:root{
  --ink:#0A0908; --panel:#161310; --panel2:#1D1915;
  --border:rgba(249,171,77,.16); --border-soft:rgba(249,171,77,.09);
  --gold:#F7931A; --gold-hi:#F9AB4D; --gold-deep:#B25F00;
  --text:#EDE6D8; --mute:#9C927E; --faint:#6E6656;
  --bear:#E4572E; --neutral:#8A8577; --up:#57C97B;
  --gold-grad:linear-gradient(90deg,#B25F00,#F7931A,#F9AB4D);
  --bear-grad:linear-gradient(90deg,#7A2E18,#E4572E);
  --up-grad:linear-gradient(90deg,#2F9159,#57C97B,#8AE6AF);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:radial-gradient(1200px 500px at 50% -220px, rgba(249,171,77,.10), rgba(0,0,0,0)), var(--ink);
  color:var(--text);
  font-family:'Archivo',system-ui,sans-serif;
  font-size:14px; line-height:1.45;
  min-height:100vh;
}
.mono{font-family:'IBM Plex Mono',ui-monospace,Menlo,monospace}
.disp{font-family:'Fraunces',Georgia,serif}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
.hidden{display:none !important}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;padding:0}
a{color:inherit}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(249,171,77,.25);border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:rgba(10,9,8,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-soft)}
.hdr-in{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:10px}
.brand-au{width:38px;height:38px;border-radius:10px;background:var(--gold-grad);display:flex;align-items:center;justify-content:center;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:17px;color:#171204;box-shadow:0 2px 14px rgba(249,171,77,.35)}
.brand-name{font-family:'Fraunces',Georgia,serif;font-size:19px;font-weight:700;line-height:1.2;color:#FFFFFF;margin:0}
.gold-text{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-sub{font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--faint);letter-spacing:.22em;margin-top:2px}
.tabs{display:flex;gap:4px;flex-wrap:wrap;flex:1 1 100%;align-items:center}
.tab{display:flex;align-items:center;gap:6px;border-radius:10px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--mute);border:1px solid transparent;transition:color .15s,background .15s}
.tab.is-on{color:var(--gold-hi);background:rgba(249,171,77,.10);border-color:var(--border)}
.hdr-right{margin-left:auto;display:flex;align-items:center;gap:14px}
.lbl{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);letter-spacing:.12em}
.pricebox{text-align:right}
.price-top{display:flex;align-items:center;gap:6px;justify-content:flex-end}
.dot{width:6px;height:6px;border-radius:50%;background:var(--faint)}
.dot.live{background:var(--up);animation:pulse 1.6s ease-in-out infinite}
.price-main{display:flex;align-items:baseline;gap:8px;justify-content:flex-end}
#priceVal{font-size:19px;font-weight:600;color:var(--gold-hi)}
#priceChg{font-size:12px}
#priceChg.pos{color:var(--up)} #priceChg.neg{color:var(--bear)}
.digbox{text-align:right}
#digTime{font-size:12px;color:var(--mute);margin-top:3px}
.btn-dig{border:1px solid var(--border);border-radius:10px;padding:8px 12px;color:var(--gold);font-size:12px;font-weight:600}
.btn-dig:disabled{opacity:.6;cursor:default}

/* ---------- panels & chips ---------- */
main{padding-top:20px;padding-bottom:60px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:20px}
.panel-soft{background:var(--panel2);border:1px solid var(--border-soft);border-radius:12px}
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);letter-spacing:.14em}
.chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;font-family:'IBM Plex Mono',monospace;font-weight:600}
.chip-cat{font-size:10px;letter-spacing:.05em;padding:1px 8px}
.chip-cat.lg{font-size:11px;padding:2px 10px}
.chip-reg{font-size:9px;letter-spacing:.08em;padding:1px 5px;border-radius:6px;color:var(--mute);border:1px solid rgba(156,146,126,.3)}
.chip-reg.lg{font-size:10px;padding:2px 7px}
.chip-hz{font-size:10px;padding:1px 7px;color:var(--mute);border:1px solid rgba(156,146,126,.3)}
.chip-hz.lg{font-size:11px;padding:2px 9px}
.chip-st{font-size:10px;letter-spacing:.04em;padding:1px 7px}
.chip-st.lg{font-size:11px;padding:2px 9px}
.icon{display:inline-flex;vertical-align:-2px}
.icon svg{display:block}

/* ---------- article cards ---------- */
.card{display:flex;gap:12px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--border-soft);border-radius:14px;padding:12px;transition:border-color .15s,background .15s}
.card:hover{border-color:var(--border);background:var(--panel2)}
.art{position:relative;flex-shrink:0;width:84px;height:84px;border-radius:10px;overflow:hidden}
.art .art-icon{position:absolute;right:-6px;bottom:-6px;opacity:.5;transform:rotate(-8deg)}
.art .fav{position:absolute;left:8px;top:8px;width:26px;height:26px;border-radius:7px;background:#fff;padding:2px;box-shadow:0 2px 8px rgba(0,0,0,.5)}
.card-body{min-width:0;flex:1;display:flex;flex-direction:column}
.card-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card-time{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint)}
.card-h{margin-top:6px;font-size:14px;font-weight:600;line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-foot{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card-src{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--mute)}
.card-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.impact{display:inline-flex;align-items:center;gap:8px}
.impact-track{display:inline-block;height:5px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.impact-fill{display:block;height:100%;border-radius:99px;background:var(--gold-grad)}
.impact-num{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--mute)}

/* ---------- gauge / bias ---------- */
.grid-bias{display:grid;gap:16px;grid-template-columns:1fr;margin-bottom:20px}
.grid-main{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:1000px){
  .grid-bias{grid-template-columns:2fr 3fr}
  .grid-main{grid-template-columns:3fr 2fr}
}
.bias-card{display:flex;flex-direction:column;align-items:center}
.bias-head{width:100%;display:flex;justify-content:space-between;align-items:center}
.gauge{width:100%;max-width:340px;margin-top:8px}
.bias-label{font-family:'IBM Plex Mono',monospace;font-size:14px;font-weight:600;letter-spacing:.18em}
.bias-sub{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);margin-top:4px;text-align:center}
.bias-counts{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center;font-family:'IBM Plex Mono',monospace;font-size:11px}
.bias-body{display:flex;flex-direction:column;align-items:center;width:100%;margin:auto 0}

/* ---------- drivers ---------- */
.drivers{display:grid;gap:12px;grid-template-columns:1fr;margin-top:12px}
@media(min-width:640px){.drivers{grid-template-columns:1fr 1fr}}
.driver{padding:12px;text-align:left;background:var(--panel2);border:1px solid var(--border-soft);border-radius:12px;transition:border-color .15s}
.driver-top{display:flex;align-items:center;gap:8px}
.driver-name{font-size:13px;font-weight:600}
.driver-n{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint)}
.driver-bar{margin-top:8px;display:flex;align-items:center;gap:8px}
.driver-track{flex:1;height:6px;border-radius:99px;background:#26221B;overflow:hidden}
.driver-fill{display:block;height:100%;border-radius:99px}
.driver-pct{font-family:'IBM Plex Mono',monospace;font-size:11px;width:62px;text-align:right}
.sessions{margin-top:16px;padding-top:12px;border-top:1px solid var(--border-soft);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sess-pill{font-family:'IBM Plex Mono',monospace;font-size:10px;border:1px solid var(--border-soft);background:var(--panel2);border-radius:999px;padding:2px 10px;color:var(--text)}
.sess-pill.is-zero{color:var(--faint)}

/* ---------- calendar ---------- */
.cal{margin-bottom:20px}
.cal-head{display:flex;align-items:center;gap:8px}
.cal-strip{margin-top:12px;display:flex;gap:12px;overflow-x:auto;padding-bottom:4px}
.cal-card{flex-shrink:0;min-width:190px;padding:12px;background:var(--panel2);border:1px solid var(--border-soft);border-radius:12px}
.cal-top{display:flex;align-items:center;gap:8px}
.cal-dot{width:7px;height:7px;border-radius:50%}
.cal-date{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--mute)}
.cal-imp{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:9px}
.cal-name{margin-top:6px;font-size:13px;font-weight:600}
.cal-note{margin-top:4px;font-size:11px;color:var(--mute);line-height:1.4}

/* ---------- latest & timeline ---------- */
.latest-head{display:flex;align-items:center;justify-content:space-between}
.linklike{display:inline-flex;align-items:center;gap:4px;font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gold)}
.latest-list{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.tl{margin-top:12px;position:relative}
.tl-line{position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:rgba(249,171,77,.22)}
.tl-day{padding-left:24px;padding-top:8px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--gold);letter-spacing:.1em}
.tl-item{position:relative;display:block;width:100%;text-align:left;padding:6px 6px 6px 24px;border-radius:10px}
.tl-item:hover{background:rgba(255,255,255,.03)}
.tl-dot{position:absolute;left:2px;top:12px;width:7px;height:7px;border-radius:50%}
.tl-h{font-size:12.5px;line-height:1.4;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tl-meta{margin-top:2px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint)}

/* ---------- feed ---------- */
.filters{display:flex;flex-direction:column;gap:16px;padding:18px;margin-bottom:16px}
.filters .filter-row{padding-bottom:14px;border-bottom:1px solid var(--border-soft)}
.filter-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fgroup{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.flabel{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);letter-spacing:.16em;width:76px;flex-shrink:0}
.fbtn{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;border-radius:999px;padding:5px 13px;border:1px solid;transition:all .15s}
.fbtn-sm{font-size:11px;font-weight:400;color:var(--mute);border-color:rgba(255,255,255,.08);background:transparent}
.fbtn-sm.is-on{color:var(--gold-hi);border-color:var(--border);background:rgba(249,171,77,.10)}
.searchbox{display:flex;align-items:center;gap:8px;border:1px solid var(--border-soft);background:var(--panel2);border-radius:10px;padding:8px 12px;flex:1;min-width:180px;max-width:420px}
.searchbox input{background:transparent;border:none;outline:none;color:var(--text);font-size:12.5px;width:100%;font-family:inherit}
.feed-meta{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);margin-bottom:12px}
/* the count line belongs to the filter panel above it, not to the takes below: it sat 16px under the
   panel and only 12 above the first take, so it read as a label on the wrong thing. On desktop it
   also sits right, under the filter's own right edge, out of the way of the takes' left column. */
@media(min-width:901px){
  .feed-meta{margin-bottom:20px;text-align:right}
}
.feed-grid{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:820px){.feed-grid{grid-template-columns:1fr 1fr}}
.empty{padding:32px;text-align:center;background:var(--panel);border:1px solid var(--border-soft);border-radius:16px;color:var(--mute);font-size:13px}

/* ---------- setup / first-run ---------- */
.setup{padding:56px 0;display:flex;flex-direction:column;align-items:center;text-align:center}
.setup .brand-au{width:72px;height:72px;border-radius:18px;font-size:30px;box-shadow:0 8px 40px rgba(249,171,77,.35)}
.setup h1{font-family:'Fraunces',Georgia,serif;font-size:26px;font-weight:600;margin:20px 0 0}
.setup p{margin:8px 0 0;max-width:460px;color:var(--mute);line-height:1.6}
.setup code{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--gold-hi);background:var(--panel2);border:1px solid var(--border-soft);border-radius:6px;padding:2px 6px}

/* ---------- modal ---------- */
.modal-back{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center;background:rgba(5,4,3,.78);backdrop-filter:blur(4px);padding:0}
@media(min-width:640px){.modal-back{align-items:center;padding:24px}}
.modal{width:100%;max-width:640px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;background:var(--panel);border:1px solid var(--border);border-radius:18px 18px 0 0;box-shadow:0 30px 80px rgba(0,0,0,.7)}
@media(min-width:640px){.modal{border-radius:18px}}
/* 62px, not 96: the chip row is 30px sitting 16px down, so 96 left a 50px band of
   empty tint under it. 16 above + 30 + 16 below is symmetric, and matches the phone. */
.modal-art{position:relative;height:62px;border-bottom:1px solid var(--border-soft)}
.modal-art .art-icon{position:absolute;right:-14px;top:-18px;opacity:.16;transform:rotate(-8deg)}
.modal-chips{position:absolute;left:16px;top:16px;display:flex;align-items:center;gap:8px}
.modal-chips .fav{width:30px;height:30px;border-radius:7px;background:#fff;padding:2px}
.modal-x{position:absolute;right:12px;top:12px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:11px;background:rgba(18,15,12,.82);color:#F3EFE6;border:1.5px solid rgba(237,230,216,.42);box-shadow:0 3px 12px rgba(0,0,0,.55);line-height:0}   /* the phone sheet's close, everywhere: 38px, a brighter hairline and a shadow, so it lifts off whatever it sits on */
.modal-x svg{width:18px;height:18px;stroke-width:2.4}   /* the thin 16px cross read as a different button */   /* the phone sheet's close, everywhere: a light glass square rather than a dark one on a faint gold hairline */   /* a rounded square, like the menu's close */
.modal-body{padding:20px;overflow-y:auto}
.modal-h{font-family:'Fraunces',Georgia,serif;font-size:22px;line-height:1.25;font-weight:600;margin:0}
.modal-meta{margin-top:8px;display:flex;align-items:center;gap:4px 12px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--mute)}
.modal-meta .src{color:var(--gold-hi)}
.modal-grid{margin-top:20px;display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:560px){.modal-grid{grid-template-columns:1fr 1fr}}
.stat{padding:16px;background:var(--panel2);border:1px solid var(--border-soft);border-radius:12px}
.split-track{display:flex;height:12px;border-radius:99px;overflow:hidden;background:#26221B;margin-top:8px}
.split-bull{background:var(--up-grad)}
.split-bear{background:var(--bear-grad)}
.split-nums{display:flex;justify-content:space-between;margin-top:4px;font-family:'IBM Plex Mono',monospace;font-size:12px}
.split-nums .b{color:#57C97B} .split-nums .r{color:var(--bear)}
.big-impact{display:flex;align-items:center;gap:12px;margin-top:12px}
.big-impact .n{font-family:'IBM Plex Mono',monospace;font-size:26px;font-weight:600;color:var(--gold-hi)}
.big-impact .track{flex:1;height:8px;border-radius:99px;background:#26221B;overflow:hidden}
.big-impact .fill{display:block;height:100%;border-radius:99px;background:var(--gold-grad)}
.impact-scale{display:flex;justify-content:space-between;flex-wrap:wrap;gap:2px 12px;font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--faint);margin-top:5px;letter-spacing:.08em}
.kp{margin-top:20px}
.kp ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.kp li{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.5}
.kp li .icon{color:var(--gold);margin-top:3px;flex-shrink:0}
.read-btn{margin-top:24px;display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:10px 16px;font-weight:600;font-size:13px;background:var(--gold-grad);color:#141005;text-decoration:none}
.no-link{margin-top:24px;font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--faint)}

/* ---------- footer / misc ---------- */
.foot{margin-top:28px;padding-bottom:32px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);line-height:1.7}
.dig-status{padding-bottom:8px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--mute)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.pulse{animation:pulse 1.6s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){.dot.live,.pulse{animation:none !important}.drawer,.drawer-back{transition:none !important}}

/* ---------- SEO / static content section ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.seo{margin-top:28px;padding-top:8px;border-top:1px solid var(--border-soft)}
.seo h2{font-family:'Fraunces',Georgia,serif;font-size:19px;font-weight:600;color:var(--text);margin:26px 0 8px}
.seo p{font-size:13.5px;line-height:1.7;color:var(--mute);margin:0 0 8px;max-width:820px}
.seo strong{color:var(--text);font-weight:600}
.seo details{max-width:820px;border:1px solid var(--border-soft);background:var(--panel);border-radius:12px;padding:10px 14px;margin:8px 0}
.seo summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--text)}
.seo summary::marker{color:var(--gold)}
.seo details p{margin:8px 0 2px}

/* ---------- learn page & nav links ---------- */
.hdr a,.hdr a:hover{text-decoration:none}
a.tab{text-decoration:none}
a.brand{text-decoration:none;color:inherit;display:flex;align-items:center;gap:10px}
.page-title{font-family:'Fraunces',Georgia,serif;font-size:26px;font-weight:600;color:var(--text);margin:22px 0 6px}
.learnpage{border-top:0;margin-top:0}
.learnpage .lead{font-size:14px}
.learn-link{color:var(--gold-hi);font-weight:600;text-decoration:none}
.learn-link:hover{text-decoration:underline}

.learnpage p,.learnpage details{max-width:none}

/* ---------- burger + slide-in drawer (mobile nav) ---------- */
.burger{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--border);color:var(--gold);flex-shrink:0}
.drawer-back{position:fixed;inset:0;z-index:60;background:rgba(5,4,3,.62);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s ease}
.drawer-back.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:70;width:min(80vw,320px);background:var(--panel);border-left:1px solid var(--border);box-shadow:-20px 0 60px rgba(0,0,0,.55);transform:translateX(105%);transition:transform .28s ease;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border)}
.drawer-title{font-family:'Fraunces',Georgia,serif;font-size:16px;font-weight:700;color:#FFFFFF}
.drawer-x{width:32px;height:32px;border-radius:8px;border:1px solid var(--border-soft);color:var(--mute);font-size:14px;line-height:1}
.drawer-link{display:block;width:100%;text-align:left;padding:15px 18px;font-size:15px;font-weight:600;color:var(--text);border-bottom:1px solid var(--border-soft);text-decoration:none}
.drawer-link:hover{background:rgba(255,255,255,.03)}
.drawer-link.is-on{color:var(--gold-hi);background:rgba(249,171,77,.08)}
.drawer-foot{padding:16px 18px;border-top:1px solid var(--border-soft);font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);letter-spacing:.12em}
body.no-scroll{overflow:hidden}
@media(max-width:640px){
  .hdr-nav{display:none}
  .burger{display:flex}
}
@media(max-width:640px){
  .digbox{display:none}
  .hdr-in{flex-wrap:nowrap;gap:10px}
  .brand-name{font-size:17px}
  .brand-sub{display:none}
  #priceVal{font-size:16px}
}
@media(min-width:641px){.drawer,.drawer-back{display:none}}

/* ---------- Au/Ag metal switcher ---------- */
.metal-switch{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--border-soft);background:var(--panel2);border-radius:999px;margin-left:4px;flex-shrink:0}
.ms-opt{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;letter-spacing:.04em;padding:4px 11px;border-radius:999px;color:var(--mute);text-decoration:none;white-space:nowrap}
a.ms-opt:hover{color:var(--text);background:rgba(255,255,255,.05);text-decoration:none}
.ms-opt.is-cur{color:var(--ink);background:var(--gold-grad)}
.drawer-switch-group{margin-top:auto;border-top:1px solid var(--border-soft)}
.drawer-switch-group .drawer-link:last-child{border-bottom:none}
.drawer-switch{color:var(--gold-hi)}
@media(max-width:640px){.metal-switch{display:none}}

.hdr-nav{display:flex;padding-bottom:17px}
@media(max-width:640px){.hdr-nav{display:none}.hdr-in{padding-bottom:14px}}
/* ---- rating changes: the banded chart ---- */
.flip-chart{display:grid;grid-template-columns:1fr auto;margin:20px -20px 0}   /* the table runs the full width of the box; 20 above, as the panel keeps above the switcher */
.flip-bl{padding-right:20px}   /* the labels take the panel's own inset on the right, so they line up with the content beneath */
.flip-sl:first-child{transform:translateX(20px)}   /* ASIA lines up with the panel's text; LONDON and NEW YORK sit on their rules */
.flip-plot{position:relative;min-width:0}
.flip-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.flip-lbls{display:flex;flex-direction:column}
.flip-bl + .flip-bl{border-top:1px solid rgba(255,255,255,.08)}   /* the same rule the plot draws between rows, continued under the labels */
.flip-bl{flex:1 1 0;display:flex;align-items:center;justify-content:flex-end;padding:0 20px 0 12px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.1em;color:var(--faint);white-space:nowrap}   /* the same tone as the session labels beneath */
.flip-sess{stroke:#fff;stroke-opacity:.22;stroke-width:1;stroke-dasharray:2 3;vector-effect:non-scaling-stroke}
.flip-line{fill:none;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}   /* the colour is the band's, set on each stretch */
.flip-row-rule{stroke:#fff;stroke-opacity:.08;stroke-width:1;vector-effect:non-scaling-stroke}
.flip-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;transform:translate(-50%,-50%)}
.flip-sess-row{grid-column:1;position:relative;height:22px;margin-top:8px}
.flip-sl{position:absolute;top:0;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.06em;color:var(--faint);white-space:nowrap}   /* each session label starts exactly on its rule; ASIA on the chart's left edge */
.flip-list{display:flex;flex-direction:column;padding:2px 12px 6px}
.flip-row{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--border-soft);font-family:'IBM Plex Mono',monospace;font-size:11px}
.flip-row:first-child{border-top:0}
.flip-t{color:var(--faint);letter-spacing:.04em}
.flip-ch{display:flex;align-items:center;gap:7px;min-width:0;font-family:'Archivo',system-ui,sans-serif;font-size:12.5px;font-weight:600}
.flip-ch b{font-weight:600;white-space:nowrap}
.flip-ch i{font-style:normal;color:var(--faint)}
.flip-all{margin:14px 0 0}
.flip-all summary{padding:9px 12px}
@media(max-width:900px){.ms-opt{font-size:10px;padding:4px 8px}}
main.wrap{padding-top:20px;padding-bottom:30px}
@keyframes tickU{0%{color:#57C97B}100%{color:inherit}}
@keyframes tickD{0%{color:#E4572E}100%{color:inherit}}
#priceVal.tick-up{animation:tickU .8s ease}
#priceVal.tick-down{animation:tickD .8s ease}

/* ---------- market intelligence ---------- */
.pulse-bar{background:var(--ink);border-bottom:1px solid var(--border-soft)}
.pb-in{display:flex;align-items:center;gap:18px;overflow-x:auto;padding-top:7px;padding-bottom:7px;scrollbar-width:none}
.pb-in::-webkit-scrollbar{display:none}
.pb-item{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;color:var(--mute);text-decoration:none;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
a.pb-item:hover{color:var(--text);text-decoration:none}
.pb-item b{font-weight:600}
.pb-cur{color:var(--gold-hi)}
.pulse-wait{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint)}
.bias-delta{margin-top:7px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.04em}
.bias-driven{margin-top:8px;font-size:11.5px;color:var(--mute)}
.gs-note{margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.1em;color:var(--faint)}
.gs-note span{color:var(--mute)}
.cal .cal-head{flex-wrap:wrap;row-gap:6px}
.cal-next{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--gold-hi);border:1px solid var(--border-soft);border-radius:999px;padding:3px 9px;white-space:nowrap}
.cal-card{display:flex;flex-direction:column}
.cal-data{margin-top:auto;padding-top:7px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.03em;color:var(--text)}
.cal-actual{font-weight:600}
@media(max-width:640px){.cal-next{display:none}}
.impact-lbl{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.12em;color:var(--faint);margin-right:3px}
.cal-card[data-act]{cursor:pointer;text-align:left}
.cal-card[data-act]:hover{border-color:var(--gold)}
.ev-top{display:flex;align-items:center;gap:12px;padding:18px 18px 0}
.ev-top .modal-x{position:static;margin-left:auto}
.ev-imp,.ev-date{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;color:var(--mute)}
.ev-data{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--text);margin:2px 0 4px}
.ev-res{font-size:12.5px;color:var(--mute);margin-bottom:4px}
.ev-why{font-size:13px;color:var(--mute);margin:10px 0 14px;line-height:1.55}
.ev-scn{border:1px solid var(--border-soft);border-radius:12px;padding:11px 13px;margin-top:10px;background:var(--panel2)}
.ev-scn-hit{border-color:var(--gold)}
.ev-scn-l{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.13em;color:var(--faint);display:flex;align-items:center;gap:8px}
.ev-hit{color:var(--gold-hi)}
.ev-verdict{font-weight:700;font-size:13.5px;margin:5px 0 3px}
.ev-x{font-size:12.5px;color:var(--text);line-height:1.5;opacity:.92}
.ev-foot{margin-top:14px;font-size:10.5px;color:var(--faint)}
.cal-hint{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.08em;color:var(--faint);white-space:nowrap}
.cal-q{margin-left:6px;width:15px;height:15px;border:1px solid var(--border-soft);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--mute);flex:0 0 auto}
.cal-card[data-act]:hover .cal-q{border-color:var(--gold);color:var(--gold-hi)}
.cal .cal-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;overflow:visible;padding-bottom:0}
.cal .cal-card{width:auto;min-width:0}
.cal-open{position:absolute;right:11px;bottom:10px;color:var(--faint);display:inline-flex}
.cal-card[data-act]:hover .cal-open{color:var(--gold-hi)}
@media(max-width:999px){.cal .cal-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.cal .cal-strip{grid-template-columns:1fr}}
.cal .cal-card{padding:15px;position:relative}
.cal .cal-name{margin-top:9px}
.cal .cal-note{margin-top:7px;line-height:1.5}
.cal .cal-data{padding-top:10px;padding-right:22px}
/* symmetric gap around the desktop menu: match the space below it */
.hdr-nav{padding-top:5px} /* .hdr-nav-sym */
.card{position:relative}
.card .art{align-self:stretch;height:auto;min-height:84px;display:flex;align-items:center;justify-content:center}
.card .card-body{padding-bottom:18px}
.art-open{position:absolute;right:12px;bottom:9px;color:var(--faint);display:inline-flex}
.card:hover .art-open{color:var(--gold-hi)}
@media(max-width:640px){
.card .art{display:none}
.card .card-top{row-gap:6px}
.card .card-h{margin-top:10px;margin-bottom:4px}
.card .card-foot{padding-top:12px}
}

/* ---------- charting desk ---------- */
.ta-board{margin-bottom:20px}
.tb-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tb-note{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.08em;color:var(--faint)}
.tb-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.tb-col{border:1px solid var(--border-soft);border-radius:12px;background:var(--panel2);padding:14px 10px;text-align:center}
.tb-tf{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;color:var(--mute)}
.tb-score{font-size:34px;font-weight:700;line-height:1.15;margin-top:6px}
.tb-band{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.12em;margin-top:2px}
.tb-sub{margin-top:9px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--faint)}
.tb-gap{display:inline-block;width:10px}
.ta-main{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
.ta-main aside{display:flex;flex-direction:column;gap:20px;min-width:0}
.read-panel{margin-bottom:20px}
/* the 5px she asked for sits under the HEADER, not on the paragraph - at the weekend
   the closed-market line comes between them, and spacing hung on .read-p lands
   below that instead of under the title */
.read-panel .bias-head{padding-bottom:5px}
.read-p{margin:10px 0 0;font-size:14px;line-height:1.65;color:var(--text)}
.feed-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.feed-all{display:inline-flex;align-items:center;gap:4px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;color:var(--gold-hi);background:none;border:0;cursor:pointer}
.feed-list{display:flex;flex-direction:column;gap:12px}
.chip-tf{color:var(--gold-hi);border-color:var(--gold);font-size:8.5px;letter-spacing:.08em;padding:2px 7px}
.lad-box{position:relative;margin-top:44px;margin-bottom:40px}   /* the tint bleeds 20px above and below the rows; this keeps clear space beyond it */
.lad-rung{position:absolute;left:0;right:0;display:flex;align-items:center;gap:8px;height:14px;transform:translateY(-7px)}
.lad-tag{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.08em;color:var(--mute);white-space:nowrap;flex:0 0 auto}
.lad-line{flex:1;border-top:1px dashed var(--border-soft)}
.lad-v{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--text);flex:0 0 auto}
.lad-piv .lad-tag,.lad-piv .lad-v{color:var(--gold-hi)}
.lad-piv .lad-line{border-color:var(--gold)}
.lad-crowd .lad-tag{color:var(--gold-hi)}
.lad-crowd .lad-line{border-style:solid;border-color:var(--gold);opacity:.55}
.lad-n{color:var(--gold-hi)}
.lad-52 .lad-tag,.lad-52 .lad-v{color:var(--faint)}
.lad-price{position:absolute;left:0;right:0;border-top:2px solid var(--gold-hi);box-shadow:0 0 12px rgba(249,171,77,.35)}
.lad-plabel{position:absolute;left:50%;top:-9px;transform:translate(-50%,-100%);font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;color:var(--gold-hi);background:var(--panel);padding:1px 6px;border:1px solid var(--gold);border-radius:6px}
.lad-foot{margin-top:7px;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.04em;color:var(--faint);line-height:1.6}
.lad-wait{margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint)}
.ind-table{margin-top:12px;display:flex;flex-direction:column}
.ind-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--border-soft)}
.ind-row:last-child{border-bottom:0}
.ind-k{font-size:12px;color:var(--mute)}
.ind-v{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--text);text-align:right}
.an-panel{margin-bottom:20px}
.an-panel .an-score{font-size:30px;font-weight:700;margin-top:8px}
.an-band{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.12em;margin-left:6px}
.an-div{margin-top:10px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--gold-hi)}
.lp p{margin:10px 0 0;font-size:13.5px;line-height:1.7;color:var(--mute)}
.lp b,.lp i{color:var(--text)}
.lp{margin-bottom:16px}
@media(max-width:960px){.ta-main{grid-template-columns:1fr}}
@media(max-width:900px){.tb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.tb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tb-col{padding:14px 12px}.tb-score{font-size:27px}.tb-col:nth-child(5){grid-column:1 / -1;justify-self:center;width:calc(50% - 6px)}}
.hdr-in{flex-wrap:wrap}
.fund-row{display:flex;margin-left:auto;align-self:center}
.fund-link{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border:1px solid var(--gold);border-radius:999px;background:rgba(249,171,77,.08);font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.14em;color:var(--gold-hi);text-decoration:none;text-transform:uppercase;line-height:13px}
.fund-link:hover{background:rgba(249,171,77,.16)}
@media(max-width:640px){.fund-row{display:none}}
.tb-rows{margin-top:10px;display:flex;flex-direction:column;gap:3px}
.tb-r{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:3px 6px;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.06em;color:var(--faint)}
.tb-r b{font-weight:600}
.lad-zone{position:absolute;left:-20px;right:-20px;pointer-events:none;border-radius:0}   /* the tint bleeds to the panel's edges (its padding is 20px); the rows stay on the content line */
.lad-zone-r{background:linear-gradient(180deg,rgba(224,92,80,.085),rgba(224,92,80,0) 82%)}
.lad-zone-s{background:linear-gradient(0deg,rgba(92,196,128,.085),rgba(92,196,128,0) 82%)}
.lad-plabel i{font-style:normal;font-size:7.5px;letter-spacing:.16em;opacity:.75;margin-right:5px;vertical-align:1px}
.lad-legend{margin-top:0;display:flex;flex-direction:column;gap:11px;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.02em;color:var(--faint);line-height:1.55}
.lad-legend b{color:var(--mute)}
.lg-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:0}
.lg-x{color:var(--gold-hi);margin-right:4px}
.tb-val{display:inline-flex;align-items:baseline;gap:4px}
.tb-num{color:var(--faint);font-weight:400;font-size:8.5px;letter-spacing:.02em}
/* Trading Study Hub banner - self-contained brand palette (dark base, emerald primary, amber badge), identical on every host site */
.promo{position:relative;display:flex;align-items:center;gap:12px;padding:14px 15px;border:1px solid rgba(52,201,140,.5);border-radius:14px;background:radial-gradient(130% 160% at 12% 0%,rgba(52,201,140,.16),rgba(52,201,140,.03) 48%,rgba(0,0,0,0) 75%),#11100d;text-decoration:none;overflow:hidden;transition:transform .15s,box-shadow .15s}
.promo::after{content:"";position:absolute;top:0;bottom:0;width:46px;left:-70px;background:linear-gradient(105deg,transparent,rgba(190,255,222,.13),transparent);transform:skewX(-18deg);animation:promoSheen 5.5s ease-in-out infinite}
@keyframes promoSheen{0%,55%{left:-70px}80%,100%{left:120%}}
.promo:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(52,201,140,.22)}
.promo-badge{position:absolute;top:8px;right:10px;font-family:'IBM Plex Mono',monospace;font-size:7.5px;letter-spacing:.18em;color:#141210;background:#d9b455;padding:2px 6px;border-radius:999px;font-weight:700}
.promo-art{color:#46e0a1;display:inline-flex;flex-shrink:0}
.promo-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.promo-txt b{font-size:13.5px;font-weight:700;color:#f2efe9;line-height:1.3}
.promo-txt span{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.06em;color:#8f9a90}
.promo-txt i{color:#46e0a1;font-weight:700}
.promo-cta{margin-left:auto;flex-shrink:0;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;font-weight:700;color:#0e1410;background:#34c98c;border:1px solid #34c98c;border-radius:999px;padding:6px 11px;transition:filter .15s;white-space:nowrap}
.promo:hover .promo-cta{filter:brightness(1.1)}
#taCharts{margin-bottom:20px}
.tape-t{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.tape-t2{margin-top:16px}
.tape-note{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.06em;color:var(--faint)}
.tape-svg{display:block;width:100%;height:auto}
.tape-lbl{font-family:'IBM Plex Mono',monospace;font-size:9.5px;fill:var(--faint)}
.tape-cur{fill:var(--gold-hi);font-weight:700}
.fw-head{margin-top:20px;padding-top:20px;margin-bottom:20px;border-top:1px solid var(--border-soft);font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.14em;color:var(--mute)}   /* the same 20 a panel title keeps: rule to title, and title to the first row */
.fw-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border-soft);font-family:'IBM Plex Mono',monospace;font-size:10px}
.fw-row:last-child{border-bottom:0}
.fw-txt{flex:1}
.fw-rng{color:var(--text)}
.fw-none{padding:7px 0;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--faint)}
@keyframes ssPulse{0%,100%{opacity:1}50%{opacity:.45}}
.an-grid{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0;align-items:center;margin-top:14px}
.an-left{min-width:110px;padding-right:26px}
.an-band{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.14em;margin:3px 0 7px}
.an-mid{display:flex;flex-direction:column;gap:12px;min-width:0;border-left:1px solid var(--border-soft);padding:4px 26px}
.an-split{display:flex;height:9px;border-radius:999px;overflow:hidden;background:var(--border-soft)}
.an-split i{display:block;height:100%}
.an-ctr{display:flex;gap:16px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:10px}
.an-stats{display:flex;flex-direction:column;gap:10px;min-width:216px;border-left:1px solid var(--border-soft);padding:4px 0 4px 26px}
.an-sr{display:flex;flex-direction:column;gap:2px}
.an-sr span{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.12em;color:var(--faint);text-transform:uppercase}
.an-sr b{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;color:var(--text)}
.an-gapnote{font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--gold-hi);line-height:1.5}
/* the most-watched level when nothing the feed cites sits near the tape - a quiet
   aside inside the value, not another uppercase mono label */
.an-sr b .an-far{font-family:'IBM Plex Mono',monospace;font-size:9px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--mute)}

@media(max-width:900px){.an-grid{grid-template-columns:1fr;gap:18px}.an-left{padding-right:0}.an-mid,.an-stats{border-left:0;padding:0;min-width:0}}
.gl-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px;margin-top:14px}
.gl{display:flex;flex-direction:column;gap:3px;padding:10px 0;border-bottom:1px solid var(--border-soft)}
.gl b{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.06em;color:var(--gold-hi)}
.gl span{font-size:12.5px;line-height:1.6;color:var(--mute)}
@media(max-width:700px){.gl-grid{grid-template-columns:1fr}}
.vg{display:flex;gap:22px;align-items:center;margin-bottom:16px}
.vg svg{flex-shrink:0;background:var(--panel2);border:1px solid var(--border-soft);border-radius:12px;padding:8px}
.vg-t{display:flex;flex-direction:column;gap:8px;min-width:0}
.vg-t p{margin:0;font-size:13.5px;line-height:1.65;color:var(--mute)}
.vg-t b,.vg-t i{color:var(--text)}
.vg-note{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--gold-hi)}
.vg-intro{margin:10px 0 0;font-size:15px;line-height:1.6;color:var(--mute)}
.vg-intro b{color:var(--text)}
@media(max-width:640px){.vg{flex-direction:column;align-items:flex-start}}
.promo-learn{margin-top:10px;padding:26px 24px;gap:18px}
.promo-learn .promo-art svg{width:56px;height:41px}
.promo-learn .promo-txt b{font-size:17px}
.promo-learn .promo-txt span{font-size:10px}
.promo-learn .promo-cta{font-size:11px;padding:9px 16px}
.vw-table{margin-top:12px;display:flex;flex-direction:column}
.vw-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-soft)}
.vw-row:last-child{border-bottom:0}
.vw-k{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.12em;color:var(--faint);flex:0 0 64px}
.vw-word{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;flex:1}
.vw-na{color:var(--faint);font-weight:400}
.vw-val{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--text)}
.tb-r b{margin-left:auto}
.ind-alert{background:linear-gradient(90deg,rgba(249,171,77,.07),rgba(0,0,0,0) 70%);border-left:2px solid var(--gold);padding-left:9px;margin-left:-9px;border-radius:4px}
@media(max-width:640px){.tb-note{display:block;padding-bottom:10px}}
.drawer-link[href*="digging4"]{color:#fff}
.tb-delta{margin:5px 0 0;font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:700;letter-spacing:.04em}
.tb-delta-na{color:var(--faint);font-weight:400}
.tb-delta-sub{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.06em;color:var(--faint);margin:1px 0 3px}
.sr-build{margin-top:8px;font-size:12px;line-height:1.6;color:var(--faint)}
.promo-dig .promo-badge{background:#F7931A;color:#1a1408}
.promo-dig .promo-art{color:#F7931A}
.promo-dig .promo-txt b{color:var(--text)}
.promo-dig .promo-txt i{color:#F9AB4D}
.promo-dig .promo-cta{background:#F7931A;border-color:#F7931A;color:#1a1408}
.promo{position:relative;min-height:92px;box-sizing:border-box;padding-right:34px}
.promo-open{position:absolute;right:12px;bottom:9px;color:#fff;font-size:14px;line-height:1}
.promo-logo{width:60px;height:60px;border-radius:15px;display:flex;align-items:center;justify-content:center;flex:0 0 60px;margin-right:4px}
.promo-logo-au{background:linear-gradient(180deg,#f4ca5e,#b8860b);color:#241a05;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:26px;box-shadow:0 0 18px rgba(212,160,23,.4)}
.promo-logo-tsh{background:#0f1411;border:1.5px solid #34c98c}
.promo-dig{background:radial-gradient(130% 150% at 50% -45%,rgba(212,160,23,.34),rgba(0,0,0,0) 58%),var(--panel2);border-color:rgba(212,160,23,.5)}
.promo-txt b{font-size:14px;line-height:1.25}
.promo-dig .promo-txt b{color:#fff}
.promo-dig .promo-txt i{color:#F9AB4D}
.promo-hub .promo-txt b{color:#efeae0}
.promo-hub .promo-txt i{color:#34c98c}
.promo-sub{display:block;margin-top:3px;font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--mute);letter-spacing:.03em}
.promo-sub-em{color:#34c98c;letter-spacing:.03em;font-size:9px}
.promo-bgc{position:absolute;right:28px;top:50%;transform:translateY(-50%);opacity:.22;pointer-events:none}
@media(max-width:1150px){.promo-bgc{display:none}}
.promo-logo-tsh svg{width:34px;height:27px}
.promo-dig .promo-txt b{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:16.5px;letter-spacing:.01em}
.promo-hub .promo-txt b{font-family:'Noto Sans','DejaVu Sans',Inter,Arial,sans-serif;font-weight:800;font-size:14.5px;letter-spacing:-.01em}
.promo-txt b i{font-style:normal}
.tape-t3{margin-top:18px}
#taCharts svg{display:block}
#taCharts{padding-bottom:20px}   /* the same inset the panel keeps at its sides */
.tape-lbl{text-anchor:end}
#taCharts .tape-t{margin-top:20px;margin-bottom:20px}
#taCharts .tape-t:first-child{margin-top:0}
#taCharts .tape-t3{margin-top:20px}

/* Build 123: institutional activity (COT) panel */
.cot-panel{margin-bottom:20px}
.cot-rows{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin-top:12px}
@media(min-width:901px){.cot-rows .cot-i:nth-last-child(-n+2){border-bottom:none}}
.cot-chart{margin-top:14px}
.cot-lastlbl{font-family:'IBM Plex Mono',monospace;font-size:9.5px}
.cot-i{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}   /* room to breathe between the four readings */
.cot-i:last-child{border-bottom:none}
.cot-r{display:flex;align-items:center;gap:12px}
.cot-n{flex:1;font-size:13px;color:var(--text)}
.cot-v{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--mute)}
.cot-pill{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;border:1px solid;border-radius:999px;padding:2px 8px;text-transform:uppercase}
.cot-m{margin-top:8px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.04em;line-height:1.55;color:var(--faint)}   /* the explanation sits off the figure, not on it */
.cot-read{margin-top:18px;font-size:13px;line-height:1.65;color:var(--mute)}
/* on the phone the name has the row to itself, and the figure and its pill sit on the line beneath - four lines of
   wrapped name squeezed beside a figure was what made the panel feel tight */
body.m-on .cot-r{flex-wrap:wrap;gap:8px 12px}
body.m-on .cot-n{flex:1 0 100%}
body.m-on .cot-v{flex:1 1 auto}
.cot-cap{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.14em;color:var(--faint);margin-bottom:8px}
.cot-svg{width:100%;height:auto;display:block}
.cot-ax{font-family:'IBM Plex Mono',monospace;font-size:8px;fill:var(--faint)}
.cot-note{margin-top:14px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.08em;color:var(--faint)}
.modal.cot-learn{max-width:640px;position:relative}
.cot-lp{margin:0 0 14px;font-size:13.5px;line-height:1.7;color:var(--mute)}
@media(max-width:900px){.cot-rows{grid-template-columns:1fr}}

/* Build 126: network footer line */
.net-line{display:block;margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.net-line b{color:var(--mute);font-weight:600}
/* the network's name is the way back to the network - same weight and colour as the b it replaces,
   so the footer line reads exactly as before until you hover it */
.net-line .net-link{color:var(--gold-hi);font-weight:600;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}
.net-line .net-link:hover,.net-line .net-link:focus-visible{color:var(--gold-hi);border-bottom-color:currentColor}

/* ---- INDICATORS timeframe switcher ---- */
.ind-tfs{display:flex;gap:6px;margin:12px 0 4px}
.ind-tf{flex:1 1 0;text-align:center;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;color:var(--faint);background:transparent;border:1px solid var(--border-soft);border-radius:7px;padding:5px 0;cursor:pointer;transition:color .15s,border-color .15s,background .15s}
.ind-tf:hover:not(:disabled){color:var(--text);border-color:var(--border)}
.ind-tf.on{color:#141005;background:var(--gold);border-color:var(--gold);font-weight:700}
.ind-tf:disabled{opacity:.35;cursor:default}
@media(max-width:420px){.ind-tf{letter-spacing:.04em}}

/* ---- AMD cycle steps ---- */
.amd-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.amd-srow{padding:11px 0;border-bottom:1px solid var(--border-soft)}
.amd-srow:last-of-type,.amd-srow.amd-send{border-bottom:0;padding-bottom:18px}
.amd-shead{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.amd-sdot{width:8px;height:8px;border-radius:50%;background:var(--border-soft);flex-shrink:0}
.amd-sdot-done{background:var(--neutral)}
.amd-sdot-on{background:var(--gold);box-shadow:0 0 8px rgba(212,160,23,.5);animation:ssPulse 2s ease-in-out infinite}
.amd-sname{font-size:13.5px;color:var(--text)}
.amd-shrs{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.06em;color:var(--faint)}
.amd-shead .amd-chip{margin-left:auto}
.amd-rng{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--mute);margin-top:6px}
.amd-rng-s{color:var(--faint)}
.amd-rng .amd-n,.amd-verd .amd-n{color:var(--text)}
.amd-rng-w .amd-n{color:var(--mute)}
.amd-rng-w{color:var(--faint)}
.amd-verd{font-size:12.5px;line-height:1.55;color:var(--mute);margin-top:4px}
.amd-vk{color:var(--gold);font-weight:600}
.amd-cyc{margin-top:13px;padding-top:12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px}
.amd-cyc-k{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.12em;color:var(--faint)}
.amd-cyc .amd-d{margin-top:0}
.amd-chip{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;border:1px solid;border-radius:5px;padding:1px 6px;margin-left:8px;vertical-align:1px}
.amd-d{display:block;font-size:13px;line-height:1.6;color:var(--mute);margin-top:4px}
.amd-n{font-family:'IBM Plex Mono',monospace;color:var(--gold)}
.amd-foot{margin-top:12px;padding-top:11px;border-top:1px solid var(--border-soft);font-size:12.5px;line-height:1.6;color:var(--mute)}

/* on a phone the COT title and its date-and-link line cannot share a row without both wrapping */
@media(max-width:560px){.latest-head{flex-direction:column;align-items:flex-start;gap:5px}}

/* the market-closed line above the chart read - quiet, not an alarm */
.cr-shut{margin:16px 0 12px;   /* lands 21px under the title - the same air the panel leaves above it */padding:11px 13px;border-radius:10px;font-size:13px;line-height:1.65;
  color:var(--mute);background:rgba(249,171,77,.06);border:1px solid rgba(249,171,77,.18)}
.cr-shut b{color:var(--text);font-weight:600}
@media(max-width:900px){ .cr-shut{font-size:12.5px;padding:10px 12px} }

/* ==========================================================================
   MOBILE SHELL - every rule here sits inside the 900px query, and every class
   is prefixed .m- and only ever emitted by the mobile renderer. Nothing in this
   block can reach the desktop layout.
   ========================================================================== */
@media (max-width: 900px) {
  body.m-on { padding-bottom: 74px; }
  .m-nav{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;background:#131110;padding:8px 7px calc(12px + env(safe-area-inset-bottom, 0px))}
  .m-nav::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(249,171,77,0),rgba(249,171,77,.55),rgba(249,171,77,0))}
  /* a.m-nv on secondary pages picks up the site's link styling, hence the explicit reset */
  .m-nv{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 0 6px;border:0;background:none;border-radius:13px;cursor:pointer;color:var(--gold);min-height:0;text-decoration:none}
  a.m-nv,a.m-nv:hover,a.m-nv:visited,a.m-nv em{text-decoration:none;border-bottom:0}
  .m-nv em{font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:9px;font-weight:500;letter-spacing:.06em;color:var(--text)}   /* one size and one weight for every label, selected or not - the gold pill does the selecting */
  .m-nv.on{background:linear-gradient(180deg,#E8B93C,#C9970F);color:#1B1405}
  .m-nv.on em{color:#1B1405}
  /* the board, as openable rows */
  .m-acc{border-bottom:1px solid var(--border-soft);cursor:pointer}
  .m-acc:last-child{border-bottom:0}
  .m-ah{display:flex;align-items:center;gap:11px;padding:13px 0}
  .m-tf{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--mute);width:30px;flex:0 0 30px}
  .m-sc{font-family:'IBM Plex Mono',monospace;font-size:19px;width:36px;text-align:right;font-weight:400}
  .m-vd{display:flex;flex:1;min-width:0;justify-content:flex-start}
  .m-chip{font-size:8.5px;letter-spacing:.06em;padding:4px 8px;gap:3px;white-space:nowrap}
  .m-dlw{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:0 0 auto}
  .m-dl{text-decoration:none;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.04em}
  .m-dsub{font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.03em;color:var(--faint);white-space:nowrap}
  .m-vd{font-size:12px}
  .m-chev{width:34px;height:34px;flex:0 0 34px;border-radius:11px;background:rgba(249,171,77,.10);border:1px solid rgba(249,171,77,.25);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:15px}
  .m-acc.on .m-chev{background:var(--gold);border-color:var(--gold);color:#141005}
  .m-ab{display:none;padding:4px 0 14px}
  .m-acc.on .m-ab{display:block}
  .m-br{display:flex;justify-content:space-between;gap:12px;padding:11px 0;font-size:13px;border-bottom:1px solid rgba(249,171,77,.07)}
  .m-br:last-of-type{border-bottom:0}
  .m-br span{color:var(--mute)}
  .m-br b{font-family:'IBM Plex Mono',monospace;font-weight:400;white-space:nowrap}
  .m-cap{font-size:12px;color:var(--faint);line-height:1.55;margin-top:9px;font-style:italic}
  .m-exp{font-size:13.5px;color:var(--mute);line-height:1.75}
  .m-exp b{color:var(--text);font-weight:500}
  .m-scale{position:relative;height:46px;margin:20px 0 5px}
  .m-sbar{position:absolute;top:18px;left:0;right:0;height:6px;border-radius:99px;background:linear-gradient(90deg,#E4572E,#7a5a4a 34%,#5A5347 50%,#4a7a5c 66%,#57C97B);opacity:.55}
  .m-dot{position:absolute;top:13px;width:16px;height:16px;border-radius:50%;border:2px solid var(--bg);transform:translateX(-8px)}
  .m-smid{position:absolute;top:11px;width:1px;height:20px;background:rgba(237,230,216,.3);left:50%}
  .m-slab{position:absolute;top:0;font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.1em;color:var(--faint)}
  .m-sfoot{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--mute);text-align:center}
  .m-all{display:block;width:100%;margin-top:14px;padding:14px;border-radius:11px;border:1px solid rgba(249,171,77,.3);background:none;color:var(--gold);font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.09em;cursor:pointer}
  /* the mobile shell owns the column, so the desktop two-column frame stands down */
  .ta-main{display:block}
  .ta-main aside{display:block}

  /* --- spacing: the desktop got its gaps from the grid, which is off here --- */
  body.m-on #view > .panel,
  body.m-on #view > section.panel,
  body.m-on #view > .ta-main > div > .panel{margin-bottom:19px}
  body.m-on #view .panel:last-child{margin-bottom:0}
  body.m-on #view{padding-bottom:8px}

  /* --- the pulse strip above the header is desktop furniture --- */
  body.m-on #pulseStrip{display:none}

  /* --- footer lives in the menu on a phone, not under every tab --- */
  /* the originals are hidden from JS by inline style; no class rule here, or it would
     hide the COPY we render inside the drop-down too */

  /* --- panel heads stack instead of squeezing into two columns --- */
  body.m-on .bias-head{flex-direction:column;align-items:flex-start;gap:6px}
  body.m-on .bias-head .eyebrow{line-height:1.5}

  /* --- bigger touch targets --- */
  .m-chev{width:42px;height:42px;flex:0 0 42px;font-size:17px}
  .m-ah{padding:11px 0}
  body.m-on .ind-tf{padding:12px 0;font-size:11px;border-radius:9px}
  body.m-on .hdr-burger, body.m-on #burger, body.m-on [data-act="drawer"]{width:46px;height:46px;padding:0;display:inline-flex;align-items:center;justify-content:center}
  body.m-on .drawer-x, body.m-on #drawerClose, body.m-on .m-drawer [data-act="drawer-close"]{width:46px;height:46px;border-radius:14px;font-size:20px;display:inline-flex;align-items:center;justify-content:center}

  /* --- the rebuilt drawer --- */
  .m-drawer{padding:12px 15px 22px;overflow-y:auto}
  /* the row is only a spacer now - the button itself is positioned against the burger */
  .m-dtop{display:block;height:46px;margin-bottom:2px}
  .m-dx{position:fixed;z-index:80;width:46px;height:46px;border-radius:12px;
    background:rgba(237,230,216,.12);border:1.5px solid rgba(237,230,216,.38);color:#F3EFE6;
    display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
    box-shadow:0 3px 12px rgba(0,0,0,.5)}
  .m-dx svg{width:22px;height:22px;stroke-width:2.4}
  .m-dlab{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.18em;color:#5A5347;display:block;margin:16px 0 9px}
  .m-drawer .m-dlab:first-child{margin-top:6px}
  .m-sw{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;margin-bottom:4px}
  .m-sw .m-el{width:28px;height:28px;flex:0 0 28px;border-radius:8px;border:1px solid rgba(249,171,77,.25);display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:#C6BCA6}
  .m-sw .m-nm{flex:1;font-size:13.5px;color:var(--text)}
  .m-sw .m-tag{font-family:'IBM Plex Mono',monospace;font-size:7.5px;letter-spacing:.1em;color:#5A5347;border:1px solid rgba(249,171,77,.18);border-radius:5px;padding:3px 6px}
  .m-sw.cur{background:rgba(249,171,77,.11)}
  .m-sw.cur .m-el{background:var(--gold);color:#141005;border-color:var(--gold)}
  .m-sw.cur .m-tag{color:var(--gold);border-color:rgba(249,171,77,.5)}
  .m-sw.soon .m-nm,.m-sw.soon .m-el{opacity:.45}
  .m-lnk{display:flex;width:100%;justify-content:space-between;align-items:center;padding:14px 2px;font-size:14px;color:#C6BCA6;background:none;border:0;border-bottom:1px solid rgba(249,171,77,.08);text-decoration:none;cursor:pointer;font-family:inherit;text-align:left}
  .m-lnk span{color:#5A5347;font-size:15px}
  .m-drawer .promo{margin-bottom:9px}
  /* the section label sits 9px above whatever follows it, which is right over a list of plain rows and
     reads as nothing against a bordered card - so the first card gets the air the label has above itself */
  .m-dlab + .promo{margin-top:7px}
  /* the disclosure is the whole foot now that the two links are gone */
  .m-foot{margin-top:20px;font-size:11.5px;color:#5A5347;line-height:1.7}
  .m-foot a{color:#8f8a7d;text-decoration:none}
  .m-foot span{display:block;margin-top:0}
  .fw-more{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);padding-top:9px}

  /* --- takes: filter + sort bar and its sheet --- */
  /* --- the footer, re-homed as a closed drop-down ---------------------------
     The rule above it is the same gold gradient hairline the header and the tab
     bar use, so the site is closed off by the line it opened with. */
  body.m-locked{position:fixed;left:0;right:0;width:100%;overflow:hidden}
  /* THE ABOUT FOLD, made the same object as the sidebar's folds. It used to be a serif heading with a
     large square chevron over a hairline - its own species, on a page where every other fold is a small
     mono summary in a rounded box. Same box, same summary type, same caret, same body copy now. */
  /* the words that stand in for the tape when the market is shut sat 9px off the panel's floor - the
     chart they replace ends well above it. A little air underneath, on the phone only. */
  .tape-shut{padding-bottom:10px}
  .m-about{position:relative;margin:26px 0 18px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}   /* the wrap adds 8px, so 26 above and 26 below */
  .m-about-h{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;
    padding:9px 12px;background:none;border:0;cursor:pointer;text-align:left;
    font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi)}
  .m-about-c{font-style:normal;width:auto;height:auto;flex:0 0 auto;border:0;border-radius:0;background:none;
    color:var(--gold-hi);font-size:13px;line-height:1;display:block}
  .m-about.on .m-about-h{border-bottom:1px solid var(--line)}
  .m-about.on .m-about-c{background:none;border:0;color:var(--gold-hi)}
  /* the real footer nodes are moved in here, so this restyles them to the folds' own body copy */
  .m-about-b{display:none;padding:10px 12px 12px}
  /* the moved nodes are .wrap and .foot in their own right: 16px of side padding, a top margin, a
     padding-bottom, and .seo's gradient rule - the footer's own divider, which has no business inside a
     fold. All of it is stripped so the fold's own 12px is the only inset, as in every other fold. */
  .m-about-b > *{margin:0 0 12px !important;padding:0 !important;display:block;border:0 !important}
  .m-about-b > *:last-child{margin-bottom:0 !important}
  .m-about-b .seo::before,.m-about-b .seo::after{display:none !important;content:none !important}
  /* the moved nodes bring their own type - the disclaimer is 10px mono, the intro is sans with bold runs -
     so the whole subtree is reset to the folds' body copy and only bold, links and headings step out of it */
  .m-about-b, .m-about-b *{font-family:'Archivo',system-ui,sans-serif !important;   /* the desk's own body face */font-size:12.5px !important;
    line-height:1.6 !important;letter-spacing:0 !important;color:var(--mute) !important;text-transform:none !important}
  .m-about-b b,.m-about-b strong{color:var(--text) !important;font-weight:600 !important}
  .m-about-b a{color:var(--gold-hi) !important;text-decoration:none}
  .m-about-b h1,.m-about-b h2,.m-about-b h3{font-size:13px !important;color:var(--text) !important;
    font-weight:600 !important;margin:0 0 6px !important}
  .m-about-b p{margin:0 0 10px !important}
  .m-about-b p:last-child{margin-bottom:0 !important}
  .m-about.on .m-about-b{display:block}

  /* --- chart switcher: same pills as the indicator timeframes --- */
  .m-cseg{display:flex;gap:6px;margin:0 0 14px}
  .m-cs{flex:1;text-align:center;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.06em;
    padding:11px 0;border-radius:9px;color:var(--mute);cursor:pointer;background:rgba(255,255,255,.04);border:0}
  .m-cs.on{background:var(--gold);color:#141005;font-weight:600}
  /* the trio is drawn at a 360 viewBox on a phone, so its labels arrive at their
     stated size instead of ~55% of it */
  body.m-on .tape-lbl{font-size:9px}
  body.m-on .tape-t{margin-top:0}

  .m-fbar{display:flex;gap:8px;margin:2px 0 12px}
  .m-fbtn{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;padding:14px;border-radius:12px;
    border:1px solid rgba(249,171,77,.3);background:rgba(249,171,77,.07);color:var(--text);
    font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.09em;cursor:pointer}
  .m-fbtn-q{background:none;border-color:var(--border);color:var(--mute)}
  .m-fn{background:var(--gold);color:#141005;border-radius:99px;min-width:19px;height:19px;
    display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:600}
  .m-fchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
  .m-fchip{font-family:'IBM Plex Mono',monospace;font-size:9px;border-radius:999px;padding:7px 11px;border:1px solid;cursor:pointer}
  .m-sheetwrap{position:fixed;inset:0;z-index:75;pointer-events:none}
  .m-sheetwrap.on{pointer-events:auto}
  .m-sh-back{position:absolute;inset:0;background:rgba(5,4,3,.72);opacity:0;transition:opacity .3s}
  .m-sheetwrap.on .m-sh-back{opacity:1}
  .m-sh{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow-y:auto;background:#171412;
    border-top:1px solid rgba(249,171,77,.3);border-radius:20px 20px 0 0;padding:12px 16px calc(20px + env(safe-area-inset-bottom, 0px));
    transform:translateY(101%);transition:transform .42s cubic-bezier(.16,.84,.30,1)}
  .m-sheetwrap.on .m-sh{transform:translateY(0)}
  .m-sh-grab{width:40px;height:4px;border-radius:99px;background:#3A362D;margin:0 auto 14px}
  .m-sh-h{display:flex;align-items:center;margin-bottom:4px}
  .m-sh-h b{font-family:'Fraunces',Georgia,serif;font-size:18px;color:var(--text)}
  .m-clr{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--gold);background:none;border:0;cursor:pointer;padding:10px 4px}
  .m-grp{margin-top:15px}
  .m-gl{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.16em;color:#5A5347;display:block;margin-bottom:9px}
  .m-opts{display:flex;flex-wrap:wrap;gap:7px}
  .m-opt{font-family:'IBM Plex Mono',monospace;font-size:10px;border-radius:999px;padding:10px 14px;cursor:pointer;
    background:none;border:1px solid rgba(249,171,77,.2);color:#C6BCA6}
  .m-opt.on{background:var(--gold);border-color:var(--gold);color:#141005;font-weight:600}
  .m-srch{display:flex;align-items:center;gap:9px;border:1px solid rgba(249,171,77,.2);border-radius:12px;padding:12px 13px;color:var(--faint)}
  .m-srch input{flex:1;background:none;border:0;outline:none;color:var(--text);font-size:12.5px;font-family:inherit}
  .m-apply{display:block;width:100%;margin-top:18px;padding:16px;border-radius:13px;border:0;
    background:linear-gradient(180deg,#E8B93C,#C9970F);color:#1B1405;font-family:'IBM Plex Mono',monospace;
    font-size:11.5px;letter-spacing:.09em;font-weight:600;cursor:pointer}
  /* the row carried 4px of its own side padding, so its label and tick sat 4px inside the divider that
     runs under them and 4px inside the sheet's title. Nothing should be inset from its own rule. */
  .m-srow{display:flex;width:100%;align-items:center;gap:12px;padding:15px 0;background:none;border:0;
    border-bottom:1px solid rgba(249,171,77,.08);cursor:pointer;text-align:left}
  .m-srow span{flex:1}
  .m-srow b{display:block;font-size:14.5px;color:var(--text);font-weight:500}
  .m-srow s{text-decoration:none;display:block;font-size:12px;color:var(--faint);margin-top:3px}
  .m-tick{width:22px;height:22px;flex:0 0 22px;border-radius:50%;border:1px solid rgba(249,171,77,.3);
    display:flex;align-items:center;justify-content:center;color:#141005;font-style:normal;font-size:12px}
  .m-srow.on .m-tick{background:var(--gold);border-color:var(--gold)}

  /* --- header / content edge -------------------------------------------------
     The desktop hairline is rgba(249,171,77,.09) over a translucent bar, which on
     a phone leaves the header and the first panel looking like one surface. Here
     the bar goes opaque and slightly darker than the page, and the edge becomes
     the SAME gold gradient the bottom tab bar already uses - so the app is
     bracketed top and bottom by one line, and content reads as passing beneath. */
  body.m-on .hdr{background:#100E0B;border-bottom:0;box-shadow:0 10px 22px -10px rgba(0,0,0,.8)}
  body.m-on .hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
    background:linear-gradient(90deg,rgba(249,171,77,0),rgba(249,171,77,.55),rgba(249,171,77,0))}
  body.m-on #view{padding-top:19px}
  /* the chart read's "last trading day" sits under its title like the board's source line does, so the
     two tabs open the same way - 6px read as an afterthought against the board's 20px */
  body.m-on #taRead .bias-head{row-gap:20px}
  /* the weekend session read is one paragraph under the title, and it carried its own 8px on top of the
     title's 20 - 28 in all, looser than any other panel on the tab. The Readings panels open at 15, so
     this does too. */
  body.m-on #taAmd > .eyebrow{margin-bottom:15px}
  body.m-on #taAmd > .eyebrow + .sr-build{margin-top:0}
   /* the same gap the panels leave between themselves */

  /* --- articles as a bottom sheet --------------------------------------------
     The modal was already bottom-anchored, so it only needed to arrive like one:
     it slides up, wears a grab handle, and the close target grows to 44px. */
  /* entry is a transition, not a filled keyframe: a keyframe with fill-mode keeps
     ownership of `transform` and the drag's inline style loses to it, which is why the
     sheet felt like it was floating free of the finger. */
  /* full height: the strip of backdrop above the sheet cost a fifth of the reading area
     and made every article feel cramped. dvh follows the browser's collapsing toolbar,
     with vh as the fallback for anything that does not know it. */
  body.m-on .modal{transform:translateY(101%);transition:transform .46s cubic-bezier(.16,.84,.30,1);
    will-change:transform;height:100vh;max-height:100vh;border-radius:16px 16px 0 0;padding-top:0;
    touch-action:pan-y}
  @supports (height: 100dvh) {
    body.m-on .modal{height:100dvh;max-height:100dvh}
  }
  body.m-on .modal.m-in{transform:translateY(0)}
  body.m-on .modal-body{touch-action:pan-y;overscroll-behavior:contain}
  body.m-on .modal::before{content:"";position:absolute;left:50%;top:8px;width:38px;height:4px;
    margin-left:-19px;border-radius:99px;background:rgba(237,230,216,.34);z-index:4;pointer-events:none;
    box-shadow:0 1px 3px rgba(0,0,0,.5)}
  body.m-on .modal-art{height:62px;flex:0 0 62px;touch-action:none;cursor:grab}
  body.m-on .modal-h{font-size:19px;line-height:1.3}
  /* THE SHEET ITSELF SCROLLS. Two attempts at an inner scroller failed - a flex child
     and then an absolutely-pinned box - because both depend on the height chain above
     them resolving. This does not: the sheet is a plain block of a known height with its
     own overflow, and the header sticks to its top while the content moves under it. */
  body.m-on .modal{position:relative;display:block;overflow-y:auto;overflow-x:hidden;
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  body.m-on .modal-art{position:sticky;top:0;z-index:3}
  body.m-on .modal-body{position:static;overflow:visible;flex:none;min-height:0;display:block}
  body.m-on .modal-x{right:10px;top:12px}   /* the look is shared now; the phone only moves it in */
  /* The tab bar is z-index 60 and the sheet is 50, so the bar sits ON TOP of the sheet -
     deliberately, since a tab is a way out of a take. That means the last stretch of every
     article was hidden beneath it, which reads exactly like "the content is at the bottom
     and will not scroll". The padding clears the bar and leaves room to scroll past it. */
  body.m-on .modal-body{padding:16px 16px calc(120px + env(safe-area-inset-bottom, 0px));
    overscroll-behavior:contain}
  body.m-on .modal-back{transition:opacity .18s}
}
/* the overflow count is not mobile-only - the desktop panel gained the same honesty */
.fw-more{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--faint);padding-top:9px}

/* the plain-English key on the session panel */
.amd-key{margin:18px 0 4px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.amd-key summary{list-style:none;cursor:pointer;padding:10px 12px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi);display:flex;align-items:center;justify-content:space-between;gap:10px}
.amd-key summary::-webkit-details-marker{display:none}
.amd-key summary::after{content:'\25BE';font-size:13px;color:var(--gold-hi);flex:0 0 auto;line-height:1}
.amd-key[open] summary::after{content:'\25B4'}
.amd-key[open] summary{border-bottom:1px solid var(--line)}
.amd-key summary:hover{color:var(--gold)}
.amd-key p{margin:0;padding:0 12px 10px;font-size:12.5px;line-height:1.6;color:var(--mute)}
.amd-key p b{color:var(--text);font-weight:600}

/* the session rows, as cards with room to breathe */
.amd-srow{padding:18px 0 20px;border-bottom:1px solid rgba(var(--text-rgb),.14)}
.amd-shead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.amd-facts{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 20px}
.amd-fact{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;min-width:0;width:100%;box-sizing:border-box}
.amd-fl{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.amd-fv{font-family:'IBM Plex Mono',monospace;font-size:15px;font-weight:600;color:var(--text);letter-spacing:.01em;white-space:nowrap}
.amd-fv .amd-n{font-size:15px}
.amd-fs{font-size:12px;line-height:1.45;color:var(--mute)}
.amd-verd{font-size:13px;line-height:1.6;color:var(--mute);margin:0}   /* the sentence under a headline reads as body copy, like the rest of the panel */
.amd-vk{display:block;color:var(--gold);font-weight:700;font-size:15px;line-height:1.2;margin-bottom:8px}
.amd-why{margin-top:16px;padding:10px 13px;border-left:2px solid var(--gold-deep);background:rgba(var(--gold-rgb),.05);font-size:12.5px;line-height:1.55;color:var(--mute)}
.amd-why .amd-fl{display:block;color:var(--gold-hi);margin-bottom:4px}


/* today's cycle as a card: three steps, the read, the levels, what it means */
.amd-cyc{margin-top:0;padding-top:18px;border-top:1px solid rgba(var(--text-rgb),.14);display:flex;flex-direction:column;gap:16px}
.amd-cyc-k{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.16em;color:var(--faint)}
.amd-steps{display:grid;grid-template-columns:1fr;gap:8px;margin-top:2px}
.amd-cstep{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:12px 14px 12px 16px;display:flex;align-items:center;gap:12px;min-width:0;box-sizing:border-box;width:100%}
.amd-cstep-n{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:600;color:var(--faint);border:1px solid var(--line)}
.amd-cstep-t{min-width:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.amd-cstep-t b{display:block;font-size:12.5px;color:var(--text);font-weight:600;line-height:1.15}
.amd-cstep-t i{display:block;font-style:normal;font-size:11px;color:var(--faint);line-height:1.35;margin-top:1px}
.amd-cstep-w{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.04em;color:var(--mute);line-height:1.3}
.amd-cstep.done .amd-cstep-n{background:var(--gold-deep);border-color:var(--gold-deep);color:var(--text-hi)}
.amd-cstep.on{border-color:var(--gold)}.amd-cstep.on .amd-cstep-n{background:var(--gold);border-color:var(--gold);color:var(--ink)}.amd-cstep.on .amd-cstep-w{color:var(--gold-hi)}
.amd-cstep.wait{opacity:.6}.amd-cstep.skip{opacity:.6}.amd-cstep.skip .amd-cstep-w{text-decoration:line-through}
.amd-read{display:flex;flex-direction:column;gap:6px;padding:2px 0 0}
.amd-read b{font-family:inherit;font-size:15px;font-weight:700;line-height:1.2;flex:0 0 auto}   /* the same face and size as the session verdicts (.amd-vk) - one voice for every headline in the panel */
.amd-read .amd-fs{flex:0 0 auto}
.amd-lvs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.amd-mean{font-size:12.5px;line-height:1.6;color:var(--mute);padding:2px 0 4px}
.amd-lv{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:12px 13px;display:flex;flex-direction:column;gap:4px;min-width:0}
@media(max-width:520px){.amd-lvs{grid-template-columns:1fr}}

/* the folded session panel: a headline and a line of numbers by default, the rest on request */
.amd-sum{font-family:'IBM Plex Mono',monospace;font-size:11.5px;line-height:1.6;color:var(--text);margin-top:12px}
.amd-sum .amd-n{font-size:11.5px}
.amd-more{margin-top:16px}   /* the same 12px the numbers line has above it, plus the pill's own 4px of visual weight */
.amd-more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:7px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--gold-hi);padding:6px 11px;border:1px solid rgba(var(--gold-rgb),.45);background:rgba(var(--gold-rgb),.10);border-radius:999px;transition:.16s}
.amd-more summary:hover{background:rgba(var(--gold-rgb),.18)}
.amd-more summary::-webkit-details-marker{display:none}
.amd-more summary::after{content:'\25BE';font-size:11px;line-height:1}
.amd-more[open] summary::after{content:'\25B4'}
.amd-more[open] summary{margin-bottom:10px}
.amd-more .amd-facts{margin-bottom:12px}
.amd-more .amd-why{margin-top:0}
.amd-more .amd-steps{margin-bottom:12px}
.amd-more .amd-lvs{margin-bottom:12px}
.amd-srow{padding:16px 0 22px}   /* the pill's outline needs the same clearance to the divider below as it has above */
.amd-cyc{gap:14px}
.amd-read{padding:2px 0 0}

/* the front page's takes list ends with the door to the rest */
.feed-more{display:flex;width:100%;justify-content:center;align-items:center;gap:8px;margin-top:20px;padding:11px 14px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gold-hi);background:rgba(var(--gold-rgb),.08);border:1px solid rgba(var(--gold-rgb),.4);border-radius:999px;cursor:pointer;transition:.16s}
.feed-more:hover{background:rgba(var(--gold-rgb),.16)}
.feed-more span{font-size:14px;line-height:1}

/* a link from a desk into the school - one style everywhere it appears */
.hub-link{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:4px 12px 12px;padding:10px 13px;border:1px solid rgba(var(--up-rgb),.45);background:rgba(var(--up-rgb),.07);border-radius:10px;color:var(--up);font-size:12.5px;font-weight:600;text-decoration:none;transition:.16s}
.hub-link:hover{background:rgba(var(--up-rgb),.14)}
.hub-link span{font-size:12px}
.hub-link i{display:block;width:100%;font-style:normal;font-weight:400;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72)}   /* the muted grey disappears against the green panel - white at 72% reads without competing with the link itself */

/* one rule for the space under a panel title: the same 20px the panel keeps above it */
#taProx > .eyebrow, #taLadder > .eyebrow, #taInd > .eyebrow, #taFlips > .eyebrow{display:block;margin-bottom:20px}
.prox-sub{margin-top:0}
.ind-tfs{margin-top:0}
.amd-head{margin-bottom:2px}
.fw-more{padding-top:16px}

/* phone shell: the space under a panel title equals the space above it (20px), the same rule as the desktop sidebar */
body.m-on .panel > .eyebrow{display:block;margin-bottom:20px}
body.m-on .bias-head{margin-bottom:20px;padding-bottom:0}
body.m-on .latest-head{margin-bottom:20px}
body.m-on .feed-head{margin-bottom:20px}
body.m-on .m-all{margin-top:20px}

/* the COT explainer: room under the modal's title on desktop; a fold on the phone */
.cot-learn .modal-h{margin:0 40px 16px 0}
.cot-learn .cot-lp{margin-top:0}
.cot-key{margin:0 0 15px}
.cot-key .cot-lp{padding:0 12px;margin:0 0 10px;font-size:13px;line-height:1.6;color:var(--mute)}
.cot-key .cot-lp:first-of-type{padding-top:10px}
.cot-key .cot-lp:last-of-type{padding-bottom:12px;margin-bottom:0}

/* phone: per-title adjustments to the 20px rhythm, at his eye */
body.m-on #taProx > .eyebrow, body.m-on #taLadder > .eyebrow{margin-bottom:15px}
body.m-on .panel > .eyebrow:has(+ .m-accs), body.m-on .panel > .eyebrow:has(+ .m-exp){margin-bottom:15px}
body.m-on .panel > .eyebrow:has(+ .an-grid){margin-bottom:0}
body.m-on .panel > .eyebrow + .an-grid{margin-top:10px}   /* the grid's own 14px top margin was the gap; 10 now */
body.m-on .latest-head{margin-bottom:25px}

/* desktop: five off the space under these titles */
body:not(.m-on) #taProx > .eyebrow, body:not(.m-on) #taLadder > .eyebrow{margin-bottom:15px}
body:not(.m-on) #taAmd > .eyebrow + .sr-build{margin-top:12px}   /* the shut-market read sat 11px under its title against 15 on its neighbours */
body:not(.m-on) .panel > .eyebrow + .an-grid{margin-top:9px}
body:not(.m-on) .latest-head + .cot-rows{margin-top:7px}
body:not(.m-on) .tb-head{margin-bottom:19px}
body:not(.m-on) .feed-head{margin-bottom:17px}   /* five more under the takes list's title row on desktop */

/* the line between the header and the desk: visible on a desktop screen, not just implied */
body:not(.m-on) .hdr{border-bottom:0;box-shadow:0 12px 24px -16px rgba(0,0,0,.9)}
body:not(.m-on) .hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,rgba(var(--gold-rgb),0),rgba(var(--gold-rgb),.6) 50%,rgba(var(--gold-rgb),0))}   /* the phone header's line: one pixel, the asset colour, fading to the edges */

/* technical levels (the strip): lifted from the gold theme, var-only */
.prox-sub{font-size:12px;line-height:1.5;color:var(--mute);margin:6px 0 18px}
.prox-key{margin:18px 0}   /* equal air above and below - it sits between the intro and the rows */
.prox-key summary{padding:9px 12px}
.prox{display:flex;flex-direction:column;gap:6px}
.prox-row{display:grid;grid-template-columns:14px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.prox-row.prox-near{border-color:rgba(var(--up-rgb),.55);background:rgba(var(--up-rgb),.06)}
.prox-side{font-size:9px}
.prox-up{color:var(--bear)}
.prox-dn{color:var(--up)}
.prox-name{font-size:13px;font-weight:600;color:var(--text);min-width:0}
.prox-name i{display:block;font-style:normal;font-weight:400;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-top:3px}
.prox-name i .amd-n{color:var(--gold-hi);letter-spacing:0;text-transform:none;font-weight:400}
.prox-v{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--text);white-space:nowrap}
.prox-badge{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;padding:5px 8px;border-radius:999px;border:1px solid var(--line);color:var(--mute);white-space:nowrap}
.prox-near .prox-badge{color:var(--up);border-color:rgba(var(--up-rgb),.55)}
.prox-now{display:flex;align-items:center;gap:10px;padding:4px 12px;font-family:'IBM Plex Mono',monospace}
.prox-now span{font-size:12.5px;font-weight:600;color:var(--gold-hi)}
.prox-now i{font-style:normal;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.prox-now::before,.prox-now::after{content:'';flex:1;height:1px;background:var(--gold-deep);opacity:.6}
.prox-miss{font-size:11.5px;line-height:1.5;color:var(--faint);padding:0;margin-top:14px}   /* flush with the footnote under it, not inset 12px */
.prox-foot{font-size:11.5px;line-height:1.5;color:var(--faint);margin-top:18px}
.prox-sub{margin-top:0}

/* the school link at the foot of a fold: real clearance from the box on every side */
.amd-key .hub-link{margin:6px 12px 0}
.amd-key:has(> .hub-link)[open]{padding-bottom:12px}

/* the line above the footer: the header's line, the other way up */
.seo{border-top:0;position:relative}
.seo::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(var(--gold-rgb),0),rgba(var(--gold-rgb),.6) 50%,rgba(var(--gold-rgb),0))}
/* the day's headline event: a band across the top of the desk, above every panel - the site's own
   background under a soft wash of the asset's colour, with that colour as its border, so it belongs to
   the page rather than sitting on it.
   One size per line: the small label above the name, and the small things that are not the name (the
   desk's note, the impact, the cue) grouped together on the right. It opens the calendar's own modal. */
.topev{display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;text-align:left;
  appearance:none;font:inherit;color:inherit;cursor:pointer;margin:0 0 20px;padding:12px 18px;border-radius:13px;   /* the gap below matches the 20px the page leaves above it */
  border:1px solid var(--border);   /* the same border every panel on the desk uses */
  background:linear-gradient(96deg,color-mix(in srgb, var(--gold) 16%, transparent),color-mix(in srgb, var(--gold) 5%, transparent) 58%,color-mix(in srgb, var(--gold) 2%, transparent)),var(--ink);
  background-clip:padding-box;   /* a background paints under a border by default, and this border is a
                                    translucent tint - the wash was showing through it and thickening the
                                    left edge. Clipped to the padding box the border reads as the panels' do. */
  transition:border-color .16s,background .16s,transform .16s}
.topev:hover{border-color:color-mix(in srgb, var(--gold) 42%, transparent);
  background:linear-gradient(96deg,color-mix(in srgb, var(--gold) 26%, transparent),color-mix(in srgb, var(--gold) 9%, transparent) 58%,color-mix(in srgb, var(--gold) 4%, transparent)),var(--ink);
  background-clip:padding-box}
.topev:active{transform:translateY(1px)}
.topev:focus-visible{outline:1px solid var(--gold-hi);outline-offset:3px}
.topev-l{display:flex;flex-direction:column;gap:4px;min-width:0}
.topev-lead{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi)}
.topev-name{font-size:16px;font-weight:600;line-height:1.25;color:var(--text)}
.topev-r{display:flex;align-items:center;gap:14px;flex:0 1 auto;min-width:0}
.topev-note{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.03em;color:var(--mute);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.topev-imp{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-hi);border:1px solid color-mix(in srgb, var(--gold) 50%, transparent);border-radius:999px;padding:4px 9px;white-space:nowrap;flex:0 0 auto}
.topev-cta{display:flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold-hi);white-space:nowrap;flex:0 0 auto}
.topev-cta i{display:inline-flex;transition:transform .16s}
.topev:hover .topev-cta i{transform:translateX(3px)}
@media(max-width:860px){.topev-note{display:none}}   /* the note is in the modal a tap away; the name is not */
@media(max-width:760px){
  .topev{flex-direction:column;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px}
  .topev-name{font-size:15.5px}
  .topev-r{width:100%;justify-content:space-between}
}
@media(max-width:760px){.topev{margin-bottom:14px}}   /* match the 14px the phone wrap leaves above it */

/* the glossary folds in the indicators panel - the same fold as the levels panel's What is ATR */
.ind-key{margin:18px 0 0}
.ind-key.prox-key{margin:18px 0}   /* the levels panel's fold carries both classes; this wins */
.ind-key + .fw-head{margin-top:23px}
.ind-key p{margin:0;padding:0 12px 10px;font-size:12.5px;line-height:1.6;color:var(--mute)}
.ind-key p:first-of-type{padding-top:10px}
.gl-t{color:var(--text);font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em}

/* The closing copy under the desk ran the full width of the page while everything above it is set in the
   728px reading column, so the lines were half as long again as any other prose on the site and much
   harder to read. On desktop it now shares that column's width and left edge; on the phone, where there
   is one column anyway, nothing changes. */
@media(min-width:901px){
  .seo > *, .foot > *{max-width:728px !important}   /* .seo p sets its own 820px measure - this wins */
}

/* PHONE TAP TARGETS. A fold's closed state is a thing you hit with a thumb, and 33-35px is under what a
   finger reliably lands on. Five more top and bottom on every fold's summary - the sidebar's and the
   footer's alike - which leaves the type and the caret exactly where they were. Last in the sheet on
   purpose: the base rules come later than the phone block and were winning on equal specificity. */
@media(max-width:900px){
  .amd-key > summary{padding-top:14px;padding-bottom:14px}
  .m-about-h{padding-top:14px;padding-bottom:14px}
}

/* the one line in the footer that is not decoration: the disclaimer reads white, bold and in capitals so
   it cannot be skimmed past, wherever the footer copy ends up - including inside the phone's About fold,
   which resets everything else it holds to the folds' muted body copy. */
.foot .nia,.m-about-b .nia,.m-foot .nia{color:#fff !important;font-weight:700 !important;letter-spacing:.04em}

/* the board's head: the title on the left, the "how to read" pill where a control belongs, and the note
   about where the ratings come from on its own line under the title - it is a caption, not a control. */
/* the head must not wrap: with wrapping allowed the browser pushes the link onto a second row rather
   than shrinking the note, which is what the twins' longer note (it names their ETF) was doing. */
.tb-head{flex-wrap:nowrap}
.tb-note{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.04em;color:var(--faint);
  line-height:1.5;flex:0 1 auto;min-width:0;margin:0 14px;text-align:center;   /* centred in the space the title and link leave */
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* it may shorten, but it may not push the link onto a second row */
.tb-head > .eyebrow{flex:0 0 auto}
.tb-head > .tb-guide{margin-left:auto}
@media(min-width:901px) and (max-width:1010px){
  /* below about a thousand the note has no room to say anything useful, and a wrapped head row looks
     broken - so it steps out and the title and pill keep the line to themselves */
  .tb-note{display:none}
}
/* a link, not a button: the same weight as the other cross-links on the desk, in the asset's colour,
   underlining on hover in its own colour the way the network line in the footer does */
.tb-guide{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;appearance:none;cursor:pointer;
  font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold-hi);background:none;border:0;padding:0;
  border-bottom:1px solid transparent;transition:border-color .16s}
.tb-guide:hover,.tb-guide:focus-visible{border-bottom-color:currentColor}
.tb-guide i{display:inline-flex;transition:transform .16s}
.tb-guide:hover i{transform:translate(2px,-2px)}
/* the scale lives in the phone's media block, so the modal carries its own copy - same numbers, scoped
   so nothing else on the desktop inherits it */
.board-guide .modal-h{margin:0 40px 16px 0}   /* the same air under the title the event modal leaves */
.board-guide .m-exp{font-size:13.5px;line-height:1.7;color:var(--mute);margin:0 0 8px}
.board-guide .m-scale{position:relative;height:52px;margin:22px 0 6px}
.board-guide .m-sbar{position:absolute;top:22px;left:0;right:0;height:6px;border-radius:99px;
  background:linear-gradient(90deg,#E4572E,#7a5a4a 34%,#5A5347 50%,#4a7a5c 66%,#57C97B);opacity:.55}
.board-guide .m-dot{position:absolute;top:17px;width:16px;height:16px;border-radius:50%;
  border:2px solid var(--panel);transform:translateX(-8px)}
.board-guide .m-smid{position:absolute;top:15px;width:1px;height:20px;background:rgba(237,230,216,.3);left:50%}
.board-guide .m-slab{position:absolute;top:0;font-family:'IBM Plex Mono',monospace;font-size:9px;
  letter-spacing:.12em;color:var(--faint)}
.board-guide .m-sfoot{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--mute);text-align:center;margin:0}
@media(max-width:900px){
  /* the phone has no head row: the note is a block under the board's title, at its own readable size,
     and it reads from the left like every other line on the page - centring is the desktop row's job */
  .tb-note{display:block;font-size:9.5px;letter-spacing:.06em;margin:8px 0 0;text-align:left;
    white-space:normal;overflow:visible;text-overflow:clip}
}

/* the sheets' close, written inline by app.js, gets the same shape from here so every close on the site
   is one object: rounded square, never a circle */
@media(max-width:900px){
  .m-sh-x{border-radius:11px !important}
}