:root{color-scheme:dark;--bg:#121918;--ink:#dedfd1;--dim:#8d9e95;--line:#3b4c44;--sage:#a8b89b;--amber:#c1a078}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}main{max-width:1220px;margin:auto;padding:28px 40px}header{display:flex;gap:28px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:23px;font:10px monospace;letter-spacing:2px;color:var(--dim)}a{color:inherit;text-decoration:none}.brand{font:16px Arial;letter-spacing:4px;color:var(--ink)}.demo{margin-left:auto}.heading{display:flex;justify-content:space-between;align-items:center;padding:25px 0 29px}.eyebrow{font:9px monospace;letter-spacing:2px;color:var(--dim);margin:0 0 13px}h1{font-size:clamp(32px,4.8vw,58px);font-weight:400;letter-spacing:6px;margin:0;line-height:1}h1 span{color:var(--amber)}.heading>p{font:13px/1.5 monospace;color:var(--dim)}.console{border:1px solid #56655b;box-shadow:0 15px 55px #0004}.topbar{display:flex;gap:20px;align-items:center;padding:11px 17px;background:#1e2924;font:10px monospace;letter-spacing:1px}.topbar i{display:inline-block;width:5px;height:5px;background:var(--sage);margin-right:7px}.topbar b{font-weight:400}.topbar #mode{margin-left:auto;color:var(--dim)}.topbar button{font:10px monospace;padding:5px 12px;min-height:30px}.viewport{position:relative;background:#080f11;overflow:hidden}canvas{display:block;width:100%;aspect-ratio:28/15;touch-action:none;outline-offset:-3px}.viewport:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(transparent 0px,transparent 3px,#00000012 4px)}#message{position:absolute;left:10%;right:10%;bottom:14%;text-align:center;font:12px/1.5 monospace;color:#e0c5a0;pointer-events:none;text-shadow:0 1px 4px black}.panel{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0b1410aa;padding:16px;z-index:2}.panel:empty{display:none}.card{max-width:600px;width:100%;background:#17211ff5;border:1px solid #72816c;padding:28px 35px;box-shadow:0 10px 70px #0006}.card h2{font:30px/1.1 Arial;letter-spacing:3px;font-weight:400;margin:12px 0 18px}.card p{font:12px/1.7 monospace;color:#a9b7aa;margin:12px 0}.card .eyebrow{font-size:10px;color:var(--amber)}button,.file{border:1px solid #526458;background:transparent;color:var(--ink);font:11px monospace;min-height:40px;padding:10px 14px;cursor:pointer;border-radius:0}button:hover,.file:hover{background:#334338}button:focus-visible,a:focus-visible,summary:focus-visible,.file:focus-within{outline:2px solid #c1a078;outline-offset:3px}button:disabled{opacity:.35;cursor:default}.primary{background:#adbaa0;color:#111c15;border-color:#adbaa0}.card .buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.dashboard{display:grid;grid-template-columns:repeat(5,1fr);background:#1b2521;padding:20px 8px}.dashboard>div{padding:0 20px;border-right:1px solid var(--line)}.dashboard>div:last-child{border:0}.dashboard span{display:block;font:9px monospace;letter-spacing:1px;color:var(--dim)}strong{display:block;font:25px monospace;font-weight:400;margin:9px 0}small{font-size:10px;color:var(--dim)}.bar{height:3px;background:#33413a;max-width:140px}.bar i{display:block;height:100%;background:#a6b29a;width:0}.warm i{background:#bd9b7d}.actions{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.actions button:last-child{margin-left:auto;color:var(--dim)}.file{position:relative;overflow:hidden;display:flex;align-items:center}.file input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}footer{display:flex;justify-content:space-between;gap:20px;color:var(--dim);font:10px/2 monospace;margin-top:20px}footer b{font-weight:400;color:var(--ink)}footer p:last-child{text-align:right;white-space:nowrap;font-size:9px;letter-spacing:1px}details{border-top:1px solid var(--line);padding:17px 0;margin-top:20px;color:var(--dim);font:11px/1.8 monospace}summary{cursor:pointer;color:var(--ink)}details p{max-width:800px}.touch{display:none}table{width:100%;border-collapse:collapse;font:11px monospace}th{text-align:left;color:var(--dim);font-size:9px;font-weight:400}td,th{padding:7px 3px;border-bottom:1px solid #39473c}td button{padding:5px 9px;min-height:30px}.market-notes{display:flex;justify-content:space-between;gap:10px;font:11px monospace;color:var(--amber);margin:16px 0}button[hidden]{display:none}@media(max-width:700px){main{padding:18px 14px}header{gap:13px;font-size:8px;letter-spacing:1px}.brand{font-size:12px;letter-spacing:2px}.heading{padding:25px 0}.heading>p{display:none}.eyebrow{font-size:8px;letter-spacing:1px}.topbar{padding:8px;font-size:8px;gap:8px}#mode{display:none}#pause{margin-left:auto}.viewport{min-height:340px}canvas{height:340px;aspect-ratio:auto}.dashboard{padding:13px 1px}.dashboard>div{padding:0 6px}.dashboard span{font-size:7px;letter-spacing:0}strong{font-size:17px;margin:8px 0}small{font-size:8px}.card{padding:15px;max-height:330px;overflow-y:auto}.card h2{font-size:22px;margin:10px 0}.card p{font-size:10px}.card .buttons{margin-top:12px}.touch{display:flex;gap:5px}.touch button{flex:1;touch-action:none;user-select:none;padding:12px 5px}.fire{color:var(--amber)}footer{display:block;font-size:9px}footer p:last-child{text-align:left}.actions button,.file{padding:8px 10px;font-size:10px}.actions button:last-child{margin-left:0}#message{font-size:10px;bottom:6%}td,th{padding:5px 2px}td button{padding:5px;min-height:28px}.market-notes{font-size:10px}}
.card{max-height:calc(100% - 20px);overflow-y:auto}.card.market{padding:19px 28px}.market h2{font-size:26px;margin:9px 0 12px}.market p{font-size:10px;line-height:1.5;margin:9px 0}.market .buttons{margin-top:12px}.market .market-notes{margin:12px 0}@media(max-width:700px){.card.market{padding:14px}.market h2{font-size:21px}.market .market-notes{margin:10px 0}}

.game-title{display:flex;align-items:center;gap:24px}.sidetrax-logo{display:inline-block;width:27px;height:54px;color:var(--ink);flex:none}.brand{display:flex;align-items:center;gap:9px}.brand .sidetrax-logo{width:10px;height:20px}.game-title h1{font-size:clamp(32px,4.8vw,58px)}@media(max-width:700px){.game-title{gap:16px}.game-title .sidetrax-logo{width:22px;height:44px}}

#message{bottom:23%}@media(max-width:700px){#message{bottom:24%}}

html.embedded,html.embedded body{background:#121918}html.embedded main{max-width:none;padding:14px!important}html.embedded header,html.embedded .heading>p,html.embedded .eyebrow,html.embedded footer,html.embedded main>details{display:none}html.embedded .heading{padding:3px 0 18px}html.embedded .game-title{gap:15px}html.embedded .game-title h1{font-size:32px;letter-spacing:4px}html.embedded .game-title .sidetrax-logo{width:21px;height:42px}html.embedded .dashboard>div{padding:0 7px}html.embedded .dashboard{padding:14px 0}html.embedded strong{font-size:18px}html.embedded .dashboard span{font-size:8px;letter-spacing:0}html.embedded .actions{margin-bottom:0}html.embedded .actions .file,html.embedded #musicplay{display:none!important}html.embedded .card .eyebrow{display:block}html.embedded .viewport{min-height:350px}html.embedded canvas{min-height:350px}html.embedded #musicnote{margin:12px 0 0;color:#acbba7;font:10px/1.5 monospace}html.embedded .touch{margin-top:12px}@media(max-width:500px){html.embedded .dashboard>div{padding:0 4px}html.embedded .dashboard span{font-size:7px}html.embedded strong{font-size:15px}html.embedded .card.market{padding:12px}html.embedded .game-title h1{font-size:26px}html.embedded .actions button{padding:8px}}
