:root{--forest-900: #0b1a10;--forest-800: #12281a;--forest-700: #1b3a25;--forest-600: #275233;--leaf: #4f9e5c;--leaf-bright: #7fd08a;--parchment: #e8d9a8;--parchment-dim: #c9b982;--bark: #4a3423;--bark-dark: #2c1f14;--gold: #f2c14e;--gold-bright: #ffe08a;--danger: #d05b4b;--ink: #10130e;--shadow: rgba(0, 0, 0, .55);--px: 3px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:Consolas,Menlo,monospace;font-size:16px;color:var(--parchment);background:var(--forest-900);overflow-x:hidden}#forest-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(ellipse 120% 70% at 50% -10%,var(--forest-700) 0%,transparent 60%),linear-gradient(180deg,var(--forest-800) 0%,var(--forest-900) 55%,#060d08 100%)}#forest-bg:before{content:"";position:absolute;left:0;right:0;bottom:0;height:38vh;background:linear-gradient(0deg,#050b07 0 22%,transparent 22%),repeating-linear-gradient(90deg,transparent 0 40px,#081209 40px 72px,transparent 72px 96px,#0a170d 96px 150px,transparent 150px 190px);opacity:.9;image-rendering:pixelated}#forest-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(1.5px 1.5px at 12% 30%,var(--gold) 50%,transparent 51%),radial-gradient(1.5px 1.5px at 78% 18%,var(--leaf-bright) 50%,transparent 51%),radial-gradient(1.5px 1.5px at 55% 42%,var(--gold-bright) 50%,transparent 51%),radial-gradient(1.5px 1.5px at 32% 12%,var(--leaf) 50%,transparent 51%),radial-gradient(1.5px 1.5px at 90% 55%,var(--gold) 50%,transparent 51%);animation:twinkle 4s steps(2) infinite;opacity:.5}@keyframes twinkle{50%{opacity:.15}}.topbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:18px 24px}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;cursor:pointer}.brand:hover .brand-text h1{color:var(--gold-bright)}.brand:focus-visible{outline:var(--px) solid var(--gold);outline-offset:3px}.robin{width:72px;height:72px;background:url(/assets/robin.png) no-repeat;background-size:576px 432px;background-position:0 0;image-rendering:pixelated;animation:bob 1.6s steps(2) infinite}.robin.celebrate{animation:hop .5s steps(2) 4}@keyframes bob{50%{transform:translateY(3px)}}@keyframes hop{50%{transform:translateY(-9px)}}.brand-text h1{font-family:"Press Start 2P",monospace;font-size:20px;color:var(--gold);text-shadow:3px 3px 0 var(--ink);letter-spacing:1px}.tagline{font-size:14px;color:var(--leaf-bright);text-shadow:2px 2px 0 var(--ink);margin-top:6px}.topbar-right{display:flex;align-items:center;gap:12px}.badge{font-size:14px;padding:8px 10px;background:var(--forest-700);border:var(--px) solid var(--ink);box-shadow:inset 0 calc(-1 * var(--px)) 0 var(--shadow);color:var(--leaf-bright);text-shadow:1px 1px 0 var(--ink)}main{display:flex;flex-direction:column;align-items:center;gap:28px;padding:12px 24px 64px}.focus-row{display:flex;justify-content:center;width:100%}.focus-row .swap-panel{width:min(480px,100%)}.panel-grid{display:flex;flex-wrap:wrap;gap:24px;justify-content:center;align-items:flex-start;width:100%;max-width:1400px}.panel{width:min(430px,100%);background:var(--forest-800);border:var(--px) solid var(--ink);box-shadow:0 0 0 var(--px) var(--bark),0 0 0 calc(2 * var(--px)) var(--ink),6px 8px 0 var(--shadow);padding:22px;position:relative}.panel:before{content:"";position:absolute;top:0;left:0;right:0;height:42px;background:var(--forest-700);border-bottom:var(--px) solid var(--ink)}.panel-title{position:relative;font-family:"Press Start 2P",monospace;font-size:15px;color:var(--parchment);text-shadow:2px 2px 0 var(--ink);margin-bottom:24px;line-height:18px}.field{margin-bottom:14px}.field label{display:block;font-size:14px;color:var(--parchment-dim);text-shadow:1px 1px 0 var(--ink);margin-bottom:6px}.row{display:flex;gap:10px}.pixel-input{font-family:inherit;font-size:16px;color:var(--parchment);background:var(--forest-900);border:var(--px) solid var(--ink);box-shadow:inset var(--px) var(--px) 0 var(--shadow);padding:0 12px;height:48px;min-width:0}select.pixel-input{width:132px;flex-shrink:0}.pixel-input.amount{flex:1;text-align:right;font-variant-numeric:tabular-nums}.pixel-input:focus-visible{outline:var(--px) solid var(--gold);outline-offset:2px}.hint{font-size:14px;color:var(--parchment-dim);margin-top:5px;text-shadow:1px 1px 0 var(--ink)}.pct-row{display:flex;gap:6px;margin-top:8px}.pct-btn{flex:1;height:32px;font-family:inherit;font-size:13px;color:var(--parchment);background:var(--forest-700);border:var(--px) solid var(--ink);box-shadow:inset 0 var(--px) 0 #ffffff0d;cursor:pointer;text-shadow:1px 1px 0 var(--ink)}.pct-btn:hover{background:var(--forest-600);color:var(--gold-bright)}.pct-btn:active{transform:translateY(1px)}.pct-btn:focus-visible{outline:var(--px) solid var(--gold);outline-offset:1px}.pixel-btn{font-family:"Press Start 2P",monospace;font-size:14px;line-height:1;color:var(--ink);background:var(--leaf);border:var(--px) solid var(--ink);box-shadow:inset 0 var(--px) 0 var(--leaf-bright),inset 0 calc(-2 * var(--px)) 0 #00000059,0 var(--px) 0 var(--ink);padding:0 18px;height:48px;cursor:pointer;text-shadow:1px 1px 0 rgba(255,255,255,.25)}.pixel-btn:hover:not(:disabled){filter:brightness(1.1)}.pixel-btn:active:not(:disabled){transform:translateY(var(--px));box-shadow:inset 0 var(--px) 0 #0003}.pixel-btn:focus-visible{outline:var(--px) solid var(--gold);outline-offset:2px}.pixel-btn:disabled{opacity:.45;cursor:not-allowed}.pixel-btn.primary{background:var(--gold);box-shadow:inset 0 var(--px) 0 var(--gold-bright),inset 0 calc(-2 * var(--px)) 0 #00000059,0 var(--px) 0 var(--ink)}.pixel-btn.secondary{background:var(--parchment-dim)}.pixel-btn.flip{display:block;margin:2px auto 12px;width:48px;font-size:18px;font-family:inherit}#connect-btn.connected{background:var(--forest-600);color:var(--parchment)}#connect-btn.connected:hover{background:var(--danger);color:var(--ink);filter:none}.actions{display:flex;flex-direction:column;gap:10px;margin-top:18px}.actions .pixel-btn{width:100%}.status{min-height:22px;margin-top:12px;font-size:14px;color:var(--leaf-bright);text-shadow:1px 1px 0 var(--ink);word-break:break-word}.status.error{color:var(--danger)}.keep-open{margin-top:10px;padding:10px 12px;font-size:14px;line-height:1.4;color:var(--ink);background:var(--gold);border:var(--px) solid var(--ink);box-shadow:inset 0 var(--px) 0 var(--gold-bright);text-shadow:none;animation:blink 1.4s steps(2) infinite}.order-list{list-style:none}.order-list .empty{font-size:14px;color:var(--parchment-dim)}.order-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 10px;border:var(--px) solid var(--ink);background:var(--forest-900);box-shadow:inset var(--px) var(--px) 0 var(--shadow);margin-bottom:10px;font-size:14px}.order-item .pair{color:var(--parchment);text-shadow:1px 1px 0 var(--ink)}.order-item .state{font-family:"Press Start 2P",monospace;font-size:14px}.state.open{color:var(--gold)}.state.filling{color:var(--leaf-bright);animation:blink 1s steps(2) infinite}.state.filled{color:var(--leaf-bright)}.state.cancelled,.state.expired{color:var(--danger)}@keyframes blink{50%{opacity:.3}}.order-item .saved{color:var(--gold-bright);text-shadow:1px 1px 0 var(--ink);font-variant-numeric:tabular-nums}.saved-total{margin-top:18px;padding:14px;border:var(--px) solid var(--ink);background:var(--forest-700);box-shadow:inset 0 var(--px) 0 #ffffff0f;display:flex;flex-direction:column;gap:8px}.saved-label{font-family:"Press Start 2P",monospace;font-size:14px;color:var(--gold);text-shadow:2px 2px 0 var(--ink);line-height:18px}.saved-value{font-size:24px;color:var(--gold-bright);text-shadow:2px 2px 0 var(--ink);font-variant-numeric:tabular-nums}.saved-total.global{margin-top:0;margin-bottom:18px}.tx-link{color:var(--leaf-bright);font-size:14px;text-decoration:none;text-shadow:1px 1px 0 var(--ink);padding:8px}.tx-link:hover{color:var(--gold-bright)}.tx-link:focus-visible{outline:var(--px) solid var(--gold);outline-offset:2px}.shilling-balance{display:flex;align-items:center;gap:14px;padding:14px;border:var(--px) solid var(--ink);background:var(--forest-700);margin-bottom:14px}.shilling-coin{width:36px;image-rendering:pixelated;animation:bob 1.4s steps(2) infinite}.earn-list{list-style:none;margin-top:16px}.earn-list li{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;font-size:14px;color:var(--parchment-dim);text-shadow:1px 1px 0 var(--ink);border-bottom:var(--px) solid var(--forest-700)}.earn-list strong{color:var(--gold-bright);font-variant-numeric:tabular-nums}#coin-canvas{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;image-rendering:pixelated;z-index:10}@media(max-width:720px){html,body{overflow-x:hidden}.saved-label,.panel-title,.stat-label{overflow-wrap:anywhere}.earn-list li{flex-wrap:wrap}.earn-list li span,.order-item .pair,.saved-total,.shilling-balance{min-width:0}.badge{overflow-wrap:anywhere;max-width:100%}.topbar{flex-direction:column;align-items:center;text-align:center;gap:14px;padding:14px 16px}.brand{flex-direction:column;gap:8px}.robin{width:60px;height:60px;background-size:480px 360px}.brand-text h1{font-size:17px}.tagline{font-size:14px}.topbar-right{width:100%;justify-content:center;flex-wrap:wrap}.topbar-right .pixel-btn{flex:1 1 auto;max-width:320px}main{padding:8px 12px 48px;gap:20px}.panel{width:100%;padding:16px 14px}.panel-grid{gap:20px}select.pixel-input{width:104px}.pixel-input{font-size:16px;padding:0 10px}.order-item{flex-wrap:wrap}.saved-value{font-size:20px}.earn-list li{font-size:14px}}@media(prefers-reduced-motion:reduce){.robin,#forest-bg:after,.state.filling{animation:none}}
