/* ── Brand Book v1.3 tokens (docs/brand-book-v1.3.html) ── */
 .ep{--bg:#0A0B0D;--surface:#14161A;--surface-2:#1C1F25;--border:#2A2E36;--gold:#D4A03A;--gold-bright:#F59E0B;
     --up:#34CF80;--down:#EF5A4D;--text:#F3F4F6;--text-2:#9AA0AA;--text-3:#5E646E; --label:#8A919C;--info:#4D9FFF;
     --sans:'IBM Plex Sans',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
     max-width:1280px;margin:0 auto;color:var(--text-2);font-family:var(--sans);font-size:13.5px;line-height:1.55;font-variant-numeric:tabular-nums}
 .ep .headrow{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:10px;margin:22px 0 4px}
 .ep h1{font-size:26px;font-weight:700;color:var(--text);letter-spacing:-.02em;margin:0;display:flex;align-items:center;gap:11px}
 .ep .beta{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--gold);border:1px solid var(--gold);border-radius:4px;padding:2px 6px;text-transform:uppercase}
 .ep .sub{font-family:var(--mono);font-size:13px;color:var(--text-2);margin:6px 0 14px}
 .ep .share{font-weight:600;font-size:13px;border-radius:8px;padding:8px 15px;border:1px solid var(--border);cursor:pointer;background:transparent;color:var(--text)}
 .ep .share .y{color:var(--gold-bright);margin-right:6px}
 .ep .u{color:var(--up)!important}.ep .d{color:var(--down)!important}.ep .yy{color:var(--gold-bright)}.ep .bb{color:var(--info)}.ep .dim{color:var(--text-3)}
 .ep .pos{color:var(--up)}.ep .neg{color:var(--down)}
 /* tabs */
 .ep .pgintro{font-size:15px;color:var(--text-2);line-height:1.55;max-width:820px;margin:0 0 10px}
 .ep .pgintro b{color:var(--text)}
 .ep .pgintro .pgtab{font-family:var(--mono);font-size:11px;color:var(--gold-bright);letter-spacing:.02em}
 /* pgmore: quiet inline expander — undo the boxy global details/summary styling */
 .ep details.pgmore{border:none;border-radius:0;background:transparent;margin:0 0 14px;max-width:820px}
 .ep .pgmore summary{list-style:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:var(--mono);font-size:11px;font-weight:500;color:var(--text-2);letter-spacing:.04em;padding:4px 11px;border:1px solid var(--border);border-radius:999px;transition:border-color .12s,color .12s,background .12s}
 .ep .pgmore summary::-webkit-details-marker{display:none}
 .ep .pgmore summary::before{content:"▸";font-size:9px;color:var(--gold-bright)}
 .ep details.pgmore[open] summary::before{content:"▾"}
 .ep .pgmore summary:hover{color:var(--text);border-color:var(--text-3);background:var(--surface-2)}
 .ep .pgmore[open] summary{border-color:var(--text-3);background:var(--surface-2)}
 .ep .qrows{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
 .ep .tip a{color:var(--gold-bright);white-space:nowrap}
 .ep .tip a:hover{color:var(--gold)}
 .ep .tip p{margin:0 0 9px}
 /* Strategy Lab's only variant with a tabs row (Callfolio's moved to the
    moneyline row below). The old 60px clearance was for the fixed Buzzberg
    Cup badge that used to float top-right site-wide — #1639 replaced it with
    the inline "Guide" navbar link, so nothing floats here anymore; match the
    breathing room .headrow already uses elsewhere on this page. */
 .ep .tabs{display:flex;gap:26px;border-bottom:1px solid var(--border);margin:22px 0 16px}
 /* no tabs to show (public Signals-only): the row is just the Share/Guide bar, so it needs
    neither the tall tab padding nor the 22px lead-in under the title — and no bottom border,
    which only existed to underline the tabs (it read as a stray frame under the title).
    Share/Guide stay in this row on purpose: the Buzzberg Cup owns the fixed top-right corner
    site-wide, so they cannot move up into the header. */
 .ep .tabs.notabs{margin:2px 0 10px;border-bottom:none}
 .ep .tabs.notabs .tabend{padding-bottom:0}
 .ep .gsub{display:none}
 .ep .mlrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
 .ep .mlrow .moneyline{flex:1;min-width:0}
 .ep .mlrow .tabend{margin-left:auto;display:flex;align-items:center;gap:14px}
 .ep .mlrow .share{padding:5px 11px;font-size:12.5px}
 /* ── Callfolio sub-nav (variant B — cofounder pick): a slim strip flush under the
      site navbar (cancels base.html's .mt-4). Performance first — the flagship,
      sellable view; the bar deliberately does NOT repeat "Callfolio". ── */
 .ep .cfnav{display:flex;gap:26px;align-items:center;margin:-24px 0 12px;border-bottom:1px solid var(--border)}
 .ep .cfnav button{font-size:13px;font-weight:600;color:var(--text-2);padding:11px 0 10px;position:relative;cursor:pointer;background:none;border:none;font-family:var(--sans)}
 .ep .cfnav button:hover{color:var(--text)}
 .ep .cfnav button.on{color:var(--text)}
 .ep .cfnav button.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold-bright);border-radius:2px}
 /* The public and admin Callfolio share one compact section navigation.
    The legacy standalone grid keeps its own title and spacing. */
 .ep .cfnav-help{display:flex;align-items:center}
 .ep #tab-holdings .portfolio-hub{padding:0 0 56px;background:transparent}
 .ep #tab-holdings .portfolio-top{margin-bottom:12px}
 .ep #tab-holdings .portfolio-controls{align-items:center}
 .ep .cf-calls-toolbar{grid-column:1 / -1;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
 .ep .cf-calls-toolbar .viewbar{margin:0}
 .ep .cf-calls-toolbar .lbl{font-size:10px}
 .ep #cf-calls-performance{row-gap:12px}
 .ep #tab-holdings .portfolio-intro{display:none}
 .ep #tab-holdings .portfolio-actions{margin-top:0}
 .ep .tab{font-size:14px;font-weight:500;color:var(--text-2);padding:0 0 12px;position:relative;cursor:pointer;background:none;border:none;font-family:var(--sans)}
 .ep .tab.on{color:var(--text)}
 .ep .tab.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold-bright)}
 .ep .tabs .tabend{margin-left:auto;display:flex;align-items:center;gap:16px;align-self:flex-end;padding-bottom:6px}
 .ep .tabs .share{padding:5px 11px;font-size:12.5px}
 .ep .tabguide{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--gold-bright);text-decoration:none}
 .ep .tabguide:hover{text-decoration:underline}
 /* info tooltip */
 .ep .info{position:relative;display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;border:1px solid #3A3F49;color:var(--label);font-size:10px;font-weight:700;cursor:help;vertical-align:middle;flex:0 0 auto}
 .ep .info:hover,.ep .info:focus{border-color:var(--gold-bright);color:var(--gold-bright);outline:none}
 /* tooltips carry the page's explanations — readable size, not fine print (cofounder feedback) */
 .ep .info .tip{display:none;position:absolute;left:-6px;top:160%;width:400px;max-width:84vw;background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:13px 16px;font-size:12.5px;line-height:1.55;color:var(--text-2);font-weight:400;text-transform:none;letter-spacing:normal;z-index:60;text-align:left;white-space:normal}
 .ep .info .tip.tip-big{width:470px;font-size:13.5px}
 .ep .tip b{color:var(--text)}
 .ep .tip .pgtab{font-family:var(--mono);font-size:11.5px;color:var(--gold-bright);letter-spacing:.02em}
 /* transparent hover bridge: without it the 10px gap between the ? and the tip drops :hover
    mid-travel, so the mouse can never reach links inside the tip */
 .ep .info::after{content:"";position:absolute;inset:-12px}
 /* the 470px how-it-works tip can't fit anchored to the icon below ~991px — render it as a
    fixed bottom sheet there (same treatment the ≤640 block gives every tip) */
 @media (max-width:991px){
  .ep .info .tip.tip-big{position:fixed;left:12px;right:12px;width:auto;max-width:none;top:auto;bottom:calc(var(--bz-mobile-tabbar-total-h, 68px) + 12px);z-index:1870}
  .ep .info .tip.tip-big::before{display:none}
 }
 .ep .info .tip::before{content:"";position:absolute;left:9px;top:-5px;width:9px;height:9px;background:var(--surface-2);border-left:1px solid var(--border);border-top:1px solid var(--border);transform:rotate(45deg)}
 /* hover/focus reveal only where a real hover exists — on touch the .tipon toggle owns the tip
    (Android Chrome focuses tabindex spans on tap, which used to make tips undismissable) */
 @media (hover:hover){ .ep .info:hover .tip,.ep .info:focus .tip,.ep .info:focus-within .tip{display:block} }
 /* panels + controls */
 .ep .panel{border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:16px 18px;margin-bottom:14px}
 .ep .viewbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
 .ep .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--label);text-transform:uppercase}
 .ep .seg{display:inline-flex;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:3px;gap:2px}
 .ep .seg button{font-family:var(--sans);font-weight:600;font-size:12.5px;color:var(--text-2);padding:6px 13px;border-radius:6px;cursor:pointer;background:transparent;border:none;white-space:nowrap}
 .ep .seg button:hover{color:var(--text)}
 .ep .seg button.on{background:#0E1014;color:var(--text);border:1px solid var(--border)}
  .ep .warn{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--gold);letter-spacing:.05em;text-transform:uppercase;display:flex;gap:7px;align-items:center}
 .ep .status{font-size:12.5px;margin:6px 0;min-height:14px}
 .ep .status .err{color:var(--down)}.ep .status .ld{color:var(--text-3)}
 .ep .status a{color:var(--gold-bright)}
 /* PF layout: rail + main */
 .ep .pf{display:grid;grid-template-columns:274px minmax(0,1fr);gap:16px}
 .ep .rail{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden;align-self:start}
 .ep .rail .cap{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);padding:10px 13px 8px;border-bottom:1px solid var(--border)}
 .ep .rsopt{background:none;border:0;padding:0 0 1px;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--label);cursor:pointer;border-bottom:1px dotted var(--text-3)}
 .ep #rail-cap,.ep #sig-cap{display:flex;align-items:center;justify-content:space-between;gap:8px}
 .ep .railclear{background:none;border:0;padding:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--down);cursor:pointer;white-space:nowrap}
 .ep .railclear:hover{text-decoration:underline}
 .ep .rsopt.on{border-bottom-color:transparent}
 .ep .rsopt:hover{color:var(--text-2)}
 .ep .rsopt.on{color:var(--gold-bright)}
 .ep .field{display:flex;align-items:center;gap:8px;background:var(--surface-2);border-bottom:1px solid var(--border);padding:9px 12px}
 .ep .field input{background:transparent;border:none;outline:none;color:var(--text);font-family:var(--mono);font-size:12px;flex:1;width:100%}
 .ep .field input::placeholder{color:var(--label)}
 .ep .kbd{font-family:var(--mono);font-size:10px;color:var(--text-3);border:1px solid var(--border);border-radius:4px;padding:0 5px}
 .ep .rlist{max-height:560px;overflow-y:auto}
 .ep #rail-selected:not(:empty){border-bottom:1px solid var(--border);padding-bottom:4px;margin-bottom:4px}
 .ep .srow{display:flex;align-items:center;gap:9px;padding:7px 12px;border-bottom:1px solid #1E2127;cursor:pointer;font-size:12.5px;border-left:2px solid transparent}
 .ep .srow:hover{background:var(--surface-2)}
 .ep .srow.hi{background:var(--surface-2)}
 .ep .srow.foc{background:rgba(77,159,255,.08);border-left-color:var(--info)}
 .ep .srow.pin{background:#101216}
 .ep .srow.pin.foc{background:rgba(77,159,255,.08)}
 .ep .av{width:22px;height:22px;border-radius:50%;background:var(--surface-2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--text-2);flex:0 0 auto;overflow:hidden}
 .ep .av img{width:100%;height:100%;object-fit:cover}
 .ep .srow .nm{flex:1;min-width:0;color:var(--text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .ep .srow .nm .s2{display:block;font-size:10.5px;color:var(--label);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .ep .ret{font-family:var(--mono);font-weight:600;font-size:12px;min-width:52px;text-align:right}
 .ep .sdot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
 .ep .x{color:var(--text-3);cursor:pointer;background:none;border:none;font-size:14px;line-height:1;padding:0 0 0 2px}
 .ep .x:hover{color:var(--down)}
 .ep .hintline{font-family:var(--mono);font-size:11px;color:var(--label);padding:8px 13px;letter-spacing:.04em}
 /* chart + holdings */
 .ep .mainrow{display:grid;grid-template-columns:minmax(0,1fr) 222px;gap:14px}
 .ep #sp-chart,.ep #sig-chart{min-width:0;height:430px}
 .ep .hold{border:1px solid var(--border);border-radius:10px;background:var(--surface-2);padding:12px 14px;display:flex;flex-direction:column}
 .ep .hold .cap{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);padding-bottom:8px;border-bottom:1px solid var(--border);margin-bottom:5px}
 .ep #sp-hold-cap,.ep #sig-hold-cap{display:flex;align-items:center;gap:6px;flex-wrap:wrap;row-gap:3px}
 .ep #sp-hold-foc:not(:empty),.ep #sig-hold-foc:not(:empty){color:var(--text);font-family:var(--sans);font-weight:600;text-transform:none;letter-spacing:0;font-size:12.5px;margin-left:2px}
 .ep #sp-hold-pager,.ep #sig-hold-pager{margin-left:auto;display:inline-flex;align-items:center;gap:4px}
 .ep .hpage{background:var(--surface);border:1px solid var(--border);border-radius:6px;color:var(--text-2);width:22px;height:22px;line-height:1;cursor:pointer;font-size:13px;padding:0}
 .ep .hpage:hover{color:var(--text);border-color:var(--text-3)}
 .ep #sp-hold-pager .pn,.ep #sig-hold-pager .pn{font-family:var(--mono);font-size:10.5px;color:var(--label)}
 .ep #sp-hold-chg{font-family:var(--mono);font-size:10.5px;line-height:1.5;padding:5px 8px;margin-bottom:6px;background:var(--surface);border:1px solid #23262D;border-radius:6px}
 .ep #sp-hold-chg .u{color:var(--up)} .ep #sp-hold-chg .d{color:var(--down)}
 .ep .hold .cap b{color:var(--text)}
 .ep .hlist{flex:1;overflow-y:auto;max-height:360px}
 .ep .hrow{display:flex;align-items:center;gap:9px;padding:6px 4px;border-bottom:1px solid #23262d;border-radius:6px}
 .ep .hrow:hover{background:rgba(255,255,255,.03)}
 .ep .hrow .t{font-family:var(--mono);font-weight:600;font-size:12.5px;color:var(--text);flex:1}
 .ep .tico{width:22px;height:22px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--text-2);flex:0 0 auto}
 .ep .tag{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border-radius:5px}
 .ep .tag.long{color:var(--up);background:rgba(52,207,128,.12)}
 .ep .tag.short{color:var(--down);background:rgba(239,90,77,.12)}
 .ep .hempty{color:var(--text-2);font-size:12px;padding:8px 0;text-align:center}
 .ep .hint{font-family:var(--mono);font-size:11px;color:var(--label);margin-top:8px;text-align:center;letter-spacing:.08em;text-transform:uppercase}
 /* tables */
 .ep .tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
 .ep .tbl-scroll table{min-width:560px}
 .ep #sig-es table,.ep #sig-grid table{min-width:640px}
 .ep table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px}
 .ep th{text-align:right;font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);padding:0 8px 10px;border-bottom:1px solid var(--border)}
 .ep th[title]{cursor:help}
 .ep th:first-child,.ep td:first-child{text-align:left}
 .ep td{padding:9px 8px;text-align:right;border-bottom:1px solid #23262d}
 .ep tbody tr:hover td{background:var(--surface-2)}
 .ep td:first-child{color:var(--text);font-weight:600;font-family:var(--sans);font-size:13px}
 .ep tr.ref td:first-child{color:var(--text-2);font-weight:500}
 .ep td:first-child .note{color:var(--label);font-weight:400;font-size:11.5px}
 .ep tr.key td{background:rgba(212,160,58,.07)}
 .ep tr.key td:first-child{border-left:2px solid var(--gold)}
 .ep tr.sel td{background:rgba(77,159,255,.06)}
 .ep .dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle}
 /* SIGNALS */
 .ep .verdict{border:1px solid var(--border);border-left:3px solid var(--info);border-radius:12px;background:var(--surface-2);padding:14px 18px;margin-bottom:14px;display:grid;grid-template-areas:"head money" "summary money" "about money";grid-template-columns:minmax(0,1fr) 330px;gap:5px 30px;align-items:start}
 .ep .verdict h2{font-family:var(--sans);font-weight:700;font-size:15.5px;color:var(--text);line-height:1.3;letter-spacing:-.01em;margin:0}
 .ep .schead{grid-area:head;min-width:0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
 .ep .sc-summary{grid-area:summary;max-width:54ch;margin:1px 0 0;color:var(--text-2);font-size:13.5px;line-height:1.5}
 .ep .sc-about{grid-area:about;justify-self:start;display:inline-flex;align-items:center;gap:7px;margin-top:4px;padding:6px 10px;border:1px solid #3A3F49;border-radius:8px;background:var(--surface);color:var(--text);font:600 12.5px/1.2 var(--sans);cursor:pointer;transition:border-color .15s,background .15s,color .15s}
 .ep .sc-about:hover,.ep .sc-about:focus-visible{border-color:var(--info);background:rgba(77,159,255,.07);outline:none}
 .ep .sc-about[hidden]{display:none}
 .ep .sc-about .arr{color:var(--info);font-family:var(--mono);font-size:13px;transition:transform .15s}
 .ep .sc-about[aria-expanded="true"] .arr{transform:rotate(180deg)}
 .ep #sc-right{grid-area:money;min-width:0}
 /* $100 -> mini bars */
 .ep .b100{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);margin:3px 0 8px}
 .ep .brow{display:flex;align-items:center;gap:10px;margin-bottom:5px}
 .ep .blab{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);flex:0 0 106px}
 .ep .btrack{flex:1;height:7px;border-radius:5px;background:var(--surface);overflow:hidden}
 .ep .bfill{height:100%;border-radius:5px}
 .ep .bval{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--text);flex:0 0 46px;text-align:right}
 .ep .bgap{font-size:12.5px;color:var(--text-2);margin-top:4px}
 /* A short inline explanation adds context without taking over the page. */
 .ep .sc-explain{grid-column:1/-1;min-width:0;margin-top:5px;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface);animation:scExplainIn .14s ease-out}
 .ep .sc-explain[hidden]{display:none}
 .ep .sc-explain-copy{margin:0;color:var(--text-2);font-size:13px;line-height:1.5}
 .ep .sc-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
 .ep .sc-tag{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;background:var(--surface-2);color:var(--text-2);font-family:var(--mono);font-size:10.5px;line-height:1.35}
 .ep .sc-explain-note{margin:8px 0 0;color:var(--label);font-size:12px;line-height:1.45}
 @keyframes scExplainIn{from{transform:translateY(-4px);opacity:.65}to{transform:translateY(0);opacity:1}}
 /* grouped strategy pills — label column + inline pills (compact, one row per family) */
 /* portfolios money line (plain-language header above the chart) */
 .ep .moneyline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:2px 0 10px}
 .ep .moneyline .mlname{font-size:15px;font-weight:600;color:var(--text)}
 .ep .moneyline .mlt{font-family:var(--mono);font-weight:600;font-size:15px}
 .ep .moneyline .mlsub{font-family:var(--mono);font-size:12.5px;color:var(--label)}
 .ep .moneyline .mlsub b{color:var(--text);font-weight:600}
 .ep .sig-cap{font-size:12.5px;color:var(--text-2);line-height:1.5;margin:4px 0 10px;min-height:16px}
 .ep .sig-cap.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:help}
 .ep details{border:1px solid var(--border);border-radius:12px;background:var(--surface);margin-bottom:14px}
 .ep summary{cursor:pointer;padding:13px 18px;font-weight:600;color:var(--text-2);font-size:13.5px;list-style:none;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
 .ep summary::before{content:"▸";color:var(--text-3);font-size:11px}
 .ep details[open] summary::before{content:"▾"}
  .ep .dbody{padding:2px 18px 16px}
 /* quants inner tabs — one table on screen at a time */
 .ep .qtabs{margin:4px 0 14px}
 .ep .qpane{display:none}
 .ep .qpane.on{display:block}
 .ep .qtake{font-size:13.5px;color:var(--text-2);background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:8px 12px;margin:0 0 14px;line-height:1.5}
 .ep .esbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 12px}
 .ep .esbar .qhow{margin:0 0 0 auto;max-width:none}
 .ep .esbar .qhow[open]{flex:1 0 100%;margin-left:0}
 .ep .esbar .qhow .qintro{margin:10px 0 4px}
 .ep .qintro{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;margin-bottom:14px}
 .ep .qh{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);margin-bottom:9px}
 .ep .step{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px;font-size:13.5px;color:var(--text-2);line-height:1.5}
 .ep .step b{color:var(--text)}
 .ep .step .n{flex:0 0 auto;width:20px;height:20px;border-radius:6px;background:var(--surface-2);border:1px solid var(--border);color:var(--gold-bright);font-family:var(--mono);font-size:11px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
 .ep .gloss{display:grid;grid-template-columns:auto 1fr;gap:7px 12px;font-size:12.5px;margin:0}
 .ep .gloss dt{font-family:var(--mono);font-weight:600;color:var(--text);text-align:right;white-space:nowrap}
 .ep .gloss dd{color:var(--text-2);margin:0}
 .ep .foot b{color:var(--gold)}
 /* mobile: speaker launcher chip + rail-as-bottom-sheet + day scrubber (hidden on desktop) */
 .ep summary::-webkit-details-marker{display:none}
 .ep .info.tipon .tip{display:block}
 .ep .rail-launch{display:none}
 .ep .sheet-bg{display:none}
 .ep .rail-close{display:none}
 .ep .scrub{display:none;align-items:center;gap:8px;margin:6px 2px 0}
 .ep .scrub .sb{width:36px;height:36px;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-2);font-size:16px;line-height:1;cursor:pointer;flex:0 0 auto}
 .ep .scrub input[type=range]{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:28px;background:transparent;cursor:pointer}
 .ep .scrub input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:var(--surface-2);border:1px solid #23262D}
 .ep .scrub input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--gold-bright);border:2px solid #0A0B0D;margin-top:-7px;box-shadow:0 0 0 1px var(--border)}
 .ep .scrub input[type=range]::-moz-range-track{height:3px;border-radius:2px;background:var(--surface-2);border:1px solid #23262D}
 .ep .scrub input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--gold-bright);border:2px solid #0A0B0D}
 .ep .scrub .scrub-lbl{font-family:var(--mono);font-size:10.5px;color:var(--text-2);flex:0 0 auto;min-width:78px;text-align:right}
 .ep .chartcol{min-width:0}
 @media (min-width:721px){ .ep #sig-rail .rlist{max-height:none} }
 /* custom chart legend (lightweight-charts has no built-in one) */
 .ep .chlegend{display:flex;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;color:var(--text-2);margin:0 0 6px;min-height:16px}
 .ep .chlegend i{display:inline-block;width:10px;height:3px;border-radius:2px;vertical-align:middle;margin-right:5px}
 /* signals rail rows reuse .srow; strategy dot ring for unselected */
 .ep .sgrp{position:sticky;top:0;z-index:1;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--label);padding:9px 13px 5px;background:#101216;border-bottom:1px solid #1E2127}
 /* the rail clips absolute children (overflow:hidden) — its ? tip renders as a fixed toast */
 .ep #sig-rail{overflow:visible}
 .ep #sig-rail .rlist{overflow:hidden auto;border-radius:0 0 12px 12px}
 @media (max-width:640px){
  .ep #sig-rail .info .tip{position:fixed;left:50%;transform:translateX(-50%);top:auto;bottom:calc(var(--bz-mobile-tabbar-total-h, 0px) + 16px);width:min(560px,92vw);max-width:none;z-index:1870}
 }
 .ep #sig-rail .info .tip::before{display:none}

 /* tablet: keep the speaker rail beside the content down to 720px, but stack the
    chart over the holdings — a 2-col mainrow leaves the chart <200px wide here */
 @media (max-width:1100px){
  .ep .verdict{grid-template-areas:"head" "money" "summary" "about";grid-template-columns:1fr;gap:7px 0}
 }
 @media (max-width:900px){
  .ep .mainrow{grid-template-columns:1fr}
  .ep .pf{grid-template-columns:240px minmax(0,1fr)}
 }
 @media (max-width:720px){
  .ep .pf{grid-template-columns:minmax(0,1fr)}   /* bare 1fr lets the launcher chip's nowrap text inflate the track past the viewport */
  .ep .rlist{max-height:300px}
 }
 /* phone */
 @media (max-width:640px){
  .ep{padding:0 12px}
  .ep h1{font-size:20px;flex-wrap:wrap;gap:8px}
  .ep .panel{padding:13px 12px}
  .ep .mainrow{grid-template-columns:1fr}
  .ep .qintro{grid-template-columns:1fr}
  .ep .verdict{grid-template-columns:1fr;gap:7px 0;padding:13px 14px}
  .ep .b100{margin-top:6px}
  .ep .sc-summary{font-size:13px;margin-top:2px}
  .ep .sc-about{width:100%;min-height:44px;justify-content:center;margin-top:2px}
  .ep .sc-explain{padding:10px 11px}
  .ep #share-lbl{display:none}   /* tabs-row Share is icon-only on phones to save room */
  /* the horizon bar WRAPS on phones. As a nowrap hidden-scroll row (no scrollbar, no fade)
     it clipped the 4th horizon and parked the "How to read this" legend ~50px past the right
     edge — 0px of it visible at 375/390px, i.e. the only on-page column legend was
     undiscoverable. Base .esbar is already flex-wrap:wrap, so NOT overriding it is the fix;
     .seg is inline-flex with nowrap children, so the chip group needs its own wrap. */
  .ep .esbar .qhow{margin-left:0}   /* base rule pushes it right with margin-left:auto */
  .ep #es-hz{flex-wrap:wrap}
  /* answer before the knobs: money line first inside the chart panel.
     On Callfolio the money line sits inside .mlrow (with Share/Guide) — flex
     `order` only moves DIRECT children, so the row itself must carry it */
  .ep #pf-panel{display:flex;flex-direction:column}
  .ep #sp-moneyline{order:-3;margin:0 0 6px}
  .ep #pf-panel .mlrow{order:-3;margin:0 0 6px}
  .ep .mlrow #sp-moneyline{margin:0}
  .ep #sp-status{order:-2}
  .ep #pf-panel .viewbar{order:-1}
  .ep .moneyline .mlname{font-size:17px}
  /* charts: shorter, scrubber replaces hover. clamp() keeps the plot LANDSCAPE at every
     phone width — a fixed 300px made it portrait (264x276 at 375px), rendering the same
     curve ~2x steeper than desktop and eating 300px of the first screen. */
  .ep #sp-chart,.ep #sig-chart{height:clamp(190px,58vw,260px)}
  .ep .chlegend{gap:4px 12px}      /* `gap:14px` was both axes: 141px of mostly dead row-gap */
  /* the scrubber is the ONLY way to read a past day on a phone (.hold .hint is hidden), but
     fixed chrome left 127px of track for ~90 trading days = 1.2px/day, unhittable. Wrapping
     the slider onto its own full-width row gives ~285px travel (3.2px/day) and lets both the
     arrows and the slider clear the 44px touch floor. */
  .ep .scrub{display:flex;flex-wrap:wrap}
  .ep .scrub input[type=range]{flex:1 1 100%;order:2;height:44px}
  .ep .scrub .sb{height:44px}
  .ep .scrub .scrub-lbl{font-size:12px}
  .ep .hold .hint{display:none}
  .ep .hlist{max-height:none}
  /* $100 bars: the label was wider than the bar it labels (46px track at 320px) */
  .ep .brow{gap:8px}
  .ep .blab{flex:0 0 92px;font-size:10px;letter-spacing:.05em;white-space:nowrap}
  .ep .tabs{margin:10px 0 10px}    /* a one-tab strip cost ~75px of the first screen */
  .ep .tabs.notabs{margin:2px 0 8px}
  .ep .headrow{margin:12px 0 2px}
  /* the 302-row rail: below the content by default, opens as a bottom sheet */
  .ep .rail-launch{display:flex;align-items:center;gap:10px;width:100%;min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px 12px;cursor:pointer;font-family:var(--sans);text-align:left}
  .ep .pf .rail{order:2;margin-top:4px}
  /* the launcher chip IS the picker on phones — the in-flow copy left the page ending in an
     unlabelled 16-row list whose 300px inner scroller ate the swipe to the footer. `:not(.sheet)`
     stops matching the moment openSheetFor() adds the class, so the sheet still shows. */
  .ep #sig-rail:not(.sheet){display:none}
  /* sheet sits ABOVE the global mobile tab bar (z 1760, height via --bz-mobile-tabbar-total-h) */
  .ep .rail.sheet{position:fixed;left:8px;right:8px;bottom:calc(var(--bz-mobile-tabbar-total-h, 68px) + 8px);top:auto;max-height:72vh;z-index:1861;display:flex;flex-direction:column;margin:0}
  .ep .rail.sheet .rlist{max-height:none;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
  .ep .rail.sheet .rail-close{display:block;margin:8px 12px 10px;padding:11px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:var(--mono);font-size:12px;cursor:pointer}
  .ep .sheet-bg{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1860;touch-action:none}
  .ep .sheet-bg[hidden]{display:none}
  /* tooltips become a bottom sheet instead of clipping off-screen (above the tab bar, no arrow) */
  .ep .info .tip{position:fixed;left:12px;right:12px;top:auto;bottom:calc(var(--bz-mobile-tabbar-total-h, 68px) + 12px);width:auto;max-width:none;z-index:1870}
  .ep .info .tip::before{display:none}
  /* with the sheet open, a bottom-anchored tip (z 1870) landed on top of the sheet's own
     "Done" button (z 1861) and read as a broken sheet — pin it to the top instead.
     (1,4,0) beats the #sig-rail tip rule's (1,3,0); 2nd selector covers callfolio's sheet. */
  .ep #sig-rail.sheet .info .tip,
  .ep .rail.sheet .info .tip{top:12px;bottom:auto;left:12px;right:12px;width:auto;transform:none}
  /* quants */
  .ep .qtabs button{padding:6px 9px;font-size:11px}
  .ep .tbl-scroll th:first-child,.ep .tbl-scroll td:first-child{position:sticky;left:0;background:var(--surface);z-index:1}
  /* the pinned label column had NO width cap and renderSignals prints the plain name AND the
     raw alias in it, so auto-layout handed it ~270px of a ~309px scrollport: at 320px it was
     wider than the port, making Total / vs SPY / vs Random-10 unreachable at EVERY scroll
     position. Cap it and let it WRAP (not ellipsize — truncating kills the ·1d/·2d/·7d
     suffix that tells the rows apart), and drop the mono alias on phones. */
  .ep .tbl-scroll td:first-child .c1{display:inline-block;max-width:150px;vertical-align:middle}
  @media (max-width:360px){ .ep .tbl-scroll td:first-child .c1{max-width:112px} }
  .ep .tbl-scroll td:first-child .c1 .dim{display:none}
  /* phones drop the stats-credibility pair (t, n): with six columns only two were ever
     visible and the rest needed a sideways swipe. Four columns fit the port, so the table
     needs no min-width at all and the swipe disappears. Desktop keeps all six. */
  .ep #sig-es .c-stat,.ep #sig-stats-panel .c-stat,.ep .qintro .gloss .c-stat,.ep .qtake .c-stat{display:none}
  /* "Strategy returns" (5 cols) and "All variants" (8!) could not fit a ~309px port. Phones drop
     Avg #pos (it is in the stats panel right above) and, for All variants, the three identity
     columns — feed/window/select move INTO the label via .gsub so every row stays identifiable. */
  .ep #sig-sig-stats .c-stat,.ep #sig-grid .c-stat,.ep #sig-grid .c-id{display:none}
  .ep #sig-grid .gsub{display:block;font-family:var(--mono);font-weight:400;font-size:10.5px;color:var(--text-3);margin-top:2px}
  .ep #sig-sig-stats table,.ep #sig-grid table{min-width:0}
  .ep #sig-grid th,.ep #sig-grid td,.ep #sig-sig-stats th,.ep #sig-sig-stats td{padding-left:6px;padding-right:6px}
  /* 320px needs another ~17px: tighter gutter + a shorter label cap on the two widest tables */
  @media (max-width:360px){
   .ep #sig-grid th,.ep #sig-grid td,.ep #sig-sig-stats th,.ep #sig-sig-stats td{padding-left:4px;padding-right:4px}
   .ep #sig-grid td:first-child .c1,.ep #sig-sig-stats td:first-child .c1{max-width:96px}
  }
  .ep #sig-es table{min-width:0}
  /* all-horizons view: pin the row identity (2nd col), not the repeated horizon (1st) */
  .ep #sig-es table.allhz th:first-child,.ep #sig-es table.allhz td:first-child{position:static;background:transparent}
  .ep #sig-es table.allhz th:nth-child(2),.ep #sig-es table.allhz td:nth-child(2){position:sticky;left:0;background:var(--surface);z-index:1}
  .ep #sig-es table.allhz tr.key td:nth-child(2){background-image:linear-gradient(rgba(212,160,58,.07),rgba(212,160,58,.07))}
  /* let the 7-col Beta/Sharpe/MaxDD panel shrink below its 560px floor, but keep a floor on
     the LABEL column: unconstrained, auto-layout collapsed it to 76px and wrapped the
     strategy name over 7 lines (a 140px-tall row) — worse than the scroll it removed. */
  .ep #sig-stats-panel table{min-width:0}
  /* with Beta/Sharpe dropped, a tighter gutter + a 112px label floor makes the remaining five
     columns fit the port exactly — no sideways swipe left on this always-visible panel
     (measured 359px -> 325px against a 329px port; row height unchanged at 79px) */
  .ep #sig-stats-panel th:first-child,.ep #sig-stats-panel td:first-child{min-width:112px}
  .ep #sig-stats-panel th,.ep #sig-stats-panel td{padding-left:6px;padding-right:6px}
  /* the gold top-50 row (and the blue selected row) lost their tint in the frozen column —
     the sticky rule's opaque background-color outranked tr.key. Paint the tint as a
     background-IMAGE so the opaque colour underneath survives (a translucent sticky cell
     would let scrolled columns bleed through). Media-gated: at base scope tr.key already
     has the tint, so an ungated gradient would double it. */
  .ep .tbl-scroll tr.key td:first-child{background-image:linear-gradient(rgba(212,160,58,.07),rgba(212,160,58,.07))}
  .ep .tbl-scroll tr.sel td:first-child{background-image:linear-gradient(rgba(77,159,255,.06),rgba(77,159,255,.06))}
  /* the "rows" glossary stayed 2-col, squeezing descriptions into ~184px (29 chars/line) */
  .ep .qrows .gloss{grid-template-columns:1fr;gap:0}
  .ep .qrows .gloss dt{text-align:left}
  .ep .qrows .gloss dt:not(:first-child){margin-top:9px}
  .ep .dbody{padding:2px 10px 14px}
 }
 @media (prefers-reduced-motion:reduce){.ep .sc-explain{animation:none}}
 /* touch ergonomics (any coarse-pointer device, incl. tablets at desktop layout) */
 @media (pointer:coarse){
  .ep .field input{font-size:16px}   /* <16px triggers iOS zoom-on-focus */
  .ep .kbd{display:none}
  .ep .seg button{padding:9px 13px}
  .ep .tab{padding:2px 2px 12px}
  .ep .pgmore summary{padding:7px 13px}
  .ep .sc-about{min-height:44px}
  .ep .rsopt{padding:8px 5px;margin:-8px -3px}
  .ep .tabguide{padding:10px 8px 12px;margin:-10px -8px -2px}
  .ep .x{padding:12px 12px;margin:-12px -10px;position:relative;z-index:1}
  /* the three controls the earlier ergonomics pass missed. .hpage was 22x22px — below the
     WCAG 24px floor — sitting next to the scrubber's own 36px arrows; padding can't fix it
     (explicit width + border-box absorbs it), so match .scrub .sb verbatim. min-height (not
     padding) on .srow: single-line Signals rows land at 44px while callfolio's two-line
     speaker rows stay as they are — padding there would add ~2,100px of sheet scroll. */
  .ep .hpage{width:36px;height:36px;font-size:16px;border-radius:8px}
  .ep .srow{min-height:44px}
  .ep .railclear{padding:12px 12px;margin:-12px -10px;position:relative;z-index:1}
  /* (hover-bridge ::after now lives in the base rules — applies to mice too) */
 }