:root{--paper: #fff4dd;--ink: #3b2c35;--mint: #97fce4;--deep: #123c3a;--gold: #f5c542;--shadow: #2a1e26}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:repeating-conic-gradient(#10312f 0% 25%,#0e2b29 0% 50%) 0 0 / 8px 8px;font-family:Pixelify Sans,ui-monospace,monospace;color:var(--ink);cursor:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><circle cx="10" cy="10" r="7.5" fill="%23e88ba0" stroke="%233a2b25" stroke-width="1.5"/><path d="M3.5 8 Q10 13 16.5 8" stroke="%23c25f7a" stroke-width="1.3" fill="none"/><path d="M3.5 12.5 Q10 7.5 16.5 12.5" stroke="%23c25f7a" stroke-width="1.3" fill="none"/><path d="M8 3.2 Q13 10 9.5 16.8" stroke="%23c25f7a" stroke-width="1.3" fill="none"/><path d="M16 14 Q21 16 22.5 22.5" stroke="%23e88ba0" stroke-width="1.6" fill="none"/></svg>') 10 10,auto}#splash{position:fixed;inset:0;z-index:20;display:grid;place-content:center;gap:4px;grid-auto-flow:column;color:var(--paper);font-family:VT323,monospace;font-size:22px;background:#0e2b29}#splash span{animation:hh-paw 1.2s steps(1) infinite}#splash span:nth-child(2){animation-delay:.2s}#splash span:nth-child(3){animation-delay:.4s}@keyframes hh-paw{0%,to{opacity:.2}50%{opacity:1}}#stage{position:fixed;inset:0;display:grid;place-items:center}#stage canvas:not(#labels){image-rendering:auto}#labels{position:absolute;pointer-events:none;z-index:2}#hud{position:fixed;top:14px;right:14px;z-index:5;display:flex;gap:8px;user-select:none}.hh-btn{width:40px;height:40px;display:grid;place-items:center;font-size:19px;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--shadow);cursor:pointer;padding:0;line-height:1}.hh-btn:hover{background:#fff9e8}.hh-btn:active{transform:translate(3px,3px);box-shadow:none}#tip{position:fixed;z-index:10;max-width:280px;background:var(--paper);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--shadow);padding:8px 10px;font-family:VT323,monospace;font-size:17px;line-height:1.25;pointer-events:none}#tip h4{font-family:Pixelify Sans,monospace;font-size:15px;margin-bottom:3px;color:var(--deep)}#tip .muted{opacity:.65}#tip .gold{color:#a87b00;font-weight:700}#tip .buy{color:#157a4e}#tip .sell{color:#c0392b}#tip hr{border:none;border-top:2px dotted var(--ink);margin:5px 0;opacity:.4}#tip img.port{float:right;width:66px;height:54px;margin:0 0 4px 6px;image-rendering:pixelated;background:#dff3ec;border:2px solid var(--ink)}#rotate{display:none;position:fixed;inset:0;z-index:30;place-content:center;text-align:center;background:#0e2b29;color:var(--paper);font-family:VT323,monospace;font-size:22px;line-height:1.5}@media(orientation:portrait)and (max-width:820px){#rotate{display:grid}}.hh-panel{position:fixed;bottom:40px;z-index:6;width:216px;font-family:VT323,monospace;user-select:none;display:flex;flex-direction:column-reverse}.hh-panel-mid{left:10px}.hh-panel-low{right:10px}.hh-panel-head{width:100%;display:flex;gap:6px;align-items:baseline;font-family:Pixelify Sans,monospace;font-size:13px;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--shadow);padding:4px 8px;cursor:pointer}.hh-panel-head:active{transform:translate(2px,2px);box-shadow:none}.hh-panel-count{margin-left:auto;color:#0f6b5c;font-family:VT323,monospace;font-size:15px}.hh-panel-caret{font-style:normal;opacity:.6}.hh-panel-body{background:#fff4ddf5;border:3px solid var(--ink);border-bottom:none;padding:4px 8px;font-size:15px;line-height:1.3}.hh-panel-row{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pin-card{position:fixed;z-index:12;max-width:280px;background:var(--paper);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--shadow);padding:8px 10px;font-family:VT323,monospace;font-size:17px;line-height:1.25}.pin-card h4{font-family:Pixelify Sans,monospace;font-size:15px;margin-bottom:3px;color:var(--deep)}.pin-card .muted{opacity:.65}.pin-card .gold{color:#a87b00;font-weight:700}.pin-card .buy{color:#157a4e}.pin-card .sell{color:#c0392b}.pin-card hr{border:none;border-top:2px dotted var(--ink);margin:5px 0;opacity:.4}.pin-card img.port{float:right;width:66px;height:54px;margin:0 0 4px 6px;image-rendering:pixelated;background:#dff3ec;border:2px solid var(--ink)}.pin-close{float:right;margin-left:6px;font-family:inherit;font-size:13px;background:var(--paper);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--shadow);padding:0 5px;cursor:pointer}.pin-close:active{transform:translate(2px,2px);box-shadow:none}.tip-link{display:inline-block;margin-top:4px;padding:1px 7px;background:var(--deep);color:var(--mint);text-decoration:none;border:2px solid var(--ink)}.tip-link:hover{background:#185450}#guide{position:fixed;inset:0;z-index:15;background:#0a182099;display:grid;place-items:center}#guide[hidden]{display:none}.guide-panel{width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 60px);display:flex;flex-direction:column;background:var(--paper);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--shadow)}.guide-head{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:3px solid var(--ink);background:var(--mint)}.guide-title{font-weight:700;font-size:18px;color:var(--deep);letter-spacing:1px}.guide-close{font-family:inherit;font-size:14px;background:var(--paper);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--shadow);padding:1px 7px;cursor:pointer}.guide-close:active{transform:translate(2px,2px);box-shadow:none}.guide-tabs{display:flex;gap:6px;padding:8px 12px 0}.guide-tabs button{font-family:VT323,monospace;font-size:16px;padding:3px 10px;background:var(--paper);border:2px solid var(--ink);cursor:pointer;opacity:.65}.guide-tabs button.on{background:var(--gold);opacity:1;box-shadow:2px 2px 0 var(--shadow)}.guide-body{overflow-y:auto;padding:10px 14px 14px;font-family:VT323,monospace;font-size:17px;line-height:1.35}.guide-body ul{padding-left:18px;margin:6px 0}.guide-body li{margin:3px 0}.guide-body p{margin:6px 0}.guide-body a{color:#0f6b5c}.guide-body code{background:#ece2c8;padding:0 4px;font-family:inherit}.guide-body table{border-collapse:collapse;margin:6px 0;width:100%}.guide-body th,.guide-body td{border:2px solid var(--ink);padding:3px 8px;text-align:left}.guide-body th{background:var(--mint);color:var(--deep)}.guide-body .muted{opacity:.65}
