/* ── Options / Stocks mode for the dashboard ─────────────────────────────── */
:root{--stk:#2ea043;--stk-d:rgba(46,160,67,.14);--stk-b:rgba(46,160,67,.5);--opt:#3b82f6;--opt-d:rgba(59,130,246,.14);--opt-b:rgba(59,130,246,.5)}

/* The selector: a full-width bar under the header; two big buttons that say what they trade. */
#asset-mode-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 24px;background:color-mix(in srgb,var(--surface) 80%,transparent);border-bottom:1px solid var(--border)}
.amb-label{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--text3)}
.amb-switch{display:inline-flex;border:2px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
.amb-btn{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 26px 8px 18px;min-width:160px;border:none;border-radius:0;background:transparent;color:var(--text3);cursor:pointer;text-align:left;transition:background .15s,color .15s}
.amb-btn+.amb-btn{border-left:2px solid var(--border)}
.amb-btn .amb-name{font-size:15px;font-weight:800;letter-spacing:.1em}
.amb-btn .amb-sub{font-size:10.5px;font-weight:500;opacity:.85}
.amb-btn:hover{color:var(--text)}
.amb-btn.opt.active{background:var(--opt);color:#04101f}
.amb-btn.stk.active{background:var(--stk);color:#03140a}
.amb-context{font-size:12.5px;color:var(--text2);flex:1;min-width:200px}
.amb-context b{font-weight:800;letter-spacing:.06em}
.amb-context .opt{color:var(--opt)}
.amb-context .stk{color:var(--stk)}
body.mode-stocks header{border-bottom:3px solid var(--stk)}
body.mode-options header{border-bottom:3px solid var(--opt)}
.mode-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.1em;padding:2px 8px;border-radius:6px;margin-left:10px;vertical-align:middle;background:var(--stk-d);color:var(--stk);border:1px solid var(--stk-b)}
@media(max-width:700px){#asset-mode-bar{padding:10px 14px}.amb-btn{min-width:0;flex:1;padding:8px 12px}.amb-switch{width:100%}.amb-label{display:none}}

/* Stocks mode swaps the option cards for the stock cards. */
#stocks-root{display:none}
body.mode-stocks #stocks-root{display:block}
body.mode-stocks main > .card:not(.stk-keep){display:none}

/* Stock bot control: big lettering + big switch; the whole card glows green when armed. */
.stk-hero{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;padding:20px 24px;margin-bottom:20px;border-radius:14px;border:1px solid var(--border);background:var(--surface);transition:border-color .3s,box-shadow .3s,background .3s}
.stk-hero h2{font-size:18px;font-weight:800;letter-spacing:.04em;display:flex;align-items:center;gap:8px;margin:0 0 4px;text-transform:none;color:var(--text)}
.stk-hero p{font-size:12px;color:var(--text2);margin:3px 0 0}
.stk-note{font-size:11.5px;padding:7px 11px;border-radius:8px;margin-top:8px;background:var(--opt-d);border:1px solid var(--opt-b);color:var(--opt)}
.stk-note.warn{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.4);color:var(--amber)}
.stk-power{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.stk-power .t{font-size:26px;font-weight:800;letter-spacing:.04em;line-height:1.1;color:var(--text3)}
.stk-power .t.on{color:var(--green)}
.stk-power .d{font-size:13px;color:var(--text2);margin-top:4px}
.stk-badge{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:800;letter-spacing:.05em;color:var(--text3);background:var(--surface2);border:1px solid var(--border)}
.stk-badge.on{color:var(--green);background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4)}
.stk-power .toggle{width:80px;height:40px;transform:scale(1.1);transform-origin:right center}
.stk-power .toggle span{border-radius:40px}
.stk-power .toggle span:before{height:32px;width:32px;left:4px;bottom:4px}
.stk-power .toggle input:checked+span:before{transform:translateX(40px)}
.stk-armed{border-color:var(--stk) !important;background:linear-gradient(135deg,rgba(46,160,67,.16),rgba(46,160,67,.04) 60%,var(--surface)) !important;
  box-shadow:0 0 0 1px var(--stk-b),0 0 26px rgba(46,160,67,.42),inset 0 0 42px rgba(46,160,67,.10);animation:stkGlow 3.4s ease-in-out infinite}
@keyframes stkGlow{0%,100%{box-shadow:0 0 0 1px var(--stk-b),0 0 20px rgba(46,160,67,.32),inset 0 0 34px rgba(46,160,67,.08)}50%{box-shadow:0 0 0 1px var(--stk),0 0 38px rgba(46,160,67,.62),inset 0 0 52px rgba(46,160,67,.15)}}
@media (prefers-reduced-motion:reduce){.stk-armed{animation:none}}
@media(max-width:700px){.stk-power .t{font-size:22px}.stk-hero{padding:16px}}

.stk-pill{font-size:10px;font-weight:800;letter-spacing:.06em;padding:2px 8px;border-radius:20px;white-space:nowrap}
.stk-pill.held{background:rgba(34,197,94,.14);color:var(--green);border:1px solid rgba(34,197,94,.4)}
.stk-pill.armed{background:var(--stk-d);color:var(--stk);border:1px solid var(--stk-b)}
.stk-pill.off{background:var(--surface2);color:var(--text3);border:1px solid var(--border)}
.stk-table{width:100%;border-collapse:collapse;font-size:12.5px}
.stk-table th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);font-weight:700;text-align:right;padding:6px 8px;border-bottom:1px solid var(--border);white-space:nowrap}
.stk-table th:first-child,.stk-table td:first-child{text-align:left}
.stk-table td{padding:9px 8px;text-align:right;border-bottom:1px solid var(--border);vertical-align:middle;font-variant-numeric:tabular-nums}
.stk-scroll{overflow-x:auto}
.stk-tkr{font-weight:800;font-size:14px}
.stk-lbl{font-size:10.5px;color:var(--text3)}
.stk-actions{display:flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
.stk-actions input{width:74px;padding:4px 6px;font-size:12px}
.stk-btn{font-size:11px;font-weight:700;padding:5px 11px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);color:var(--text);cursor:pointer;white-space:nowrap}
.stk-btn:hover{border-color:var(--stk)}
.stk-btn.sell{background:rgba(239,68,68,.12);color:#ff6b6b;border-color:rgba(239,68,68,.4)}
.stk-btn.buy{background:var(--stk);color:#03140a;border-color:var(--stk);font-size:13px;padding:9px 22px}
.stk-btn.buy:hover{filter:brightness(1.1)}
.stk-btn.ghost{background:transparent}
.stk-btn.tv{background:rgba(245,158,11,.13);color:var(--amber);border-color:rgba(245,158,11,.45)}
.stk-btn.buynow{background:var(--stk-d);color:var(--stk);border-color:var(--stk-b)}
.stk-btn.buynow:hover{background:var(--stk);color:#03140a}
.stk-btn.favon{background:rgba(245,197,24,.15);color:#f5c518;border-color:rgba(245,197,24,.5)}
.stk-btn.save{background:var(--stk);color:#03140a;border-color:var(--stk)}
.stk-seg{display:inline-flex;border:1px solid var(--border);border-radius:9px;overflow:hidden}
.stk-seg button{padding:7px 16px;font-size:12px;font-weight:700;background:transparent;border:none;border-radius:0;color:var(--text3);cursor:pointer}
.stk-seg button.active{background:var(--stk);color:#03140a}
.stk-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.stk-chip{min-width:48px;padding:8px 14px;border-radius:9px;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-weight:800;font-size:13px;cursor:pointer}
.stk-chip.active{background:var(--stk-d);border-color:var(--stk);color:var(--stk)}
.stk-row{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.stk-field label{display:block;font-size:11px;color:var(--text3);margin-bottom:4px}
.stk-field input,.stk-field select{padding:8px 10px;font-size:13px}
.stk-hint{font-size:11.5px;color:var(--text3);margin-top:8px;line-height:1.5}
.stk-code{display:block;white-space:pre-wrap;word-break:break-all;background:#0f1319;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:var(--text);margin:6px 0}
.stk-log{max-height:260px;overflow:auto;font-size:11.5px}
.stk-log div{padding:4px 0;border-bottom:1px solid var(--border);display:flex;gap:10px;color:var(--text2)}
.stk-log .t{color:var(--text3);white-space:nowrap}
.stk-log .error{color:var(--red)}.stk-log .buy{color:var(--green)}.stk-log .exit{color:var(--amber)}.stk-log .ignored{color:var(--text3)}
.stk-empty{color:var(--text3);font-size:12.5px;padding:14px 4px}
.stk-star{background:none;border:none;cursor:pointer;font-size:17px;line-height:1;padding:0 6px 0 0;color:var(--text3);vertical-align:middle}
.stk-star:hover{color:var(--amber)}
.stk-star.on{color:#f5c518;text-shadow:0 0 8px rgba(245,197,24,.45)}
.stk-size{display:inline-block;margin-top:2px;padding:1px 7px;border-radius:12px;font-size:10.5px;font-weight:700;cursor:pointer;border:1px solid var(--border);background:var(--surface2);color:var(--text3);white-space:nowrap}
.stk-size:hover{border-color:var(--stk);color:var(--text)}
.stk-size.own{background:var(--stk-d);border-color:var(--stk-b);color:var(--stk)}
.stk-favchips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:12px;font-size:11px;color:var(--text3)}
.stk-favchips .stk-chip{min-width:0;padding:5px 11px;font-size:12px}
.stk-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:210;align-items:center;justify-content:center;padding:20px}
.stk-modal .box{background:var(--surface);border:1px solid var(--stk-b);border-radius:14px;padding:20px;width:100%;max-width:440px;max-height:92vh;overflow:auto}
.stk-modal.wide .box{max-width:520px;padding:22px;border-color:rgba(245,158,11,.5)}
.stk-rung{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0}
.stk-rung select{padding:5px 8px;font-size:12px}
#stk-tv-modal h3{font-size:15px;font-weight:800;margin:0 0 2px}
#stk-tv-modal .sec{margin-top:16px;font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--amber)}
#stk-tv-modal .trow{display:flex;gap:8px;align-items:center;margin-top:7px}
#stk-tv-modal .trow input{flex:1;min-width:0;padding:9px 11px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
#stk-tv-modal .help{font-size:11px;color:var(--text3);margin-top:7px;line-height:1.55}
#stk-tv-modal a.btnlink{padding:6px 11px;border-radius:8px;font-size:11px;font-weight:700;text-decoration:none;white-space:nowrap}
#stk-tv-modal .bm{display:inline-block;margin-top:8px;padding:11px 20px;border-radius:9px;font-weight:800;font-size:13px;text-decoration:none;color:#fff;cursor:grab;background:linear-gradient(135deg,#2ea043,#238636)}
#stk-flash{padding:10px 14px;margin-bottom:14px;border-radius:9px;font-size:12.5px;font-weight:600}
#stk-flash.good{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4);color:var(--green)}
#stk-flash.bad{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.4);color:var(--red)}
.stk-tkr{font-weight:800}
