@font-face{font-family:'Rubik';src:url('./fonts/Rubik-Variable.ttf') format('truetype');font-style:normal;font-weight:300 900;font-display:swap}
:root{color-scheme:dark;--bg:#101114;--surface:#15171b;--chart:#0e1013;--line:#30333a;--muted:#9ba0a9;--text:#ebecef;--accent:#edac60;--up:#66c9a5;--down:#e7827d;--mono:'Rubik',Arial,sans-serif;font-family:'Rubik',Arial,sans-serif;font-size:16px;font-variant-numeric:tabular-nums}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,select{font:inherit;color:inherit}button,select,a{touch-action:manipulation}button{cursor:pointer;border-radius:2px}button:disabled{opacity:.43;cursor:default}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}

/* Allocate the viewport to the workspace; the chart takes all remaining height. */
.app{height:100vh;height:100dvh;min-height:36rem;padding:0 18px;display:grid;grid-template-rows:58px minmax(0,1fr) 30px;max-width:2200px;margin:auto}
.masthead{display:flex;align-items:center;gap:28px;min-width:0}
.masthead h1{margin:0;font:700 21px/1 var(--mono);letter-spacing:-.7px;flex-shrink:0}
.brand{display:inline-flex;color:var(--accent)}
.collection-switch{display:flex;align-self:stretch;gap:20px}
.collection{border:0;border-bottom:2px solid transparent;background:none;padding:3px 0 0;font-size:14px;color:var(--muted)}
.collection.active{color:var(--text);border-bottom-color:var(--accent)}.collection:hover:enabled{color:white}
.mode-switch{display:flex;align-self:stretch;gap:24px;margin-left:auto}
.mode{padding:3px 0 0;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:var(--muted);font-size:14px;white-space:nowrap}
.mode.active{color:var(--text);border-bottom-color:var(--accent)}.mode:hover:enabled{color:white}
.header-account{flex-shrink:0}.account-cta{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:9px 12px;border:1px solid #edac6080;border-radius:2px;background:#30261c;color:var(--accent);font:500 14px 'Rubik',Arial,sans-serif;white-space:nowrap}.account-cta:hover{background:#453324}.save-score{clear:both;padding:12px 0;margin-bottom:14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.result .save-score p{margin:0 0 9px;color:var(--text);font-size:14px}.save-score .account-cta{width:100%;min-height:42px}.save-score span{display:block;margin-top:6px;color:var(--muted);font-size:12px}
.game-layout{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 262px;gap:12px}
.chart-card{min-width:0;min-height:0;display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr) auto auto;background:var(--chart);border:1px solid var(--line)}
.chart-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;padding:0 14px;border-bottom:1px solid var(--line);background:var(--surface)}
.timeframes{display:flex;align-items:stretch;gap:2px;flex-shrink:0}
.timeframe{border:0;border-bottom:2px solid transparent;background:none;padding:10px 9px;font-size:14px;color:var(--muted)}
.timeframe.active{color:var(--accent);border-bottom-color:var(--accent)}.timeframe:hover:enabled{background:#282d35;color:var(--text)}
.setup-control{display:flex;align-items:center;gap:8px;padding:4px 0;min-width:0}.setup-control label{font-size:14px;color:var(--muted)}
.setup-control select{font-size:14px;height:30px;max-width:245px;min-width:0;padding:3px 7px;background:#171a1f;border-color:#414650}
.daily-date{color:var(--muted);font-size:14px;padding:10px 0}
@media(max-width:600px){.chart-toolbar{padding:0 8px;gap:0 8px}.timeframe{padding:8px 7px}.setup-control{flex:1;min-width:140px}.setup-control label{display:none}.setup-control select{width:100%;max-width:none}.timeframes{flex:1}}
.market-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;background:var(--surface)}
.chart-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chart-heading strong{font-size:16px;font-weight:600}
.pill{font:12px var(--mono);padding:3px 6px;border:1px solid #454953;color:#bbc1cb;white-space:nowrap}
.status{color:var(--accent);font:12px var(--mono)}.status.paused{color:var(--muted)}
.quote-row{display:flex;align-items:baseline;justify-content:flex-end;flex-wrap:wrap;gap:8px 12px}
.price{font:26px/1 var(--mono);letter-spacing:-1px;font-variant-numeric:tabular-nums}
.quote-row #change{font:14px var(--mono)}.positive{color:var(--up)}.negative{color:var(--down)}
.entry-note{color:#888f9a;font-size:12px}
.indicator-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.indicator-label{font:12px var(--mono);color:#858c97;margin-right:7px}
.indicator{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid #414650;background:#171a1f;color:#b5bac4;font-size:14px;line-height:18px}
.indicator::before{content:'';width:7px;height:7px;flex-shrink:0;border:1px solid #7a818c}
.indicator:hover{background:#282d35}.indicator.active{background:#30343d;color:#f5f5f7;border-color:#737b89}.indicator.active::before{border-color:var(--accent);background:var(--accent)}
.legend{padding:8px 17px 4px;min-height:27px;font:12px/15px var(--mono);color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 16px}
.legend span:first-child{color:var(--up)}.legend span:last-child{color:var(--down)}
.chart-wrap{min-height:0;position:relative;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.chart-message{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;color:var(--muted);background:var(--chart)}
.chart-footer{display:flex;justify-content:space-between;gap:10px;padding:6px 16px;min-height:28px;font:12px/16px var(--mono);color:#969daa}
#hover-readout{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.action-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;border-top:1px solid var(--line);background:var(--surface)}
.primary-actions{display:flex;align-items:stretch;gap:10px;flex:1;max-width:420px;min-width:0}
.primary-actions>#play{width:110px;min-height:46px;flex-shrink:0;font-size:15px}
.primary-actions>#share-result{min-height:46px;flex-shrink:0;padding:7px 10px}
.primary-actions>.save-action{min-width:110px;background:var(--accent);border-color:var(--accent);color:#251a0c;flex-shrink:0}.primary-actions>.save-action:hover{background:#ffc781}
.playback-options{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0}
.playback-options .keyboard-hint{margin-right:8px}
.secondary,.icon-button{min-height:36px;padding:7px 14px;border:1px solid #636a77;background:#303640;box-shadow:inset 0 1px #ffffff0a,0 2px #08090c;font-size:14px}
.secondary{min-width:94px}.secondary span{font-size:12px;margin-right:6px}.icon-button{background:#1c2027;padding:7px 11px}.icon-button span{margin-left:5px;font-family:var(--mono)}
.secondary:hover:enabled,.icon-button:hover:enabled{background:#424b59}.secondary:active:enabled,.icon-button:active:enabled{transform:translateY(1px);box-shadow:none}
.speed-label{font-size:14px;color:var(--muted);margin-left:7px}
select{background:#181b21;border:1px solid #454b56;border-radius:2px;height:36px;padding:6px 8px;font:14px var(--mono)}
.keyboard-hint{font-size:12px;color:#8f96a1;white-space:nowrap}kbd{font:12px var(--mono);padding:3px 5px;border:1px solid #555b65;margin-right:4px}

.decision-panel{display:flex;flex-direction:column;min-width:0;min-height:0;padding:18px;background:var(--surface);border:1px solid var(--line);overflow-y:auto;scrollbar-width:thin}
.round-label{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font:12px var(--mono)}
.account-strip{display:flex;flex-direction:column;gap:4px;margin-top:12px;font-size:14px}.account-strip strong{font-weight:500}.account-strip span{color:var(--muted);font-size:12px}
.progress-status{min-height:16px;font-size:12px;color:var(--muted)}.progress-status:has(span:not(:empty)){margin-top:7px}.progress-status span:not(:empty){display:block;margin-bottom:4px}.progress-status #progress-message{color:var(--accent)}
.result .capture small{font-size:16px;letter-spacing:0;margin-left:4px;color:var(--muted)}.result .round-money{font-size:16px}.result .round-money.positive{color:var(--up)}.result .round-money.negative{color:var(--down)}
.account-details{display:grid;gap:12px;margin:18px 0 24px}.account-details div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:12px}.account-details span{color:var(--muted)}
input{background:#181b21;border:1px solid #454b56;border-radius:2px;color:var(--text);padding:8px;font:16px 'Rubik',Arial,sans-serif;min-width:0}input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.name-row{display:flex;gap:8px;margin-top:8px}.name-row input{flex:1}.board-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.board-filters input{font-size:14px}.board-filters select{flex:1}
dialog .dialog-note{font-size:14px;line-height:1.5}.board-table{width:100%;border-collapse:collapse;font-size:14px}.board-table th,.board-table td{text-align:right;padding:10px 6px;border-bottom:1px solid var(--line)}.board-table th{color:var(--muted);font-weight:400}.board-table th:nth-child(2),.board-table td:nth-child(2){text-align:left;overflow-wrap:anywhere}.board-table .is-you{color:var(--accent)}
.eyebrow{font:12px var(--mono);letter-spacing:.04em;color:var(--muted);margin:0}
.position-summary{margin:27px 0 22px}.position-status{font-size:14px;color:#c8cdd5;margin-bottom:22px}
.field-label{display:block;font-size:14px;color:var(--muted);margin-bottom:8px}
.pnl{display:block;font:36px/1.05 var(--mono);color:var(--up);letter-spacing:-1.5px;white-space:nowrap}.pnl span{font-size:.7em;margin-left:2px}.pnl.negative{color:var(--down)}
.position-details{display:grid;gap:15px;margin:0 0 24px;padding-top:19px;border-top:1px solid var(--line)}
.position-details>div{display:flex;justify-content:space-between;gap:8px;font-size:14px}.position-details dt{color:var(--muted)}.position-details dd{margin:0;font-family:var(--mono)}
.sell-button{width:100%;min-height:46px;background:var(--accent);border:1px solid #f4c088;border-bottom:3px solid #b37834;color:#251a0c;font:700 16px var(--mono);letter-spacing:.03em}
.sell-button:hover:enabled{background:#ffc781}.sell-button:active:enabled{transform:translateY(1px);border-bottom-width:1px}
.sell-button:disabled{background:#242830;color:#abb2bd;border-color:#3c414a;opacity:1;min-height:36px;font-size:12px}
.trade-controls{display:flex;gap:8px;flex:1;min-width:0}.trade-controls>.sell-button,.trade-controls>.next-button{flex:1;min-width:0;width:auto}
.short-button{background:#382124;border-color:#9b5b59;border-bottom-color:#653c3e;color:#efaaa5}
.short-button:hover:enabled{background:#4a2a2e}
.result{border-top:1px solid #444a55;padding-top:14px;margin-top:18px}
.result .capture{font:34px/1 var(--mono);letter-spacing:-1px;color:var(--accent)}
.result .result-label{font-size:12px;color:var(--muted);margin:7px 0 17px}
.result h2{font:bold 20px var(--mono);margin:0 0 8px}.result p{color:#b1b8c2;font-size:14px;line-height:1.5;margin:7px 0}
.result dl{font-size:14px;margin:16px 0}.result dl>div{display:flex;justify-content:space-between;gap:8px;margin:10px 0}.result dt{color:var(--muted)}.result dd{margin:0;font-family:var(--mono)}
.result .result-meta{font-size:12px;color:#939ca9}
.next-button{display:flex;justify-content:center;align-items:center;gap:14px;background:#313844;border:1px solid #6b7483;min-height:46px;padding:9px 12px;font-size:14px;margin:0;flex-shrink:0}.next-button:hover{background:#464f60}
.page-footer{display:flex;align-items:center;justify-content:space-between;color:#7e8694;font:12px var(--mono)}
.text-button{border:0;background:none;color:#b5bac4;font-size:12px;padding:4px 0}.text-button:hover{text-decoration:underline;text-underline-offset:3px}
dialog{max-width:560px;width:calc(100% - 32px);max-height:calc(100dvh - 40px);overflow-y:auto;border:1px solid #59616e;background:#191c22;color:var(--text);border-radius:3px;padding:28px}
dialog::backdrop{background:#050609c9}.dialog-close{position:absolute;right:12px;top:10px;background:none;border:0;font-size:26px;color:var(--muted)}
.share-preview{display:block;width:100%;resize:none;min-height:200px;padding:14px;border:1px solid var(--line);border-radius:2px;background:var(--bg);color:var(--text);font:16px/1.6 'Rubik',Arial,sans-serif}.share-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.share-options>*{flex:1;min-height:44px;white-space:nowrap}#share-status:empty{display:none}
dialog h2{font:600 25px 'Rubik',Arial,sans-serif;margin:12px 0 22px}dialog p{font-size:16px;line-height:1.6;color:#bdc3cc}
.welcome-dialog{max-width:400px;padding:24px}.welcome-dialog h2{font-size:22px;margin:0 32px 16px 0}.welcome-dialog p{margin:0 0 16px;line-height:1.5}.welcome-dialog strong{color:var(--text);font-weight:500}.welcome-dialog .welcome-collections{padding-top:16px;border-top:1px solid var(--line)}.welcome-dialog .account-cta{width:100%;min-height:44px}
.formula{padding:16px;border-left:2px solid var(--accent);background:#242830;font:14px/1.8 var(--mono)}.formula strong{color:var(--accent)}

@media(max-width:1200px){
.market-strip{align-items:flex-start}.quote-row{max-width:185px}.entry-note{flex-basis:100%;text-align:right}.chart-heading{gap:8px}.indicator-label,.keyboard-hint{display:none}
}
@media(max-width:900px){
.app{padding:0 10px calc(104px + env(safe-area-inset-bottom,0px));grid-template-rows:50px minmax(0,1fr) 28px}.masthead{gap:18px}.masthead h1{font-size:19px}.mode-switch{gap:18px;margin-left:auto}
.game-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:8px}
.market-strip{align-items:center;padding:10px 12px}.quote-row{max-width:none}.entry-note{display:none}.chart-heading{gap:7px}.status{margin-left:5px}
.indicator-bar{padding:6px 10px}.legend{padding-top:6px;padding-bottom:2px;min-height:23px}.keyboard-hint{display:block}
.chart-card{grid-template-rows:auto auto auto auto minmax(0,1fr) auto}
.action-bar{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;flex-direction:column;gap:8px;padding:8px max(10px,env(safe-area-inset-left,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-right,0px));box-shadow:0 -6px 20px #0003}
.primary-actions{width:100%;max-width:680px;flex:none;gap:10px}.primary-actions>#play{min-height:48px;width:110px}.trade-controls>.sell-button,.trade-controls>.next-button{min-height:48px;font-size:16px}
.playback-options{width:100%;max-width:680px;height:32px}.playback-options .keyboard-hint{margin-right:auto}.playback-options .icon-button,.playback-options select{min-height:32px;height:32px;padding-top:4px;padding-bottom:4px}
.decision-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'label bank' 'summary details' 'progress progress';gap:6px 18px;padding:11px 14px;overflow:visible}
.account-strip{grid-area:bank;flex-direction:row;justify-content:flex-end;flex-wrap:wrap;gap:4px 10px;margin:0;font-size:12px}.account-strip span{display:none}.progress-status{grid-area:progress}.progress-status:empty{display:none}.progress-status:has(span:not(:empty)){margin:0}.progress-status span:not(:empty){display:inline;margin:0 8px 0 0}
.round-label{grid-area:label}.position-summary{grid-area:summary;margin:0;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px}.position-status{margin:0;font-size:14px}.pnl-block{text-align:right}.field-label{font-size:12px;margin-bottom:4px}.pnl{font-size:27px;letter-spacing:-1px}
.position-details{grid-area:details;display:flex;justify-content:space-between;gap:12px;padding:0 0 0 17px;margin:0;border-top:0;border-left:1px solid var(--line);align-self:center}
.position-details>div{flex-direction:column;gap:5px}.position-details dt{font-size:12px}.position-details dd{font-size:14px}
.app.is-finished .game-layout{grid-template-rows:minmax(0,1fr) minmax(0,240px)}
.app.is-finished .decision-panel{grid-template-areas:'summary bank' 'result result' 'progress progress';grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}
.app.is-finished .round-label,.app.is-finished .position-details{display:none}
.app.is-finished .position-summary{display:block}.app.is-finished .position-status{display:none}.app.is-finished .pnl-block{text-align:left}
.result{grid-area:result;overflow-y:auto;margin:0;padding-top:10px;min-height:0;scrollbar-width:thin}.result .capture{float:left;font-size:28px;margin-right:10px}.result .result-label{margin:7px 0 18px}.result h2{clear:both}.result dl{margin:10px 0}
}
@media(max-width:540px){
.primary-actions>.save-action{min-width:96px;padding:7px 8px}
.app{padding-left:6px;padding-right:6px;grid-template-rows:78px minmax(0,1fr) 25px}.masthead{display:grid;grid-template-columns:auto 1fr;grid-template-rows:38px 36px;gap:0 16px;padding:0 3px}.masthead h1{font-size:20px}.collection-switch{justify-self:end;gap:20px}.collection{font-size:14px}.mode-switch{grid-column:1/-1;justify-self:start;gap:24px;margin-left:0}.mode{font-size:14px}
.market-strip{gap:8px}.chart-heading{max-width:170px;gap:5px 7px}.chart-heading strong{font-size:14px}.status{flex-basis:100%;margin-left:0}.price{font-size:23px}.quote-row{gap:4px;flex-direction:column;align-items:flex-end}.quote-row #change{font-size:12px}
.indicator-bar{gap:5px;padding:6px}.indicator{font-size:13px;gap:5px;padding:5px 6px}.indicator::before{width:6px;height:6px}.legend{padding-left:12px;gap:12px}
.chart-footer{padding-left:12px;padding-right:12px;min-height:24px}.keyboard-hint{display:none}
.speed-label{font-size:12px}.secondary,.icon-button{padding-left:10px;padding-right:10px}.primary-actions>#play{width:100px}.playback-options{justify-content:space-between}.playback-options .speed-label{margin-left:auto}
.decision-panel{padding:9px 11px;gap:7px 12px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.position-summary{display:block}.position-status{font-size:12px;margin-bottom:4px}.pnl-block{text-align:left}.field-label{font-size:12px;margin-bottom:3px}.pnl{font-size:26px}
.position-details{padding-left:12px;gap:8px}.position-details dd{font-size:13px}.page-footer{font-size:12px}
.app.is-finished .game-layout{grid-template-rows:minmax(0,1fr) minmax(0,220px)}
}
@media(max-height:700px){
.position-summary{margin-top:17px;margin-bottom:16px}.position-status{margin-bottom:14px}.legend{padding-top:3px;min-height:20px}.chart-footer{padding-top:3px;padding-bottom:3px;min-height:22px}.market-strip{padding-top:9px;padding-bottom:9px}
}
@media(max-width:900px) and (max-height:700px){
.position-summary{margin:0}.position-status{display:none}.legend{display:none}.chart-footer{min-height:20px;font-size:12px}.chart-card{grid-template-rows:auto auto auto minmax(0,1fr) auto}
.app.is-finished .game-layout{grid-template-rows:minmax(0,1fr) minmax(0,190px)}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(max-width:760px){
  .app{grid-template-rows:82px minmax(0,1fr) 25px}
  .masthead{display:grid;grid-template-columns:auto auto;grid-template-rows:42px 36px;gap:0 12px;padding:0 3px}
  .masthead h1{grid-column:1;grid-row:1;font-size:20px}.header-account{grid-column:2;grid-row:1;justify-self:end}
  .collection-switch{grid-column:1;grid-row:2;justify-self:start;gap:12px}.mode-switch{grid-column:2;grid-row:2;justify-self:end;gap:12px;margin-left:0}.mode,.collection{font-size:14px}.account-cta{padding:8px 10px;min-height:36px}
  .result .save-score{padding:8px 0;margin-bottom:10px}.result .save-score p{margin-bottom:6px}
}
@media(max-width:380px){
  .app{grid-template-rows:110px minmax(0,1fr) 25px}.masthead{grid-template-rows:42px 30px 32px}
  .collection-switch{grid-row:2;grid-column:1/-1}.mode-switch{grid-row:3;grid-column:1/-1;justify-self:start}
}
