html{font-size:15px}
body{font:14px/1.5 Inter,system-ui,sans-serif;background:radial-gradient(circle at 80% 0%,rgba(120,95,255,.18),transparent 34rem),radial-gradient(circle at 10% 100%,rgba(74,222,128,.08),transparent 28rem),var(--bg);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.70),transparent 86%);opacity:.25;pointer-events:none}
a{color:inherit;text-decoration:none}

/* shell */
.shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;border-right:1px solid var(--line);background:rgba(5,5,16,.72);backdrop-filter:blur(16px);display:flex;flex-direction:column;z-index:10;overflow-y:auto}
.brand{min-height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 1rem;gap:.8rem;flex-shrink:0}
.sig{width:34px;height:34px;border:1px solid var(--line2);display:grid;place-items:center;font:700 .75rem 'JetBrains Mono';letter-spacing:.12em;flex-shrink:0}
.wordmark{font:700 .76rem/.96 'JetBrains Mono';letter-spacing:.16em}
.nav{padding:.8rem 0;border-bottom:1px solid var(--line)}
.nav .nav-sep{display:block;margin:1rem 1rem .7rem;border-top:2px solid var(--line2);height:0}
.nav a,.nav button{display:flex;width:100%;align-items:center;gap:.7rem;padding:.68rem 1rem;color:var(--ink2);font:500 .68rem 'JetBrains Mono';letter-spacing:.13em;text-transform:uppercase;background:none;border:0;text-align:left;cursor:pointer}
.nav .theme-mobile{display:none}
.nav a::before,.nav button::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor;opacity:.55;flex:0 0 6px}
.nav .active,.nav a:hover,.nav button:hover{background:var(--ink);color:var(--bg)}
.meta{margin-top:auto;padding:1rem;display:grid;gap:.55rem;border-top:1px solid var(--line);flex-shrink:0}
.pill{border:1px solid var(--line);background:transparent;padding:.4rem .55rem;font:500 .66rem 'JetBrains Mono';letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);display:flex;gap:.4rem;align-items:center}
button.pill{width:100%;cursor:pointer;text-align:left}.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);flex-shrink:0}
.dot.on{background:var(--green)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--red);animation:blink .8s infinite}@keyframes blink{50%{opacity:.3}}

/* main content */
.main{padding:1.5rem clamp(1rem,3vw,3rem) calc(2.5rem + env(safe-area-inset-bottom));min-width:0;overflow:hidden}
.top{display:flex;justify-content:space-between;gap:1.5rem;align-items:flex-start;margin-bottom:1.5rem;flex-wrap:wrap}
.top h1{font:700 clamp(2rem,6vw,4rem)/.92 'JetBrains Mono';letter-spacing:.12em;text-transform:uppercase;margin:0;min-width:0}
.eyebrow{font:500 .7rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin-bottom:.5rem}
.statusbox{border:1px solid var(--line);background:var(--panel);padding:.85rem 1rem;min-width:180px;backdrop-filter:blur(8px)}
.statusbox .label{font:500 .68rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}
.statusbox .metric{font:500 1.15rem 'JetBrains Mono'}
.tag{font:500 .62rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.1em;color:var(--muted);border:1px solid var(--line);padding:.2rem .45rem;background:var(--panel2)}
.subtle{font-size:.82rem;color:var(--muted);line-height:1.5}
.btn{font:500 .7rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.12em;border:1px solid var(--line2);background:var(--panel2);color:var(--ink);padding:.5rem .75rem;min-width:38px;min-height:38px;cursor:pointer;white-space:nowrap;flex-shrink:0}
.btn:hover,.btn.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.btn.danger{border-color:rgba(251,44,54,.6);color:#fecaca}.btn.danger:hover{background:#fb2c36;color:#fff}.btn:disabled,.btn.disabled{opacity:.45;cursor:not-allowed}.btn .exp{font-size:.68rem;opacity:.55}
.sel-sm{font-size:.6rem!important;padding:.15rem .2rem!important;min-width:0!important;border:none!important;background:var(--bg)!important;color:var(--muted)!important;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='4'%3E%3Cpath d='M0 0l3 4 3-4z' fill='%23d4c8ff' opacity='.5'/%3E%3C/svg")!important;background-repeat:no-repeat!important;background-position:right center!important;padding-right:10px!important}.sel-sm option{background:var(--bg)!important;color:var(--ink)!important}
.small{height:300px}.muted{color:var(--muted)}

/* tabs */
.tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 1.2rem}
.tab{font:500 .7rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.12em;border:1px solid var(--line);background:var(--panel2);color:var(--muted);padding:.5rem .85rem;cursor:pointer;white-space:nowrap;flex-shrink:0}
.tab.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tab:hover:not(.active){border-color:var(--line2);color:var(--ink2)}

/* card grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(360px,100%),1fr));gap:.9rem}
.card{background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px);min-width:0;overflow:hidden}
.card.full{grid-column:1/-1}
@media(min-width:1400px){.card.wide{grid-column:span 2}}
@media(min-width:1400px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.head{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;border-bottom:1px solid var(--line);min-height:52px;min-width:0;overflow:hidden;flex-wrap:wrap}
.head .label{font:600 .72rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.14em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.head .tag{margin-left:auto;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.body{padding:.85rem 1rem;min-width:0;overflow:hidden}

/* sidebyside */
.sidebyside{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.9rem}
@media(max-width:860px){.sidebyside{grid-template-columns:1fr}}

/* stat cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(170px,100%),1fr));gap:.65rem}
.mini{background:var(--panel2);border:1px solid var(--line);padding:.75rem .85rem;min-width:0;overflow:hidden}
.mini .label{font:500 .62rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin-bottom:.35rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .metric{font:600 clamp(.9rem,2.5vw,1.2rem) 'JetBrains Mono';color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.metric.pos{color:var(--green)}.metric.neg{color:var(--red)}

/* ticker lookup */
.two{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:1rem}
.chart{width:100%;min-height:320px;overflow:hidden}
#hlChartTag{display:block;height:2.9em;line-height:1.45;overflow:hidden;overflow-wrap:anywhere;font:500 .74rem 'JetBrains Mono';font-variant-numeric:tabular-nums;color:var(--muted)}
#hlSelected{display:block;min-height:1.35em;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.controls{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.controls input,.controls select{background:rgba(0,0,0,.25);border:1px solid var(--line);color:var(--ink);padding:.5rem .65rem;font:500 .82rem 'JetBrains Mono';min-width:0;flex:0 1 auto}
.controls input:focus,.controls select:focus{border-color:var(--line2);outline:none}
.controls input{flex:1 1 140px;min-width:80px}
.splitline{height:1px;background:var(--line);margin:1rem 0}
.trade-pane{display:none}.trade-pane.active{display:block}.trade-mode-tabs .btn.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}summary{cursor:pointer}

/* tables */
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table{width:100%;border-collapse:collapse;font:500 .78rem 'JetBrains Mono';min-width:0}
thead th{font:600 .66rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.12em;color:var(--muted);padding:.55rem .6rem;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap;cursor:pointer;position:sticky;top:0;background:var(--panel)}
thead th:hover{color:var(--ink)}
thead th.sorted{color:var(--ink)}
thead th:first-child,tbody td:first-child{text-align:left}
tbody td{padding:.45rem .6rem;border-bottom:1px solid rgba(212,200,255,.06);text-align:right;white-space:nowrap;color:var(--ink2)}
tbody tr:hover td{background:rgba(212,200,255,.03)}
td.pos{color:var(--green)}td.neg{color:var(--red)}
td.expired{opacity:.45;text-decoration:line-through}td.expiring{color:var(--warn)}

/* raw */
.raw{white-space:pre-wrap;font:500 .74rem 'JetBrains Mono';color:var(--muted);max-width:100%;overflow:auto;max-height:70vh;line-height:1.6;overflow-wrap:anywhere}
td.closed-row{background:rgba(167,139,250,.105);color:#e9ddff;box-shadow:inset 4px 0 0 rgba(167,139,250,.72),inset 0 0 0 999px rgba(99,102,241,.012)}td.open-row{background:rgba(52,211,153,.10);box-shadow:inset 3px 0 0 rgba(52,211,153,.55)}td.group-start{border-top:8px solid rgba(212,200,255,.18)}tbody tr:first-child td.group-start{border-top-width:0}
.view{display:none}.view.active{display:block}

/* bid/ask bar */
.bar{height:8px;border-radius:4px;overflow:hidden;display:flex;margin-top:.4rem;background:var(--line)}
.bar .bid{background:var(--green);height:100%}.bar .ask{background:var(--red);height:100%}

/* perf chart */
.perf-chart{width:100%;min-height:280px;overflow:visible}
.perf-card .head{align-items:flex-start}
.perf-card .head .label{padding-top:.1rem}
.perf-card .body{padding-top:.7rem}
.perf-card .chart{min-height:260px;height:300px;position:relative;overflow:visible}
.perf-card .small{height:300px;overflow:visible}
.perf-controls{display:grid;grid-template-columns:minmax(92px,.75fr) minmax(0,1fr) minmax(0,1fr);gap:.45rem;margin-bottom:.65rem;align-items:stretch}
.perf-group{border:1px solid var(--line);background:var(--panel2);padding:.35rem;display:grid;grid-template-rows:auto 1fr;gap:.28rem;min-width:0}
.perf-label{font:600 .52rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.14em;color:var(--muted);line-height:1}
.perf-seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.25rem;min-width:0}
.perf-controls select,.perf-controls .btn{width:100%;min-width:0;min-height:32px;padding:.35rem .45rem;font-size:.6rem;letter-spacing:.08em;text-align:center}
.perf-controls select{background:rgba(0,0,0,.25);border:1px solid var(--line2);color:var(--ink);font:600 .65rem 'JetBrains Mono';text-transform:uppercase;appearance:none;-webkit-appearance:none;text-align-last:center;cursor:pointer}
.perf-readout{margin-top:.45rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.perf-tooltip{position:absolute;z-index:20;display:none;pointer-events:none;min-width:138px;max-width:190px;padding:.46rem .55rem;border:1px solid rgba(167,139,250,.45);background:rgba(10,8,24,.94);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04) inset;color:var(--ink);font:600 .7rem 'JetBrains Mono';backdrop-filter:blur(8px)}
.perf-tooltip.show{display:block}.perf-tip-date{color:var(--muted);font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.18rem}.perf-tip-value{font-size:.9rem;color:var(--ink);font-variant-numeric:tabular-nums}.perf-card .tv-lightweight-charts table{overflow:visible!important}

/* ======== RESPONSIVE ======== */

/* narrow desktop */
@media(max-width:1100px){
  .two{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr))}
}

/* tablet */
@media(max-width:860px){
  html{font-size:14px}
  body{min-height:100dvh}
  .shell{display:block}
  .side{position:sticky;top:0;width:100%;height:auto;z-index:30;border-right:0;border-bottom:1px solid var(--line);background:rgba(5,5,16,.92);overflow:visible}
  .brand{min-height:52px;padding:0 .75rem;gap:.55rem}
  .sig{width:28px;height:28px;font-size:.68rem}
  .wordmark{font-size:.68rem;letter-spacing:.11em}
  .nav{display:flex;overflow-x:auto;gap:.3rem;padding:.5rem .6rem;border-bottom:0;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nav::-webkit-scrollbar{display:none}
  .nav a,.nav button{flex:0 0 auto;width:auto;border:1px solid var(--line);background:var(--panel2);padding:.5rem .55rem;min-height:36px;font-size:.6rem;letter-spacing:.08em}
  .nav .theme-mobile{display:flex}
  .nav a::before,.nav button::before{display:none}.nav .nav-sep{flex:0 0 2px;width:2px;height:28px;margin:.1rem .35rem;border-top:0;border-left:2px solid var(--line2)}
  .meta{display:none}
  .main{padding:1rem .75rem calc(1.5rem + env(safe-area-inset-bottom))}
  .top{display:block;margin-bottom:1rem}
  .top h1{font-size:clamp(1.8rem,12vw,3rem);line-height:.95}
  .statusbox{margin-top:.7rem;width:100%}
  .grid{grid-template-columns:1fr!important;gap:.65rem}
  .cards{grid-template-columns:repeat(auto-fill,minmax(min(140px,100%),1fr));gap:.5rem}
  .controls input,.controls select{font-size:16px;min-height:40px;flex:1 1 100px}
  .sel-sm{font-size:16px!important;min-width:42px!important;min-height:38px!important;padding:.35rem 1.3rem .35rem .45rem!important;border:1px solid var(--line)!important;background-color:var(--panel2)!important}
  .btn{font-size:.65rem;padding:.45rem .6rem;min-height:38px}
  .perf-controls{grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:.55rem}
  .perf-group:first-child{grid-column:1/-1}
  .perf-controls select,.perf-controls .btn{min-height:34px;font-size:.58rem;padding:.32rem .38rem}
  .perf-card .chart{min-height:235px;height:250px}
  .tab{font-size:.62rem;padding:.45rem .6rem;min-height:38px}
  table{font-size:.72rem}
  thead th{font-size:.6rem;padding:.45rem .4rem}
  tbody td{padding:.4rem;font-size:.7rem}
}

/* phone */
@media(max-width:480px){
  .main{padding:.75rem .55rem calc(1.2rem + env(safe-area-inset-bottom))}
  .mini{padding:.6rem}
  .mini .metric{font-size:.95rem}
  .cards{grid-template-columns:repeat(auto-fill,minmax(min(130px,100%),1fr));gap:.4rem}
  .controls{flex-direction:column}.controls input,.controls select,.controls button{width:100%;flex:1 1 auto}
  .btn,.tab{padding:.4rem .5rem;font-size:.6rem;min-height:38px}
  .sel-sm{font-size:16px!important;min-height:38px!important;padding:.35rem 1.3rem .35rem .45rem!important;border:1px solid var(--line)!important;background-color:var(--panel2)!important}
  .head{padding:.6rem .7rem}
  .body{padding:.65rem .7rem}
  .chart{min-height:260px}.perf-chart{min-height:220px}
  .perf-card .body{padding:.55rem}
  .perf-card .chart{min-height:205px;height:220px}
  .perf-controls{gap:.32rem;margin-bottom:.45rem}
  .perf-group{padding:.28rem;gap:.22rem}
  .perf-label{font-size:.48rem}
  .perf-readout{font-size:.72rem;margin-top:.35rem}
}

/* ultrawide */
@media(min-width:1800px){
  .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .card.wide{grid-column:span 2}
  .main{max-width:2200px;margin:0 auto}
}

td.instrument-cell{text-align:left;min-width:240px;white-space:normal}
.inst-main{color:var(--ink);font-weight:650;line-height:1.15}
.inst-meta{color:var(--muted);font-size:.68rem;margin-top:.15rem;letter-spacing:.02em}


/* portfolio overview */
.overview-card .body{padding:1rem}
.overview-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);gap:.9rem;align-items:stretch}
.overview-main{min-width:0}
.overview-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;height:100%}
.overview-stat{background:linear-gradient(180deg,rgba(167,139,250,.08),rgba(0,0,0,.06)),var(--panel2);border:1px solid var(--line);padding:1rem;min-width:0;display:flex;flex-direction:column;justify-content:space-between;min-height:105px}
.overview-stat.primary{grid-column:span 1;min-height:126px;border-color:var(--line2);box-shadow:inset 0 0 0 1px rgba(167,139,250,.05)}
.overview-stat .label,.risk-chip .label{font:600 .62rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-stat .metric{font:700 clamp(1.1rem,2.5vw,1.85rem) 'JetBrains Mono';letter-spacing:-.03em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-stat.primary .metric{font-size:clamp(1.35rem,3.2vw,2.35rem)}
.metric-line{display:flex;align-items:center;gap:.4rem;min-width:0}.metric-line .metric{min-width:0;flex:1}
.overview-perf{border:1px solid var(--line);background:var(--panel2);min-width:0;overflow:hidden}.overview-perf .head{background:rgba(0,0,0,.08)}
.risk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:.5rem}
.risk-chip{background:var(--panel2);border:1px solid var(--line);padding:.62rem .72rem;min-width:0;overflow:hidden}
.risk-chip .metric{font:650 .95rem 'JetBrains Mono';color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.risk-chip .metric.pos{color:var(--green)}.risk-chip .metric.neg{color:var(--red)}
@media(max-width:1280px){.overview-layout{grid-template-columns:1fr}.overview-cards{grid-template-columns:repeat(auto-fill,minmax(min(190px,100%),1fr))}}
@media(max-width:860px){.overview-cards{grid-template-columns:repeat(auto-fill,minmax(min(155px,100%),1fr));gap:.5rem}.overview-stat{min-height:92px;padding:.75rem}.overview-stat.primary{min-height:104px}.overview-stat .metric{font-size:1.1rem}.overview-stat.primary .metric{font-size:1.35rem}}
@media(max-width:480px){.overview-card .body{padding:.65rem}.overview-layout{gap:.65rem}.overview-cards{grid-template-columns:1fr 1fr}.overview-stat{padding:.65rem;min-height:86px}.overview-stat.primary{grid-column:1/-1}.risk-grid{grid-template-columns:1fr 1fr}}


/* portfolio overview density tweaks */
.overview-card .head{min-height:44px;padding:.65rem 1rem}
.overview-card .body{padding:.9rem 1rem 1rem}
.overview-layout{align-items:start}
.overview-cards{height:auto;align-content:start;align-items:start;grid-template-columns:repeat(15,minmax(0,1fr))}
.overview-stat{grid-column:span 5;min-height:94px;padding:.85rem .95rem;justify-content:flex-start;gap:.32rem;align-self:start}
.overview-stat:not(.risk-small){height:132px}
.overview-stat.primary{grid-column:span 5;min-height:132px}
.overview-stat.risk-small{grid-column:span 3;min-height:76px;padding:.68rem .78rem;background:var(--panel2)}
.overview-stat .label{margin-bottom:.24rem}
.overview-stat:not(.risk-small) .label{min-height:34px;display:flex;align-items:center}
.overview-stat .metric{line-height:1.08}
.overview-stat:not(.risk-small) .metric{margin-top:.52em}
.overview-stat:not(.primary):not(.risk-small) .metric{margin-top:.65em}
.overview-stat.risk-small .metric{font-size:clamp(.92rem,1.8vw,1.12rem);font-weight:650;margin-top:.35em}
.overview-stat .metric.pos{color:var(--green)}
.overview-stat .metric.neg{color:var(--red)}
.overview-section-label{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;margin:.1rem 0 -.25rem;color:var(--muted);font:650 .62rem 'JetBrains Mono';text-transform:uppercase;letter-spacing:.14em}
.overview-note{grid-column:1/-1;color:var(--muted);font-size:.72rem;margin-top:-.15rem}
.metric-label-row{display:flex;align-items:center;justify-content:space-between;gap:.55rem;margin-bottom:.34rem!important}
.pnl-period{border:1px solid var(--line2);background:rgba(0,0,0,.28);color:var(--ink);font:700 .74rem 'JetBrains Mono';letter-spacing:.08em;text-transform:uppercase;padding:.34rem 1.4rem .34rem .55rem;min-height:34px;min-width:70px;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='5'%3E%3Cpath d='M0 0l3.5 5L7 0z' fill='%23d4c8ff' opacity='.75'/%3E%3C/svg");background-repeat:no-repeat;background-position:right .45rem center}.pnl-period option{background:var(--bg);color:var(--ink)}
.label-period{color:var(--ink2);border:1px solid var(--line);padding:.05rem .28rem;margin-left:.25rem;font-size:.55rem;background:rgba(0,0,0,.18)}
#watchlist tbody td{padding:.22rem .55rem}
#watchlist .btn{min-height:21px;min-width:0;padding:.08rem .36rem;font-size:.54rem;letter-spacing:.08em}
@media(max-width:860px){.overview-cards{grid-template-columns:repeat(6,minmax(0,1fr))}.overview-stat,.overview-stat.primary{grid-column:span 3;padding:.72rem}.overview-stat:not(.risk-small){height:118px;min-height:118px}.overview-stat.risk-small{grid-column:span 2;min-height:74px}.pnl-period{font-size:.7rem;min-height:34px}}
@media(max-width:480px){.overview-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-stat,.overview-stat.primary,.overview-stat.risk-small{grid-column:span 1}.overview-section-label,.overview-note{grid-column:1/-1}}

/* option lookup */
#monthButtons{align-items:flex-start;gap:.35rem .55rem}
.exp-year{display:flex;align-items:center;gap:.28rem;flex-wrap:wrap;border:1px solid var(--line);background:rgba(0,0,0,.10);padding:.28rem .35rem}
.exp-year>span{font:700 .58rem 'JetBrains Mono';letter-spacing:.12em;color:var(--muted);padding:0 .2rem}
.exp-btn{display:inline-grid;grid-template-rows:auto auto;gap:.04rem;min-width:56px;min-height:36px;padding:.28rem .38rem;text-align:center;line-height:1.05}
.exp-btn b{font-size:.64rem;color:inherit}.exp-btn span{font-size:.54rem;opacity:.72}
.option-chain{width:auto;min-width:420px;max-width:620px;font-size:.72rem;font-variant-numeric:tabular-nums}
.option-chain thead th,.option-chain tbody td{text-align:right!important;padding:.25rem .42rem;min-width:64px}
.option-chain thead th{font-size:.56rem;letter-spacing:.08em;cursor:default}
.option-chain tbody td{font-size:.72rem;line-height:1.12}
.option-chain th:nth-child(3),.option-chain td.strike{text-align:center!important;min-width:70px;color:var(--ink);font-weight:750;background:var(--panel2)}
.option-chain tr.atm td{border-top:1.5px solid var(--ink2);border-bottom:1.5px solid var(--ink2);background:rgba(167,139,250,.10)}
.option-chain tr.atm td.strike{background:rgba(167,139,250,.18)}
.option-matrix{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:.68rem;font-variant-numeric:tabular-nums}
.option-matrix th,.option-matrix td{border-bottom:1px solid var(--line);border-right:1px solid rgba(212,200,255,.08);padding:.20rem .30rem;text-align:right;white-space:nowrap;min-width:68px;background:rgba(0,0,0,.08)}
.option-matrix thead th{position:sticky;top:0;z-index:3;background:var(--panel2);font:700 .56rem 'JetBrains Mono';letter-spacing:.08em;color:var(--muted);text-align:center}
.option-matrix .expiry-head{color:var(--ink);border-left:1px solid var(--line);background:linear-gradient(180deg,rgba(167,139,250,.16),var(--panel2))}
.option-matrix .expiry-head span{color:var(--muted);font-weight:500;margin-left:.25rem}
.option-matrix .call-head{color:#34d399}.option-matrix .put-head{color:#fbbf24}.option-matrix .sticky{position:sticky;left:0;z-index:4}
.option-matrix td.strike{font-weight:800;color:var(--ink);text-align:center;background:var(--panel2);min-width:70px;border-right:1px solid var(--line)}
.option-matrix tr.atm td{background:rgba(167,139,250,.10);border-top:1.5px solid var(--ink2);border-bottom:1.5px solid var(--ink2)}
.option-matrix tr.atm td.strike{background:rgba(167,139,250,.20)}
.option-matrix .matrix-cell{cursor:pointer;transition:background .12s ease,color .12s ease}.option-matrix .matrix-cell:hover{background:rgba(167,139,250,.22);color:var(--ink)}
.option-matrix .matrix-cell.call{box-shadow:inset 2px 0 0 rgba(52,211,153,.45)}.option-matrix .matrix-cell.put{box-shadow:inset 2px 0 0 rgba(251,191,36,.42)}
.option-matrix .matrix-empty{color:var(--muted);text-align:center;background:rgba(0,0,0,.05)}.option-matrix .matrix-cell span{display:block;line-height:1.12}.option-matrix .matrix-cell span:first-child{color:var(--muted)}.option-matrix .matrix-cell span:last-child{color:var(--ink)}
.option-matrix .matrix-cell.selected.buy{background:rgba(52,211,153,.22);outline:1px solid rgba(52,211,153,.75);box-shadow:inset 0 0 0 1px rgba(52,211,153,.55)}
.option-matrix .matrix-cell.selected.sell{background:rgba(251,191,36,.22);outline:1px solid rgba(251,191,36,.80);box-shadow:inset 0 0 0 1px rgba(251,191,36,.6)}
.trade-option-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1rem;align-items:start}.option-selector-table{max-height:560px}.combo-panel{position:sticky;top:.6rem;border:1px solid var(--line);background:var(--panel2);padding:.8rem}.combo-summary .metric{font-size:1.35rem}.combo-box table{font-size:.68rem}.combo-box .btn{min-height:26px;padding:.15rem .35rem;font-size:.52rem}dialog{border:1px solid var(--line2);background:var(--panel);color:var(--ink);padding:1rem;max-width:520px}dialog::backdrop{background:rgba(0,0,0,.55)}@media(max-width:980px){.trade-option-layout{grid-template-columns:1fr}.combo-panel{position:relative;top:auto}}


/* ======== Comfort pass: sticky module navigation + mobile ergonomics ======== */
.app-tabs{
  position:sticky;
  top:0;
  z-index:24;
  padding:.55rem 0;
  background:linear-gradient(180deg,rgba(5,5,16,.96),rgba(5,5,16,.82));
  backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
}
.app-tabs.is-stuck{border-bottom-color:var(--line)}
.app-tabs .tab{color:var(--ink2);border-color:rgba(212,200,255,.22)}
.app-tabs .tab:hover:not(.active){color:var(--ink);border-color:var(--line2);background:rgba(167,139,250,.08)}
.top-button{
  position:fixed;
  right:calc(1rem + env(safe-area-inset-right));
  bottom:calc(1rem + env(safe-area-inset-bottom));
  z-index:60;
  width:42px;height:42px;
  border:1px solid var(--line2);
  background:rgba(10,8,24,.88);
  color:var(--ink);
  font:800 1rem 'JetBrains Mono';
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  opacity:0;transform:translateY(8px);
  pointer-events:none;
  transition:opacity .16s ease,transform .16s ease,background .16s ease;
  cursor:pointer;
}
.top-button:hover{background:var(--ink);color:var(--bg)}
.top-button.show{opacity:1;transform:translateY(0);pointer-events:auto}
.scroll{position:relative;overscroll-behavior-x:contain}
.scroll::after{
  content:"scroll →";
  position:sticky;
  right:.35rem;
  bottom:.35rem;
  float:right;
  margin-top:-1.6rem;
  font:700 .52rem 'JetBrains Mono';
  letter-spacing:.12em;
  color:var(--muted);
  border:1px solid var(--line);
  background:rgba(5,5,16,.78);
  padding:.18rem .34rem;
  pointer-events:none;
  opacity:.72;
}
.trade-card .mini{border-color:rgba(167,139,250,.22)}
.trade-card input,.trade-card select{min-height:40px}
.trade-controls{align-items:stretch}
.trade-controls input,.trade-controls select{flex:1 1 130px}
.trade-controls .btn{min-height:42px}

@media(min-width:861px){.scroll::after{display:none}}
@media(max-width:860px){
  .app-top{margin-bottom:.55rem}
  .app-top .eyebrow{font-size:.58rem;margin-bottom:.28rem}
  .app-top h1{font-size:clamp(1.45rem,9vw,2.45rem);letter-spacing:.08em}
  .statusbox{display:grid;grid-template-columns:1fr auto;gap:.35rem .7rem;padding:.65rem .75rem}
  .statusbox .label{grid-column:1/-1}
  #server,#topUpdated,#refreshNote{font-size:.58rem;margin-top:0!important}
  .app-tabs{
    top:calc(52px + env(safe-area-inset-top));
    overflow-x:auto;
    flex-wrap:nowrap;
    scrollbar-width:none;
    margin:.55rem -.75rem .9rem;
    padding:.5rem .75rem;
  }
  .app-tabs::-webkit-scrollbar{display:none}
  .app-tabs .tab{flex:0 0 auto}
  .option-selector-table{max-height:68vh}
  .option-matrix th,.option-matrix td{min-width:74px;padding:.28rem .36rem}
  .option-matrix .matrix-cell span{line-height:1.22}
}
@media(max-width:620px){
  .trade-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
  .trade-mode-tabs .btn{width:100%;white-space:normal;line-height:1.2}
  .trade-controls{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
  .trade-controls input,.trade-controls select,.trade-controls button,.trade-controls label{width:100%;min-width:0;max-width:none!important}
  .trade-controls .danger{grid-column:1/-1}
  .chart{min-height:235px}
  #hlChart{min-height:260px}
  .perf-card .chart{height:230px;min-height:215px}
  .card{border-left-color:rgba(167,139,250,.18);border-right-color:rgba(167,139,250,.18)}
}
@media(max-width:480px){
  .app-top h1{font-size:1.55rem;line-height:1.02}
  .statusbox{grid-template-columns:1fr;padding:.6rem .65rem}
  .option-matrix th,.option-matrix td{min-width:78px;padding:.34rem .38rem;font-size:.72rem}
  .option-matrix td.strike{min-width:72px}
}
@media(max-width:420px){.trade-controls{grid-template-columns:1fr}}

/* HyperLiquid focused watchlist / lookup */
.controls select option,.perf-controls select option,.pnl-period option{background:#111827;color:#d4c8ff}
.hl-main-list table{font-size:.74rem}
.hl-main-list tbody td{padding:.30rem .55rem}
.hl-lookup{margin-top:1rem;border:1px solid var(--line);background:rgba(0,0,0,.10);padding:.75rem}
.hl-lookup summary{cursor:pointer;color:var(--ink2);letter-spacing:.12em;text-transform:uppercase}
#hlLookupTable{opacity:.88}
#hlLookupTable table{font-size:.68rem}
#hlLookupTable tbody td{padding:.24rem .48rem}

/* HyperLiquid instruments: mirror Instruments tab flow */
.hl-search-results table,.hl-main-list table{font-size:.72rem}
.hl-search-results tbody td,.hl-main-list tbody td{padding:.28rem .5rem}
.hl-search-results .btn,.hl-main-list .btn{min-height:24px;min-width:0;padding:.12rem .38rem;font-size:.54rem;letter-spacing:.08em}
.hl-market-workspace{margin-top:.35rem}
#hlCategory{max-width:180px}

.hl-market-name{cursor:pointer;color:var(--ink);font-weight:700}
.hl-market-name.selected{color:var(--accent)}

tr.clickable-row{cursor:pointer}
tr.clickable-row:hover td{background:rgba(167,139,250,.055)}