/* ── TOKENS ─────────────────────────────────────────────────────────────── */
:root{
  --bg:#060810;--bg2:#0b0d18;--bg3:#101422;--bg4:#161b2e;--bg5:#1c2238;--bg6:#222842;
  --border:rgba(255,255,255,0.05);--border2:rgba(255,255,255,0.09);--border3:rgba(255,255,255,0.15);
  --gold:#c9a84c;--gold2:#e8c97a;--gold3:#f5dfa0;
  --gd:rgba(201,168,76,0.07);--gd2:rgba(201,168,76,0.14);--gd3:rgba(201,168,76,0.25);
  --red:#e05555;--rd:rgba(224,85,85,0.08);--rd2:rgba(224,85,85,0.2);
  --green:#4caf82;--gn:rgba(76,175,130,0.08);--gn2:rgba(76,175,130,0.2);
  --blue:#5b8ef0;--bl:rgba(91,142,240,0.08);--bl2:rgba(91,142,240,0.2);
  --amber:#e8923a;--am:rgba(232,146,58,0.08);--am2:rgba(232,146,58,0.2);
  --purple:#9b7de8;--pu:rgba(155,125,232,0.08);
  --text:#ede9e0;--text2:#9a9690;--text3:#525050;--text4:#2a2830;
    --blood:#8b1a1a;--frost:#e8f0f5;--forest:#0a1a0f;--bone:#d4c9a8;--ember:#ff6b35;--moon:#c8d8e8;
  --mono:'DM Mono',monospace;--serif:'Cormorant Garamond',serif;--sans:'Syne',sans-serif;
  --r:10px;--rs:6px;--rx:4px;
  --nav:56px;--top:48px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}
body::before{content:'';position:fixed;inset:0;background-image:radial-gradient(ellipse 80% 50% at 50% -10%,rgba(201,168,76,0.06),transparent);pointer-events:none;z-index:0}
body::after{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(201,168,76,0.012) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,0.012) 1px,transparent 1px);background-size:50px 50px;pointer-events:none;z-index:0}
::-webkit-scrollbar{width:2px;height:2px}::-webkit-scrollbar-thumb{background:var(--bg5);border-radius:2px}

/* ── AUTH SCREEN ─────────────────────────────────────────────────────────── */
#auth-screen{position:fixed;inset:0;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;padding:24px}
.auth-logo{text-align:center;margin-bottom:40px}
.auth-logo .eyebrow{font-family:var(--mono);font-size:8px;color:var(--gold);letter-spacing:.35em;text-transform:uppercase;margin-bottom:10px;opacity:.7}
.auth-logo h1{font-family:var(--serif);font-size:52px;font-weight:400;font-style:italic;color:var(--text);line-height:1;letter-spacing:-.02em}
.auth-logo h1 em{color:var(--gold)}
.auth-logo .sub{font-family:var(--mono);font-size:9px;color:var(--text3);margin-top:8px;letter-spacing:.1em}
.auth-card{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid var(--border2);border-radius:var(--r);padding:32px;width:100%;max-width:380px;position:relative;overflow:hidden}
.auth-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(201,168,76,0.3),transparent)}
.auth-title{font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase;margin-bottom:20px}
.auth-btn{width:100%;padding:12px 20px;border-radius:var(--rs);border:1px solid var(--border2);background:var(--bg4);color:var(--text);font-family:var(--sans);font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .15s;margin-bottom:10px}
.auth-btn:hover{border-color:var(--gold);background:var(--gd2);color:var(--gold2)}
.auth-btn.primary{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.auth-btn.primary:hover{background:var(--gold2)}
.auth-divider{text-align:center;font-family:var(--mono);font-size:8px;color:var(--text3);letter-spacing:.1em;margin:14px 0}
.auth-input{width:100%;background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);color:var(--text);font-family:var(--sans);font-size:12px;padding:10px 14px;outline:none;transition:border-color .12s;margin-bottom:8px}
.auth-input:focus{border-color:rgba(201,168,76,.4)}
.auth-invite{display:flex;gap:6px;margin-bottom:10px}
.auth-invite input{flex:1}
.auth-note{font-family:var(--mono);font-size:9px;color:var(--text3);text-align:center;margin-top:12px;line-height:1.6}

/* ── APP LAYOUT ──────────────────────────────────────────────────────────── */
#app{display:none;flex-direction:column;height:100%;position:relative;z-index:1}
#app.show{display:flex}

/* TOP BAR */
.topbar{height:var(--top);background:rgba(6,8,16,.95);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;flex-shrink:0;z-index:100}
.tb-left{display:flex;align-items:center;gap:10px}
.tb-logo{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--text);letter-spacing:-.01em}
.tb-logo em{color:var(--gold)}
.tb-sess{font-family:var(--mono);font-size:8px;color:var(--text3);letter-spacing:.06em;display:flex;align-items:center;gap:5px}
.tb-sess .sdot{width:5px;height:5px;border-radius:50%;background:var(--ember);animation:blink 1.5s infinite;flex-shrink:0}
.tb-right{display:flex;align-items:center;gap:8px}
.tb-avatar{width:28px;height:28px;border-radius:50%;background:var(--gd2);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;color:var(--gold);cursor:pointer;flex-shrink:0}
.tb-balance{font-family:var(--mono);font-size:9px;color:var(--gold);background:var(--gd);border:1px solid rgba(201,168,76,.15);padding:3px 9px;border-radius:3px;cursor:pointer}
.tb-online{display:flex;gap:4px;align-items:center}
.online-dot{width:22px;height:22px;border-radius:50%;border:1px solid var(--border2);background:var(--bg3);display:flex;align-items:center;justify-content:center;font-size:7px;cursor:pointer;transition:all .1s}
.online-dot:hover{border-color:var(--gold)}
.late-tag{font-family:var(--mono);font-size:7px;padding:2px 7px;border-radius:3px;background:var(--rd);color:var(--red);border:1px solid var(--rd2);animation:blink 1s infinite;display:none}
/* Firestore sync indicator */
#fs-sync{display:flex;align-items:center;gap:4px;padding:2px 7px;border-radius:3px;font-family:var(--mono);font-size:7.5px;letter-spacing:.06em;border:1px solid transparent;transition:all .3s;opacity:0;pointer-events:none;flex-shrink:0}
#fs-sync.syncing{opacity:1;color:var(--amber);border-color:rgba(232,146,58,.2);background:var(--am);pointer-events:auto}
#fs-sync.synced{opacity:1;color:var(--green);border-color:rgba(76,175,130,.2);background:var(--gn);pointer-events:auto}
#fs-sync.error{opacity:1;color:var(--red);border-color:rgba(224,85,85,.2);background:var(--rd);pointer-events:auto;cursor:pointer}
#fs-sync-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;background:currentColor}
#fs-sync.syncing #fs-sync-dot{animation:blink .8s infinite}
/* Avatar style picker */
.av-style-btn{width:36px;height:36px;border-radius:50%;border:2px solid var(--border2);overflow:hidden;cursor:pointer;transition:border-color .15s;flex-shrink:0;background:var(--bg3)}
.av-style-btn:hover,.av-style-btn.active{border-color:var(--gold);box-shadow:0 0 8px rgba(201,168,76,.3)}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.4}}

/* BOTTOM NAV */
.bottomnav{height:var(--nav);background:rgba(11,13,24,.98);backdrop-filter:blur(20px);border-top:1px solid var(--border);display:flex;align-items:stretch;flex-shrink:0;z-index:100}
.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;border:none;background:none;color:var(--text3);transition:all .12s;position:relative;padding:6px 4px}
.nav-item:hover{color:var(--text2)}
.nav-item.active{color:var(--gold)}
.nav-item.active::before{content:'';position:absolute;top:0;left:20%;right:20%;height:1px;background:var(--gold);box-shadow:0 0 8px var(--gold)}
.nav-icon{font-size:16px;line-height:1}
.nav-label{font-family:var(--mono);font-size:6.5px;letter-spacing:.08em;text-transform:uppercase}
.nav-badge{position:absolute;top:5px;right:calc(50% - 14px);background:var(--red);color:white;font-size:7px;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);padding:0 3px}

/* CONTENT AREA */
.content-area{flex:1;overflow:hidden;display:flex;flex-direction:column}
.tab-panel{display:none;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.tab-panel.active{display:flex;flex-direction:column;animation:fadeUp .2s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.panel-content{padding:14px;flex:1}

/* ── SESSION STATUS BAR ──────────────────────────────────────────────────── */
.sess-bar{background:rgba(11,13,24,.9);border-bottom:1px solid var(--border);padding:0 14px;height:34px;display:flex;align-items:center;gap:3px;overflow-x:auto;flex-shrink:0}
.sess-bar::-webkit-scrollbar{height:0}
.sc{display:flex;align-items:center;gap:3px;padding:3px 8px;border-radius:3px;border:1px solid var(--border);font-family:var(--mono);font-size:7px;white-space:nowrap;cursor:pointer;transition:all .12s;flex-shrink:0;letter-spacing:.04em;color:var(--text3)}
.sc.open{background:var(--rd);border-color:var(--rd2);color:var(--red)}
.sc.done{background:var(--gn);border-color:var(--gn2);color:var(--green)}
.sc.strict{border-color:rgba(201,168,76,.2);color:var(--gold)}
.sc .d{width:4px;height:4px;border-radius:50%;background:currentColor;flex-shrink:0}
.sc.open .d{animation:blink 1.2s infinite}
.sdivider{width:1px;height:12px;background:var(--border);flex-shrink:0;margin:0 1px}

/* ── CARDS ───────────────────────────────────────────────────────────────── */
.card{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;margin-bottom:10px;position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.06),transparent)}
.card:last-child{margin-bottom:0}
.card.gold{border-color:rgba(201,168,76,.2);box-shadow:0 0 30px rgba(201,168,76,.04)}
.card.red{border-color:rgba(224,85,85,.2)}
.card.green{border-color:rgba(76,175,130,.2)}
.card.blue{border-color:rgba(91,142,240,.2)}
.card.amber{border-color:rgba(232,146,58,.2)}
.card-title{font-size:7.5px;font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.card-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}

/* ── CHIPS ───────────────────────────────────────────────────────────────── */
.chip{font-family:var(--mono);font-size:7px;padding:2px 7px;border-radius:3px;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;display:inline-block}
.chip-gold{background:var(--gd2);color:var(--gold);border:1px solid rgba(201,168,76,.2)}
.chip-red{background:var(--rd);color:var(--red);border:1px solid var(--rd2)}
.chip-green{background:var(--gn);color:var(--green);border:1px solid var(--gn2)}
.chip-blue{background:var(--bl);color:var(--blue);border:1px solid var(--bl2)}
.chip-amber{background:var(--am);color:var(--amber);border:1px solid var(--am2)}
.chip-gray{background:var(--bg4);color:var(--text3);border:1px solid var(--border)}

/* ── BUTTONS ─────────────────────────────────────────────────────────────── */
.btn{padding:7px 14px;border-radius:var(--rs);font-family:var(--mono);font-size:9px;letter-spacing:.08em;cursor:pointer;border:none;transition:all .12s;display:inline-flex;align-items:center;gap:6px}
.btn-gold{background:var(--gold);color:var(--bg);font-weight:700}
.btn-gold:hover{background:var(--gold2)}
.btn-outline{background:var(--bg3);border:1px solid var(--border2);color:var(--text2)}
.btn-outline:hover{border-color:var(--border3);color:var(--text)}
.btn-red{background:var(--rd);border:1px solid var(--rd2);color:var(--red)}
.btn-green{background:var(--gn);border:1px solid var(--gn2);color:var(--green)}
.btn-green:hover{background:rgba(76,175,130,.15)}
.btn-full{width:100%;justify-content:center;padding:10px}
.btn-next{width:100%;padding:11px;border-radius:var(--rs);background:var(--gn);border:1px solid var(--gn2);color:var(--green);font-family:var(--mono);font-size:9px;cursor:pointer;margin-top:14px;font-weight:600;letter-spacing:.1em;transition:all .12s}
.btn-next:hover{background:rgba(76,175,130,.15)}

/* ── INPUTS ──────────────────────────────────────────────────────────────── */
.inp{background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);color:var(--text);font-family:var(--sans);font-size:11.5px;padding:8px 12px;outline:none;transition:border-color .12s;width:100%}
.inp:focus{border-color:rgba(201,168,76,.35)}
.inp-sm{padding:4px 8px;font-size:10.5px;border-radius:var(--rx)}
.sel{background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);color:var(--text);font-family:var(--mono);font-size:10px;padding:6px 10px;outline:none;cursor:pointer;width:100%}
.sel:focus{border-color:rgba(201,168,76,.35)}
.textarea{background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);color:var(--text);font-family:var(--sans);font-size:11.5px;padding:8px 12px;outline:none;resize:none;width:100%;line-height:1.6;transition:border-color .12s}
.textarea:focus{border-color:rgba(201,168,76,.35)}
.field-label{font-family:var(--mono);font-size:7.5px;color:var(--text3);letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px;display:block}

/* ── INFO BOXES ──────────────────────────────────────────────────────────── */
.info{padding:8px 12px;border-radius:0 var(--rs) var(--rs) 0;margin-bottom:8px;font-size:11px;color:var(--text2);line-height:1.65;border-left:2px solid var(--gold);background:rgba(201,168,76,.04);font-family:var(--mono)}
.info.red{border-color:var(--red);background:var(--rd)}
.info.green{border-color:var(--green);background:var(--gn)}
.info.blue{border-color:var(--blue);background:var(--bl)}
.info.amber{border-color:var(--amber);background:var(--am)}
.info strong{color:var(--text)}

/* ── GRID ────────────────────────────────────────────────────────────────── */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.divider{height:1px;background:var(--border);margin:12px 0}

/* ── STAT CARDS ──────────────────────────────────────────────────────────── */
.stat{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:12px 14px;position:relative;overflow:hidden}
.stat::before{content:'';position:absolute;top:0;left:0;right:0;height:2px}
.stat.gold::before{background:linear-gradient(90deg,var(--gold),transparent)}
.stat.green::before{background:linear-gradient(90deg,var(--green),transparent)}
.stat.red::before{background:linear-gradient(90deg,var(--red),transparent)}
.stat.blue::before{background:linear-gradient(90deg,var(--blue),transparent)}
.stat-label{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px}
.stat-val{font-family:var(--serif);font-size:24px;font-weight:600;font-style:italic;color:var(--text);line-height:1;margin-bottom:2px}
.stat-sub{font-family:var(--mono);font-size:8.5px;color:var(--text3)}

/* ── PROGRESS ────────────────────────────────────────────────────────────── */
.progress{height:3px;background:var(--bg5);border-radius:3px;overflow:hidden;margin:6px 0}
.progress-fill{height:100%;border-radius:3px;transition:width .4s ease}
.progress-fill.gold{background:linear-gradient(90deg,var(--gold),var(--gold2))}
.progress-fill.green{background:var(--green)}
.progress-fill.red{background:var(--red)}
.progress-fill.blue{background:var(--blue)}

/* ── OPTION BUTTONS ──────────────────────────────────────────────────────── */
.opt-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.opt{padding:5px 12px;border-radius:var(--rx);border:1px solid var(--border2);background:var(--bg4);color:var(--text2);font-family:var(--mono);font-size:9px;cursor:pointer;transition:all .12s;letter-spacing:.03em}
.opt:hover{border-color:var(--gold);color:var(--gold)}
.opt.on{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.opt.on-green{background:var(--gn);border-color:var(--green);color:var(--green)}
.opt.on-red{background:var(--rd);border-color:var(--red);color:var(--red)}
.opt.on-blue{background:var(--bl);border-color:var(--blue);color:var(--blue)}
.opt.on-gold{background:var(--gd2);border-color:var(--gold);color:var(--gold)}
.opt.sd{border-color:var(--rd2);color:var(--red)}
.opt.go{border-color:var(--gn2);color:var(--green)}

/* ── TABLES ──────────────────────────────────────────────────────────────── */
.tbl{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:10px}
.tbl th{text-align:left;padding:5px 8px;color:var(--text3);font-size:7px;letter-spacing:.15em;text-transform:uppercase;border-bottom:1px solid var(--border)}
.tbl td{padding:6px 8px;border-bottom:1px solid var(--border);color:var(--text2);line-height:1.5}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:rgba(255,255,255,.015)}

/* ── DECISION TREE ───────────────────────────────────────────────────────── */
.dt-node{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px}
.dt-node.pass{border-color:var(--gn2);background:rgba(76,175,130,.03)}
.dt-node.fail{border-color:var(--rd2);background:rgba(224,85,85,.03)}
.dt-q{font-size:13px;font-weight:600;color:var(--text);margin-bottom:6px;line-height:1.5;font-family:var(--sans)}
.dt-rule{font-size:10px;color:var(--text3);font-family:var(--mono);margin-bottom:8px;line-height:1.65;background:var(--bg4);padding:6px 10px;border-radius:var(--rx);border-left:2px solid var(--gold);font-style:italic}
.dt-opts{display:flex;flex-wrap:wrap;gap:5px}
.dt-opt{padding:5px 12px;border-radius:var(--rx);border:1px solid var(--border2);background:var(--bg4);color:var(--text2);font-family:var(--mono);font-size:9px;cursor:pointer;transition:all .12s}
.dt-opt:hover{border-color:var(--gold);color:var(--gold)}
.dt-opt.sel{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.dt-opt.sd-opt{border-color:var(--rd2);color:var(--red)}
.dt-opt.go-opt{border-color:var(--gn2);color:var(--green)}
.dt-res{margin-top:8px;padding:6px 10px;border-radius:var(--rx);font-family:var(--mono);font-size:9px;letter-spacing:.05em;display:none}
.dt-res.show{display:block}
.dt-res.pass{background:var(--gn);color:var(--green);border:1px solid var(--gn2)}
.dt-res.fail{background:var(--rd);color:var(--red);border:1px solid var(--rd2)}
.dt-res.warn{background:var(--gd2);color:var(--gold);border:1px solid rgba(201,168,76,.2)}
.gate-hard{background:var(--rd);color:var(--red);border:1px solid var(--rd2);padding:1px 6px;border-radius:2px;font-size:6.5px;font-family:var(--mono);letter-spacing:.1em}

/* ── PAIR CARDS ──────────────────────────────────────────────────────────── */
.pair-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:10px}
.pair-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px;cursor:pointer;transition:all .15s;position:relative}
.pair-card:hover{border-color:var(--border2)}
.pair-card.active{border-color:var(--gold);background:var(--gd);box-shadow:0 0 16px rgba(201,168,76,.1)}
.pair-card.qualified{border-color:rgba(76,175,130,.4)}
.pair-card.sd{border-color:rgba(224,85,85,.3);opacity:.7}
.pair-card.fully-done .pair-progress{color:var(--green);font-weight:700}
.pair-card.locked{border-color:rgba(232,146,58,.3);opacity:.6}
.pair-card.sess-locked{border-color:rgba(155,125,232,.3);opacity:.55;cursor:not-allowed}
.pair-card.sess-locked .pair-status{color:var(--purple)}

/* ── PAIR SUMMARY POPUP (Journal tap) ───────────────────────────────────── */
#pair-summary-overlay{position:fixed;inset:0;background:rgba(6,8,16,.88);z-index:9998;display:flex;align-items:flex-end;justify-content:center;backdrop-filter:blur(10px);animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.pair-summary-sheet{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--r) var(--r) 0 0;width:100%;max-width:480px;padding:20px;padding-bottom:calc(20px + env(safe-area-inset-bottom));max-height:80vh;overflow-y:auto}
.pair-summary-sheet::before{content:'';display:block;width:36px;height:3px;background:var(--bg5);border-radius:3px;margin:0 auto 18px}
.pair-summary-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--border)}
.pair-summary-row:last-child{border-bottom:none}
.pair-summary-key{font-family:var(--mono);font-size:7.5px;color:var(--text3);letter-spacing:.12em;text-transform:uppercase}
.pair-summary-val{font-family:var(--mono);font-size:10px;color:var(--text);font-weight:600}

/* ── SESSION SUBMIT BUTTON ───────────────────────────────────────────────── */
.sess-submit-btn{width:100%;padding:11px;border-radius:var(--rs);border:1px solid rgba(201,168,76,.3);background:var(--gd);color:var(--gold);font-family:var(--mono);font-size:9px;cursor:pointer;margin-top:10px;font-weight:600;letter-spacing:.1em;transition:all .12s;display:flex;align-items:center;justify-content:center;gap:6px}
.sess-submit-btn:hover{background:var(--gd2);border-color:var(--gold)}
.sess-submit-btn.submitted{background:rgba(76,175,130,.08);border-color:var(--gn2);color:var(--green);cursor:default}
.sess-submit-btn.submitted:hover{background:rgba(76,175,130,.08)}
/* ── SESSION EDIT TAG ────────────────────────────────────────────────────── */
.sess-edit-tag{display:inline-block;font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.08em;padding:1px 5px;border-radius:2px;border:1px solid var(--border);background:var(--bg3);margin-left:6px;vertical-align:middle}
.sess-edit-btn{padding:4px 10px;border-radius:var(--rs);border:1px solid rgba(201,168,74,.25);background:var(--gd);color:var(--gold);font-family:var(--mono);font-size:7.5px;cursor:pointer;letter-spacing:.06em;font-weight:600;transition:all .12s;flex-shrink:0}
.sess-edit-btn:hover{border-color:var(--gold);background:var(--gd2)}
.pair-name{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.05em;color:var(--text);margin-bottom:3px}
.pair-status{font-family:var(--mono);font-size:7px;letter-spacing:.1em}
.pair-card.qualified .pair-status{color:var(--green)}
.pair-card.sd .pair-status{color:var(--red)}
.pair-card.locked .pair-status{color:var(--amber)}
.pair-meta{font-size:9.5px;color:var(--text3);font-family:var(--mono);margin-top:3px}
.pair-steps{display:flex;gap:2px;margin-top:6px}
.pstep{width:7px;height:7px;border-radius:50%;background:var(--bg4);border:1px solid var(--border)}
.pstep.done{background:var(--green);border-color:var(--green)}
.pstep.active{background:var(--gold);border-color:var(--gold)}
.pstep.fail{background:var(--red);border-color:var(--red)}
.pair-progress{font-family:var(--mono);font-size:7px;color:var(--text3);margin-top:4px}

/* ── STREAK CARDS ────────────────────────────────────────────────────────── */
.streak-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px;text-align:center}
.streak-num{font-family:var(--serif);font-size:32px;font-style:italic;color:var(--gold);line-height:1}
.streak-label{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.15em;text-transform:uppercase;margin-top:3px}
.streak-best{font-family:var(--mono);font-size:8.5px;color:var(--text3);margin-top:2px}

/* ── WOLF DEN ────────────────────────────────────────────────────────────── */
.den-hero{background:linear-gradient(135deg,rgba(201,168,76,.08),rgba(155,125,232,.05));border:1px solid rgba(201,168,76,.18);border-radius:var(--r);padding:16px;margin-bottom:14px;position:relative;overflow:hidden}
.den-hero::before{content:\'\';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--purple),transparent)}
.den-xp-bar{height:6px;background:var(--bg4);border-radius:6px;overflow:hidden;margin:8px 0 4px}
.den-xp-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold),var(--gold2));transition:width .5s cubic-bezier(.4,0,.2,1)}
.den-badge-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.den-badge{width:34px;height:34px;border-radius:50%;background:var(--bg4);border:1.5px solid var(--border2);display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer}
.den-badge.earned{border-color:rgba(201,168,76,.4);background:var(--gd)}
.den-badge.locked{opacity:.35;filter:grayscale(1)}
.den-module{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);margin-bottom:8px;overflow:hidden;transition:border-color .15s}
.den-module:hover{border-color:var(--border2)}
.den-module-hdr{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;user-select:none}
.den-module-icon{width:36px;height:36px;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.den-module-title{font-size:13px;font-weight:600;color:var(--text);flex:1;min-width:0}
.den-module-meta{font-family:var(--mono);font-size:7.5px;color:var(--text3);margin-top:2px}
.den-module-pct{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--gold);flex-shrink:0}
.den-module-body{border-top:1px solid var(--border);background:var(--bg3)}
.den-track{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);transition:background .1s}
.den-track:last-child{border-bottom:none}
.den-track:hover{background:rgba(255,255,255,.02)}
.den-track-icon{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border2);background:var(--bg4);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;transition:all .12s}
.den-track-icon.done{background:var(--green);border-color:var(--green);color:#fff}
.den-track-title{font-size:12px;color:var(--text);flex:1;min-width:0}
.den-track-type{font-family:var(--mono);font-size:7px;color:var(--text3);margin-top:2px;letter-spacing:.06em;text-transform:uppercase}
.den-test-card{background:var(--bg2);border:1px solid rgba(91,142,240,.25);border-radius:var(--r);padding:16px;margin-bottom:10px}
.den-test-q{font-size:14px;color:var(--text);line-height:1.55;margin-bottom:14px;min-height:48px}
.den-test-opts{display:flex;flex-direction:column;gap:6px}
.den-test-opt{padding:10px 14px;border-radius:var(--rs);border:1px solid var(--border2);background:var(--bg3);font-size:12px;color:var(--text);cursor:pointer;text-align:left;transition:all .12s}
.den-test-opt:hover{border-color:rgba(91,142,240,.5);background:rgba(91,142,240,.06)}
.den-test-opt.correct{border-color:var(--green);background:var(--gn);color:var(--green)}
.den-test-opt.wrong{border-color:var(--red);background:var(--rd);color:var(--red)}
.den-test-opt.reveal{border-color:rgba(91,142,240,.5);background:rgba(91,142,240,.08)}
.den-rank-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--rs);margin-bottom:4px}
.den-rank-row.me{background:var(--gd);border:1px solid rgba(201,168,76,.2)}
.den-rank-row:not(.me){background:var(--bg3);border:1px solid var(--border)}

/* ── HEATMAP ─────────────────────────────────────────────────────────────── */
.heatmap{display:grid;grid-template-columns:auto repeat(8,1fr);gap:2px;font-family:var(--mono);font-size:7.5px}
.hm-label{color:var(--text3);display:flex;align-items:center;padding-right:6px;font-size:7px;white-space:nowrap}
.hm-cell{height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:7px;cursor:pointer;transition:all .12s}
.hm-cell:hover{transform:scale(1.1)}
.hm-0{background:var(--bg4);color:var(--text3)}
.hm-1{background:rgba(76,175,130,.15);color:var(--green)}
.hm-2{background:rgba(76,175,130,.3);color:var(--green)}
.hm-3{background:rgba(76,175,130,.5);color:#fff}
.hm-neg{background:rgba(224,85,85,.2);color:var(--red)}

/* ── EQUITY CURVE ────────────────────────────────────────────────────────── */
.chart-area{height:120px;background:var(--bg3);border-radius:var(--rs);position:relative;overflow:hidden;margin-top:8px}
.chart-area canvas{position:absolute;inset:0;width:100%;height:100%}

/* ── NOTIFICATION BANNER ─────────────────────────────────────────────────── */
.notif-banner{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:10px 14px;display:flex;align-items:flex-start;gap:10px;margin-bottom:8px}
.notif-banner.gold{border-color:rgba(201,168,76,.25);background:rgba(201,168,76,.04)}
.notif-banner.red{border-color:var(--rd2);background:var(--rd)}
.notif-banner.green{border-color:var(--gn2);background:var(--gn)}
.notif-icon{font-size:16px;flex-shrink:0;margin-top:1px}
.notif-body{flex:1}
.notif-title{font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}
.notif-text{font-size:11.5px;color:var(--text2);line-height:1.5}

/* ── CORR RAIL ───────────────────────────────────────────────────────────── */
.corr-rail{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);margin-bottom:6px;overflow:hidden}
.corr-rail-hdr{padding:8px 12px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;border-bottom:1px solid var(--border)}
.corr-rail-name{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.04em}
.corr-rail-status{font-family:var(--mono);font-size:7.5px;padding:2px 7px;border-radius:3px}
.corr-rail-body{padding:10px 12px;display:none}
.corr-rail-body.open{display:block}

/* ── EXECUTION PHASES ────────────────────────────────────────────────────── */
.phase-nav{display:flex;gap:3px;overflow-x:auto;padding-bottom:2px;margin-bottom:12px}
.phase-nav::-webkit-scrollbar{height:0}
.phase-btn{padding:5px 11px;border-radius:var(--rx);border:1px solid var(--border);background:var(--bg3);color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;white-space:nowrap;transition:all .12s;flex-shrink:0;letter-spacing:.04em}
.phase-btn:hover{border-color:var(--border2);color:var(--text2)}
.phase-btn.active{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.phase-btn.done{background:var(--gn);border-color:var(--gn2);color:var(--green)}
.phase-btn.locked{opacity:.4;cursor:not-allowed}

/* ── CHECKLIST ───────────────────────────────────────────────────────────── */
.check-item{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.check-item:last-child{border-bottom:none;padding-bottom:0}
.check-box{width:18px;height:18px;border-radius:3px;border:1px solid var(--border2);background:var(--bg4);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s;margin-top:1px}
.check-box{min-width:28px;min-height:28px}.check-box.checked{background:var(--green);border-color:var(--green);color:white;font-size:10px}
.check-box.blocked{background:var(--red);border-color:var(--red);color:white;font-size:10px}
.check-body{flex:1}
.check-title{font-size:12px;font-weight:600;color:var(--text);margin-bottom:2px;line-height:1.4}
.check-desc{font-size:10.5px;color:var(--text3);font-family:var(--mono);line-height:1.55}
.check-gate{font-family:var(--mono);font-size:7px;letter-spacing:.1em;margin-top:4px}

/* ── VULN SCORE ──────────────────────────────────────────────────────────── */
.vuln-bar{background:var(--bg4);border-radius:4px;height:6px;overflow:hidden;margin:6px 0}
.vuln-fill{height:100%;border-radius:4px;transition:width .4s ease,background .3s}
/* ── CANDLE SEQ STATE MACHINE ─────────────────────────────────────────────── */
.cs-hist-row{display:flex;align-items:flex-start;gap:8px;padding:7px 0;border-bottom:1px solid var(--border)}
.cs-hist-row:last-child{border-bottom:none}
.cs-hist-pos{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--gold);min-width:22px}
.cs-hist-time{font-family:var(--mono);font-size:8px;color:var(--text3);min-width:36px}
.cs-hist-body{flex:1;font-family:var(--mono);font-size:9px;color:var(--text2);line-height:1.6}
.cs-hist-vuln{font-family:var(--mono);font-size:8px;color:var(--text3);white-space:nowrap}
.cs-dead-box{background:var(--rd);border:1px solid var(--rd2);border-radius:var(--rs);padding:16px;text-align:center}
.cs-sd-box{background:rgba(155,125,232,.08);border:1px solid rgba(155,125,232,.25);border-radius:var(--rs);padding:16px;text-align:center}
.cs-log-form{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:12px;margin-top:8px}
.cs-role-btn{padding:8px 6px;border-radius:var(--rx);border:1px solid var(--border2);background:var(--bg4);color:var(--text3);font-family:var(--mono);font-size:9px;cursor:pointer;transition:all .12s;text-align:center;min-width:0}
.cs-role-btn.on{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.cs-role-btn.warn-on{background:var(--am);border-color:var(--amber);color:var(--amber)}
.cs-warn-btn{padding:5px 9px;border-radius:var(--rx);border:1px solid var(--border2);background:var(--bg4);color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;transition:all .12s}
.cs-warn-btn.on{background:var(--rd);border-color:var(--rd2);color:var(--red)}
.cs-warn-btn.on-hard{background:rgba(155,125,232,.12);border-color:rgba(155,125,232,.35);color:var(--purple)}
.cs-choch-btn{flex:1;padding:9px 6px;border-radius:var(--rx);border:1px solid var(--border2);background:var(--bg4);color:var(--text3);font-family:var(--mono);font-size:9px;cursor:pointer;transition:all .12s;text-align:center}
.cs-choch-btn.on{background:var(--gn);border-color:var(--gn2);color:var(--green)}
.cs-choch-btn.on-wait{background:var(--am);border-color:var(--am2);color:var(--amber)}
.cs-log-btn{width:100%;padding:11px;border-radius:var(--rs);background:var(--gd2);border:1px solid rgba(201,168,76,.3);color:var(--gold);font-family:var(--mono);font-size:9px;font-weight:700;cursor:pointer;letter-spacing:.1em;transition:all .12s;margin-top:10px}
.cs-log-btn:hover{background:var(--gd3);border-color:var(--gold)}
.cs-start-btn{width:100%;padding:13px;border-radius:var(--rs);background:var(--gd);border:1px solid rgba(201,168,76,.25);color:var(--gold2);font-family:var(--mono);font-size:10px;font-weight:700;cursor:pointer;letter-spacing:.12em;transition:all .12s;margin-top:4px}
.cs-start-btn:hover{background:var(--gd2);border-color:var(--gold)}
.cs-abort-btn{flex:1;padding:9px;border-radius:var(--rs);background:var(--rd);border:1px solid var(--rd2);color:var(--red);font-family:var(--mono);font-size:9px;cursor:pointer;letter-spacing:.08em;transition:all .12s}
.cs-reset-btn{padding:7px 14px;border-radius:var(--rs);background:var(--bg3);border:1px solid var(--border);color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;transition:all .12s}
.cs-reset-btn:hover{border-color:var(--border2);color:var(--text2)}

/* ── REFERENCE ───────────────────────────────────────────────────────────── */
.ref-section{border:1px solid var(--border);border-radius:var(--rs);overflow:hidden;margin-bottom:6px}
.ref-section-hdr{padding:10px 14px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;background:var(--bg2)}
.ref-section-hdr:hover{background:var(--bg3)}
.ref-section-title{font-family:var(--mono);font-size:10px;font-weight:500;color:var(--text);letter-spacing:.04em}
.ref-section-body{padding:12px 14px;display:none;background:var(--bg3)}
.ref-section-body.open{display:block}
.ref-rule{font-size:11.5px;color:var(--text2);line-height:1.7;margin-bottom:8px;font-family:var(--mono)}
.ref-note{background:var(--bg4);border-radius:var(--rx);padding:8px 10px;margin-top:6px;font-size:11px;color:var(--text3);font-family:var(--mono);line-height:1.6;border-left:2px solid var(--blue)}
.ref-version{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.08em;margin-top:8px}

/* ── JOURNAL TIMELINE ────────────────────────────────────────────────────── */
.timeline{position:relative;padding-left:20px}
.timeline::before{content:'';position:absolute;left:6px;top:0;bottom:0;width:1px;background:var(--border)}
.tl-item{position:relative;margin-bottom:12px}
.tl-item::before{content:'';position:absolute;left:-17px;top:6px;width:7px;height:7px;border-radius:50%;background:var(--bg4);border:1px solid var(--border2)}
.tl-item.active::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 8px rgba(201,168,76,.4)}
.tl-item.done::before{background:var(--green);border-color:var(--green)}
.tl-item.fail::before{background:var(--red);border-color:var(--red)}
.tl-sess{font-family:var(--mono);font-size:7.5px;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.tl-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px}

/* ── PACK FEED ───────────────────────────────────────────────────────────── */
.feed-item{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px}
.feed-hdr{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.feed-avatar{width:26px;height:26px;border-radius:50%;background:var(--gd2);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:8px;color:var(--gold);flex-shrink:0}
.feed-name{font-family:var(--mono);font-size:9.5px;color:var(--text);font-weight:500}
.feed-time{font-family:var(--mono);font-size:8px;color:var(--text3);margin-left:auto}
.feed-content{font-size:12px;color:var(--text2);line-height:1.6;margin-bottom:8px}
.feed-tags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.feed-actions{display:flex;gap:8px;align-items:center}
.feed-react{font-family:var(--mono);font-size:9px;color:var(--text3);cursor:pointer;padding:2px 7px;border-radius:3px;border:1px solid var(--border);background:var(--bg3);transition:all .1s}
.feed-react:hover{border-color:var(--border2);color:var(--text2)}

/* ── CHAT ────────────────────────────────────────────────────────────────── */
.chat-channels{display:flex;gap:4px;overflow-x:auto;padding-bottom:4px;margin-bottom:10px}
.chat-channels::-webkit-scrollbar{height:0}
.ch-btn{padding:4px 11px;border-radius:var(--rx);border:1px solid var(--border);background:var(--bg3);color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;white-space:nowrap;transition:all .1s;flex-shrink:0}
.ch-btn.active{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.chat-messages{flex:1;overflow-y:auto;padding-bottom:4px}
.msg{display:flex;gap:8px;margin-bottom:10px}
.msg.mine{flex-direction:row-reverse}
.msg-avatar{width:24px;height:24px;border-radius:50%;background:var(--gd2);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:7.5px;color:var(--gold);flex-shrink:0;margin-top:2px}
.msg-bubble{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:8px 11px;max-width:75%;font-size:12px;color:var(--text);line-height:1.5}
.msg.mine .msg-bubble{background:var(--gd);border-color:rgba(201,168,76,.2)}
.msg-meta{font-family:var(--mono);font-size:7.5px;color:var(--text3);margin-top:3px;display:flex;gap:6px;align-items:center}
.msg.mine .msg-meta{justify-content:flex-end}
.chat-input-area{border-top:1px solid var(--border);padding-top:10px;display:flex;gap:6px;align-items:flex-end;flex-shrink:0}
.chat-input{flex:1;background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);color:var(--text);font-family:var(--sans);font-size:12px;padding:8px 12px;outline:none;resize:none;max-height:80px;line-height:1.5}
.chat-input:focus{border-color:rgba(201,168,76,.35)}

/* ── SCALING ─────────────────────────────────────────────────────────────── */
.scale-stage{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px;cursor:pointer;transition:all .15s}
.scale-stage:hover{border-color:var(--border2)}
.scale-stage.active{border-color:var(--gold);background:var(--gd)}
.scale-stage-name{font-family:var(--serif);font-size:16px;font-style:italic;color:var(--text);margin-bottom:2px}
.scale-stage.active .scale-stage-name{color:var(--gold2)}
.scale-stage-meta{font-family:var(--mono);font-size:9px;color:var(--text3)}
.scale-tier{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-bottom:1px solid var(--border);font-family:var(--mono);font-size:10px}
.scale-tier:last-child{border-bottom:none}
.scale-tier.active-tier{color:var(--gold)}
.scale-tier.active-tier .tier-range{color:var(--gold)}
.tier-range{color:var(--text2)}
.tier-risk{color:var(--green)}
.tier-active-badge{font-family:var(--mono);font-size:7px;padding:1px 5px;border-radius:2px;background:var(--gd2);color:var(--gold);border:1px solid rgba(201,168,76,.2)}

/* ── 8R TRACKER ──────────────────────────────────────────────────────────── */
.r8-track{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid rgba(201,168,76,.2);border-radius:var(--r);padding:14px 16px}
.r8-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.r8-title{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--gold2)}
.r8-status{font-family:var(--mono);font-size:8px;letter-spacing:.1em}
.r8-bar{height:8px;background:var(--bg4);border-radius:8px;overflow:hidden;margin:8px 0;position:relative}
.r8-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));border-radius:8px;transition:width .4s ease}
.r8-target{position:absolute;right:0;top:0;bottom:0;width:2px;background:rgba(255,255,255,.3)}

/* ── RECOVERY ENGINE ─────────────────────────────────────────────────────── */
.recovery-banner{background:rgba(139,26,26,.06);border:1px solid rgba(139,26,26,.25);border-radius:var(--rs);padding:12px 14px;display:none}
.recovery-banner.show{display:block;animation:fadeUp .2s ease}
.recovery-title{font-family:var(--mono);font-size:8px;letter-spacing:.15em;color:var(--blood);text-transform:uppercase;margin-bottom:6px}
.recovery-rules{font-size:11px;color:var(--text2);line-height:1.7;font-family:var(--mono)}

/* ── MEDIA UPLOAD ────────────────────────────────────────────────────────── */
.media-panel{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:10px 12px;margin-bottom:10px}
.media-pair-label{font-family:var(--mono);font-size:7.5px;color:var(--gold);letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.media-slots{display:flex;gap:8px}
.media-slot{flex:1;height:70px;background:var(--bg4);border:1px dashed var(--border2);border-radius:var(--rs);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .12s;overflow:hidden;position:relative}
.media-slot:hover{border-color:var(--gold);border-style:solid}
.media-slot .tf-label{font-family:var(--mono);font-size:7.5px;color:var(--text3);margin-bottom:3px}
.media-slot .add-icon{font-size:20px;color:var(--text3)}
.media-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media-slot .cap-overlay{position:absolute;bottom:0;left:0;right:0;background:rgba(6,8,16,.85);padding:2px 6px;font-size:7.5px;color:var(--text2);font-family:var(--mono)}

/* ── UNEXECUTED TRADES ───────────────────────────────────────────────────── */
.unex-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px;margin-bottom:6px}
.unex-type{font-family:var(--mono);font-size:7.5px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}
.unex-type.a{color:var(--red)}
.unex-type.b{color:var(--amber)}
.unex-type.c{color:var(--blue)}

/* ── WEEKLY REVIEW ───────────────────────────────────────────────────────── */
.week-stat{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px;text-align:center}
.week-stat-val{font-family:var(--serif);font-size:20px;font-style:italic;color:var(--text);line-height:1}
.week-stat-label{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.12em;text-transform:uppercase;margin-top:2px}

/* ── MOBILE FIXES ────────────────────────────────────────────────────────── */
@media(max-width:480px){
  .g3{grid-template-columns:1fr 1fr}
  .g4{grid-template-columns:1fr 1fr}
  .pair-grid{grid-template-columns:1fr 1fr}
}

/* ── RANK BADGES ──────────────────────────────────────────────────────────── */
.rank-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:10px;font-family:var(--mono);font-size:7.5px;font-weight:600;letter-spacing:.04em;border:1px solid;white-space:nowrap;flex-shrink:0}
.rank-badge.scout{color:var(--text3);border-color:var(--text4);background:rgba(82,80,80,.12)}
.rank-badge.tracker{color:var(--blue);border-color:rgba(91,142,240,.3);background:var(--bl)}
.rank-badge.hunter{color:var(--green);border-color:rgba(76,175,130,.3);background:var(--gn)}
.rank-badge.executionwolf{color:var(--amber);border-color:rgba(232,146,58,.3);background:var(--am)}
.rank-badge.packlead{color:var(--purple);border-color:rgba(155,125,232,.3);background:var(--pu)}
.rank-badge.alphaanalyst{color:var(--gold);border-color:rgba(201,168,76,.35);background:var(--gd2);box-shadow:0 0 8px rgba(201,168,76,.12)}

/* ── RANK PROGRESSION BAR ─────────────────────────────────────────────────── */
.rank-prog{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:10px 12px;margin-bottom:10px}
.rank-prog-label{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px}
.rank-prog-title{font-family:var(--mono);font-size:9px;color:var(--text);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.rank-reqs{font-family:var(--mono);font-size:8px;color:var(--text2);line-height:1.8;margin-top:6px}
.rank-req-line{display:flex;align-items:center;gap:6px;margin-bottom:2px}
.rank-req-line .rr-done{color:var(--green)}
.rank-req-line .rr-miss{color:var(--text3)}

/* ── DRILL TRACK ──────────────────────────────────────────────────────────── */
.drill-chart-wrap{position:relative;border-radius:var(--rs);overflow:hidden;margin-bottom:10px;border:1px solid var(--border2)}
.drill-chart-wrap img{width:100%;display:block;cursor:zoom-in}
.drill-flipped .drill-chart-front{display:none}
.drill-chart-front{display:block}
.drill-reveal-box{background:var(--bg3);border:1px solid rgba(201,168,76,.35);border-radius:var(--rs);padding:10px 12px;margin-bottom:10px}
.drill-reveal-label{font-family:var(--mono);font-size:7px;color:var(--gold);letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px}
.drill-reveal-answer{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--text);line-height:1.5;margin-bottom:6px}
.drill-teaching{font-family:var(--mono);font-size:9px;color:var(--text2);line-height:1.7;border-top:1px solid var(--border);padding-top:8px;margin-top:6px}
.drill-selfmark{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.drill-selfmark-btn{padding:10px;border-radius:var(--rs);font-family:var(--mono);font-size:9px;font-weight:700;cursor:pointer;letter-spacing:.05em;transition:all .12s}
.drill-difficulty{font-family:var(--mono);font-size:7px;padding:1px 6px;border-radius:2px;letter-spacing:.08em;text-transform:uppercase}
.drill-difficulty.standard{background:var(--bl);color:var(--blue);border:1px solid rgba(91,142,240,.3)}
.drill-difficulty.advanced{background:var(--am);color:var(--amber);border:1px solid rgba(232,146,58,.3)}
.drill-difficulty.elite{background:var(--rd);color:var(--red);border:1px solid var(--rd2)}

/* ── EXAM TRACK ───────────────────────────────────────────────────────────── */
.exam-card{background:linear-gradient(135deg,rgba(155,125,232,.08),rgba(155,125,232,.03));border:1px solid rgba(155,125,232,.3);border-radius:var(--r);padding:14px}
.exam-timer{font-family:var(--mono);font-size:20px;font-weight:700;letter-spacing:.05em;text-align:center;padding:8px;background:var(--bg4);border-radius:var(--rs);margin-bottom:12px}
.exam-timer.urgent{color:var(--red);animation:blink .8s infinite}
.exam-timer.ok{color:var(--amber)}
.exam-timer.fine{color:var(--green)}
.exam-q-progress{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.12em;margin-bottom:6px}
.exam-q-text{font-size:14px;font-weight:600;color:var(--text);line-height:1.55;margin-bottom:12px}
.exam-reveal-row{background:var(--bg3);border-left:2px solid var(--gold);border-radius:0 var(--rs) var(--rs) 0;padding:8px 10px;margin-bottom:6px}
.exam-result-badge{text-align:center;padding:20px;border-radius:var(--r)}
.exam-result-badge.pass{background:rgba(76,175,130,.07);border:1px solid rgba(76,175,130,.3)}
.exam-result-badge.fail{background:var(--rd);border:1px solid var(--rd2)}

/* ── FLAG TO DEN BUTTON ───────────────────────────────────────────────────── */
.flag-den-btn{font-family:var(--mono);font-size:8px;padding:3px 8px;border-radius:3px;border:1px solid rgba(155,125,232,.3);background:rgba(155,125,232,.08);color:var(--purple);cursor:pointer;transition:all .1s;display:inline-flex;align-items:center;gap:4px}
.flag-den-btn:hover{border-color:var(--purple);background:rgba(155,125,232,.15)}

/* ── COMPREHENSION PANEL ─────────────────────────────────────────────────── */
.comp-panel{border-top:1px solid var(--border);padding-top:10px;margin-top:8px;display:none}
.comp-panel.open{display:block;animation:fadeUp .15s ease}
.comp-hunt-row{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rx);padding:8px 10px;margin-bottom:6px}
.comp-stat-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}
.comp-stat{background:var(--bg4);border-radius:3px;padding:4px 8px;font-family:var(--mono);font-size:8px}
.weak-concept{font-family:var(--mono);font-size:8px;color:var(--red);padding:2px 7px;border-radius:3px;background:var(--rd);border:1px solid var(--rd2);display:inline-block;margin:2px}

/* ── PACK AGGREGATE ──────────────────────────────────────────────────────── */
.pack-agg{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:12px 14px;margin-bottom:12px}
.pack-agg-title{font-family:var(--mono);font-size:7px;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px}
.pack-agg-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}

/* ── PAIR MODAL ──────────────────────────────────────────────────────────── */
#pair-modal{
  position:fixed;inset:0;z-index:700;
  display:flex;flex-direction:column;
  background:var(--bg);
  transform:translateY(100%);
  transition:transform .32s cubic-bezier(.32,0,.67,0);
  will-change:transform;
}
#pair-modal.open{transform:translateY(0);transition:transform .32s cubic-bezier(.33,1,.68,1)}
#pair-modal.closing{transform:translateY(100%);transition:transform .28s cubic-bezier(.32,0,.67,0)}

/* drag handle */
.modal-handle{
  width:36px;height:4px;border-radius:4px;
  background:var(--bg5);margin:8px auto 0;flex-shrink:0;cursor:grab
}
/* header */
.modal-hdr{
  height:52px;display:flex;align-items:center;
  gap:10px;padding:0 14px;border-bottom:1px solid var(--border);
  flex-shrink:0;background:rgba(6,8,16,.97)
}
.modal-back{
  width:32px;height:32px;border-radius:var(--rs);
  border:1px solid var(--border2);background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;color:var(--text2);font-size:16px;
  transition:all .12s
}
.modal-back:hover{border-color:var(--border3);color:var(--text)}
.modal-pair-name{
  font-family:var(--mono);font-size:16px;font-weight:500;
  letter-spacing:.04em;color:var(--text);flex:1
}
.modal-status-chip{
  font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;
  padding:3px 8px;border-radius:3px;text-transform:uppercase
}
.modal-media-btn{
  width:32px;height:32px;border-radius:var(--rs);
  border:1px solid var(--border2);background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:15px;flex-shrink:0;transition:all .12s
}
.modal-media-btn:hover{border-color:var(--gold)}
/* progress bar under header */
.modal-progress-bar{
  height:2px;background:var(--bg4);flex-shrink:0;position:relative
}
.modal-progress-fill{
  height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));
  transition:width .3s ease
}
/* ── PACK FEED ───────────────────────────────────────────────────────────── */
.feed-filter{padding:4px 11px;border-radius:var(--rx);border:1px solid var(--border);background:var(--bg4);color:var(--text3);font-family:var(--mono);font-size:8px;cursor:pointer;transition:all .12s;white-space:nowrap;flex-shrink:0;letter-spacing:.04em}
.feed-filter:hover{border-color:var(--border2);color:var(--text2)}
.feed-filter.active{background:var(--gd2);border-color:rgba(201,168,76,.35);color:var(--gold2)}
.feed-entry{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid var(--border);border-radius:var(--r);margin-bottom:8px;overflow:hidden;position:relative;transition:border-color .12s}
.feed-entry:hover{border-color:var(--border2)}
.feed-entry.type-trade{border-left:3px solid var(--green)}
.feed-entry.type-trade.loss{border-left-color:var(--red)}
.feed-entry.type-analysis{border-left:3px solid var(--blue)}
.feed-entry.type-journal{border-left:3px solid var(--gold)}
.feed-entry.type-pattern{border-left:3px solid var(--purple)}
.feed-entry.type-chart{border-left:3px solid var(--amber)}
.feed-entry.type-news{border-left:3px solid var(--red)}
.feed-entry.type-scenario{border-left:3px solid rgba(91,142,240,.6)}
.feed-entry.type-eod{border-left:3px solid rgba(155,125,232,.6)}
.feed-entry-header{display:flex;align-items:center;gap:8px;padding:10px 12px 6px}
.feed-avatar{width:26px;height:26px;border-radius:50%;background:var(--gd2);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:8px;color:var(--gold);flex-shrink:0}
.feed-meta{flex:1;min-width:0}
.feed-name{font-family:var(--sans);font-size:11px;font-weight:600;color:var(--text);line-height:1.2}
.feed-submeta{font-family:var(--mono);font-size:7.5px;color:var(--text3);display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-top:2px}
.feed-type-chip{font-family:var(--mono);font-size:6.5px;padding:1px 6px;border-radius:2px;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.feed-body{padding:0 12px 8px}
.feed-text{font-family:var(--sans);font-size:12px;color:var(--text2);line-height:1.65;margin-bottom:6px}
.feed-chart{width:100%;max-height:160px;object-fit:cover;border-radius:var(--rs);border:1px solid var(--border);margin-bottom:6px;cursor:pointer}
.feed-tags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.feed-tag{font-family:var(--mono);font-size:7px;padding:2px 7px;border-radius:2px;background:var(--bg4);border:1px solid var(--border);color:var(--text3)}
.feed-tag.pair{background:var(--bl);border-color:var(--bl2);color:var(--blue)}
.feed-tag.session{background:var(--gd);border-color:rgba(201,168,76,.2);color:var(--gold)}
.feed-tag.outcome-win{background:var(--gn);border-color:var(--gn2);color:var(--green)}
.feed-tag.outcome-loss{background:var(--rd);border-color:var(--rd2);color:var(--red)}
.feed-tag.scenario{background:var(--pu);border-color:rgba(155,125,232,.25);color:var(--purple)}
.feed-actions{display:flex;gap:2px;padding:4px 8px 8px;align-items:center}
.feed-action-btn{padding:4px 9px;border-radius:var(--rx);border:1px solid transparent;background:none;color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;transition:all .1s;display:flex;align-items:center;gap:4px}
.feed-action-btn:hover{background:var(--bg4);border-color:var(--border);color:var(--text2)}
.feed-action-btn.reacted{background:var(--gd2);border-color:rgba(201,168,76,.25);color:var(--gold)}
.feed-reactions-row{display:flex;gap:4px;padding:0 12px 6px;flex-wrap:wrap}
.feed-reaction-pill{display:flex;align-items:center;gap:3px;padding:2px 7px;border-radius:10px;border:1px solid var(--border);background:var(--bg4);cursor:pointer;transition:all .1s;font-family:var(--mono);font-size:9px;color:var(--text3)}
.feed-reaction-pill:hover{border-color:var(--border2);color:var(--text)}
.feed-reaction-pill.mine{background:var(--gd2);border-color:rgba(201,168,76,.35);color:var(--gold)}
.feed-comments-section{border-top:1px solid var(--border);padding:8px 12px;background:rgba(6,8,16,.3)}
.feed-comment{display:flex;gap:7px;margin-bottom:7px}
.feed-comment-avatar{width:20px;height:20px;border-radius:50%;background:var(--bg4);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:7px;color:var(--text3);flex-shrink:0}
.feed-comment-body{flex:1}
.feed-comment-name{font-family:var(--mono);font-size:7.5px;color:var(--text2);margin-bottom:1px}
.feed-comment-text{font-family:var(--sans);font-size:11px;color:var(--text2);line-height:1.5}
.feed-comment-time{font-family:var(--mono);font-size:7px;color:var(--text3);margin-top:2px}

/* ── NEW FEED POST TYPES ─────────────────────────────────────────────────── */
.feed-entry.type-kill_order{border-left:3px solid var(--purple);background:linear-gradient(135deg,rgba(155,125,232,.04),var(--bg3))}
.feed-entry.type-confirmed_kill{border-left:3px solid var(--green);background:linear-gradient(135deg,rgba(76,175,130,.06),var(--bg3))}
.feed-entry.type-pack_run{border-left:3px solid var(--amber);background:linear-gradient(135deg,rgba(232,146,58,.05),var(--bg3))}
.feed-entry.type-badge_milestone{border-left:3px solid var(--gold);background:linear-gradient(135deg,rgba(201,168,76,.08),var(--bg3))}
.kill-order-card{background:rgba(155,125,232,.06);border:1px solid rgba(155,125,232,.25);border-radius:var(--rs);padding:10px 12px;margin-bottom:8px}
.pack-run-card{background:rgba(232,146,58,.06);border:1px solid rgba(232,146,58,.25);border-radius:var(--rs);padding:10px 12px;margin-bottom:8px}
.badge-card{background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.25);border-radius:var(--rs);padding:10px 12px;margin-bottom:8px;text-align:center}
.pin-indicator{position:absolute;top:8px;right:10px;font-size:10px;opacity:.7}
.feed-entry.pinned{border-top:2px solid var(--gold)}
.date-sep{text-align:center;padding:8px 0;font-family:var(--mono);font-size:7.5px;color:var(--text3);letter-spacing:.12em;position:relative;margin:4px 0}
.date-sep::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--border)}
.date-sep span{background:var(--bg);padding:0 10px;position:relative}
.feed-search-wrap{padding:8px 14px;border-bottom:1px solid var(--border);background:var(--bg2);flex-shrink:0}
.feed-search-inp{width:100%;background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);color:var(--text);font-family:var(--mono);font-size:11px;padding:7px 12px;outline:none;transition:border-color .12s}
.feed-search-inp:focus{border-color:rgba(201,168,76,.35)}
.feed-images-row{display:flex;gap:6px;margin-bottom:8px}
.feed-images-row img{flex:1;max-height:120px;object-fit:cover;border-radius:var(--rs);border:1px solid var(--border);cursor:pointer}
.quoted-post{background:var(--bg4);border:1px solid var(--border2);border-left:2px solid var(--text3);border-radius:var(--rs);padding:7px 10px;margin-bottom:8px;cursor:pointer}
.quoted-post-author{font-family:var(--mono);font-size:7.5px;color:var(--text3);margin-bottom:3px}
.quoted-post-text{font-family:var(--sans);font-size:11px;color:var(--text3);line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mention{color:var(--gold);font-weight:600}
.feed-post-menu{position:absolute;top:8px;right:8px;z-index:10}
.feed-post-menu-btn{background:none;border:none;color:var(--text4);font-size:14px;cursor:pointer;padding:2px 6px;border-radius:var(--rx);transition:all .1s;line-height:1}
.feed-post-menu-btn:hover{color:var(--text3);background:var(--bg4)}
.feed-post-dropdown{position:absolute;right:0;top:22px;background:var(--bg2);border:1px solid var(--border2);border-radius:var(--rs);min-width:140px;box-shadow:0 8px 24px rgba(0,0,0,.5);z-index:50;overflow:hidden}
.feed-post-dropdown button{width:100%;padding:8px 12px;background:none;border:none;color:var(--text2);font-family:var(--mono);font-size:9px;cursor:pointer;text-align:left;transition:background .1s;letter-spacing:.04em}
.feed-post-dropdown button:hover{background:var(--bg3);color:var(--text)}
.feed-post-dropdown button.danger{color:var(--red)}
.feed-bookmark-btn{color:var(--text3);transition:color .1s}
.feed-bookmark-btn.bookmarked{color:var(--gold)}
.compose-img2-slot{display:none}
.compose-img2-slot.show{display:flex}

/* ── THE DEN (ACADEMY) ───────────────────────────────────────────────────── */
.den-section{background:linear-gradient(135deg,var(--bg2),var(--bg3));border:1px solid var(--border);border-radius:var(--r);margin-bottom:10px;overflow:hidden}
.den-section-hdr{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:background .1s}
.den-section-hdr:hover{background:rgba(255,255,255,.02)}
.den-section-hdr::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent)}
.den-section-body{display:none;border-top:1px solid var(--border);padding:14px 16px}
.den-section-body.open{display:block}
.hunt-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px;position:relative;overflow:hidden}
.hunt-card::before{content:'';position:absolute;top:0;left:0;bottom:0;width:3px}
.hunt-card.active::before{background:var(--gold)}
.hunt-card.locked::before{background:var(--text3)}
.hunt-card.complete::before{background:var(--green)}
.hunt-card-title{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--text);margin-bottom:4px}
.hunt-card-meta{font-family:var(--mono);font-size:8px;color:var(--text3);letter-spacing:.04em}
.track-item{background:var(--bg4);border:1px solid var(--border);border-radius:var(--rs);padding:10px 12px;margin-bottom:6px;display:flex;align-items:flex-start;gap:10px}
.track-icon{font-size:16px;flex-shrink:0;margin-top:1px}
.track-body{flex:1;min-width:0}
.track-title{font-size:12px;font-weight:600;color:var(--text);margin-bottom:3px;line-height:1.4}
.track-meta{font-family:var(--mono);font-size:7.5px;color:var(--text3)}
.track-studied{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--border2);background:var(--bg3);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;flex-shrink:0;transition:all .12s}
.track-studied.done{background:var(--green);border-color:var(--green);color:white}
.kill-order-submit{background:var(--bg3);border:1px solid rgba(155,125,232,.3);border-radius:var(--rs);padding:14px}
.ko-status-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:10px;font-family:var(--mono);font-size:8px;letter-spacing:.06em}
.ko-status-pill.pending{background:rgba(232,146,58,.1);border:1px solid rgba(232,146,58,.3);color:var(--amber)}
.ko-status-pill.submitted{background:rgba(91,142,240,.1);border:1px solid rgba(91,142,240,.3);color:var(--blue)}
.ko-status-pill.confirmed{background:rgba(76,175,130,.1);border:1px solid rgba(76,175,130,.3);color:var(--green)}
.ko-status-pill.hunt_again{background:rgba(224,85,85,.1);border:1px solid rgba(224,85,85,.3);color:var(--red)}
.wolf-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}
.wolf-row:last-child{border-bottom:none}
.wolf-row-av{width:32px;height:32px;border-radius:50%;background:var(--gd2);border:1.5px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;color:var(--gold);flex-shrink:0}
.wolf-row-name{font-family:var(--mono);font-size:10px;color:var(--text);flex:1}
.wolf-row-meta{font-family:var(--mono);font-size:8px;color:var(--text3)}
.review-card{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:12px 14px;margin-bottom:8px}
.review-card.pending{border-color:rgba(232,146,58,.3)}
.submission-img{width:100%;border-radius:var(--rs);border:1px solid var(--border);margin:8px 0;cursor:pointer}
.trail-progress-bar{height:6px;background:var(--bg4);border-radius:6px;overflow:hidden;margin:8px 0}
.trail-progress-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold),var(--gold2));transition:width .4s ease}
.badge-icon{font-size:32px;margin-bottom:6px}
.rank-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}
.rank-row:last-child{border-bottom:none}
.rank-num{font-family:var(--mono);font-size:10px;color:var(--text3);width:22px;text-align:center;flex-shrink:0}
.yt-embed{width:100%;aspect-ratio:16/9;border-radius:var(--rs);border:none;margin:8px 0}
.pack-run-row{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);padding:10px 12px;margin-bottom:6px}
.countdown-display{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--amber);letter-spacing:.08em}
.den-tab-row{display:flex;border-bottom:1px solid var(--border);background:var(--bg2);flex-shrink:0}
.den-tab{flex:1;padding:9px 4px;font-family:var(--mono);font-size:8px;letter-spacing:.08em;background:none;border:none;color:var(--text3);border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;transition:all .12s}
.den-tab.active{color:var(--gold);border-bottom-color:var(--gold)}
.analytics-bar{background:var(--bg3);border-radius:var(--rx);height:6px;overflow:hidden;margin-top:4px}
.analytics-bar-fill{height:100%;border-radius:var(--rx);background:linear-gradient(90deg,var(--gold),var(--gold2))}

/* ── KILL LOG VIEW SWITCHER ──────────────────────────────────────────────── */
.tl-view-row{display:flex;gap:5px;padding:8px 14px;background:var(--bg2);border-bottom:1px solid var(--border);flex-shrink:0}
.tl-view-btn{flex:1;padding:7px 4px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg3);color:var(--text3);font-family:var(--mono);font-size:8.5px;cursor:pointer;text-align:center;transition:all .12s;white-space:nowrap}
.tl-view-btn.active{background:var(--gd2);border-color:rgba(201,168,76,.35);color:var(--gold)}
.tl-view-btn:hover:not(.active){border-color:var(--border2);color:var(--text2)}

/* ── GALLERY VIEW ────────────────────────────────────────────────────────── */
#tl-gallery-view{flex:1;overflow-y:auto;padding:10px 14px;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start}
.gallery-tile{position:relative;aspect-ratio:16/9;border-radius:var(--rs);overflow:hidden;cursor:pointer;border:1px solid var(--border);background:var(--bg3);transition:border-color .12s}
.gallery-tile:hover{border-color:var(--border2)}
.gallery-tile.win{border-color:rgba(76,175,130,.3)}
.gallery-tile.loss{border-color:rgba(224,85,85,.3)}
.gallery-tile img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-tile-overlay{position:absolute;top:0;left:0;right:0;padding:4px 6px;display:flex;gap:4px;align-items:flex-start}
.gallery-tile-r{position:absolute;bottom:4px;right:6px;font-family:var(--mono);font-size:9px;font-weight:700}
.gallery-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:4px;padding:8px}
.gallery-placeholder .gp-pair{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--text)}
.gallery-placeholder .gp-setup{font-family:var(--mono);font-size:7.5px;color:var(--text3);text-align:center}
.gallery-placeholder .gp-r{font-family:var(--mono);font-size:10px;font-weight:700}

/* ── CALENDAR VIEW ───────────────────────────────────────────────────────── */
#tl-calendar-view{flex:1;overflow-y:auto;padding:10px 14px}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.cal-nav-btn{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--rs);color:var(--text2);font-family:var(--mono);font-size:12px;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s}
.cal-nav-btn:hover{border-color:var(--gold);color:var(--gold)}
.cal-title{font-family:var(--mono);font-size:10px;color:var(--text);letter-spacing:.08em;font-weight:700}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-dow{font-family:var(--mono);font-size:6.5px;color:var(--text3);text-align:center;padding:4px 0;letter-spacing:.04em}
.cal-cell{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rx);min-height:48px;position:relative;cursor:pointer;transition:border-color .12s;overflow:hidden;padding:3px 4px}
.cal-cell:hover{border-color:var(--border2)}
.cal-cell.today{border-color:rgba(201,168,76,.4);background:var(--gd)}
.cal-cell.empty{background:var(--bg2);cursor:default;opacity:.4}
.cal-cell.has-trades{cursor:pointer}
.cal-day-num{font-family:var(--mono);font-size:7px;color:var(--text3);line-height:1;margin-bottom:2px}
.cal-day-r{font-family:var(--mono);font-size:8.5px;font-weight:700;line-height:1}
.cal-day-badge{position:absolute;top:3px;right:3px;background:var(--bg4);border:1px solid var(--border);border-radius:3px;font-family:var(--mono);font-size:5.5px;color:var(--text3);padding:1px 3px;line-height:1.2}
.cal-day-dots{display:flex;gap:2px;flex-wrap:wrap;margin-top:2px}
.cal-dot{width:4px;height:4px;border-radius:50%;flex-shrink:0}
.cal-expand{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--rs);padding:10px 12px;margin-top:4px;margin-bottom:4px}
.cal-expand-title{font-family:var(--mono);font-size:7.5px;color:var(--gold);letter-spacing:.12em;margin-bottom:8px}

/* ── DELETE + MULTI-SELECT ───────────────────────────────────────────────── */
.trade-card.selecting{position:relative}
.trade-card.selected{border-color:rgba(224,85,85,.4);background:rgba(224,85,85,.03)}
.trade-card .tcard-check{position:absolute;top:10px;right:10px;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border2);background:var(--bg4);display:none;align-items:center;justify-content:center;font-size:11px;pointer-events:none}
.trade-card.selecting .tcard-check{display:flex}
.trade-card.selected .tcard-check{background:var(--red);border-color:var(--red);color:white}
.tl-multi-bar{position:fixed;bottom:calc(var(--nav) + 8px);left:50%;transform:translateX(-50%);background:var(--bg2);border:1px solid rgba(224,85,85,.3);border-radius:var(--r);padding:10px 16px;display:flex;align-items:center;gap:10px;z-index:800;box-shadow:0 4px 24px rgba(0,0,0,.5);min-width:260px}
.tl-multi-label{font-family:var(--mono);font-size:9px;color:var(--text2);flex:1}

/* ── 8-KILL RING ─────────────────────────────────────────────────────────── */
.ring-8{display:flex;gap:3px;align-items:center;margin-top:4px}
.ring-dot{width:7px;height:7px;border-radius:50%;border:1px solid var(--border2);background:var(--bg4);flex-shrink:0;transition:all .2s}
.ring-dot.filled{background:var(--gold);border-color:var(--gold);box-shadow:0 0 4px rgba(201,168,76,.4)}
.ring-dot.filled.win{background:var(--green);border-color:var(--green)}
.ring-dot.filled.loss{background:var(--red);border-color:var(--red)}

/* ── ANALYTICS OVERLAY ───────────────────────────────────────────────────── */
.tl-analytics-overlay{position:fixed;inset:0;background:rgba(6,8,16,.92);z-index:950;backdrop-filter:blur(12px);display:flex;align-items:flex-end;justify-content:center}
.tl-analytics-sheet{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--r) var(--r) 0 0;width:100%;max-width:480px;max-height:88vh;display:flex;flex-direction:column}
.tl-an-tab-row{display:flex;border-bottom:1px solid var(--border);overflow-x:auto;flex-shrink:0}
.tl-an-tab-row::-webkit-scrollbar{height:0}
.tl-an-tab{flex-shrink:0;padding:9px 12px;font-family:var(--mono);font-size:8px;letter-spacing:.06em;background:none;border:none;border-bottom:2px solid transparent;color:var(--text3);cursor:pointer;transition:all .12s;white-space:nowrap}
.tl-an-tab.active{color:var(--gold);border-bottom-color:var(--gold)}
.an-bar-wrap{background:var(--bg3);border-radius:var(--rx);height:18px;overflow:hidden;flex:1}
.an-bar-fill{height:100%;border-radius:var(--rx);background:linear-gradient(90deg,var(--gold),var(--gold2));transition:width .4s ease}

/* ── SMART BAR ───────────────────────────────────────────────────────────── */
.type-qp-btn{flex-shrink:0;width:52px;padding:6px 4px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg3);color:var(--text3);font-family:var(--mono);font-size:7.5px;cursor:pointer;text-align:center;line-height:1.6;transition:all .12s;letter-spacing:.02em}
.type-qp-btn span{display:block;margin-top:2px}
.type-qp-btn.active{background:var(--gd);border-color:rgba(201,168,76,.4);color:var(--gold)}
.type-qp-btn:hover{border-color:var(--border2);color:var(--text2)}
#sb-filter-btn.active{background:var(--gd);border-color:rgba(201,168,76,.4);color:var(--gold)}
#sb-type-btn.active{background:var(--gd);border-color:rgba(201,168,76,.4);color:var(--gold)}
#sb-compose-trigger:hover{border-color:rgba(201,168,76,.3)}
#feed-compose-text:focus{outline:none}
.wolf-av-img{width:36px;height:36px;border-radius:50%;background:var(--gd2);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:var(--gold);margin:0 auto 3px;position:relative;transition:border-color .1s}
.wolf-av-img:hover{border-color:var(--gold2)}
.wolf-av-online{position:absolute;bottom:1px;right:1px;width:8px;height:8px;border-radius:50%;background:var(--green);border:1.5px solid var(--bg2)}
.wolf-av-name{font-family:var(--mono);font-size:6.5px;color:var(--text3);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46px}
.wolf-av-sess{font-family:var(--mono);font-size:6px;color:var(--gold);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46px}

/* step tabs */
.modal-tabs{
  height:38px;display:flex;align-items:center;
  gap:2px;padding:0 14px;overflow-x:auto;flex-shrink:0;
  border-bottom:1px solid var(--border);background:var(--bg2)
}
.modal-tabs::-webkit-scrollbar{height:0}
.modal-tab{
  padding:4px 11px;border-radius:var(--rx);
  border:1px solid transparent;background:none;
  color:var(--text3);font-family:var(--mono);font-size:8px;
  cursor:pointer;white-space:nowrap;transition:all .12s;
  flex-shrink:0;letter-spacing:.04em
}
.modal-tab:hover{color:var(--text2)}
.modal-tab.active{background:var(--gd2);border-color:var(--gold);color:var(--gold2)}
.modal-tab.done{background:var(--gn);border-color:var(--gn2);color:var(--green)}
/* morning vs session strip */
.modal-mvs{
  background:var(--bg2);border-bottom:1px solid var(--border);
  display:none;flex-shrink:0;overflow-x:auto;-webkit-overflow-scrolling:touch
}
.modal-mvs.show{display:block}
.modal-mvs-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* content */
.modal-body{
  flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:14px
}
/* bottom nav */
.modal-footer{
  height:56px;display:flex;align-items:center;gap:8px;
  padding:0 14px;border-top:1px solid var(--border);
  background:rgba(11,13,24,.98);flex-shrink:0
}
.modal-nav-btn{
  flex:1;height:44px;min-height:44px;border-radius:var(--rs);
  border:1px solid var(--border2);background:var(--bg3);
  color:var(--text2);font-family:var(--mono);font-size:9px;
  letter-spacing:.06em;cursor:pointer;transition:all .12s;
  display:flex;align-items:center;justify-content:center;gap:6px
}
.modal-nav-btn:hover{border-color:var(--border3);color:var(--text)}
.modal-nav-btn.primary{
  background:var(--gold);border-color:var(--gold);
  color:var(--bg);font-weight:700
}
.modal-nav-btn:disabled{opacity:.3;cursor:not-allowed}
/* media overlay in modal */
.modal-media-row{
  display:flex;gap:8px;margin-bottom:12px
}
.modal-media-slot{
  flex:1;height:64px;background:var(--bg4);
  border:1px dashed var(--border2);border-radius:var(--rs);
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;cursor:pointer;overflow:hidden;position:relative;
  transition:border-color .12s
}
.modal-media-slot:hover{border-color:var(--gold);border-style:solid}
.modal-media-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.modal-media-slot .cap-overlay{position:absolute;bottom:0;left:0;right:0;background:rgba(6,8,16,.85);padding:2px 6px;font-size:7px;color:var(--text2);font-family:var(--mono)}

/* ── CODE HINT — Part 2 ────────────────────────────────────────────────── */
.code-hint-wrap{margin-top:12px;border:1px solid rgba(201,168,76,.18);border-radius:var(--rs);overflow:hidden}
.code-hint-toggle{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:rgba(201,168,76,.04);font-family:var(--mono);font-size:8px;color:var(--gold);letter-spacing:.12em;cursor:pointer;user-select:none;transition:background .12s}
.code-hint-toggle:hover{background:rgba(201,168,76,.08)}
.code-hint-arrow{transition:transform .2s;display:inline-block}
.code-hint-panel{display:none;border-top:1px solid rgba(201,168,76,.12)}
.code-hint-panel.open{display:block}
.code-hint-card{padding:10px 12px;border-bottom:1px solid var(--border)}
.code-hint-card:last-child{border-bottom:none}
.code-hint-id{font-family:var(--mono);font-size:7px;color:var(--gold);letter-spacing:.2em;margin-bottom:4px;opacity:.7}
.code-hint-body{font-family:var(--mono);font-size:9px;color:var(--text2);line-height:1.65}
.code-hint-illus{margin-top:6px;font-family:var(--mono);font-size:8.5px;color:var(--text3);border-left:2px solid rgba(201,168,76,.2);padding-left:8px;line-height:1.6}

/* ── PHASE 4 REBUILD — Part 3 ────────────────────────────────────────── */
.p4-section{padding:10px 0;border-bottom:1px solid var(--border)}
.p4-section:last-child{border-bottom:none}
.p4-section-lbl{font-family:var(--mono);font-size:7.5px;color:var(--gold);letter-spacing:.18em;margin-bottom:8px}
.rxn-row{display:flex;flex-direction:column;gap:6px;margin-bottom:4px}
.rxn-pair-lbl{font-family:var(--mono);font-size:8px;color:var(--text3);letter-spacing:.06em}

/* ── PHASE 7/8 — Part 3 ─────────────────────────────────────────────── */
.p7-section{padding:10px 0;border-bottom:1px solid var(--border)}
.p7-section:last-child{border-bottom:none}
.p7-lbl{font-family:var(--mono);font-size:7.5px;color:var(--gold);letter-spacing:.18em;margin-bottom:7px}
.r-display{display:flex;justify-content:space-around;padding:12px;background:var(--bg2);border-radius:var(--rs);margin-top:8px}
.r-display-item{text-align:center}
.r-display-label{font-family:var(--mono);font-size:7px;color:var(--text3);letter-spacing:.1em;margin-bottom:4px}
.r-display-val{font-family:var(--mono);font-size:18px;font-weight:700}
.cr-step{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--border)}
.cr-step:last-child{border-bottom:none}
.cr-step-num{font-family:var(--mono);font-size:8px;color:var(--gold);flex-shrink:0;min-width:28px}
.cr-step-text{font-family:var(--mono);font-size:9px;color:var(--text2);flex:1;line-height:1.5}

.rrc-health-status { animation: fadeIn 0.3s ease-out; }
.rrc-illustrations-section { animation: fadeIn 0.3s ease-out; }
.rrc-illustrations { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rrc-illustrations img { border-radius: var(--rx); border: 1px solid var(--border); cursor: pointer; transition: all 0.2s; }
.rrc-illustrations img:hover { border-color: var(--gold); box-shadow: 0 4px 16px rgba(0,0,0,.4); }
@keyframes fadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

.rrc-chart-examples-section { animation: fadeIn 0.3s ease-out; }
.rrc-chart-examples > div { transition: all 0.2s; }
.rrc-chart-examples > div:hover { border-color: var(--gold) !important; box-shadow: 0 4px 16px rgba(0,0,0,.4); }
.modal-overlay { animation: fadeIn 0.2s ease-out; backdrop-filter: blur(4px); }
.modal-overlay > div { animation: slideUp 0.3s ease-out; }
@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

/* ══════════════════════════════════════════════════════════════════════════
   PC LAYOUT — ≥1024px
   Surgical responsive layer. Mobile layout is untouched below this block.
══════════════════════════════════════════════════════════════════════════ */
/* PC-only elements: hidden on mobile */
.pc-rail{display:none}
.pc-main{display:contents}
#tab-dashboard-right{display:none}
#tab-analysis-right{display:none}
#tab-execution-right{display:none}
.auth-logo-stats{display:none}
.auth-logo-online{display:none}

@media(min-width:1024px){

  /* Show PC-only elements */
  #tab-dashboard-right{display:flex;}
  #tab-analysis-right{display:flex;}
  #tab-execution-right{display:flex;}
  .auth-logo-stats{display:flex;}
  .auth-logo-online{display:flex;}

  /* ── THE STALK TAB — 2-column layout ───────────────────────────────── */
  #tab-analysis{flex-direction:row !important;overflow:hidden;}
  #tab-analysis > #analysis-tab-content{
    flex:0 0 46%;
    max-width:520px;
    overflow-y:auto;
    border-right:1px solid var(--border);
    padding:14px;
  }
  #tab-analysis-right{
    flex:1;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
    padding:14px 16px;
    gap:10px;
  }

  /* ── EXECUTION TAB — 2-column layout ───────────────────────────────── */
  #tab-execution{flex-direction:row !important;overflow:hidden;}
  #tab-execution > .panel-content{
    flex:0 0 380px;
    min-width:320px;
    overflow-y:auto;
    border-right:1px solid var(--border);
    padding:14px;
  }
  #tab-execution-right{
    flex:1;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
  }
  /* On PC: exec-modal becomes an inline right panel, not a full-screen overlay */
  #exec-modal.pc-inline{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    transition:none !important;
    flex:1;
    z-index:1;
    background:transparent;
    display:flex;
    flex-direction:column;
  }
  /* Hide the drag handle on PC */
  #exec-modal.pc-inline > div:first-child{display:none;}
  /* Make the exec modal header blend into pc panel */
  #exec-modal.pc-inline > div:nth-child(2){
    background:rgba(11,13,24,.6);
    border-bottom:1px solid var(--border);
  }

  /* ── AUTH SCREEN — 2-column split ──────────────────────────────────── */
  #auth-screen{
    flex-direction:row;
    padding:0;
    align-items:stretch;
    justify-content:stretch;
  }

  /* Left brand panel */
  .auth-logo{
    flex:0 0 42%;
    max-width:520px;
    margin-bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:var(--bg2);
    border-right:1px solid var(--border2);
    padding:48px 40px;
    position:relative;
    overflow:hidden;
  }
  /* decorative grid on brand panel */
  .auth-logo::before{
    content:'';
    position:absolute;inset:0;
    background-image:
      linear-gradient(var(--border) 1px,transparent 1px),
      linear-gradient(90deg,var(--border) 1px,transparent 1px);
    background-size:110px 110px;
    pointer-events:none;
  }
  /* giant W watermark */
  .auth-logo::after{
    content:'W';
    position:absolute;
    font-family:var(--serif);
    font-size:340px;
    font-style:italic;
    color:rgba(255,255,255,0.025);
    top:50%;left:50%;
    transform:translate(-50%,-52%);
    pointer-events:none;
    line-height:1;
  }
  .auth-logo .eyebrow{
    font-size:9px;
    letter-spacing:.4em;
    margin-bottom:16px;
    position:relative;z-index:1;
  }
  .auth-logo h1{
    font-size:72px;
    position:relative;z-index:1;
    margin-bottom:10px;
  }
  .auth-logo .sub{
    font-size:10px;
    letter-spacing:.35em;
    position:relative;z-index:1;
    margin-bottom:40px;
  }
  /* stat pills row on brand panel */
  .auth-logo-stats{
    display:flex;gap:12px;
    position:relative;z-index:1;
    margin-top:8px;
  }
  .auth-logo-stat{
    background:var(--gd);border:1px solid rgba(201,168,76,.18);
    border-radius:8px;padding:10px 18px;text-align:center;
  }
  .auth-logo-stat-num{
    font-family:var(--serif);font-size:22px;font-style:italic;
    color:var(--gold);line-height:1;margin-bottom:3px;
  }
  .auth-logo-stat-lbl{
    font-family:var(--mono);font-size:8px;color:var(--text3);letter-spacing:.1em;
  }
  /* online wolves row on brand panel */
  .auth-logo-online{
    display:flex;gap:8px;align-items:center;
    position:relative;z-index:1;margin-top:28px;
  }
  .auth-logo-online-lbl{
    font-family:var(--mono);font-size:8px;color:var(--text3);
    letter-spacing:.18em;margin-right:6px;
  }
  .auth-logo-wolf{
    width:34px;height:34px;border-radius:50%;
    border:1.5px solid rgba(201,168,76,.4);background:var(--gd);
    display:flex;align-items:center;justify-content:center;
    font-family:var(--mono);font-size:10px;color:var(--gold);
    position:relative;
  }
  .auth-logo-wolf .wolf-dot{
    position:absolute;bottom:1px;right:1px;
    width:8px;height:8px;border-radius:50%;
    background:var(--green);border:2px solid var(--bg2);
  }

  /* Right auth form panel */
  #auth-screen > .auth-card,
  #auth-screen > #auth-register-card{
    flex:1;
    max-width:none;
    border-radius:0;
    border:none;
    background:var(--bg);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:48px 60px;
  }
  /* inner card box on desktop */
  #auth-screen > .auth-card > *,
  #auth-screen > #auth-register-card > *{
    width:100%;max-width:380px;
  }
  #auth-screen > .auth-card{width:auto;}

  /* ── APP LAYOUT — left rail replaces bottom nav ─────────────────────── */
  #app.show{
    flex-direction:row;
    height:100vh;
    overflow:hidden;
  }
  .pc-rail{display:flex;}
  .pc-main{display:flex;}

  /* Left nav rail */
  .pc-rail{
    width:72px;
    min-width:72px;
    background:rgba(11,13,24,.98);
    border-right:1px solid var(--border);
    display:flex;
    flex-direction:column;
    align-items:center;
    padding-top:0;
    flex-shrink:0;
    z-index:200;
    overflow:hidden;
  }
  /* rail logo */
  .pc-rail-logo{
    height:48px;
    display:flex;align-items:center;justify-content:center;
    width:100%;
    border-bottom:1px solid var(--border);
    flex-shrink:0;
  }
  .pc-rail-logo span{
    font-family:var(--serif);font-size:20px;font-style:italic;color:var(--gold);
  }
  /* rail nav items */
  .pc-rail-nav{
    display:flex;flex-direction:column;align-items:center;
    width:100%;padding:8px 0;flex:1;gap:2px;
  }
  .pc-rail-item{
    width:52px;
    padding:9px 0 7px;
    border-radius:8px;
    display:flex;flex-direction:column;align-items:center;gap:3px;
    cursor:pointer;
    border:none;background:none;
    color:var(--text3);
    transition:all .12s;
    position:relative;
    font-size:inherit;
    flex-shrink:0;
  }
  .pc-rail-item:hover{background:var(--bg4);color:var(--text2);}
  .pc-rail-item.active{
    background:var(--gd2);color:var(--gold);
  }
  .pc-rail-item.active::before{
    content:'';position:absolute;left:0;top:20%;bottom:20%;
    width:3px;border-radius:0 2px 2px 0;background:var(--gold);
    margin-left:-8px;
  }
  .pc-rail-item .ri-icon{font-size:17px;line-height:1;}
  .pc-rail-item .ri-label{
    font-family:var(--mono);font-size:6px;letter-spacing:.08em;
    text-transform:uppercase;line-height:1;
  }
  .pc-rail-badge{
    position:absolute;top:6px;right:6px;
    background:var(--red);color:#fff;
    font-size:7px;min-width:13px;height:13px;
    border-radius:7px;display:flex;align-items:center;justify-content:center;
    font-family:var(--mono);padding:0 3px;
  }

  /* Main column (topbar + content) */
  .pc-main{
    flex:1;display:flex;flex-direction:column;overflow:hidden;
  }

  /* Topbar on PC — slightly taller, full-width of pc-main */
  .topbar{height:48px;padding:0 20px;}

  /* Session bar — always visible on PC, sits below topbar */
  .sess-bar{display:flex !important;}

  /* Hide bottom nav on PC */
  .bottomnav{display:none !important;}

  /* Content area fills remaining height */
  .content-area{flex:1;overflow:hidden;}

  /* ── TERRITORY TAB — 2-column layout ───────────────────────────────── */
  #tab-dashboard{flex-direction:row !important;overflow:hidden;}
  #tab-dashboard > .panel-content{
    flex:0 0 44%;
    max-width:500px;
    overflow-y:auto;
    border-right:1px solid var(--border);
    padding:16px 18px;
  }
  /* Right detail column */
  #tab-dashboard-right{
    flex:1;
    overflow-y:auto;
    padding:16px 18px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  /* On PC push the last 3 dashboard cards (Scaling, Ref Bank, Prey Perf)
     into the right column — done via CSS order trick on a grid. */
  /* We wrap them in a right panel via JS-free approach:
     hide them in left, show clones in right — BUT we agreed no JS changes.
     So instead: use CSS display:contents + order to push specific IDs right.
     Cleanest no-JS approach: absolute right panel that scrolls independently. */

  /* Give the dashboard a grid context */
  #tab-dashboard > .panel-content{
    display:flex;flex-direction:column;
  }

  /* Cards that stay LEFT (top 5 sections) — already in natural order */
  /* Cards that move RIGHT — we use the pc-dash-right wrapper injected in HTML */

}
/* end @media pc */

/* ── #1 Pinned Banner ── */
.pin-banner{background:rgba(201,168,76,.08);border-bottom:1px solid rgba(201,168,76,.2);padding:4px 12px;font-family:'JetBrains Mono',monospace;font-size:7px;color:var(--gold);letter-spacing:.15em;display:flex;align-items:center;gap:5px}
/* ── #2 Reaction tray (already rendered, just style improvements) ── */
.feed-emoji-tray{display:flex;gap:3px;padding:0 12px 6px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.feed-emoji-tray-btn{background:var(--bg3);border:1px solid var(--border);border-radius:20px;padding:3px 8px;font-size:12px;cursor:pointer;transition:all .12s;flex-shrink:0;display:flex;align-items:center;gap:3px;font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--text3)}
.feed-emoji-tray-btn:hover{border-color:var(--gold);background:var(--gd)}
.feed-emoji-tray-btn.reacted{border-color:var(--gold);background:var(--gd);color:var(--gold2)}
/* ── #3 Session separator ── */
.session-sep{text-align:center;padding:6px 0;font-family:'JetBrains Mono',monospace;font-size:7px;color:var(--text3);letter-spacing:.15em;position:relative;margin:4px 0}
.session-sep::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--border)}
.session-sep span{padding:0 10px;position:relative;border-radius:20px;border:1px solid var(--border);background:var(--bg)}
/* ── #5 Chat unread badge ── */
.ch-badge{display:inline-block;min-width:14px;height:14px;border-radius:7px;background:var(--red);color:#fff;font-family:'JetBrains Mono',monospace;font-size:7px;line-height:14px;text-align:center;padding:0 3px;margin-left:4px;vertical-align:middle}
/* ── #6 Mention picker ── */
#mention-picker{position:absolute;bottom:100%;left:0;right:0;background:var(--bg2);border:1px solid var(--border2);border-radius:var(--rs);z-index:200;max-height:140px;overflow-y:auto;display:none}
.mention-item{padding:7px 12px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text2);cursor:pointer;display:flex;align-items:center;gap:8px}
.mention-item:hover{background:var(--bg3);color:var(--gold)}
/* ── #7 Session-aware online bar ── */
.wolf-avatar.same-sess .wolf-av-img{box-shadow:0 0 0 2px var(--green)}
/* ── #8 Just-you state ── */
#pack-solo-status{padding:8px 0 2px}
/* ── #12 Inner tab badges ── */
.pvt-badge{display:inline-block;min-width:14px;height:14px;border-radius:7px;background:var(--red);color:#fff;font-family:'JetBrains Mono',monospace;font-size:7px;line-height:14px;text-align:center;padding:0 3px;margin-left:3px;vertical-align:middle;animation:blink 1.5s infinite}
