/* The client site - "Essentials": a white ground, ink type, one accent, hairlines
   and space instead of boxes, huge numbers, and each model's own chart as its
   picture. Light by default; dark through the same tokens. System fonts only, and
   every size in rem so a phone set to large text gets large text.

   Tokens first. Every token that carries WORDS clears 4.5:1 against --bg, in the
   light set and in the dark set (tests/test_web.py reads the last set in this
   file). The chart colours (--s1..--s3, --line-a, --fill, --mk) draw lines and
   fills, never words. */
:root{
  --bg:#ffffff; --ink:#0a0a0b; --ink2:#34343a; --muted:#5f5f67; --faint:#6a6a72;
  --line:#e4e4e8; --grid:#efeff2; --surface:#f5f5f7; --surface2:#ececf0;
  --up:#0a7f4f; --down:#c42b26; --warn:#8a5a00;
  --accent:#0b64b0; --accent2:#0b64b0; --fill:#4fb3ff; --on-fill:#04192a; --line-a:#4fb3ff;
  --index:#62626a; --hold:#0b7a5c; --mk:#8e8e97;
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a;
  --scrim:rgba(10,10,11,.32); --lift:0 1px 2px rgba(10,10,11,.05),0 14px 36px rgba(10,10,11,.12);
  --logo-filter:invert(1); --hero:#0a0a0b; --on-hero:#ffffff; --on-hero2:#c9c9d1;
  --f:ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1); --dur:.17s; --hh:57px; --tabbar:62px; --max:1280px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#05080b; --ink:#f2f5f7; --ink2:#c9d0d5; --muted:#949ea5; --faint:#869097;
    --line:#1d252a; --grid:#12181c; --surface:#0e1418; --surface2:#151c21;
    --up:#34c98a; --down:#ff6b61; --warn:#f5c451;
    --accent:#8fd3ff; --accent2:#8fd3ff; --fill:#6cc6ff; --on-fill:#04192a; --line-a:#6cc6ff;
    --index:#a3acb3; --hold:#2bc08a; --mk:#76828a;
    --s1:#3987e5; --s2:#d95926; --s3:#199e70;
    --scrim:rgba(0,0,0,.6); --lift:0 0 0 1px rgba(255,255,255,.07),0 18px 44px rgba(0,0,0,.7);
    --logo-filter:none; --hero:#0f2433; --on-hero:#f2f5f7; --on-hero2:#a9c4d6;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#05080b; --ink:#f2f5f7; --ink2:#c9d0d5; --muted:#949ea5; --faint:#869097;
  --line:#1d252a; --grid:#12181c; --surface:#0e1418; --surface2:#151c21;
  --up:#34c98a; --down:#ff6b61; --warn:#f5c451;
  --accent:#8fd3ff; --accent2:#8fd3ff; --fill:#6cc6ff; --on-fill:#04192a; --line-a:#6cc6ff;
  --index:#a3acb3; --hold:#2bc08a; --mk:#76828a;
  --s1:#3987e5; --s2:#d95926; --s3:#199e70;
  --scrim:rgba(0,0,0,.6); --lift:0 0 0 1px rgba(255,255,255,.07),0 18px 44px rgba(0,0,0,.7);
  --logo-filter:none; --hero:#0f2433; --on-hero:#f2f5f7; --on-hero2:#a9c4d6;
  color-scheme:dark;
}

/* ---- the ground --------------------------------------------------------- */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 0.9375rem/1.55 var(--f);
  font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh}
body.locked{overflow:hidden}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{margin:0;font-weight:600;text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:8px;top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:10px 14px;border-radius:8px;text-decoration:none}
.skip:focus{top:8px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:1.125rem;height:1.125rem;flex:none;vertical-align:-0.2em}
.eyebrow{font-size:0.8125rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);line-height:1.3}
.h1{font-size:clamp(2rem,1.3rem + 2.6vw,2.5rem);line-height:1.06;letter-spacing:-.035em;font-weight:650}
.sub{font-size:1.125rem;line-height:1.45;color:var(--muted);max-width:46ch}
.note{font-size:0.8125rem;line-height:1.5;color:var(--muted);max-width:92ch}
.note .ico{width:0.875rem;height:0.875rem;margin-right:5px;vertical-align:-2px}
.note b{color:var(--ink);font-weight:600}
.bad{color:var(--down)}

/* ---- the frame ---------------------------------------------------------- */
#app{display:flex;flex-direction:column;min-height:100vh}
#top{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.topin{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:20px;height:56px;padding-inline:16px}
#brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-height:44px;flex:none}
/* the wordmark is the artwork itself, white on transparent: inverted on light */
#brand .word{display:block;height:1rem;width:auto;filter:var(--logo-filter)}
/* THE MARK, to the logo's own geometry: three identical bars climbing to the
   right, each lifted by half its own height. */
.mark{position:relative;display:inline-block;height:20px;width:18px;flex:none;color:currentColor}
.mark i{position:absolute;display:block;width:25.6%;height:50%;background:currentColor}
.mark i:nth-child(1){left:0;bottom:0}
.mark i:nth-child(2){left:36.8%;bottom:25%}
.mark i:nth-child(3){left:73.6%;bottom:50%}
#view{flex:1;width:100%;max-width:var(--max);margin:0 auto;padding:0 16px 48px;outline:none}
@media (min-width:760px){.topin,#view{padding-inline:32px}}
@media (min-width:1200px){.topin,#view{padding-inline:48px}}
.screen{display:flex;flex-direction:column;min-width:0}

/* the five tabs: words in the header on a wide screen, a bar at the foot on a phone */
#tabs{margin-left:auto;display:flex;gap:26px;height:100%}
#tabs a{position:relative;display:flex;align-items:center;gap:6px;height:100%;color:var(--muted);text-decoration:none;font-weight:500;font-size:0.9375rem;transition:color var(--dur)}
#tabs a:hover{color:var(--ink)}
#tabs a[aria-current=page]{color:var(--ink)}
#tabs a[aria-current=page]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--fill)}
#tabs .ico{display:none;width:1.375rem;height:1.375rem}
#tabs .ico svg{width:100%;height:100%}
@media (max-width:759px){
  #tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;height:auto;gap:0;background:var(--bg);border-top:1px solid var(--line);
    padding:0 4px env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
  #tabs a{flex-direction:column;justify-content:center;gap:3px;height:var(--tabbar);font-size:0.75rem;min-width:0}
  #tabs a .lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  #tabs .ico{display:block}
  #tabs a[aria-current=page]::after{top:-1px;bottom:auto;left:26%;right:26%}
  #view{padding-bottom:calc(var(--tabbar) + 40px + env(safe-area-inset-bottom))}
  body.has-tray #view{padding-bottom:calc(var(--tabbar) + 120px + env(safe-area-inset-bottom))}
}
/* a signed-in header (logo + market + account) needs 404px: on the common 390px phone the account button was half off the screen. */
@media (max-width:419px){.topin{gap:10px}#brand .word{height:.875rem}}
@media (max-width:389px){#brand .word{display:none}}
@media (min-width:760px) and (max-width:1023px){#tabs{gap:18px}}
body.gate #tabs,body.gate #top,body.gate .tray{display:none!important}
/* my account, in the header */
.acct{position:relative;flex:none}
.acct:empty{display:none}
.acct-btn{width:36px;height:36px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0}
.acct-btn:hover,.acct-btn[aria-expanded=true]{border-color:var(--ink)}
.acct-btn:focus-visible{outline:2px solid var(--fill);outline-offset:2px}
.acct-btn .ico{width:1.125rem;height:1.125rem}
.acct-ini{font-size:0.8125rem;font-weight:700;letter-spacing:.02em}
.look-btn .ico{width:1.0625rem;height:1.0625rem}
@media (max-width:479px){.topin{gap:8px}.acct-btn{width:34px;height:34px}}
.acct-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;width:260px;max-width:calc(100vw - 32px);background:var(--bg);border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--lift);padding:6px}
.acct-who{display:grid;gap:2px;padding:10px 10px 12px;border-bottom:1px solid var(--line);margin-bottom:4px}
.acct-who b{font-size:0.9375rem}.acct-who span{font-size:0.8125rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.acct-opt{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:6px 10px;border:0;border-radius:10px;background:transparent;color:var(--ink);text-align:left;font:inherit;font-size:0.9375rem;cursor:pointer}
.acct-opt:hover,.acct-opt:focus-visible{background:var(--surface);outline:none}
.acct-opt .ico{width:1.125rem;height:1.125rem;color:var(--muted)}
.acct-opt.out{color:var(--down)}.acct-opt.out .ico{color:var(--down)}
.acct-sep{height:1px;background:var(--line);margin:4px 6px}
@media (max-width:759px){.acct{margin-left:auto}}
/* the My account page */
.acc{display:grid;gap:18px;max-width:760px;padding-bottom:12px}
.acc-sec .setrow{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.acc-sec .setrow .k{color:var(--muted);font-size:0.9375rem}
.acc-v{min-width:0;overflow-wrap:anywhere}
@media (max-width:559px){.acc-sec .setrow{grid-template-columns:minmax(0,1fr)}}


/* the market picker */
.mkt{position:relative;flex:none}
.mkt-btn{display:flex;align-items:center;gap:8px;height:36px;padding:0 10px 0 5px;border:1px solid var(--line);border-radius:999px;
  background:var(--bg);color:var(--ink);font-size:0.875rem;font-weight:500;white-space:nowrap;min-height:36px}
.mkt-btn:hover{border-color:var(--muted)}
.mkt-code{display:inline-grid;place-items:center;min-width:1.75rem;height:1.5rem;padding:0 5px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:0.6875rem;font-weight:650;letter-spacing:.04em}
.mkt-btn .mk-k{color:var(--muted);font-weight:400}
.mkt-btn .ico{width:0.875rem;height:0.875rem;color:var(--muted);transition:transform var(--dur)}
.mkt-btn[aria-expanded=true] .ico{transform:rotate(180deg)}
.mkt-menu{position:absolute;top:calc(100% + 8px);left:0;z-index:60;width:340px;max-width:calc(100vw - 32px);max-height:min(70vh,560px);overflow-y:auto;
  background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--lift);padding:8px}
.mkt-h{padding:8px 10px 6px;font-size:0.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mkt-opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:48px;padding:6px 10px;border:0;border-radius:10px;background:transparent;color:var(--ink);text-align:left}
.mkt-opt:hover:not(:disabled){background:var(--surface)}
.mkt-opt:disabled{cursor:default;color:var(--muted)}
.mkt-opt:disabled .mkt-code{background:var(--surface2);color:var(--muted)}
.mo-n{display:flex;flex-direction:column;gap:1px;min-width:0}
.mo-n b{font-weight:600;font-size:0.9375rem}
.mo-n small{font-size:0.8125rem;color:var(--muted)}
.mo-s{font-size:0.75rem;color:var(--muted);white-space:nowrap}
.mkt-opt[aria-checked=true] .mo-s{color:var(--accent);font-weight:600}
.mkt-note{padding:10px 10px 4px;font-size:0.75rem;line-height:1.45;color:var(--muted);border-top:1px solid var(--line);margin-top:6px}
@media (max-width:759px){
  .mkt{margin-left:auto}
  .mkt-btn .mk-c,.mkt-btn .mk-dot{display:none}
  .mkt-btn .mk-k{color:var(--ink);font-weight:500}
  .mkt-menu{left:auto;right:0}
}
@media (min-width:760px) and (max-width:1023px){.mkt-btn .mk-k,.mkt-btn .mk-dot{display:none}}

/* ---- buttons and switches ------------------------------------------------ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;
  border:1px solid var(--line);background:var(--bg);color:var(--ink);font-weight:500;font-size:0.9375rem;white-space:nowrap;
  text-decoration:none;transition:background var(--dur),border-color var(--dur),color var(--dur)}
.btn .ico{width:1.125rem;height:1.125rem}
.btn:hover{border-color:var(--ink)}
.btn.ink{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn.ink:hover{opacity:.88}
.btn.pri{background:var(--fill);border-color:var(--fill);color:var(--on-fill)}
.btn.pri:hover{opacity:.9}
.btn[aria-pressed=true]{background:var(--surface);border-color:var(--ink)}
.btn.pri[aria-pressed=true]{background:var(--fill);border-color:var(--fill)}
.btn.grow{flex:1}
.btn.sm{min-height:36px;padding:0 14px;font-size:0.8125rem}
.btn.wide{width:100%}
@media (max-width:759px){.btn.sm{min-height:44px}}
.btn:disabled{opacity:.45;cursor:not-allowed}
.linkbtn{border:0;background:transparent;padding:0;min-height:32px;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);
  text-underline-offset:4px;font-weight:500;font-size:0.8125rem}
.linkbtn:hover{text-decoration-color:currentColor}
.seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:22px;padding:3px;gap:2px;max-width:100%}
.seg button{border:0;background:transparent;border-radius:999px;min-height:36px;padding:0 14px;font-size:0.8125rem;font-weight:500;color:var(--muted);
  white-space:nowrap;transition:background var(--dur),color var(--dur)}
.seg button:hover:not(:disabled):not([aria-pressed=true]){color:var(--ink)}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--bg)}
.seg button:disabled{opacity:.45;cursor:not-allowed}
@media (max-width:759px){.seg button{min-height:40px;padding:0 12px}}
.perw{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.perl{font-size:0.8125rem;color:var(--muted)}
.ttabs{display:flex;flex-wrap:nowrap;gap:28px;overflow-x:auto;scrollbar-width:none;padding-inline:2px;min-width:0;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
@media (min-width:1200px){.ttabs{-webkit-mask-image:none;mask-image:none}}
.ttabs::-webkit-scrollbar{display:none}
.ttabs button{position:relative;flex:none;border:0;background:transparent;min-height:50px;padding:0;font-size:0.9375rem;font-weight:500;color:var(--muted);white-space:nowrap}
.ttabs button+button::before{content:"·";position:absolute;left:-16px;color:var(--muted);opacity:.6;pointer-events:none}
.ttabs button:hover{color:var(--ink)}
.ttabs button[aria-pressed=true]{color:var(--ink)}
.ttabs button[aria-pressed=true]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--fill)}
@media (max-width:759px){.ttabs{gap:24px}.ttabs button+button::before{left:-14px}}

/* ---- numbers ------------------------------------------------------------ */
.num{white-space:nowrap;font-weight:600}
.num.up{color:var(--up)}.num.down{color:var(--down)}.num.none{color:var(--faint);font-weight:400}
.num .arrow{font-size:.7em;margin-right:3px;vertical-align:1px}
.pair{display:flex;flex-direction:column;gap:1px}
.pair .lbl{display:block;font-size:0.75rem;color:var(--muted);font-weight:400}
.period{font-size:0.8125rem;color:var(--ink2);margin:6px 0}
.sim{font-size:0.8125rem;line-height:1.5;color:var(--muted);margin:10px 0 0}
.foot-note.analysis{display:flex;gap:8px;align-items:flex-start;font-size:0.8125rem;line-height:1.55;color:var(--ink2);
  border-top:1px solid var(--line);margin:48px 0 0;padding-top:20px;max-width:none}
.foot-note.analysis .ico{width:1rem;height:1rem;color:var(--muted);margin-top:2px}
.tested{display:inline-flex;align-items:center;white-space:nowrap;font-size:0.8125rem;color:var(--ink2)}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:0.8125rem;border:1px solid var(--line);color:var(--ink2);background:var(--bg)}
.pill.accent{border-color:var(--accent);color:var(--accent)}
.tipwrap{display:inline}
.tip{appearance:none;border:0;background:none;padding:0 0 0 4px;margin:0;color:var(--muted);line-height:1;vertical-align:-2px;min-height:0}
.tip .ico{width:0.9375rem;height:0.9375rem}
.tip[aria-expanded=true]{color:var(--ink)}
/* the bubble itself: on top of the page, never inside it */
.tip-pop{position:fixed;z-index:300;background:var(--ink);color:var(--bg);border-radius:12px;padding:12px 36px 12px 14px;
  box-shadow:0 12px 32px rgba(0,0,0,.22);font-size:0.8125rem;font-weight:400;line-height:1.5;text-transform:none;letter-spacing:0;text-align:left;white-space:normal}
.tip-pop p{margin:0;color:var(--bg);max-width:none}
.tip-pop::before{content:"";position:absolute;top:-6px;left:calc(var(--ax,50%) - 6px);width:12px;height:12px;background:var(--ink);transform:rotate(45deg);border-radius:2px}
.tip-pop.above::before{top:auto;bottom:-6px}
.tip-x{position:absolute;top:6px;right:6px;appearance:none;border:0;background:none;color:var(--bg);opacity:.75;padding:4px;min-height:0;line-height:0;cursor:pointer}
.tip-x:hover{opacity:1}.tip-x .ico{width:0.875rem;height:0.875rem}
@media (prefers-reduced-motion:no-preference){.tip-pop{animation:tipIn .12s ease-out}}
@keyframes tipIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.chip{display:flex;gap:10px;align-items:flex-start}
.chipbody{display:flex;flex-direction:column}
.chiplbl{font-size:0.8125rem;color:var(--muted)}
.chipval{font-size:1.125rem;font-weight:600}

/* ---- empty, waiting, notices -------------------------------------------- */
.empty{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:40px 0;border-top:1px solid var(--line)}
.empty h2{font-size:1.5rem;letter-spacing:-.02em}
.empty p{color:var(--muted);max-width:56ch}
.empty .row{display:flex;gap:8px;flex-wrap:wrap}
.loading{display:flex;flex-direction:column;align-items:center;gap:12px;padding:80px 0;color:var(--muted);font-size:0.9375rem}
.loading .bars{position:relative;display:inline-block;height:28px;width:25px;color:var(--ink)}
.loading .bars i{position:absolute;display:block;width:25.6%;height:50%;background:currentColor;animation:rise 1s ease-in-out infinite}
.loading .bars i:nth-child(1){left:0;bottom:0}
.loading .bars i:nth-child(2){left:36.8%;bottom:25%;animation-delay:.15s}
.loading .bars i:nth-child(3){left:73.6%;bottom:50%;animation-delay:.3s}
@keyframes rise{0%,100%{opacity:.3}50%{opacity:1}}
.loading-line{padding:24px 0;color:var(--muted)}
/* the first frame: the screen's shape while its figures arrive (app.js, skeleton) */
.sk{display:flex;flex-direction:column;min-width:0}
.skb{display:block;height:12px;border-radius:6px;background:var(--surface2,var(--line));max-width:100%}
.skb.t{height:20px;border-radius:8px}
.sk .eyebrow .skb{height:11px}
.sk-amt{height:56px;width:100%;border-radius:10px}
.sk-chips{display:flex;gap:8px;flex-wrap:wrap}.sk-chips .skb{height:32px;border-radius:999px}
.sk-tabs{display:flex;gap:10px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sk-tabs .skb{height:30px;border-radius:999px}
.sk-say{margin:18px 0 0;font-size:0.875rem;color:var(--muted)}
.sk-head{display:flex;flex-direction:column;gap:12px;padding:40px 0 8px}
.sk-card{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;padding:36px 0;border-bottom:1px solid var(--line)}
@media (min-width:760px){.sk-card{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center}}
.sk-l{display:flex;flex-direction:column;gap:12px;min-width:0}
.sk-chart{height:88px;width:100%;border-radius:10px}
.sk .skb{position:relative;overflow:hidden}
.sk .skb::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--bg) 55%,transparent),transparent);
  animation:skshine 1.4s ease-in-out infinite}
@keyframes skshine{to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.sk .skb::after{animation:none;display:none}}
.notice{padding:14px 16px;border-radius:12px;background:var(--surface);margin:24px 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.notice.bad b{color:var(--down)}
.calm{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border-radius:12px;padding:14px 16px;margin:4px 0}
.calm>.ico{width:1.25rem;height:1.25rem;color:var(--muted);margin-top:2px}
.calm b{display:block;font-weight:600}
.calm span{display:block;font-size:0.8125rem;color:var(--ink2)}
.calm.good>.ico{color:var(--up)}
.calm.warn>.ico{color:var(--warn)}
.toast{position:fixed;left:50%;top:calc(72px + env(safe-area-inset-top));transform:translate(-50%,-8px);opacity:0;pointer-events:none;
  transition:opacity var(--dur),transform var(--dur);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;
  font-weight:500;font-size:0.8125rem;z-index:95;max-width:calc(100% - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ---- Models: the top ------------------------------------------------------ */
.dtop{display:grid;gap:32px;padding:48px 0 40px}
@media (min-width:1024px){.dtop{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:end}.dtop .intro{grid-column:1/7}.dtop .amt{grid-column:7/13}}
@media (max-width:759px){.dtop{padding:28px 0 28px;gap:28px}}
.intro{display:flex;flex-direction:column;gap:14px}
.amt{display:flex;flex-direction:column;gap:12px;min-width:0}
.amt>label{font-size:1.125rem;color:var(--muted)}
.amt-field{display:flex;align-items:baseline;gap:8px;border-bottom:2px solid var(--ink);transition:border-color var(--dur);min-width:0}
.amt-field:focus-within{border-color:var(--fill)}
.amt-field .cur{font-size:clamp(1.5rem,1rem + 2vw,2.5rem);font-weight:300;color:var(--muted)}
.amt-field input{font-size:clamp(2.25rem,1.4rem + 3.6vw,4rem);line-height:1.12;font-weight:650;letter-spacing:-.04em;width:100%;min-width:0;
  border:0;background:transparent;padding:0 0 4px;font-variant-numeric:tabular-nums;color:var(--ink)}
.amt-field input:focus{outline:none}
.chips{display:flex;flex-wrap:wrap;gap:8px}
button.chip{border:1px solid var(--line);background:var(--bg);border-radius:999px;min-height:44px;padding:0 16px;font-size:0.9375rem;font-weight:500;
  display:inline-flex;align-items:center;transition:background var(--dur),color var(--dur),border-color var(--dur)}
button.chip:hover{border-color:var(--ink)}
button.chip[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
@media (max-width:759px){button.chip{padding:0 12px}}
.fits{font-size:0.9375rem;color:var(--ink)}
/* the amount, tucked away: one button beside the headline, the calculator in a panel */
.dtop-slim{padding:40px 0 28px}
@media (min-width:1024px){.dtop-slim .intro{grid-column:1/9}.dtop-slim .amt-pill{grid-column:9/13;justify-self:end;align-self:end}}
.amt-pill{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);
  border-radius:16px;padding:12px 16px;text-align:left;cursor:pointer;justify-self:start;max-width:100%}
.amt-pill:hover{border-color:var(--ink)}
.amt-pill:focus-visible{outline:2px solid var(--fill);outline-offset:2px}
.amt-k{flex-basis:100%;font-size:0.75rem;color:var(--muted);letter-spacing:.02em}
.amt-v{font-size:1.375rem;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.amt-ch{font-size:0.875rem;font-weight:600;color:var(--accent)}
.amt-sheet .amt-title{font-size:1.5rem;letter-spacing:-.02em;margin:0;padding-right:48px}
.amt-sheet .amt-field input{font-size:clamp(2rem,1.4rem + 2.4vw,2.75rem)}
.amt-done{align-self:stretch;min-height:48px}
@media (min-width:760px){.sheet.amt-sheet{width:min(480px,100%)}}
@media (max-width:759px){.sheet.amt-sheet{inset:auto 0 0 0;max-height:88vh;border-radius:20px 20px 0 0}}
.lhead+.mkline{border-top:0;padding-top:8px}
.amt-r{flex-basis:100%;font-size:0.75rem;color:var(--accent);font-weight:600}
.amt-r:empty{display:none}
.budget{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:6px 0 0;font-size:0.875rem;color:var(--ink2)}
.budget .ico{width:1rem;height:1rem;color:var(--muted)}
/* the two-handle range */
.rng{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:20px}
.rng-h{font-size:1.0625rem;margin:0}
.rng-track{position:relative;height:28px}
.rng-bg,.rng-fill{position:absolute;top:12px;height:4px;border-radius:2px}
.rng-bg{left:0;right:0;background:var(--surface2)}
.rng-fill{background:var(--fill)}
.rng-track input[type=range]{position:absolute;inset:0;width:100%;margin:0;background:transparent;pointer-events:none;-webkit-appearance:none;appearance:none;height:28px}
.rng-track input[type=range]::-webkit-slider-runnable-track{background:transparent;height:28px}
.rng-track input[type=range]::-moz-range-track{background:transparent}
.rng-track input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:24px;height:24px;margin-top:2px;border-radius:50%;background:var(--bg);border:2px solid var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:pointer}
.rng-track input[type=range]::-moz-range-thumb{pointer-events:auto;width:22px;height:22px;border-radius:50%;background:var(--bg);border:2px solid var(--ink);cursor:pointer}
.rng-track input[type=range]:focus-visible::-webkit-slider-thumb{outline:3px solid var(--fill);outline-offset:1px}
.rng-ends{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--muted)}
.rng-say{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.rng .linkbtn{justify-self:start}

/* the Today part: what it shows, and when the next change is due */
.today-what{border-top:1px solid var(--line);margin-top:8px;padding-top:16px;display:grid;gap:6px;max-width:68ch}
.today-what h4{margin:6px 0 0;font-size:0.9375rem}
.today-what p{margin:0;color:var(--ink2);line-height:1.5;font-size:0.9375rem}
.mkline{display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline;font-size:0.8125rem;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}
.mkline b{color:var(--ink);font-weight:600}
.mkline span{flex-basis:100%}

/* held by the most models */
.popular{display:grid;gap:16px;padding:32px 0 40px;border-top:1px solid var(--line)}
.pop-head{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
.pop-head h2{font-size:1.5rem;letter-spacing:-.02em}
.pop-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.prow{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 0;border-bottom:1px solid var(--line)}
@media (min-width:760px){.prow{grid-template-columns:minmax(180px,260px) minmax(0,1fr) 190px;gap:20px;align-items:center}}
.pn{display:flex;align-items:baseline;gap:8px;min-width:0}
.pn b{font-weight:600;font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.code{font-size:0.8125rem;color:var(--muted);white-space:nowrap}
.prow .pbar{position:relative;height:10px;border-radius:999px;background:var(--surface2);overflow:hidden}
.prow .pbar i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--fill)}
.pv{font-size:0.8125rem;color:var(--ink2);white-space:nowrap}
@media (min-width:760px){.pv{text-align:right}}

/* the Held by most models tab (web/client/pages/held.js) */
/* ---- held by the most models (held.js): a few calm pictures ---------------- */
.hx{display:grid;gap:24px;padding:8px 0 40px}
.hx-held-body{display:grid;gap:36px}
.hx-hh{font-size:1.125rem;letter-spacing:-.015em;margin:0 0 12px}
.hx-hsum{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;font-size:0.9375rem;color:var(--muted)}
.hx-hsum b{color:var(--ink);font-size:1.25rem;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-right:2px}
.hx-hlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.hx-hrow{border-bottom:1px solid var(--line)}
.hx-hrow-b{display:grid;grid-template-columns:24px minmax(0,1fr) 18px;grid-template-areas:"n name chev" "n bar chev" "n tr chev";
  gap:6px 12px;align-items:center;width:100%;border:0;background:transparent;color:var(--ink);text-align:left;padding:14px 4px;cursor:pointer;font:inherit}
.hx-hrow-b:hover{background:var(--surface)}
.hx-hrow-b:focus-visible{outline:2px solid var(--fill);outline-offset:-2px}
.hx-hn{grid-area:n;font-size:0.875rem;font-weight:650;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.hx-hrow .pn{grid-area:name;display:flex;flex-direction:column;gap:1px;min-width:0}
.hx-hrow .pn b{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hx-hrow .code{font-size:0.8125rem;color:var(--muted)}
.hx-hbarw{grid-area:bar;display:flex;align-items:center;gap:12px;min-width:0}
.hx-hbarw .pbar{position:relative;flex:1 1 auto;height:12px;border-radius:6px;background:var(--surface2);overflow:hidden}
.hx-hbarw .pbar i{position:absolute;left:0;top:0;bottom:0;border-radius:6px;background:var(--fill)}
.hx-hbarw .pv{flex:none;font-size:0.8125rem;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.hx-hbarw .pv b{color:var(--ink);font-size:0.9375rem}
.hx-htr{grid-area:tr;display:flex;align-items:center;gap:8px}
.hx-chev{grid-area:chev;width:16px;height:16px;color:var(--muted);transform:rotate(-90deg)}
@media (min-width:900px){
  .hx-hrow-b{grid-template-columns:24px minmax(180px,260px) minmax(0,1fr) 150px 18px;grid-template-areas:"n name bar tr chev";padding:12px 4px}
}
.hx-hsl svg{display:block}
.hx-hsl-l{fill:none;stroke:var(--line-a);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.hx-hsl-d{fill:var(--line-a)}
.hx-hdr{display:inline-flex;align-items:center;gap:3px;font-size:0.75rem;font-weight:600;color:var(--muted)}
.hx-hdr .ico{width:13px;height:13px}
.hx-hdr.up{color:var(--up)}.hx-hdr.up .ico{transform:rotate(-45deg)}
.hx-hdr.dn{color:var(--down)}.hx-hdr.dn .ico{transform:rotate(45deg)}
.hx-rank>.note{margin-top:10px}
.hx-hgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
@media (min-width:640px){.hx-hgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.hx-hgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hx-hcard{border:1px solid var(--line);border-radius:16px;padding:14px 14px 8px;display:grid;gap:6px;min-width:0;overflow:hidden;transition:border-color var(--dur)}
.hx-hcard:hover{border-color:var(--mk)}
.hx-hc-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;min-width:0}
.hx-hc-head>div{display:grid;gap:1px;min-width:0}
.hx-hc-head b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hx-hc-head .code{font-size:0.75rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hx-hc-v{display:grid;justify-items:end;gap:4px;white-space:nowrap}
.hx-hc-v b{font-size:0.9375rem;font-variant-numeric:tabular-nums}
.hx-pill{font-size:0.75rem;font-weight:600;border-radius:999px;padding:2px 8px;background:var(--surface);color:var(--muted)}
.hx-pill.up{color:var(--up)}.hx-pill.dn{color:var(--down)}
.hx-hc-open{display:block;width:100%;min-width:0;overflow:hidden;border:0;background:transparent;padding:0;cursor:pointer}
.hx-hc-chart{min-width:0;overflow:hidden}
.hx-two{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
@media (min-width:900px){.hx-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}}
.hx-panel{min-width:0}
.hx-sbar{display:flex;gap:2px;height:22px;border-radius:8px;overflow:hidden}
.hx-sbar i{display:block;min-width:4px;background:var(--fill)}
.hx-slegend{list-style:none;margin:14px 0 8px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}
.hx-slegend li{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:8px;align-items:center;font-size:0.875rem}
.hx-slegend li i{width:10px;height:10px;border-radius:3px;background:var(--fill)}
.hx-slegend li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hx-slegend li b{font-variant-numeric:tabular-nums;font-weight:600}
.hx-hmoves{display:grid;gap:16px}
.hx-hmv h4{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:0.9375rem}
.hx-hmv h4 .ico{width:14px;height:14px}
.hx-hmv.up h4{color:var(--up)}.hx-hmv.up h4 .ico{transform:rotate(-45deg)}
.hx-hmv.dn h4{color:var(--down)}.hx-hmv.dn h4 .ico{transform:rotate(45deg)}
.hx-hmv ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.hx-hmv li{display:flex;justify-content:space-between;gap:12px;font-size:0.9375rem;border-bottom:1px solid var(--line);padding-bottom:6px}
.hx-hmv li span{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.hx-hwhat{border-top:1px solid var(--line);padding-top:20px;display:grid;gap:10px;max-width:72ch}
.hx-hwhat h3{font-size:1.0625rem}
.hx-hwhat p{color:var(--ink2);line-height:1.55;margin:0}
.hx-hm-wrap{position:fixed;inset:0;z-index:85;display:flex;align-items:center;justify-content:center;padding:24px}
.hx-hm-scrim{position:absolute;inset:0;background:var(--scrim)}
.hx-hmodal{position:relative;width:min(880px,100%);max-height:100%;overflow-y:auto;overscroll-behavior:contain;background:var(--bg);
  border-radius:20px;padding:22px 24px 24px;display:grid;gap:18px;box-shadow:var(--lift);outline:none}
@media (max-width:640px){.hx-hm-wrap{padding:0;align-items:flex-end}.hx-hmodal{border-radius:20px 20px 0 0;max-height:92vh;padding:18px 16px 24px}}
.hx-hm-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.hx-hm-head h2{font-size:1.5rem;letter-spacing:-.02em}
.hx-hm-x{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;flex:none}
.hx-hm-x .ico{width:18px;height:18px}
.hx-hm-chart{display:grid;gap:12px;min-width:0}
.hx-hm-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;margin:0}
.hx-hm-facts div{border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.hx-hm-facts dt{font-size:0.75rem;color:var(--muted)}
.hx-hm-facts dd{margin:2px 0 0;font-weight:650;font-size:1.0625rem;font-variant-numeric:tabular-nums}
.hx-hm-facts .up{color:var(--up)}.hx-hm-facts .dn{color:var(--down)}
.hx-holders .hx-hh{margin-bottom:8px}
.hx-hgroups{display:grid;gap:6px}
.hx-hg{border:1px solid var(--line);border-radius:12px}
.hx-hg summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;list-style:none;font-size:0.9375rem}
.hx-hg summary::-webkit-details-marker{display:none}
.hx-hg summary b{font-variant-numeric:tabular-nums;min-width:28px;text-align:center;border-radius:999px;background:var(--surface);padding:2px 8px;font-size:0.8125rem}
.hx-hg[open] summary{border-bottom:1px solid var(--line)}
.hx-hg-list{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px}
.hx-hchip{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;min-height:32px;padding:0 12px;font-size:0.8125rem;cursor:pointer;text-align:left}
.hx-hchip:hover,.hx-hchip:focus-visible{border-color:var(--ink)}
.hx-hnone{margin:0}

/* the list tools */
.shelfbar{position:sticky;top:var(--hh);z-index:20;background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 24px}
.shelfbar .ttabs{flex:1 1 auto}
.shelfbar .perw{padding:6px 0}
@media (max-width:1023px){.shelfbar .ttabs{flex-basis:100%}.shelfbar .perw{flex-basis:100%;border-top:1px solid var(--line)}}
@media (max-width:759px){.shelfbar .perl{display:none}}
.lnote{padding:16px 0 0}
.lhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;padding:32px 0 0}
.lhead h2{font-size:1.5rem;letter-spacing:-.02em}
.pline{flex-basis:100%;font-size:0.8125rem;color:var(--ink)}
.pshort{flex-basis:100%;display:flex;gap:6px;align-items:flex-start;color:var(--ink2)}
.nothing{padding:32px 0}

/* ---- one model, one row ---------------------------------------------------- */
.mc{display:grid;gap:24px;padding:48px 0;border-bottom:1px solid var(--line);min-width:0}
.mc:last-child{border-bottom:0}
@media (min-width:1024px){
  .mc{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;row-gap:28px;grid-template-rows:auto auto 1fr;padding:64px 0}
  .mc-head{grid-column:1/5;grid-row:1}
  .facts{grid-column:1/5;grid-row:2}
  .mc-data{grid-column:5/13;grid-row:1/4;align-self:start}
}
@media (max-width:1023px){.mc>.mc-head{order:1}.mc>.mc-data{order:2}.mc>.facts{order:3}}
@media (max-width:759px){.mc{padding:40px 0;gap:26px}}
.mc-head{display:flex;flex-direction:column;gap:10px;min-width:0}
.mhd{margin:0}
.mname{display:inline;font-size:clamp(2rem,1.4rem + 2.2vw,2.5rem);line-height:1.06;letter-spacing:-.035em;font-weight:700;overflow-wrap:anywhere}
.mname .cty{font-weight:300;color:var(--muted)}
.mname .sep{font-weight:300;color:var(--muted);padding:0 .08em}
.nmb{all:unset;cursor:pointer;background-image:linear-gradient(currentColor,currentColor);background-size:0 2px;background-repeat:no-repeat;
  background-position:0 100%;transition:background-size var(--dur) var(--ease)}
.nmb:hover{background-size:100% 2px}
.nmb:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.mline{font-size:0.9375rem;color:var(--muted);max-width:44ch}
.labels{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.label{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 10px;border-radius:999px;border:1px solid var(--line);
  background:transparent;color:var(--ink2);font-size:0.6875rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.label .ico{width:0.8125rem;height:0.8125rem}
.label.sig{border-color:var(--ink2);color:var(--ink)}
.label.sig .star{color:var(--accent)}
button.label{cursor:help}
button.label:hover{border-color:var(--ink2)}
.label.preview{border-style:dashed;color:var(--warn);border-color:var(--warn)}
.labelnote{flex-basis:100%;font-size:0.8125rem;color:var(--ink2);background:var(--surface);border-radius:10px;padding:10px 12px;line-height:1.45}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;margin:0}
@media (min-width:760px) and (max-width:1023px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.facts>div{border-top:1px solid var(--line);padding:12px 0;min-width:0}
.facts dt{font-size:0.8125rem;color:var(--muted)}
.facts dd{margin:2px 0 0;font-size:1.125rem;font-weight:600;letter-spacing:-.01em}
.facts dd small{display:block;font-size:0.8125rem;font-weight:400;color:var(--muted);letter-spacing:0}
.mc-acts{display:flex;gap:8px;flex-wrap:wrap}
.mc-data{display:flex;flex-direction:column;gap:16px;min-width:0}
.figs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;row-gap:20px}
@media (max-width:559px){.figs{grid-template-columns:minmax(0,1fr)}}
.fig{display:flex;flex-direction:column;gap:4px;min-width:0;container-type:inline-size}
.fk{font-size:1.125rem;color:var(--muted)}
.fv{font-size:clamp(2rem,13.5cqi,4rem);line-height:1;font-weight:650;letter-spacing:-.045em;overflow-wrap:anywhere;color:var(--ink);text-align:left}
button.fv{all:unset;cursor:pointer;font-size:clamp(2rem,13.5cqi,4rem);line-height:1;font-weight:650;letter-spacing:-.045em;overflow-wrap:anywhere;color:var(--ink)}
button.fv:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
button.fv:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.fm{font-size:0.8125rem;color:var(--muted)}
.simline{max-width:none}
.mc.mini{padding:0;border:0;display:flex;flex-direction:column;gap:14px}
.mc.mini .mname{font-size:1.75rem}
.mc.mini .fv{font-size:clamp(1.5rem,11cqi,2.5rem)}

/* ---- charts ------------------------------------------------------------- */
.chart{position:relative;width:100%;min-width:0;touch-action:pan-y}
.chart.pick{cursor:pointer}
.chart svg{display:block;overflow:visible}
.chart.none{padding:32px 0;color:var(--muted);font-size:0.8125rem}
.chart.mini.none{padding:12px 0}
.chartsvg .grid{stroke:var(--grid);stroke-width:1}
.chartsvg .base{stroke:var(--line);stroke-width:1}
.chartsvg .ax{font-size:0.8125rem;fill:var(--muted)}
.chartsvg .ax.lbl{fill:var(--ink2);font-weight:500}
.chartsvg .val{font-size:0.6875rem;fill:var(--ink2)}
.chartsvg .area{opacity:.1}
.chartsvg .end{stroke:var(--bg);stroke-width:2}
.chartsvg .xline{stroke:var(--muted);stroke-width:1}
.chartsvg .xdot{stroke:var(--bg);stroke-width:2}
.chartsvg .dropbar{opacity:.55}
.tt{position:absolute;top:0;z-index:3;pointer-events:none;background:var(--bg);border:1px solid var(--line);box-shadow:var(--lift);border-radius:10px;
  padding:10px 12px;font-size:0.8125rem;min-width:170px}
.tt .m{font-weight:600;margin-bottom:4px}
.tt .l{display:flex;align-items:center;gap:12px;justify-content:space-between;white-space:nowrap}
.tt .l span{display:flex;align-items:center;gap:6px;color:var(--muted)}
.tt .l b{font-weight:600}
.sw{display:inline-block;width:16px;height:0;border-top:2px solid;flex:none;vertical-align:middle}
.sw.d{border-top-style:dashed;border-top-width:2px}
.legend{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:0.8125rem;color:var(--ink)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.chart.bars{overflow-x:auto;overscroll-behavior-x:contain}
/* candles: up days hollow, down days filled */
.candles .wick.up{stroke:var(--up)}.candles .wick.dn{stroke:var(--down)}
.candles .body.up{fill:var(--bg);stroke:var(--up);stroke-width:1.2}
.candles .body.dn{fill:var(--down);stroke:var(--down);stroke-width:1}
.candles .lvl.entry{stroke:var(--accent);stroke-width:1.4}
.candles .lvl.stop{stroke:var(--down);stroke-width:1.4;stroke-dasharray:5 4}
.candles .lvlbg{fill:var(--bg);stroke-width:1}
.candles .lvlbg.entry{stroke:var(--accent)}.candles .lvlbg.stop{stroke:var(--down)}
.candles .lvltx{font-size:0.75rem;font-weight:600}
.candles .lvltx.entry{fill:var(--accent)}.candles .lvltx.stop{fill:var(--down)}
.candles .entrymark{fill:var(--accent)}
.candles .lastbg{fill:var(--ink)}
.candles .lasttx{fill:var(--bg);font-size:0.75rem;font-weight:600}
.ckey .ck{display:inline-block;width:10px;height:14px;border-radius:2px}
.ckey .ck.up{border:1.5px solid var(--up)}
.ckey .ck.dn{background:var(--down)}
.ckey .lk{display:inline-block;width:18px;height:0;border-top:2px solid var(--accent)}
.ckey .lk.stop{border-top:2px dashed var(--down)}
/* the twelve-month strip */
.strip12 .cell{fill:var(--surface)}
.strip12 .rdot{fill:var(--fill);stroke:var(--bg);stroke-width:1.5}
.strip12 .stoptick{stroke:var(--down);stroke-width:3;stroke-linecap:round}
.dotkey{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--fill)}
.tickkey{display:inline-block;width:3px;height:14px;border-radius:2px;background:var(--down)}

/* ---- the model sheet ------------------------------------------------------ */
.sheet-wrap{position:fixed;inset:0;z-index:60}
.scrim{position:absolute;inset:0;background:var(--scrim);opacity:0;transition:opacity .2s}
.sheet-wrap.on .scrim{opacity:1}
.sheet{position:absolute;inset:0;background:var(--bg);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
  transform:translateY(24px);opacity:0;transition:transform .22s var(--ease),opacity .22s;outline:none}
.sheet-wrap.on .sheet{transform:none;opacity:1}
.sheet>*{flex-shrink:0}
.tour>*{flex-shrink:0}
@media (min-width:760px){.sheet{inset:0 0 0 auto;width:min(760px,100%);transform:translateX(32px);border-left:1px solid var(--line);box-shadow:var(--lift)}}
.sh-head{position:relative;padding:calc(28px + env(safe-area-inset-top)) 32px 16px;display:flex;flex-direction:column;gap:10px}
.sh-head .mname-h{padding-right:48px;margin:0}
.sh-head .mname{font-size:clamp(1.875rem,1.3rem + 2vw,2.5rem)}
.xbtn{position:absolute;top:calc(16px + env(safe-area-inset-top));right:16px;width:44px;height:44px;border-radius:999px;border:1px solid var(--line);
  background:var(--bg);display:grid;place-items:center;color:var(--ink)}
.xbtn:hover{border-color:var(--ink)}
.xbtn .ico{width:1.25rem;height:1.25rem}
.sh-nav{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding:10px 32px;overflow-x:auto;scrollbar-width:thin}
.sh-nav .seg{flex-wrap:nowrap}
/* on the smallest phones the five parts wrap onto two lines rather than hide "Today" off-screen */
@media (max-width:419px){.sh-nav .seg{flex-wrap:wrap;row-gap:4px}}
@media (max-width:759px){.sh-nav .seg button{padding:0 9px}}
.sh-body{padding:28px 32px 32px;display:flex;flex-direction:column;gap:28px;flex:1}
.sh-body .foot-note.analysis{margin-top:8px}
@media (max-width:759px){.sh-head{padding-inline:16px;padding-top:calc(20px + env(safe-area-inset-top))}.sh-nav{padding-inline:16px}.sh-body{padding:24px 16px 28px}}
.sh-actions{position:sticky;bottom:0;z-index:5;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 32px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);background:var(--bg)}
@media (max-width:759px){.sh-actions{padding-inline:16px}}
.said{flex-basis:100%;font-size:0.8125rem;color:var(--muted)}
.said:empty{display:none}
.said.bad{color:var(--down)}
.block{display:flex;flex-direction:column;gap:18px;min-width:0}
.ov-tools{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.sh-hero .figs{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:559px){.sh-hero .figs{grid-template-columns:minmax(0,1fr)}}
.sec-h{font-size:1.5rem;letter-spacing:-.02em}
h3.sec-h{margin-top:8px}
.sub2{font-size:1.125rem;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;margin:0}
@media (min-width:560px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
.stats>div{border-top:1px solid var(--line);padding:12px 0 14px;min-width:0}
.stats dt{font-size:0.8125rem;color:var(--muted)}
.stats dd{margin:2px 0 0;font-size:1.5rem;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.stats small{display:block;font-size:0.8125rem;color:var(--muted)}
.renews{display:flex;gap:8px;align-items:center;font-size:0.9375rem;color:var(--ink)}
.renews .ico{color:var(--muted)}
.stopbox{background:var(--surface);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.stopbox h3{display:flex;gap:8px;align-items:center;font-size:1.125rem}
.stopbox h3 .ico{color:var(--accent)}
.stopbox p{max-width:66ch}
.stopbox h4{margin:6px 0 0;font-size:1rem}
.stopbox p.example{border-left:3px solid var(--accent);padding-left:12px}
.fair{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--line);padding-top:20px}
.fair h3{font-size:1.125rem}
/* the numbers table */
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-top:1px solid var(--ink);overscroll-behavior-x:contain}
table{border-collapse:collapse;width:100%;font-size:0.875rem}
caption{text-align:left;font-size:0.8125rem;color:var(--muted);padding:10px 0}
.tblwrap caption{position:sticky;left:0}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-size:0.8125rem;font-weight:500;color:var(--muted);white-space:nowrap}
.ntable{min-width:640px}
.ntable th.grp{color:var(--ink);font-weight:600;border-bottom:1px solid var(--ink2);white-space:normal}
.ntable tbody th{font-weight:500;white-space:nowrap;position:sticky;left:0;background:var(--bg);z-index:1}
.ntable tbody th small{display:block;font-size:0.75rem;font-weight:400;color:var(--muted)}
.ntable td{white-space:nowrap}
/* each year */
.years{list-style:none;margin:0;padding:0}
.yrow{display:grid;grid-template-columns:3.6rem minmax(60px,1fr) 5.5rem;grid-template-areas:"y b v" "y d m";gap:2px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:0.875rem}
@media (min-width:560px){.yrow{grid-template-columns:3.6rem minmax(80px,1fr) 6rem 7rem 9rem;grid-template-areas:"y b v d m"}}
.yy{grid-area:y;font-weight:600}
.yy small{display:block;font-size:0.75rem;color:var(--muted);font-weight:400}
.ybar{grid-area:b;position:relative;display:block;height:8px;background:var(--surface);border-radius:999px}
.ybar i{position:absolute;top:0;bottom:0;background:var(--s1);border-radius:999px}
.ybar i.neg{background:var(--down)}
.yv{grid-area:v;text-align:right}
.yd{grid-area:d;color:var(--muted);font-size:0.8125rem}
.ym{grid-area:m;color:var(--muted);font-size:0.8125rem}
.yd b,.ym b{color:var(--ink2);font-weight:500}
@media (max-width:559px){.yd{grid-column:1/3;padding-left:calc(3.6rem + 12px)}.ym{text-align:right}}
/* the renewals timeline */
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.tl-item{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--line)}
.tl-date b{display:block;font-weight:600;font-size:0.9375rem}
.tl-date span{font-size:0.8125rem;color:var(--muted)}
.tl-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.tl-kind{font-size:0.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tl-item.stop .tl-kind{color:var(--down)}
.tl-row{display:grid;grid-template-columns:1.25rem minmax(0,1fr) auto;gap:4px 10px;align-items:baseline;font-size:0.9375rem}
.tl-row .sgn{font-weight:700;text-align:center}
.tl-row.in .sgn{color:var(--up)}.tl-row.out .sgn{color:var(--down)}
.tl-row .nm{min-width:0;overflow-wrap:anywhere}
.tl-row .px{color:var(--ink2);white-space:nowrap}
.tl-row .why{grid-column:2/-1;font-size:0.8125rem;color:var(--muted)}
.tl-row.out .why{color:var(--ink2)}
.history{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.history li{padding:10px 0;border-bottom:1px solid var(--line);font-size:0.9375rem}
.history .when{font-weight:600;font-size:0.8125rem;color:var(--muted)}
.history .add b{color:var(--up)}.history .drop b{color:var(--down)}
/* holdings */
.holdlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.holdlist>li{border-bottom:1px solid var(--line)}
.hrow{all:unset;box-sizing:border-box;cursor:pointer;display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr)) 1.25rem;gap:8px 16px;padding:14px 0;align-items:center}
.hrow:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hrow:hover .hn b{text-decoration:underline;text-underline-offset:3px}
.hn{grid-column:1/4;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;min-width:0}
.hn b{font-size:1.0625rem;font-weight:600;overflow-wrap:anywhere}
.hk{display:flex;flex-direction:column;font-size:0.9375rem;font-weight:500;min-width:0}
.hk small{font-size:0.75rem;font-weight:400;color:var(--muted)}
.hc{grid-column:1/3}
.hcv{display:flex;align-items:center;gap:8px}
.hrow .chev{grid-column:4;grid-row:1;width:1.125rem;height:1.125rem;color:var(--muted);transition:transform var(--dur)}
.hrow[aria-expanded=true] .chev{transform:rotate(180deg)}
@media (min-width:760px){
  .hrow{grid-template-columns:minmax(150px,1.6fr) repeat(3,minmax(0,1fr)) minmax(130px,1.3fr) minmax(0,.7fr) 1.25rem}
  .hn{grid-column:auto;flex-direction:column;gap:0}
  .hc{grid-column:auto}
  .hrow .chev{grid-column:auto;grid-row:auto}
}
.meter{position:relative;display:inline-block;width:56px;height:6px;border-radius:999px;background:var(--surface2);overflow:hidden;flex:none}
.meter i{position:absolute;left:0;top:0;bottom:0;background:var(--up);border-radius:999px}
.meter.near i{background:var(--down)}
.hpanel{padding:4px 0 20px}
.candlebox{display:flex;flex-direction:column;gap:12px}
/* today */
.today{display:flex;flex-direction:column;gap:14px}
.dateline{display:flex;flex-direction:column;gap:2px;font-size:0.8125rem;color:var(--muted)}
.dateline b{color:var(--ink);font-weight:500}
.chg{border-top:1px solid var(--ink)}
.crow{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
@media (min-width:640px){.crow{grid-template-columns:4.5rem minmax(140px,1fr) auto}}
.crow .co{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;min-width:0}
.crow .nm{font-weight:600;font-size:1.125rem;letter-spacing:-.01em;overflow-wrap:anywhere}
.crow .kvs{grid-column:2;display:flex;flex-wrap:wrap;gap:4px 20px;font-size:0.8125rem;color:var(--muted)}
@media (min-width:640px){.crow .kvs{grid-column:auto;justify-content:flex-end}}
.crow .kvs b{color:var(--ink);font-weight:500}
.io{display:inline-flex;align-items:center;gap:7px;font-size:0.8125rem;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.io::before{content:"";width:8px;height:8px;border-radius:2px;background:currentColor;flex:none}
.io.in{color:var(--up)}
.io.out{color:var(--down)}
.io.out::before{background:transparent;border:1.5px solid currentColor;width:7px;height:7px}
.inside{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:14px}
.inside h4{font-size:0.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
/* A pill is nowrap, and "6501.T · MITSUBISHI ELECTRIC CORP." is wider than a
   phone, so the page itself scrolled sideways. Here, and only here, a pill wraps. */
.holdings{display:flex;flex-wrap:wrap;gap:6px;max-width:100%}
.holdings .pill{max-width:100%;white-space:normal;overflow-wrap:anywhere}
details.howcalc{border-top:1px solid var(--line);padding-top:4px}
details.howcalc summary{cursor:pointer;font-weight:500;min-height:44px;display:flex;align-items:center;gap:8px;list-style:none}
details.howcalc summary::-webkit-details-marker{display:none}
details.howcalc summary .ico{color:var(--muted)}
details.howcalc p{margin:0 0 10px;color:var(--ink2);max-width:66ch}
/* the money it takes: the same quiet disclosure, with its own worked example and table */
details.moneybox{border-top:1px solid var(--line);padding-top:4px}
details.moneybox summary{cursor:pointer;font-weight:500;min-height:44px;display:flex;align-items:center;gap:8px;list-style:none}
details.moneybox summary::-webkit-details-marker{display:none}
details.moneybox summary .ico{color:var(--muted)}
details.moneybox h4{margin:14px 0 6px;font-size:1rem}
details.moneybox p{margin:0 0 10px;color:var(--ink2);max-width:66ch}
details.moneybox p.example{border-left:3px solid var(--accent);padding-left:12px;color:var(--ink)}
.captbl tr.ref th,.captbl tr.ref td{font-weight:600}

/* ---- the compare tray -------------------------------------------------- */
.tray{position:fixed;left:50%;bottom:24px;z-index:45;transform:translateX(-50%);background:var(--bg);border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--lift);padding:8px 8px 8px 16px;display:flex;align-items:center;gap:12px;max-width:calc(100% - 32px)}
@media (max-width:759px){.tray{bottom:calc(var(--tabbar) + 12px + env(safe-area-inset-bottom));left:12px;right:12px;transform:none;max-width:none;padding-left:8px;gap:8px}}
.tray .tl{font-size:0.8125rem;color:var(--muted);white-space:nowrap}
.slots{display:flex;gap:6px;min-width:0;flex:1}
.slot{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:0 10px 0 12px;
  min-height:44px;font-size:0.8125rem;font-weight:500;max-width:200px;min-width:0;color:var(--ink)}
button.slot:hover{border-color:var(--ink)}
.slot .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.slot .x{width:0.875rem;height:0.875rem;color:var(--muted)}
.slot.empty{width:44px;padding:0;border-style:dashed;flex:none}
.tray .btn{flex:none}
@media (max-width:759px){.tray .tl,.tray .slot.empty{display:none}.slot{padding:0 8px 0 10px;flex:1 1 0}.slot .sw{width:10px}.tray .btn{padding:0 14px}}
.tray.demo{position:static;transform:none;box-shadow:none;max-width:100%}
/* the smallest phones: the chosen models on their own line, each with its name */
@media (max-width:399px){.tray{flex-wrap:wrap}.slots{flex:1 1 100%;flex-wrap:wrap}.slot{flex:1 1 40%;max-width:none}.tray .btn{flex:1 1 100%}}

/* ---- Compare, Watchlist, Training, About: the tops ---------------------- */
.phead{display:flex;flex-direction:column;gap:12px;padding:48px 0 28px}
@media (max-width:759px){.phead{padding:28px 0 20px}}
.cmp{display:flex;flex-direction:column;gap:18px}
.tablewrap{overflow-x:auto;border-top:1px solid var(--ink);overscroll-behavior-x:contain}
table.ct{border-collapse:separate;border-spacing:0;width:100%;min-width:calc(150px + var(--ncol,3) * 180px);font-size:0.9375rem}
.ct th,.ct td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.ct tbody th{position:sticky;left:0;z-index:2;background:var(--bg);font-weight:400;color:var(--muted);font-size:0.8125rem;width:160px;min-width:140px;padding-left:0}
.ct thead th{font-weight:400;vertical-align:bottom}
.ct thead th.corner{position:sticky;left:0;z-index:3;background:var(--bg);padding-left:0}
.ct td.big{font-size:1.5rem;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.ct td.mkcell{color:var(--ink2)}
.ct td.mkcell.big{font-weight:500}
.ct caption{position:sticky;left:0}
.mh{display:flex;flex-direction:column;gap:6px;min-width:150px}
.mh .key{display:flex;align-items:center;gap:8px;font-size:0.8125rem;color:var(--muted)}
.mh .key .sw{width:24px;border-top-width:3px}
.mh .nm{all:unset;cursor:pointer}
.mh .nm .mname{font-size:1.125rem;letter-spacing:-.01em;line-height:1.2}
.mh .nm:hover .ttl{text-decoration:underline;text-underline-offset:3px}
.mh .nm:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mh .nm2{font-size:1.125rem;font-weight:600}
.mh .acts{display:flex;gap:6px}

/* watchlist */
.wsum{display:flex;flex-wrap:wrap;gap:6px 22px;padding:16px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);font-size:0.9375rem;color:var(--ink2)}
.wsum b{color:var(--ink);font-weight:650;font-size:1.125rem}
@media (min-width:760px){.wsum span+span::before{content:"·";margin-right:22px;margin-left:-14px;color:var(--muted)}}
.wgrid{display:grid;gap:0}
.wcard{display:flex;flex-direction:column;gap:20px;padding:28px 0;border-bottom:1px solid var(--line);min-width:0}
.whead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 16px;align-items:flex-start}
.wt{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1 1 260px}
.wname{margin:0}
.wname .mname{font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem)}
.status{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line);font-size:0.8125rem;font-weight:500;color:var(--ink2);white-space:nowrap}
.status.on{background:var(--fill);border-color:var(--fill);color:var(--on-fill)}
.status.late{border-color:var(--warn);color:var(--warn)}
.wbody{display:grid;gap:22px}
@media (min-width:900px){.wbody{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:32px}}
.wchart{display:flex;flex-direction:column;gap:8px;min-width:0}
.wfig{display:flex;flex-wrap:wrap;gap:2px 14px;font-size:0.8125rem;color:var(--muted)}
.wfig b{color:var(--ink);font-weight:600;font-size:0.9375rem}
.wfig .mk{flex-basis:100%}
.wcol{display:flex;flex-direction:column;gap:10px;min-width:0}
.wcol h4,.wtoday h4{font-size:0.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.shares{display:flex;flex-direction:column;gap:8px}
.sharebar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:var(--surface2);gap:2px}
.sharebar i{display:block;height:100%;background:var(--fill)}
.sharebar i.cash{background:var(--surface2)}
.sharenames{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:0.8125rem;color:var(--muted)}
.sharenames b{color:var(--ink);font-weight:500}
.cushions{display:flex;flex-direction:column;gap:8px}
.cdots{position:relative;height:30px;margin:0 6px;border-bottom:1px solid var(--line)}
.cdots::before{content:"";position:absolute;left:0;top:4px;bottom:0;border-left:2px dashed var(--down)}
.cdots i{position:absolute;top:10px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--mk);opacity:.7}
.cdots i.near{background:var(--ink);opacity:1}
.cdots .axis0,.cdots .axis1{position:absolute;bottom:-18px;font-size:0.6875rem;color:var(--muted)}
.cdots .axis0{left:-4px}.cdots .axis1{right:-4px}
.cnames{display:flex;flex-direction:column;gap:2px;font-size:0.8125rem;color:var(--muted);margin-top:14px}
.cnames b{color:var(--ink);font-weight:500}
.wtoday{display:flex;flex-direction:column;gap:8px}
.iochips{display:flex;flex-wrap:wrap;gap:6px}
.iochip{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);font-size:0.875rem;max-width:100%;overflow-wrap:anywhere}
.wacts{display:flex;gap:8px;flex-wrap:wrap}
.wcard.gone p{color:var(--ink2)}
.wcard.mini{padding:0;border:0;gap:14px}
.wcard.mini .wbody{grid-template-columns:minmax(0,1fr)}
/* ---- the watchlist's four views (watchlist.js, 27 September 2026) ------------ */
.wv-glance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 18px}
@media (min-width:900px){.wv-glance{grid-template-columns:repeat(4,minmax(0,1fr))}}
.wv-glance>div{border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:grid;gap:2px;min-width:0}
.wv-glance b{font-size:1.375rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.wv-glance span{font-size:0.8125rem;color:var(--muted);overflow-wrap:anywhere}
.wv-glance .act{border-color:color-mix(in srgb,var(--warn) 45%,var(--line));background:color-mix(in srgb,var(--warn) 7%,var(--bg))}
.wv-glance .act b{color:var(--warn)}
.wv-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 20px;padding:12px 0;border-top:1px solid var(--ink)}
.wv-count{margin:0;font-weight:600}
.wv-switch{display:flex;align-items:center;gap:10px;max-width:100%;overflow-x:auto}
.wv-switch .seg{flex:none}
.wv-list{display:grid}
.wv-list>.wcard{border-bottom:1px solid var(--line)}
.wv{gap:16px}
.wv-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px 24px;flex-wrap:wrap}
.wv-head .wt{min-width:0;flex:1 1 360px}
.wv-meta{margin:4px 0 0;color:var(--muted);font-size:0.875rem}
.wv-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
@media (max-width:759px){.wv-side{align-items:flex-start}}
.wv h4{margin:0 0 10px;font:600 0.6875rem/1.3 var(--f);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.wv .mu{color:var(--muted)}
.wv-drop{color:var(--down);font-size:0.75rem;white-space:nowrap}
/* summary: three panels */
.wv-3{display:grid;grid-template-columns:minmax(0,1fr);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.wv-3>section{padding:16px 18px;min-width:0}
.wv-3>section+section{border-top:1px solid var(--line)}
@media (min-width:1024px){.wv-3{grid-template-columns:1.1fr 1fr 1fr}.wv-3>section+section{border-top:0;border-left:1px solid var(--line)}}
.wv-key{display:flex;align-items:center;gap:6px;margin:-4px 0 10px;font-size:0.75rem;color:var(--muted)}
.wv-key i{display:inline-block;width:10px;height:10px;border-radius:3px}.wv-key i+*{margin-right:6px}
.wv-key i.me,.wv-bars i.me{background:var(--fill)}.wv-key i.ix,.wv-bars i.ix{background:var(--mk);opacity:.55}
.wv-bars i.neg.me{background:var(--down);opacity:.75}
.wv-rows{display:grid;gap:8px;margin-bottom:12px}
.wv-row{display:grid;grid-template-columns:72px minmax(0,1fr) 92px;gap:10px;align-items:center;font-size:0.8125rem}
.wv-row .v{display:grid;justify-items:end;gap:1px}
.wv-bars{display:grid;gap:3px;min-width:0}.wv-bars i{display:block;height:7px;border-radius:4px}
.wv-hold{list-style:none;margin:0;padding:0}
.wv-hold li{display:grid;grid-template-columns:minmax(0,1fr) 56px 58px;gap:8px;align-items:center;padding:6px 0;border-top:1px solid var(--line);font-size:0.875rem}
.wv-hold li .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wv-hold li .c{text-align:right;font-variant-numeric:tabular-nums}
.wv-evs{list-style:none;margin:0;padding:0}
.wv-ev{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:0.875rem;align-items:start}
.wv-ev>b{font-size:0.8125rem}
.wv-ev.next>b{color:var(--accent)}.wv-ev.today{background:color-mix(in srgb,var(--warn) 7%,transparent)}
.wv-ev.stop>span{color:var(--down)}
/* holdings */
.wv-2{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
@media (min-width:1024px){.wv-2{grid-template-columns:320px minmax(0,1fr);gap:32px}}
.wv-left{display:grid;gap:16px;align-content:start}

.wv-ringrow{display:flex;gap:18px;align-items:center}
.wv-ring{position:relative;width:116px;height:116px;flex:none;display:grid;place-items:center}
.wv-ring svg{position:absolute;inset:0}
.wv-ring .bg{fill:none;stroke:var(--surface2);stroke-width:9}
.wv-ring .fg{fill:none;stroke:var(--fill);stroke-width:9;stroke-linecap:round}
.wv-ring span{position:relative;display:grid;justify-items:center;font-size:0.6875rem;color:var(--muted);text-align:center;line-height:1.2}
.wv-ring span b{font-size:1.25rem;color:var(--ink);letter-spacing:-.02em;margin:2px 0}
.wv-figs{display:grid;gap:10px}
.wv-fig{display:grid;gap:1px}.wv-fig .k{font-size:0.8125rem;color:var(--muted)}.wv-fig .num{font-size:1.25rem;font-weight:700}
.wv-fig .i{font-size:0.75rem;color:var(--muted)}
.wv-tbl{width:100%;border-collapse:collapse;font-size:0.875rem;font-variant-numeric:tabular-nums}
.wv-tbl th,.wv-tbl td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.wv-tbl thead th{font:600 0.6875rem var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink)}
.wv-tbl th:first-child{text-align:left}.wv-tbl tbody th{font-weight:600}
.wv-tbl td.cu{display:flex;justify-content:flex-end;align-items:center;gap:8px}
.wv-curve{margin-top:12px;min-width:0}
/* periods */
.wv-ribbon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--line);border-radius:16px;overflow:hidden}
.wv-ribbon>div{padding:12px 14px;display:grid;gap:6px;min-width:0;border-top:1px solid var(--line)}
.wv-ribbon>div:nth-child(-n+2){border-top:0}.wv-ribbon>div:nth-child(2n){border-left:1px solid var(--line)}
@media (min-width:900px){.wv-ribbon{grid-template-columns:repeat(5,minmax(0,1fr))}.wv-ribbon>div{border-top:0;border-left:1px solid var(--line)}.wv-ribbon>div:first-child{border-left:0}}
.wv-ribbon .k{font-size:0.75rem;color:var(--muted)}
.wv-cmp{display:grid;gap:4px}.wv-cmp .v{display:flex;justify-content:space-between;gap:8px;font-size:0.8125rem;align-items:baseline}
.wv-ribbon .i{font-size:0.75rem;color:var(--muted)}
.wv-foot{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:center}
@media (min-width:900px){.wv-foot{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
.wv-foot .wv-curve{margin:0}
.wv-when h4{margin-bottom:6px}
.wv-run{display:grid;grid-template-columns:auto minmax(60px,1fr) auto;gap:10px;align-items:center;font-size:0.8125rem}
.wv-track{position:relative;height:6px;border-radius:3px;background:var(--surface2)}
.wv-track i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--fill)}
.wv-track b{position:absolute;top:-4px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:3px solid var(--fill);transform:translateX(-7px)}
/* in & out */
.wio{display:grid;gap:10px;padding:8px 0 24px;border-bottom:1px solid var(--line)}
.wio-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 20px}
.wio-head h2{font-size:1.25rem;letter-spacing:-.02em;margin:0}
.wio-key{display:flex;align-items:center;gap:6px;margin:0;font-size:0.75rem;color:var(--muted);flex-wrap:wrap}
.wio-key i{margin-left:8px}
.wio i.in,.wio-key i.in{display:inline-grid;place-items:center;min-width:12px;height:12px;border-radius:3px;background:var(--up);color:#fff;font:700 9px var(--f);font-style:normal}
.wio i.out,.wio-key i.out{display:inline-grid;place-items:center;min-width:12px;height:12px;border-radius:3px;background:var(--down);color:#fff;font:700 9px var(--f);font-style:normal}
.wio i.out.stop,.wio-key i.out.stop{background:var(--bg);border:2px solid var(--down);color:var(--down);min-width:12px;height:12px;box-sizing:border-box}
.wio-tbl{border-collapse:separate;border-spacing:0;font-size:0.8125rem;min-width:100%}
.wio-tbl th,.wio-tbl td{padding:0;border-bottom:1px solid var(--line);height:34px}
.wio-tbl thead th{font:600 0.625rem var(--f);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap;height:26px;text-align:left}
.wio-n{text-align:left;padding-right:14px!important;white-space:nowrap;max-width:260px;overflow:hidden;text-overflow:ellipsis;position:sticky;left:0;background:var(--bg);z-index:1}
tbody .wio-n{font-weight:600}
.wio-d{min-width:22px}
.wio-c{min-width:22px;text-align:center;vertical-align:middle}
.wio-c i{margin:1px}
.wio-c.wio-now,.wio-d.wio-now{background:color-mix(in srgb,var(--fill) 10%,var(--bg));text-align:center;padding:0 8px!important}
.wio-t{padding-left:14px!important;white-space:nowrap;text-align:left}
.wio-t .up{color:var(--up)}.wio-t .dn{color:var(--down)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wv-io2{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
@media (min-width:1024px){.wv-io2{grid-template-columns:minmax(0,0.75fr) minmax(0,2fr);gap:28px}}
.wv-io2 section h4+*{margin-bottom:16px}
.wv-quiet{margin:0 0 16px;color:var(--muted);font-size:0.875rem}
.wv-inout .wv-ev{grid-template-columns:80px minmax(0,1fr)}
.wv-inout .iochip{font-size:0.8125rem;padding:3px 10px}

.wrecent{display:flex;flex-direction:column;gap:16px;padding-top:40px}
.wrecent h2{font-size:1.5rem;letter-spacing:-.02em}
.yourcall{display:flex;gap:8px;align-items:flex-start;padding-top:28px;color:var(--ink2)}

/* training */
.prog{display:flex;align-items:center;gap:14px;max-width:420px}
.progress{font-weight:600;white-space:nowrap}
.prog .pbar{position:relative;flex:1;height:6px;border-radius:999px;background:var(--surface2);overflow:hidden}
.prog .pbar i{position:absolute;left:0;top:0;bottom:0;background:var(--fill);border-radius:999px;transition:width .3s var(--ease)}
.lessons{display:grid;gap:16px;padding-bottom:24px}
@media (min-width:900px){.lessons{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px}}
.lesson{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--bg)}
.lesson.done{border-color:var(--ink2)}
.lart{background:var(--surface);padding:16px 16px 8px}
.ill{display:block;width:100%;height:auto;max-height:170px}
.ill .il-ink{stroke:var(--ink2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ill .il-ink.thin{stroke:var(--line);stroke-width:1.5}
.ill .il-acc{stroke:var(--line-a);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ill .il-mk{stroke:var(--mk);stroke-width:1.6;stroke-dasharray:4 4}
.ill .il-s3{stroke:var(--s3);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ill .il-down{stroke:var(--down);stroke-width:2;stroke-linecap:round}
.ill .il-down.dash{stroke-dasharray:6 5}
.ill .il-card{fill:var(--bg);stroke:var(--line);stroke-width:1.5}
.ill .il-fill{fill:var(--fill);opacity:.8}
.ill .il-person{fill:var(--bg);stroke:var(--ink2);stroke-width:2}
.ill .il-dot.acc{fill:var(--fill)}
.ill .il-dot.down{fill:var(--down)}
.ill .il-in{fill:var(--bg);stroke:var(--up);stroke-width:1.5}
.ill .il-out{fill:var(--bg);stroke:var(--down);stroke-width:1.5}
.ill .il-sun{fill:var(--fill);opacity:.85}
.ill .il-fan{fill:var(--mk);opacity:.14}
.ill .il-tag{fill:var(--bg);stroke:var(--line);stroke-width:1.5}
.ill .il-t{font-size:0.75rem;fill:var(--ink2)}
.ill .il-t.sm{font-size:0.6875rem}
.ill .il-t.acc{fill:var(--accent)}.ill .il-t.down{fill:var(--down)}.ill .il-t.up{fill:var(--up)}
.lsn-head{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;width:100%;padding:18px 20px;min-height:44px}
.lsn-head:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.lnum{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;border:1px solid var(--line);font-weight:600;font-size:0.875rem}
.lesson.done .lnum{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.ltext{display:flex;flex-direction:column;gap:2px;min-width:0}
.ltext b{font-size:1.125rem;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.ltext span{font-size:0.875rem;color:var(--muted)}
.lsn-head .chev{width:1.25rem;height:1.25rem;color:var(--muted);transition:transform var(--dur)}
.lsn-head[aria-expanded=true] .chev{transform:rotate(180deg)}
.lbody{padding:0 20px 20px;display:flex;flex-direction:column;gap:12px}
.lbody p{color:var(--ink2);max-width:66ch}
.lacts{padding-top:6px}
.gloss{display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr);gap:8px 16px;margin:0}
.gloss dt{font-weight:600}
.gloss dd{margin:0;color:var(--ink2)}
@media (max-width:420px){.gloss{grid-template-columns:minmax(0,1fr)}.gloss dd{margin-bottom:6px}}

/* about */
.cols2{display:grid;gap:0 48px}
@media (min-width:900px){.cols2{grid-template-columns:1fr 1fr;align-items:start}}
.sec{border-top:1px solid var(--line);padding:24px 0 28px;display:flex;flex-direction:column;gap:10px}
.sec h2{display:flex;align-items:center;gap:10px;font-size:1.125rem;letter-spacing:-.01em}
.sec h3{font-size:0.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.sec p{max-width:62ch;color:var(--ink2)}
.aboutico{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--surface);color:var(--ink2);flex:none}
.aboutico .ico{width:1rem;height:1rem}
.draft{align-self:flex-start;font-size:0.8125rem;font-weight:500;padding:3px 10px;border-radius:999px;border:1px dashed var(--down);color:var(--down)!important}
.setrow{display:grid;gap:10px;padding:16px 0;border-top:1px solid var(--line);align-items:center}
@media (min-width:560px){.setrow{grid-template-columns:120px minmax(0,1fr)}}
.setrow .k{font-weight:500}
.setrow>.seg,.setrow>.btn,.setrow>.swatches{justify-self:start}
.swatches{display:flex;flex-wrap:wrap;gap:4px}
.swatch{width:44px;height:44px;border-radius:999px;border:0;background:transparent;display:grid;place-items:center;padding:0}
.swatch i{width:28px;height:28px;border-radius:999px;display:block;background:var(--c);box-shadow:inset 0 0 0 1px var(--line)}
.swatch[aria-pressed=true] i{box-shadow:0 0 0 3px var(--bg),0 0 0 4.5px var(--ink)}
.version{font-size:0.8125rem;color:var(--muted);padding-top:12px}

/* ---- the tour ----------------------------------------------------------- */
.tour-wrap{position:fixed;inset:0;z-index:80;background:var(--scrim);display:flex;align-items:center;justify-content:center;padding:16px}
.tour{position:relative;width:min(720px,100%);max-height:100%;overflow-y:auto;background:var(--bg);border-radius:20px;box-shadow:var(--lift);
  display:flex;flex-direction:column;gap:18px;padding:22px 28px 24px;outline:none;animation:up .22s var(--ease)}
@media (max-width:759px){.tour-wrap{padding:0}.tour{width:100%;height:100%;max-height:none;border-radius:0;padding:calc(16px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom))}}
@keyframes up{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.ttop{display:flex;justify-content:space-between;align-items:center;gap:12px}
.tbrand{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.tbrand .star{color:var(--accent);width:1rem;height:1rem}
.tskip{min-height:44px}
.tvis{background:var(--surface);border-radius:14px;padding:18px;min-height:180px;overflow:hidden;pointer-events:none;flex:none}
.tvis .mc.mini{gap:10px}
.tvis .mc.mini .figs{grid-template-columns:repeat(2,minmax(0,1fr))}
.tvis .chart{background:transparent}
.tvis .tt{display:none}
.tcopy{display:flex;flex-direction:column;gap:8px}
.tcopy h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);letter-spacing:-.025em;line-height:1.15}
.ttext{font-size:1.0625rem;color:var(--ink2);line-height:1.5;max-width:60ch}
.tfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding:10px 0 4px;position:sticky;bottom:-24px;background:var(--bg)}
@media (max-width:759px){.tfoot{bottom:calc(-16px - env(safe-area-inset-bottom))}}
.dots{display:flex;gap:6px}
.dots i{width:6px;height:6px;border-radius:9px;background:var(--line);transition:width var(--dur),background var(--dur)}
.dots i.on{background:var(--ink);width:20px}
.tbtns{display:flex;gap:8px}
.tfig{display:flex;flex-direction:column;gap:8px}
.tbig{font-size:clamp(1.5rem,1.1rem + 2vw,2.5rem);font-weight:650;letter-spacing:-.03em;color:var(--muted)}
.tbig b{color:var(--ink)}
.tcandle{display:flex;flex-direction:column;gap:6px}
.tart .ill{max-height:200px}
.tmini .dateline{font-size:0.75rem}
.tstack{display:flex;flex-direction:column;gap:18px}
.tstack .wcard.mini{background:var(--bg);border-radius:12px;padding:14px}
/* the ten-step tour (26 September 2026): a progress line, numbered pointers on live
   pictures, and the small pieces each picture is built from */
.tprog{height:3px;border-radius:3px;background:var(--line);overflow:hidden;flex:none}
.tprog i{display:block;height:100%;width:0;background:var(--fill);transition:width .35s var(--ease)}
.tfoot{justify-content:space-between;flex-wrap:wrap}
.tnext{display:flex;align-items:center;gap:8px;font-size:0.875rem;color:var(--ink2);cursor:pointer;min-height:44px}
.tnext input{width:18px;height:18px;margin:0;accent-color:var(--ink);flex:none}
.tourcard{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--surface);border-radius:16px;padding:18px 20px;margin:0 0 18px}
.tourcard .tc-text{display:flex;flex-direction:column;gap:4px;max-width:60ch}
.tourcard h2{font-size:1.25rem;letter-spacing:-.015em}
.tourcard p:not(.eyebrow){color:var(--muted)}
.tvis{min-height:0;padding:22px}
.tfacts2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tfacts2 div{background:var(--bg);border-radius:10px;padding:9px 12px;display:flex;flex-direction:column}
.tfacts2 small{color:var(--muted);font-size:0.75rem}
.tpinned{display:flex;flex-direction:column;gap:14px}
.pinned{position:relative;outline:2px solid var(--fill);outline-offset:4px;border-radius:8px}
.pin{position:absolute;top:-15px;left:-22px;z-index:3;width:22px;height:22px;border-radius:999px;background:var(--fill);color:var(--on-fill);
  font:700 0.75rem/22px var(--f);text-align:center;box-shadow:0 0 0 3px var(--surface);animation:pinpop .45s var(--ease) both}
@keyframes pinpop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.plegend{list-style:none;margin:0;padding:12px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.plegend li{display:flex;gap:10px;align-items:flex-start;font-size:0.9375rem;line-height:1.4;color:var(--ink2)}
.pnum{flex:none;width:22px;height:22px;border-radius:999px;background:var(--fill);color:var(--on-fill);font:700 0.75rem/22px var(--f);text-align:center}
.tchips{display:flex;flex-wrap:wrap;gap:6px}
.tchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:4px 10px;font-size:0.8125rem;font-weight:500}
.tchip .ico{width:.875rem;height:.875rem;color:var(--up)}
.tchips.soft .tchip{background:transparent}
.tchips.mini .tchip{padding:2px 8px;font-size:0.75rem}
.tchip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.thero{display:flex;flex-direction:column;gap:10px}
.thero .chart svg{animation:reveal 1.4s var(--ease) both}
@keyframes reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.thero sup,.tpinned sup{font-size:.55em;margin-left:2px}
.note.star{font-size:0.75rem}
.tflowbox{display:flex;flex-direction:column;gap:14px}
.tbadge{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;background:var(--ink);color:var(--bg);border-radius:999px;padding:5px 12px;font-weight:600;font-size:0.875rem}
.tbadge .ico{width:1rem;height:1rem}
.tflow{list-style:none;margin:0;padding:0;display:grid;gap:8px;grid-template-columns:repeat(5,minmax(0,1fr))}
.tflow li{background:var(--bg);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;position:relative;
  animation:up .4s var(--ease) both;animation-delay:calc(var(--i) * .12s)}
.tflow li:not(:last-child)::after{content:"";position:absolute;right:-7px;top:24px;width:6px;height:2px;background:var(--fill)}
.tflow li div{display:flex;flex-direction:column;gap:2px}
.tflow li span{font-size:0.8125rem;color:var(--muted);line-height:1.35}
.tfi{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:10px;background:color-mix(in srgb,var(--fill) 22%,transparent);color:var(--ink);flex:none}
.tfi .ico{width:1.125rem;height:1.125rem}
@media (max-width:640px){.tflow{grid-template-columns:minmax(0,1fr)}.tflow li{flex-direction:row;align-items:flex-start}
  .tflow li:not(:last-child)::after{right:auto;left:27px;top:auto;bottom:-7px;width:2px;height:6px}}
.tfacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tfacts div{display:flex;flex-direction:column;gap:2px}
.tfacts b{font-size:clamp(1.375rem,1rem + 1.5vw,2rem);letter-spacing:-.03em;font-weight:650}
.tfacts span{font-size:0.8125rem;color:var(--muted);line-height:1.35}
.tmkt{display:flex;flex-direction:column;gap:8px}
.tmkt-btn{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:6px 12px}
.tmkt-btn .ico{width:1rem;height:1rem}
.tmkt-list{background:var(--bg);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:2px;max-width:420px}
.tmkt-opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 8px;border-radius:8px;font-size:0.875rem}
.tmkt-opt.on{background:var(--surface)}
.tmkt-opt.off{color:var(--muted)}
.tmkt-opt small{color:var(--muted);font-size:0.75rem}
.tmkt-soon{display:flex;flex-direction:column;gap:2px}
.tlist{display:flex;flex-direction:column;gap:6px}
.tlrow{display:flex;justify-content:space-between;gap:12px;align-items:center;background:var(--bg);border-radius:10px;padding:9px 12px}
.tlrow div{display:flex;flex-direction:column}
.tlrow small{color:var(--muted);font-size:0.75rem}
.tlv{display:flex;flex-direction:column;align-items:flex-end;font-weight:600}
.ttiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:560px){.ttiles{grid-template-columns:minmax(0,1fr)}}
.ttile{background:var(--bg);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:6px}
.ttn{font-size:1.0625rem;letter-spacing:-.01em}
.tkind{align-self:flex-start}
.trenew{display:flex;align-items:center;gap:6px;font-size:0.8125rem;color:var(--muted)}
.trenew .ico{width:.9rem;height:.9rem}
.tpair{display:flex;gap:14px;flex-wrap:wrap;font-size:0.875rem;color:var(--muted)}
.tpair b{color:var(--ink)}
.tbar{display:flex;flex-direction:column;gap:10px}
.tamt{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:var(--bg);border-radius:12px;padding:10px 12px}
.tamt small{color:var(--muted)}
.tamt b{font-size:1.125rem}
.tvis .mc:not(.mini){background:var(--bg);border-radius:12px;padding:14px}
.tswitch{display:inline-flex;align-self:flex-start;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--bg);font-size:0.8125rem}
.tswitch span{padding:5px 12px;border-radius:999px}
.tswitch span.on{background:var(--ink);color:var(--bg)}
.ttable{overflow-x:auto;background:var(--bg);border-radius:12px;padding:8px 12px}
.ttable table{border-collapse:collapse;width:100%;font-size:0.8125rem}
.ttable th,.ttable td{text-align:right;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.ttable th:first-child{text-align:left;font-weight:500}
.ttable tr:last-child th,.ttable tr:last-child td{border-bottom:0}
.ttable td.good{font-weight:700}
.tsheet{background:var(--bg);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.tparts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.tparts div{background:var(--bg);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:4px}
.tparts span:not(.tfi){font-size:0.75rem;color:var(--muted);line-height:1.35}
@media (max-width:640px){.tparts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.thold{display:flex;flex-direction:column;gap:6px}
.thr{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:8px;align-items:center;background:var(--bg);border-radius:10px;padding:9px 12px;font-size:0.8125rem}
.thr .hn{display:flex;flex-direction:column}
.thr small{color:var(--muted);font-size:0.6875rem;display:block}
@media (max-width:560px){.thr{grid-template-columns:repeat(2,minmax(0,1fr))}.thr .hn{grid-column:1/-1}}
.tthree{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;counter-reset:t3}
.tthree li{background:var(--bg);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:4px;counter-increment:t3}
.tthree li b::before{content:counter(t3) ". ";color:var(--accent)}
.tthree li span{font-size:0.8125rem;color:var(--muted);line-height:1.35}
@media (max-width:560px){.tthree{grid-template-columns:minmax(0,1fr)}}
/* the tour's picture of the five tabs - its own name: it was ".ttabs", the list
   tabs' name, and turned the Models lists into a five-column grid on two rows */
.tour-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--bg);border-radius:12px;padding:6px}
.tour-tabs span{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;color:var(--muted)}
.tour-tabs span:first-child{color:var(--ink)}
.tour-tabs .ico{width:1.25rem;height:1.25rem}
.tour-tabs small{font-size:0.75rem}
.ttabinfo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ttabinfo li{display:flex;gap:10px;align-items:flex-start}
.ttabinfo li div{display:flex;flex-direction:column}
.ttabinfo li span:not(.tfi){font-size:0.875rem;color:var(--muted)}

/* ---- sign-in ------------------------------------------------------------ */
.signin{max-width:380px;margin:12vh auto 0;text-align:center;padding:0 4px}
.signin img{width:min(240px,70%);display:block;margin:0 auto 28px;filter:var(--logo-filter)}
.signin .field{text-align:left}
.field{display:flex;flex-direction:column;gap:6px;margin:0 0 14px}
.field label{font-size:0.8125rem;color:var(--muted);font-weight:500}
.field input{appearance:none;background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:12px;padding:11px 14px;font-size:1rem;min-height:48px;width:100%}
.field input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--fill) 30%,transparent)}
.field .hint{font-size:0.8125rem;color:var(--muted)}
.signin .btn{width:100%;background:var(--ink);border-color:var(--ink);color:var(--bg);min-height:48px}
.signin .msg{min-height:20px;color:var(--down);font-size:0.875rem;margin-top:10px}
.signin .first{display:flex;gap:8px;align-items:flex-start;text-align:left;margin:22px 0 0;font-size:0.875rem;color:var(--muted);line-height:1.45}
.signin .first svg{flex:none;width:1.125rem;height:1.125rem;margin-top:1px;color:var(--muted)}
.signin.choose h1{font-size:1.75rem;letter-spacing:-.02em;margin:0 0 6px}
.signin.choose .lead{color:var(--muted);font-size:0.9375rem;line-height:1.45;margin:0 0 20px}
.signin .accept{display:flex;gap:12px;align-items:flex-start;text-align:left;background:var(--surface);border-radius:14px;padding:14px;margin:4px 0 16px;font-size:0.875rem;line-height:1.45;cursor:pointer}
.signin .accept input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--ink)}

/* the first sign-in screen (the owner's pick "5E", 27 Sep 2026): one dark page in
   either theme, on purpose - the colours are set here, not taken from the theme */
.gx{position:fixed;inset:0;z-index:60;overflow-y:auto;color:#f2f5f7;
  background:radial-gradient(900px 640px at 78% 42%,#0f2233,#05080b) #05080b;
  font-family:inherit}
.gx-in{min-height:100%;max-width:1180px;margin:0 auto;padding:48px 64px;display:grid;
  grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:center}
.gx-l{display:flex;flex-direction:column;gap:26px;min-width:0}
.gx-brand{display:flex;align-items:flex-end;gap:10px;color:#fff}
.gx-brand .mark{height:26px;width:23px}
.gx-word{height:22px;width:auto;display:block}
.gx-lead{margin:0 0 -12px;font-size:clamp(1.25rem,2.4vw,1.875rem);font-weight:650;letter-spacing:-.02em;color:#6cc6ff;text-wrap:balance}
.gx-h{margin:0;font-size:clamp(2.5rem,5.4vw,4rem);line-height:1.02;letter-spacing:-.045em;font-weight:750}
.gx-h span{display:block}.gx-h .dim{color:#4a5b68}
.signin.gx-form{max-width:none;margin:0;padding:0;text-align:left}
.gx-fields{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;gap:12px;align-items:end;max-width:640px}
.gx-form .field{margin:0;gap:7px}
.gx-form .field label{font-size:0.8125rem;font-weight:600;color:#c9d3da}
.gx-form .field input{background:#16212a;border:1.5px solid #4b5d6b;color:#e9eef2;border-radius:14px;min-height:56px;padding:0 18px;font-size:1rem}
.gx-form .field input::placeholder{color:#8796a2;opacity:1}
.gx-form .field input:hover{border-color:#6a7f8f}
.gx-form .field input:focus{border-color:#6cc6ff;box-shadow:0 0 0 4px rgba(108,198,255,.22)}
.gx-form .field input:-webkit-autofill{-webkit-text-fill-color:#e9eef2;box-shadow:0 0 0 1000px #16212a inset;caret-color:#e9eef2}
.signin.gx-form .btn{width:auto;min-height:56px;padding:0 34px;border-radius:14px;background:#6cc6ff;border-color:#6cc6ff;color:#04192a;font-size:1rem;font-weight:650}
.signin.gx-form .btn:hover{background:#8fd4ff;border-color:#8fd4ff}
.signin.gx-form .btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
.signin.gx-form .msg{color:#ff9b93;margin-top:12px}
.signin.gx-form .first{margin:6px 0 0;color:#9fb0bc}
.signin.gx-form .first svg{color:#9fb0bc}
.gx-trust{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:0.875rem;color:#9fb0bc}
.gx-trust li::before{content:"\2713\00a0";color:#34c98a;font-weight:700}
.gx-phone{justify-self:end;width:320px;height:650px;border-radius:44px;background:#11171c;padding:12px;position:relative;
  box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 0 1px #243039}
.gx-notch{position:absolute;left:50%;top:20px;transform:translateX(-50%);width:104px;height:26px;border-radius:14px;background:#11171c}
.gx-scr{height:100%;border-radius:34px;overflow:hidden;background:#fff;color:#0a0a0b;padding:58px 16px 16px;display:flex;flex-direction:column;gap:10px}
.gx-kicker{font-size:0.625rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#5f5f67}
.gx-title{display:flex;flex-direction:column;gap:6px}
.gx-scr i{display:block;height:9px;border-radius:5px;background:#e4e4e8}
.gx-title i{height:14px;background:#d6d6dc}
.gx-legend{display:flex;gap:14px;font-size:0.6875rem;font-weight:600}
.gx-legend span::before{content:"";display:inline-block;width:14px;height:0;margin-right:6px;vertical-align:middle;border-top:2px solid}
.gx-legend .b{color:#0b64b0}.gx-legend .s{color:#c42b26}.gx-legend .s::before{border-top-style:dashed}
.gx-chart{display:block;width:100%;height:auto;border-bottom:1px solid #e4e4e8;padding-bottom:8px}
.gx-grid{stroke:#eeeef2;stroke-width:1}
.gx-buy{stroke:#0b64b0;stroke-width:1.4}
.gx-stop{stroke:#c42b26;stroke-width:1.4;stroke-dasharray:4 3}
line.gx-up{stroke:#0a7f4f;stroke-width:1}line.gx-dn{stroke:#c42b26;stroke-width:1}
rect.gx-up{fill:#0a7f4f}rect.gx-dn{fill:#c42b26}
.gx-tri{fill:#0b64b0}
.gx-row{display:grid;grid-template-columns:34px 1fr 50px;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid #eeeef2}
.gx-row i.gx-sm{justify-self:end;background:#eeeef2}
.gx-st{font-size:0.6875rem;font-weight:700}.gx-st.in{color:#0a7f4f}.gx-st.out{color:#c42b26}
.gx-note{margin-top:auto;font-size:0.625rem;color:#8e8e97;text-align:center}
@media (max-width:959px){
  .gx-in{grid-template-columns:minmax(0,1fr);padding:40px 24px}
  .gx-phone{display:none}
}
@media (max-width:640px){
  .gx-in{padding:32px 16px;align-items:start}
  .gx-l{gap:22px}
  .gx-fields{grid-template-columns:minmax(0,1fr)}
  .signin.gx-form .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media (forced-colors:active){.btn.pri,.status.on{border:1px solid ButtonText}}

/* ---- names, the Signature line, rebalancing (26 September 2026) ------------ */
.sigline{flex-basis:100%;font-size:0.875rem;font-weight:600;color:var(--accent)}
.figs.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:719px){.figs.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:459px){.figs.three{grid-template-columns:minmax(0,1fr)}}
.rwhy{background:var(--surface);border-radius:16px;padding:16px 18px;margin:14px 0 18px;display:flex;flex-direction:column;gap:10px}
.rwhy h4{font-size:1.0625rem;margin:0}
.rwhy>p{color:var(--ink2);max-width:72ch;line-height:1.5}
.rsteps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:719px){.rsteps{grid-template-columns:repeat(2,minmax(0,1fr))}}
.rsteps div{background:var(--bg);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.rsteps span{font-size:0.8125rem;color:var(--muted);line-height:1.4}
.rart{margin:0;background:var(--bg);border-radius:12px;padding:12px}
.rart svg.ra{width:100%;height:auto;display:block}
.rart figcaption{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:0.8125rem;color:var(--ink2);margin-top:8px}
.rart .k{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.ra .ra-t{font:600 14px var(--f);fill:var(--ink)}
.ra .ra-s{font:400 12px var(--f);fill:var(--muted)}
.ra .ra-s.stop{fill:var(--down)}
.ra .ra-c{font:600 13px var(--f);fill:var(--ink)}
.ra .ra-box{stroke-width:1.2}
.ra .ra-box.stay,.rart .k.stay{fill:color-mix(in srgb,var(--fill) 16%,var(--bg));stroke:var(--fill);background:color-mix(in srgb,var(--fill) 16%,var(--bg));border:1px solid var(--fill)}
.ra .ra-box.in,.rart .k.in{fill:color-mix(in srgb,var(--up) 14%,var(--bg));stroke:var(--up);background:color-mix(in srgb,var(--up) 14%,var(--bg));border:1px solid var(--up)}
.ra .ra-box.out,.rart .k.out{fill:color-mix(in srgb,var(--down) 12%,var(--bg));stroke:var(--down);background:color-mix(in srgb,var(--down) 12%,var(--bg));border:1px solid var(--down)}
.ra .ra-panel{fill:var(--surface)}
.ra .ra-bar{fill:var(--fill)}
.ra .ra-bar2{fill:var(--line)}
.ra .ra-cut{stroke:var(--ink);stroke-dasharray:4 4}
.ra .ra-arrow{stroke:var(--ink);stroke-width:1.6;fill:none}
.ra .ra-axis{stroke:var(--ink2)}
.ra .ra-dot,.rart .k.dot{fill:var(--fill);background:var(--fill);border-radius:99px}
.ra .ra-stop,.rart .k.stop{fill:var(--down);background:var(--down)}

/* a picture that opens large on a tap (ui.zoomable) */
.zoom-btn{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;text-align:inherit;color:inherit}
.zoom-btn:focus-visible{outline:2px solid var(--fill);outline-offset:4px;border-radius:8px}
.zoom-hint{position:absolute;right:6px;top:6px;display:inline-flex;align-items:center;gap:4px;font-size:0.75rem;color:var(--muted);
  background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px 9px;opacity:.9}
.zoom-hint .ico{width:12px;height:12px}
.zoom-wrap{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:2vh 2vw}
.zoom-scrim{position:absolute;inset:0;background:var(--scrim)}
.zoom-box{position:relative;width:min(1500px,96vw);max-height:96vh;overflow:auto;background:var(--bg);border-radius:18px;padding:48px 28px 22px;box-shadow:var(--lift);outline:none}
.zoom-box .rart svg{width:100%;height:auto;max-height:78vh}
.zoom-x{position:absolute;top:10px;right:10px}

/* ---- a model's Today: Status, Order slip, Timeline (27 September 2026) ---- */
.td-bar{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;margin:4px 0 14px}
.td-body{min-width:0}
.td-v{display:flex;flex-direction:column;gap:14px;min-width:0}
.td-quiet{color:var(--muted);margin:6px 0}
.td-head{border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;background:var(--surface)}
.td-head b{font-size:1.0625rem;font-weight:700}
.td-head span{color:var(--ink2);font-size:0.9375rem}
.td-head.moves{background:color-mix(in srgb,var(--warn) 16%,var(--bg))}
.td-clock{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));gap:10px;position:relative}
.td-stop{display:flex;flex-direction:column;gap:2px;padding-top:16px;position:relative;font-size:0.875rem}
.td-stop::before{content:"";position:absolute;top:5px;left:12px;right:-10px;height:2px;background:var(--line)}
.td-stop:last-child::before{display:none}
.td-stop i{position:absolute;top:0;left:0;width:12px;height:12px;border-radius:50%;background:var(--ink)}
.td-stop.now i{background:var(--accent)}
.td-stop.next i{background:var(--bg);border:2px solid var(--muted);box-sizing:border-box}
.td-stop b{font-weight:600}
.td-stop span{color:var(--muted);font-size:0.8125rem}
.io-tbl{width:100%;border-collapse:collapse;font-size:0.9375rem;font-variant-numeric:tabular-nums}
.io-tbl th,.io-tbl td{padding:9px 8px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.io-tbl thead th{font-size:0.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.io-tbl tbody th{font-weight:600}
.io-tbl .n{text-align:right;white-space:nowrap}
.io-tbl .tipwrap{text-transform:none;letter-spacing:0}
.io-gain{color:var(--ink2);font-size:0.8125rem}
.td-sliphead h4{margin:0 0 2px;font-size:1.125rem}
.td-slip{border-radius:12px;padding:12px 14px}
.td-slip h5{margin:0 0 6px;font-size:0.9375rem;font-weight:700}
.td-slip.in{background:color-mix(in srgb,var(--up) 10%,var(--bg))}
.td-slip.in h5{color:var(--up)}
.td-slip.out{background:color-mix(in srgb,var(--down) 9%,var(--bg))}
.td-slip.out h5{color:var(--down)}
.td-slip .io-tbl th,.td-slip .io-tbl td{border-bottom-color:color-mix(in srgb,var(--ink) 10%,transparent)}
.td-pastslip{display:flex;flex-direction:column;gap:8px}
.td-pastslip h4,.td-day h4{margin:0 0 4px;font-size:0.9375rem}
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:8px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl-node{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;padding:8px 0;position:relative}
.tl-node i{width:14px;height:14px;border-radius:50%;margin:3px 0 0 1px;background:var(--bg);border:2.5px solid var(--accent);box-sizing:border-box;z-index:1}
.tl-node.now i{background:var(--ink);border-color:var(--ink)}
.tl-node.next i{border:2.5px solid var(--muted);background:var(--surface)}
.tl-node>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.tl-node b{font-weight:600}
.tl-node .mu{font-size:0.8125rem}
.io-tbl .io-co{min-width:8.5rem}
.io-tbl .io-co>div{display:flex;flex-direction:column;gap:2px}
.io-tbl .io-co .io{font-size:0.75rem}
/* the count on a list tab (C2) */
.ttabs .tcount{display:inline-block;margin-left:7px;padding:1px 7px;border-radius:999px;background:var(--surface2);color:var(--ink2);font-size:0.75rem;font-weight:600;font-variant-numeric:tabular-nums;vertical-align:1px}
.ttabs button[aria-pressed=true] .tcount{background:var(--fill);color:var(--on-fill)}
.intro .showing b{color:var(--ink);font-weight:600}
/* with counts on them the tabs sit a little closer, so the row still fits on one line */
.ttabs:has(.tcount){gap:20px}
.ttabs:has(.tcount) button+button::before{left:-12px}
.ttabs .tcount{margin-left:5px;padding:1px 6px}

/* ---- About · Why you can be confident (27 September 2026) ---------------- */
.ab-tabs{padding-top:24px}
.ab-tabs .ttabs{border-bottom:1px solid var(--line)}
.trust{display:flex;flex-direction:column}
.tr-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:4px 0 12px}
.tr-tile{background:var(--surface);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.tr-tile b{font-size:2rem;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.tr-tile span{font-size:0.875rem;color:var(--ink2)}
.tr-sec{border-top:1px solid var(--line);padding:28px 0;display:flex;flex-direction:column;gap:14px}
.tr-sec h2{font-size:1.375rem;letter-spacing:-.02em;text-wrap:balance}
.tr-sub{max-width:68ch;color:var(--ink2)}
.tr-sec>p{max-width:68ch;color:var(--ink2)}
.tr-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;counter-reset:s}
.tr-step{position:relative;display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.tr-step:not(:last-child)::after{content:"→";position:absolute;right:-9px;top:22px;color:var(--muted);font-size:0.875rem;background:var(--bg);line-height:1}
.tr-num{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--fill);color:var(--on-fill)}
.tr-num .ico{width:1.1rem;height:1.1rem}
.tr-step b{display:block;font-weight:600;margin-bottom:4px}
.tr-step span{font-size:0.875rem;color:var(--ink2)}
.tr-fig{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--bg);overflow-x:auto}
.tr-svg{display:block;width:100%;min-width:520px;height:auto}
.tr-t{font-size:0.75rem;fill:var(--ink2)}
.tr-t.b{font-weight:700;fill:var(--ink)}
.tr-t.mu{fill:var(--muted)}
.tr-t.sm{font-size:0.65625rem;fill:var(--muted)}
.tr-t.down{fill:var(--down)}
.tr-t.in{fill:var(--ink)}
.tr-t.on{fill:var(--on-fill)}
.tr-dot{fill:var(--mk);opacity:.55}
.tr-zone{fill:var(--up);opacity:.08}
.tr-axis{stroke:var(--line);stroke-width:1.5}
.tr-cut{stroke:var(--ink2);stroke-width:1.5;stroke-dasharray:5 4}
.tr-me{fill:var(--up);stroke:var(--bg);stroke-width:3}
.tr-me-l{stroke:var(--up);stroke-width:2}
.tr-old{fill:var(--surface2);stroke:var(--line)}
.tr-new{fill:var(--fill)}
.tr-stay{fill:var(--fill);opacity:.85}
.tr-gone{fill:var(--down);opacity:.45}
.tr-groups{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.tr-groups li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:var(--surface)}
.tr-groups .ico{width:1.1rem;height:1.1rem;color:var(--up);flex:none;margin-top:2px}
.tr-groups b,.tr-checks b,.tr-h b{display:block;font-weight:600}
.tr-groups span,.tr-checks span,.tr-h span{font-size:0.875rem;color:var(--ink2)}
.tr-checks{margin:0;padding:0;list-style:none;counter-reset:c;display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:760px){.tr-checks{grid-template-columns:1fr 1fr}}
.tr-checks li{counter-increment:c;position:relative;padding:12px 14px 12px 52px;border:1px solid var(--line);border-radius:12px}
.tr-checks li::before{content:counter(c);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--up);color:var(--bg);font-size:0.8125rem;font-weight:700}
.tr-honest{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:760px){.tr-honest{grid-template-columns:1fr 1fr 1fr}}
.tr-h{display:flex;gap:12px;align-items:flex-start}
.trust>.calm{margin:8px 0 24px}
.tr-cap{font-size:0.8125rem;color:var(--muted);margin:6px 0 0}
/* the confidence filter beside the period (27 September 2026) */
.shelfbar .confw{padding:6px 0;display:flex;align-items:center;gap:10px}
.shelfbar .confw .perl{display:inline-flex;align-items:center;gap:4px}
@media (max-width:1023px){.shelfbar .confw{flex-basis:100%;border-top:1px solid var(--line)}}
@media (max-width:759px){.shelfbar .confw .perl{display:inline-flex}}

/* ---- Watchlist · In & out as a daily sheet (27 September 2026) ------------- */
.io-panel{display:flex;flex-direction:column;gap:16px;min-width:0}
.io-clock{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.io-ck{background:var(--surface);border-radius:14px;padding:12px 16px;display:flex;flex-direction:column;gap:3px}
.io-ck.main{background:var(--hero);color:var(--on-hero)}
.io-ck .k{font-size:0.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.io-ck.main .k,.io-ck.main span{color:var(--on-hero2)}
.io-ck b{font-size:1.25rem;letter-spacing:-.01em}
.io-ck span{font-size:0.8125rem;color:var(--muted)}
.io-bar{display:flex;justify-content:flex-start}
.io-body{min-width:0}
.io-code{font-family:ui-monospace,Menlo,monospace;font-size:0.75rem;font-weight:600;color:var(--muted);margin-left:6px}
.io-tags{display:inline-flex;flex-wrap:wrap;gap:4px;align-items:center}
.io-sl{font-size:0.6875rem;font-weight:700;color:var(--down);border:1px solid var(--down);border-radius:5px;padding:0 5px}
.io-pill{display:inline-block;font-size:0.75rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--surface2);color:var(--muted)}
.io-pill.amb{background:color-mix(in srgb,var(--warn) 16%,var(--bg));color:var(--ink)}
.io-pill.red{background:color-mix(in srgb,var(--down) 12%,var(--bg));color:var(--down)}
.io-res small{color:var(--ink2);font-size:0.8125rem}
.io-p{border-top:1.5px solid var(--ink);padding:12px 0 4px}
.io-p h3{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:1rem;margin:0 0 4px}
.io-p h3 .linkbtn{font-weight:650;color:var(--ink)}
.io-r{display:grid;grid-template-columns:5.5rem minmax(0,1.4fr) minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1.5fr);gap:6px 14px;align-items:baseline;
  padding:10px 0;border-top:1px solid var(--line);font-size:0.9375rem;font-variant-numeric:tabular-nums}
.io-lab{display:flex;align-items:center;gap:3px;font-size:0.6875rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.io-lab .tipwrap{text-transform:none;letter-spacing:0}
.io-val b{font-weight:650}
@media (max-width:759px){.io-r{grid-template-columns:1fr 1fr}.io-r>.io-tags{grid-column:1/-1}.io-r>div:nth-child(2){grid-column:1/-1}}
.io-quiet{border-top:1.5px solid var(--ink);padding:12px 0;color:var(--muted);font-size:0.875rem}
.io-quiet b{color:var(--ink)}
.io-none{background:var(--surface);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:4px}
.io-none span{color:var(--muted)}
.io-how{display:flex;gap:8px;align-items:flex-start;font-size:0.8125rem;color:var(--ink2)}
.io-how .ico{width:1rem;height:1rem;flex:none;margin-top:1px;color:var(--muted)}
.io-after-list{display:flex;flex-direction:column;gap:12px}
.io-a{border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.io-ah{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;margin-bottom:8px}
.io-ah h3{margin:0;font-size:1rem}.io-ah h3 .linkbtn{font-weight:650;color:var(--ink)}
.io-a.quiet summary{cursor:pointer;color:var(--muted);font-size:0.875rem}
.io-after,.io-lg{width:100%;border-collapse:collapse;font-size:0.875rem;font-variant-numeric:tabular-nums}
.io-after th,.io-after td,.io-lg th,.io-lg td{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.io-after thead th,.io-lg thead th{font-size:0.6875rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);border-bottom:1.5px solid var(--ink);white-space:nowrap}
.io-after thead .tipwrap,.io-lg thead .tipwrap{text-transform:none;letter-spacing:0}
.io-after .n,.io-lg .n{text-align:right;white-space:nowrap}
.io-after tbody th,.io-lg tbody th{font-weight:500}
.io-state{font-size:0.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.io-after tr.new td,.io-after tr.new th{background:color-mix(in srgb,var(--up) 9%,var(--bg))}
.io-after tr.new td:first-child{box-shadow:inset 3px 0 0 var(--up)}.io-after tr.new .io-state{color:var(--up)}
.io-after tr.gone td,.io-after tr.gone th{background:color-mix(in srgb,var(--down) 8%,var(--bg));color:var(--down)}
.io-after tr.gone td:first-child{box-shadow:inset 3px 0 0 var(--down)}.io-after tr.gone .io-state{color:var(--down)}
.io-log{display:flex;flex-direction:column;gap:12px;min-width:0}
.io-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between}
.io-chips .seg{max-width:100%;overflow-x:auto}
.io-lg td small{display:block;color:var(--muted);font-size:0.75rem}
.io-lg tr.io-sec td{background:var(--surface);font-size:0.6875rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:6px 8px}
.io-lg tr.io-now td,.io-lg tr.io-now th{background:color-mix(in srgb,var(--warn) 7%,var(--bg))}
@media (max-width:759px){.io-clock{grid-template-columns:1fr 1fr;gap:8px}.io-ck.main{grid-column:1/-1}.io-ck{padding:10px 12px}.io-ck b{font-size:1.0625rem}}
/* the parts of a portfolio's sheet stay on one row, scrolling sideways on a phone */
.sh-nav .seg{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none}
.sh-nav .seg::-webkit-scrollbar{display:none}
.sh-nav .seg button{flex:none;white-space:nowrap}
@media (max-width:759px){.sh-nav .seg{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .sh-nav .seg button{padding:0 10px}}
/* the list's heading in two lines (27 September 2026) */
.lhead{display:flex;flex-direction:column;gap:6px;padding:24px 0 4px}
.lh1{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.lh1 h2{font-size:1.5rem;letter-spacing:-.02em;margin:0}
.lh-n{font-size:0.875rem;color:var(--muted);font-variant-numeric:tabular-nums}
.fchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px 4px 3px 12px;font-size:0.8125rem;background:var(--surface)}
.fchip-x{appearance:none;border:0;background:var(--bg);border-radius:999px;padding:3px 10px;font-size:0.8125rem;font-weight:600;color:var(--ink);cursor:pointer;min-height:0}
.fchip-x:hover{background:var(--surface2)}
.lh2{margin:0;font-size:0.8125rem;color:var(--ink2)}
.lh2 .lh-mk{color:var(--muted)}.lh2 .lh-mk b{color:var(--ink)}
/* About us (27 September 2026) */
.us-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:start;border:1px solid var(--line);border-radius:18px;padding:22px;margin-bottom:28px}
.us-mono{width:84px;height:84px;border-radius:50%;background:var(--ink);color:var(--bg);display:grid;place-items:center;font-size:1.75rem;font-weight:700;letter-spacing:.02em}
.us-text h2{margin:0;font-size:1.5rem;letter-spacing:-.02em}
.us-role{margin:2px 0 10px;font-size:0.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.us-text p{max-width:64ch;color:var(--ink2)}
.us-seen h2{font-size:0.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.us-logos{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.us-logos li{display:grid;place-items:center;text-align:center;min-height:64px;padding:10px 14px;border-radius:12px;background:var(--surface);
  font-weight:700;font-size:0.9375rem;letter-spacing:-.01em;color:var(--ink2)}
@media (max-width:599px){.us-card{grid-template-columns:1fr}.us-mono{width:64px;height:64px;font-size:1.25rem}}
/* the pop as a number counts up into view */
@media (prefers-reduced-motion:no-preference){.pop-in{animation:popIn .55s cubic-bezier(.2,.9,.3,1.2)}}
@keyframes popIn{0%{transform:translateY(6px) scale(.96);opacity:.35}100%{transform:none;opacity:1}}
.fv.pop-in,.tr-tile b.pop-in{display:inline-block}

/* the card's buttons, right under its chart and to the right (27 September 2026) */
.mc-data>.mc-acts{justify-content:flex-end;margin-top:4px}
.us-text{display:flex;flex-direction:column;gap:8px}.us-text p{margin:0}.us-text .us-role{margin:0 0 4px}
/* Following: the two cards at the top (27 September 2026) */
.fw-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:0 0 20px}
.fw-card{background:var(--surface);border-radius:14px;padding:14px 18px;display:flex;flex-direction:column;gap:2px}
.fw-card .k{font-size:0.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fw-card b{font-size:1.5rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fw-card span:last-child{font-size:0.8125rem;color:var(--muted)}
/* About · Version and its log */
.vlog-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.vlog-list summary{cursor:pointer;color:var(--ink2)}
.vlog-list summary b{color:var(--ink)}
.vlog-list ul{margin:6px 0 4px 18px;padding:0;color:var(--ink2);font-size:0.875rem;display:flex;flex-direction:column;gap:3px}

/* THE LANGUAGE CONTROL (1 October 2026): a plain select, in the page's own look on the
   light pages and in the sign-in screen's dark look there. Hidden while English is the
   only language. */
.langsel{display:inline-flex;align-items:center}
.langsel[hidden]{display:none}
.langsel select{appearance:none;-webkit-appearance:none;font:inherit;font-size:0.9375rem;min-height:40px;padding:0 34px 0 14px;border-radius:10px;
  border:1.5px solid var(--line);background:var(--surface,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23788' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
  color:var(--ink);cursor:pointer;max-width:100%}
.langsel select:hover{border-color:var(--muted)}
.langsel select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.langsel select:disabled{opacity:.6;cursor:progress}
.gx-act{display:flex;align-items:center;gap:10px}
.gx-act .btn{flex:1 1 auto}
.gx-act .langsel{flex:0 0 auto}
.gx-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.gx .langsel select{background-color:#16212a;border-color:#4b5d6b;color:#e9eef2;min-height:44px;border-radius:12px}
.gx .langsel select:hover{border-color:#6a7f8f}
.gx .langsel select:focus-visible{outline:3px solid #fff}

/* ===== RIGHT-TO-LEFT (1 October 2026) ===================================================
   Everything above is written for left-to-right. When the page language reads right to left
   (Arabic, Hebrew, Persian, Urdu...) <html dir="rtl"> is set by i18n.js, flex and grid turn round
   by themselves, and THIS block turns round what does not: positions and alignment written with
   left/right, side borders, drawer and arrows. It is last on purpose and every rule starts with
   [dir="rtl"], so in a left-to-right language none of it applies (the English look is untouched).
   Rules of thumb used here:
     * a sentence, table, card or menu turns round (it starts on the right);
     * a SCALE does not turn round (a slider, the stop-loss line, a chart: small is on the left in every
       language), so those get direction:ltr;
     * an arrow that means "go on / go back" turns round (.ico-dir); an arrow that means
       "rising / falling" does not.
   Add a rule here whenever a new left/right appears above (the i18n-audit skill checks). */
[dir="rtl"] .langsel select{padding:0 14px 0 34px;background-position:left 12px center}
[dir="rtl"] .skip{left:auto;right:8px}
[dir="rtl"] .ico-dir{transform:scaleX(-1)}
/* drawings and charts keep their own geometry: in a right-to-left page an SVG text would otherwise
   anchor from its right end */
[dir="rtl"] svg{direction:ltr}
[dir="rtl"] .note .ico{margin-right:0;margin-left:5px}
[dir="rtl"] .num .arrow{margin-right:0;margin-left:3px}
/* header */
[dir="rtl"] #tabs{margin-left:0;margin-right:auto}
[dir="rtl"] .acct-menu{right:auto;left:0}
[dir="rtl"] .mkt-menu{left:auto;right:0}
[dir="rtl"] .mkt-btn{padding:0 5px 0 10px}
[dir="rtl"] .acct-opt,[dir="rtl"] .mkt-opt{text-align:right}
@media (max-width:759px){
  [dir="rtl"] .acct,[dir="rtl"] .mkt{margin-left:0;margin-right:auto}
  [dir="rtl"] .mkt-menu{right:auto;left:0}
  [dir="rtl"] #tabs a[aria-current=page]::after{left:26%;right:26%}
}
/* tabs inside a screen: the fade at the edge, the dot between them */
[dir="rtl"] .ttabs{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(270deg,#000 calc(100% - 28px),transparent)}
@media (min-width:1200px){[dir="rtl"] .ttabs{-webkit-mask-image:none;mask-image:none}}
[dir="rtl"] .ttabs button+button::before{left:auto;right:-16px}
[dir="rtl"] .ttabs:has(.tcount) button+button::before{left:auto;right:-12px}
@media (max-width:759px){[dir="rtl"] .ttabs button+button::before{left:auto;right:-14px}
  [dir="rtl"] .sh-nav .seg{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(270deg,#000 calc(100% - 36px),transparent)}}
[dir="rtl"] .ttabs .tcount{margin-left:0;margin-right:7px}
[dir="rtl"] .ttabs:has(.tcount) .tcount{margin-right:5px}
/* the bubble, the amount, the drawer */
[dir="rtl"] .tip-pop{padding:12px 14px 12px 36px;text-align:right}
[dir="rtl"] .tip-x{right:auto;left:6px}
[dir="rtl"] .zoom-hint{right:auto;left:6px}
[dir="rtl"] .zoom-x{right:auto;left:10px}
[dir="rtl"] .amt-pill{text-align:right}
[dir="rtl"] .amt-sheet .amt-title{padding-right:0;padding-left:48px}
[dir="rtl"] .sh-head .mname-h{padding-right:0;padding-left:48px}
[dir="rtl"] .xbtn{right:auto;left:16px}
@media (min-width:760px){[dir="rtl"] .sheet{inset:0 auto 0 0;transform:translateX(-32px);border-left:0;border-right:1px solid var(--line)}}
/* a slider is a scale: the smallest amount stays on the left */
[dir="rtl"] .rng-track,[dir="rtl"] .rng-ends,[dir="rtl"] .cdots,[dir="rtl"] .wv-track{direction:ltr}
/* bars fill from the side the line starts on */
[dir="rtl"] .prow .pbar i,[dir="rtl"] .hx-hbarw .pbar i,[dir="rtl"] .prog .pbar i,[dir="rtl"] .meter i{left:auto;right:0}
[dir="rtl"] .hx-hsum b{margin-right:0;margin-left:2px}
[dir="rtl"] .hx-hrow-b,[dir="rtl"] .hx-hchip,[dir="rtl"] .fv{text-align:right}
[dir="rtl"] .hx-hn{text-align:left}
[dir="rtl"] .hx-chev{transform:rotate(90deg)}
@media (min-width:760px){[dir="rtl"] .pv{text-align:left}}
/* quoted examples */
[dir="rtl"] .stopbox p.example,[dir="rtl"] details.moneybox p.example{border-left:0;border-right:3px solid var(--accent);padding-left:0;padding-right:12px}
/* tables: the first column is on the right, numbers sit at the end (the left) */
[dir="rtl"] caption,[dir="rtl"] th,[dir="rtl"] td{text-align:right}
[dir="rtl"] .tblwrap caption,[dir="rtl"] .ct caption{left:auto;right:0}
[dir="rtl"] .ntable tbody th{left:auto;right:0}
[dir="rtl"] .ct tbody th,[dir="rtl"] .ct thead th.corner{left:auto;right:0;padding-left:16px;padding-right:0}
[dir="rtl"] .yv,[dir="rtl"] .wv-hold li .c{text-align:left}
@media (max-width:559px){[dir="rtl"] .yd{padding-left:0;padding-right:calc(3.6rem + 12px)}[dir="rtl"] .ym{text-align:left}}
[dir="rtl"] .wv-tbl th,[dir="rtl"] .wv-tbl td,[dir="rtl"] .io-tbl .n,[dir="rtl"] .io-after .n,[dir="rtl"] .io-lg .n{text-align:left}
[dir="rtl"] .wv-tbl th:first-child{text-align:right}
[dir="rtl"] .wio-tbl thead th,[dir="rtl"] .wio-n,[dir="rtl"] .wio-t{text-align:right}
[dir="rtl"] .wio-n{padding-right:0!important;padding-left:14px!important;left:auto;right:0}
[dir="rtl"] .wio-t{padding-left:0!important;padding-right:14px!important}
[dir="rtl"] .wio-key i{margin-left:0;margin-right:8px}
[dir="rtl"] .wv-key i+*{margin-right:0;margin-left:6px}
@media (min-width:760px){[dir="rtl"] .wsum span+span::before{margin-right:-14px;margin-left:22px}}
/* dividers, a pin, the timeline, the stop line */
@media (min-width:1024px){[dir="rtl"] .wv-3>section+section{border-left:0;border-right:1px solid var(--line)}}
[dir="rtl"] .wv-ribbon>div:nth-child(2n){border-left:0;border-right:1px solid var(--line)}
@media (min-width:900px){[dir="rtl"] .wv-ribbon>div{border-left:0;border-right:1px solid var(--line)}[dir="rtl"] .wv-ribbon>div:first-child{border-right:0}}
[dir="rtl"] .pin{left:auto;right:-22px}
[dir="rtl"] .tflow li:not(:last-child)::after{right:auto;left:-7px}
@media (max-width:640px){[dir="rtl"] .tflow li:not(:last-child)::after{left:auto;right:27px}}
[dir="rtl"] .td-stop::before{left:-10px;right:12px}
[dir="rtl"] .td-stop i{left:auto;right:0}
[dir="rtl"] .tl::before{left:auto;right:8px}
[dir="rtl"] .tl-node i{margin:3px 1px 0 0}
[dir="rtl"] .tr-step:not(:last-child)::after{content:"\2190";right:auto;left:-9px}
[dir="rtl"] .tr-checks li{padding:12px 52px 12px 14px}
[dir="rtl"] .tr-checks li::before{left:auto;right:14px}
[dir="rtl"] .io-code{margin-left:0;margin-right:6px}
[dir="rtl"] .rart .k{margin-right:0;margin-left:5px}
[dir="rtl"] .thero sup,[dir="rtl"] .tpinned sup{margin-left:0;margin-right:2px}
[dir="rtl"] .vlog-list ul{margin:6px 18px 4px 0}
[dir="rtl"] .fchip{padding:3px 12px 3px 4px}
[dir="rtl"] .slot{padding:0 12px 0 10px}
@media (min-width:760px){[dir="rtl"] .tray{padding:8px 16px 8px 8px}}
@media (max-width:759px){[dir="rtl"] .slot{padding:0 10px 0 8px}}
/* the sign-in screen */
[dir="rtl"] .signin .field,[dir="rtl"] .signin .first,[dir="rtl"] .signin .accept,[dir="rtl"] .signin.gx-form{text-align:right}

/* ---- the footer under every screen (2 October 2026) ---- */
.legal{width:100%;max-width:var(--max);margin:0 auto;padding:0 16px 32px}
@media (min-width:760px){.legal{padding-inline:32px}}
@media (min-width:1200px){.legal{padding-inline:48px}}
@media (max-width:759px){.legal{padding-bottom:calc(var(--tabbar) + 28px + env(safe-area-inset-bottom))}}
.legal:empty{display:none}
.legal-in{border-top:1px solid var(--line);padding-top:22px}
.legal-in h2{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:0.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.legal-in h2 .ico{width:1rem;height:1rem}
.legal-list{list-style:none;margin:0;padding:0;font-size:0.75rem;line-height:1.65;color:var(--ink2)}
.legal-list li{break-inside:avoid;margin:0 0 10px}
.legal-list b{color:var(--ink);font-weight:600}
@media (min-width:900px){.legal-list{column-count:2;column-gap:48px}}
/* ---- About Allocatorr, one column, and About us with photos (2 October 2026) ---- */
.pubapp{border:1px solid var(--line);border-radius:18px;padding:22px;background:var(--surface);margin-bottom:28px}
.pubapp h2{margin:0 0 6px}
.pub-lead{margin:0 0 18px;font-size:1.375rem;line-height:1.3;font-weight:650;letter-spacing:-.02em;color:var(--ink)}
.pub-points{list-style:none;margin:0;padding:0;display:grid;gap:16px}
@media (min-width:760px){.pub-points{grid-template-columns:repeat(3,1fr);gap:24px}}
.pub-points li{display:flex;gap:12px;align-items:flex-start}
.pub-points b{display:block;color:var(--ink);margin-bottom:2px}
.pub-points span{color:var(--ink2);font-size:0.9375rem;line-height:1.5}
.pub-points .aboutico{background:var(--bg)}
.us-co{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:start;border:1px solid var(--line);border-radius:18px;padding:22px;background:var(--surface);margin-bottom:36px}
.us-coico{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--ink);color:var(--bg)}
.us-coico .ico{width:1.5rem;height:1.5rem}
.us-co h2{margin:0 0 4px;font-size:1.5rem;letter-spacing:-.02em}
.us-link{font-weight:600;color:var(--ink)}
.us-teamh{margin:0 0 14px;font-size:0.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.us-card{grid-template-columns:132px minmax(0,1fr);margin-bottom:0}
.us-photo{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:14px;background:var(--surface2)}
.us-lead{grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:28px;padding:26px;margin-bottom:20px}
.us-lead h2{font-size:1.875rem}
.us-lead .us-seen{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px}
.us-seen h3{margin:0 0 12px;font-size:0.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.us-lead .us-logos{margin:0;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.us-lead .us-logos li{min-height:48px;font-size:0.8125rem}
.us-team{display:grid;gap:20px}
@media (min-width:980px){.us-team{grid-template-columns:1fr 1fr}}
.us-creds{display:inline-block;margin-left:10px;font-size:0.8125rem;font-weight:600;letter-spacing:.02em;color:var(--muted);vertical-align:middle}
.us-card .us-text p{font-size:0.9375rem;line-height:1.6}
@media (max-width:599px){.us-card,.us-lead{grid-template-columns:1fr;gap:16px;padding:18px}.us-photo{max-width:160px}.us-lead .us-photo{max-width:200px}.us-co{grid-template-columns:1fr;padding:18px}}

/* ---- "One method, six countries" on Why you can be confident (2 October 2026) ---- */
.tr-world{display:grid;gap:28px;align-items:center;border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:28px;margin:12px 0 8px}
@media (min-width:760px){.tr-world{grid-template-columns:minmax(180px,240px) minmax(0,1fr);gap:40px;padding:34px}}
.tr-globe{width:100%;max-width:240px;height:auto;justify-self:center;color:var(--ink)}
.tr-gl{stroke:currentColor;stroke-width:1.4;opacity:.38}.tr-gl-edge{opacity:.85;stroke-width:2}
.tr-gd-halo{fill:currentColor;opacity:.14}.tr-gd{fill:currentColor}
.tr-world-t{display:flex;flex-direction:column;gap:12px}
.tr-world-t h2{margin:0;font-size:1.875rem;line-height:1.15;letter-spacing:-.03em;text-wrap:balance}
.tr-world-lead{margin:0;font-size:1.125rem;line-height:1.45;font-weight:560;color:var(--ink)}
.tr-world-t>p{max-width:68ch;margin:0;color:var(--ink2)}
.tr-world-t .eyebrow{margin:0}
.tr-chips{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tr-chips li{padding:6px 14px;border-radius:999px;background:var(--bg);border:1px solid var(--line);font-size:0.875rem;font-weight:600;color:var(--ink)}

/* ---- About Allocatorr, made visual (2 October 2026) ---- */
.ab-flow{margin:4px 0 6px}
.ab-tiles{list-style:none;margin:6px 0 4px;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.ab-tiles li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.ab-tiles b{display:block;color:var(--ink);font-weight:600;margin-bottom:2px}
.ab-tiles span:not(.aboutico){font-size:0.875rem;color:var(--ink2);line-height:1.45}
.ab-tiles .aboutico{background:var(--bg)}
.ab-yes .aboutico{background:var(--good-bg,#e6f4ec);color:var(--good,#1a7f4b)}.ab-no .aboutico{background:var(--bad-bg,#fbeaea);color:var(--bad,#b3261e)}
.ab-same{display:flex;gap:8px;align-items:flex-start;margin-top:6px}.ab-same .ico{width:1rem;height:1rem;margin-top:3px;color:var(--muted);flex:none}
.ab-chips{list-style:none;margin:2px 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ab-chips li{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:0.875rem;font-weight:600;color:var(--ink)}
.ab-chips .ico{width:.95rem;height:.95rem;color:var(--muted)}
/* the publishing diagram: prices in, Allocatorr, THE LINE, you, your broker */
.pd{display:grid;gap:14px;margin:6px 0 18px;grid-template-columns:1fr}
@media (min-width:860px){.pd{grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch}}
.pd-side{display:flex;flex-direction:column;gap:10px}
.pd-head{margin:0;font-size:0.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pd-row{display:grid;grid-template-columns:1fr 1fr;gap:26px;position:relative;flex:1}
.pd-row>.pd-node:first-child::after{content:"→";position:absolute;left:calc(50% - 13px);top:50%;transform:translateY(-50%);color:var(--muted);font-size:1.125rem;line-height:1;width:26px;text-align:center}
.pd-node{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--bg);min-width:0}
.pd-node b{font-weight:600;color:var(--ink)}
.pd-node span:not(.pd-ico){font-size:0.8125rem;color:var(--ink2);line-height:1.45}
.pd-ico{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--surface2);color:var(--ink)}
.pd-ico .ico{width:1.1rem;height:1.1rem}
.pd-key{border-color:var(--ink)}.pd-key .pd-ico{background:var(--fill);color:var(--on-fill)}
.pd-line{display:flex;flex-direction:row;align-items:center;gap:10px;padding:10px 0;font-size:0.8125rem;color:var(--ink2);line-height:1.4;border-top:2px dashed var(--line2,var(--line));border-bottom:2px dashed var(--line2,var(--line))}
@media (min-width:860px){.pd-line{flex-direction:column;justify-content:center;text-align:center;width:150px;padding:0 14px;border-top:0;border-bottom:0;border-left:2px dashed var(--line2,var(--line));border-right:2px dashed var(--line2,var(--line))}}
.pd-lock{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--surface2);color:var(--ink);flex:none}.pd-lock .ico{width:1rem;height:1rem}
@media (max-width:520px){.pd-row{grid-template-columns:1fr;gap:26px}.pd-row>.pd-node:first-child::after{content:"↓";left:50%;top:auto;bottom:-24px;transform:translateX(-50%)}}
.pubapp .pub-points{margin-top:6px}
/* where the prices come from: sources in, the index out */
.ab-src{display:grid;gap:14px;align-items:center;grid-template-columns:1fr}
@media (min-width:760px){.ab-src{grid-template-columns:2fr auto 1.2fr}}
.ab-src-in{display:grid;gap:12px;grid-template-columns:1fr 1fr}
@media (max-width:520px){.ab-src-in{grid-template-columns:1fr}}
.ab-src-arrow{display:grid;place-items:center;color:var(--muted)}.ab-src-arrow .ico{width:1.4rem;height:1.4rem}
@media (max-width:759px){.ab-src-arrow{transform:rotate(90deg)}}

/* "Featured on": one-colour marks drawn with the text colour, so they read on light and dark */
.us-logos li{padding:12px 14px;min-height:64px}
.lg{display:block;max-width:100%;background:currentColor;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;opacity:.82}
.lg-adaptrade{-webkit-mask-image:url(/client-assets/featured/adaptrade-v1.webp);mask-image:url(/client-assets/featured/adaptrade-v1.webp)}
.lg-better{-webkit-mask-image:url(/client-assets/featured/better-v1.webp);mask-image:url(/client-assets/featured/better-v1.webp)}
.lg-ceska{-webkit-mask-image:url(/client-assets/featured/ceska-v1.webp);mask-image:url(/client-assets/featured/ceska-v1.webp)}
.lg-futures{-webkit-mask-image:url(/client-assets/featured/futures-v1.webp);mask-image:url(/client-assets/featured/futures-v1.webp)}
.lg-ib{-webkit-mask-image:url(/client-assets/featured/ib-v1.webp);mask-image:url(/client-assets/featured/ib-v1.webp)}
.lg-index{-webkit-mask-image:url(/client-assets/featured/index-v1.webp);mask-image:url(/client-assets/featured/index-v1.webp)}
.lg-nordic{-webkit-mask-image:url(/client-assets/featured/nordic-v1.webp);mask-image:url(/client-assets/featured/nordic-v1.webp)}
.lg-nut{-webkit-mask-image:url(/client-assets/featured/nut-v1.webp);mask-image:url(/client-assets/featured/nut-v1.webp)}
.lg-odds{-webkit-mask-image:url(/client-assets/featured/odds-v1.webp);mask-image:url(/client-assets/featured/odds-v1.webp)}
.lg-quant{-webkit-mask-image:url(/client-assets/featured/quant-v1.webp);mask-image:url(/client-assets/featured/quant-v1.webp)}
.lg-stocks{-webkit-mask-image:url(/client-assets/featured/stocks-v1.webp);mask-image:url(/client-assets/featured/stocks-v1.webp)}
.lg-striker{-webkit-mask-image:url(/client-assets/featured/striker-v1.webp);mask-image:url(/client-assets/featured/striker-v1.webp)}
.lg-systems{-webkit-mask-image:url(/client-assets/featured/systems-v1.webp);mask-image:url(/client-assets/featured/systems-v1.webp)}
.lg-traders{-webkit-mask-image:url(/client-assets/featured/traders-v1.webp);mask-image:url(/client-assets/featured/traders-v1.webp)}
.lg-tradersCom{-webkit-mask-image:url(/client-assets/featured/tradersCom-v1.webp);mask-image:url(/client-assets/featured/tradersCom-v1.webp)}
.lg-adaptrade{aspect-ratio:240/56}
.lg-better{aspect-ratio:240/55}
.lg-ceska{aspect-ratio:240/38}
.lg-futures{aspect-ratio:240/77}
.lg-ib{aspect-ratio:240/75}
.lg-index{aspect-ratio:240/113}
.lg-nordic{aspect-ratio:240/54}
.lg-nut{aspect-ratio:240/133}
.lg-odds{aspect-ratio:240/215}
.lg-quant{aspect-ratio:240/55}
.lg-stocks{aspect-ratio:240/63}
.lg-striker{aspect-ratio:240/77}
.lg-systems{aspect-ratio:240/77}
.lg-traders{aspect-ratio:240/49}
.lg-tradersCom{aspect-ratio:240/71}

/* ==== PORTFOLIAA PRO (8 October 2026) =======================================
   The same app in PORTFOLIAA's look, switched on by data-app="portfoliaa" on
   <html> (assets/pa.js). Warm and adult rather than pink: plum, ivory and ink, a
   serif for headings, every word token above 4.5:1. Only PORTFOLIAA's screens use
   the .pa- classes; the tokens re-colour the shared pieces (charts, buttons, sheet). */
:root[data-app="portfoliaa"]{
  --bg:#fbf8f5; --ink:#1f1a1d; --ink2:#3f363b; --muted:#675c62; --faint:#6b6066;
  --line:#ebe2dd; --grid:#f2ebe7; --surface:#f5eeea; --surface2:#eee4df;
  --up:#21704a; --down:#b3261e; --warn:#7f5300;
  --accent:#8e2457; --accent2:#7a1f4b; --fill:#8e2457; --on-fill:#ffffff; --line-a:#8e2457;
  --index:#5d555a; --hold:#21704a; --mk:#a3979e;
  --s1:#8e2457; --s2:#c0623e; --s3:#2e7d6b;
  --hero:#3d1027; --on-hero:#ffffff; --on-hero2:#efd3df;
  --pa-wash:#f6e9ef; --pa-rose:#e9c9d6; --pa-gold:#a8742a;
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,"Times New Roman",serif;
}
@media (prefers-color-scheme:dark){
  :root[data-app="portfoliaa"]:not([data-theme="light"]){
    --bg:#160f13; --ink:#f6eff2; --ink2:#dccfd5; --muted:#ae9fa7; --faint:#a5969e;
    --line:#2e232a; --grid:#22191f; --surface:#1f171b; --surface2:#291e24;
    --up:#5ccf94; --down:#ff8a80; --warn:#f2c35a;
    --accent:#f2a9c8; --accent2:#f2a9c8; --fill:#e07aa6; --on-fill:#2a0a19; --line-a:#e889b0;
    --index:#bcb0b6; --hold:#5ccf94; --mk:#7f7179;
    --s1:#e889b0; --s2:#e08a66; --s3:#5cbfa5;
    --hero:#3d1027; --on-hero:#ffffff; --on-hero2:#efd3df;
    --pa-wash:#2a1720; --pa-rose:#4a2535; --pa-gold:#d9a55a;
  }
}
:root[data-app="portfoliaa"][data-theme="dark"]{
  --bg:#160f13; --ink:#f6eff2; --ink2:#dccfd5; --muted:#ae9fa7; --faint:#a5969e;
  --line:#2e232a; --grid:#22191f; --surface:#1f171b; --surface2:#291e24;
  --up:#5ccf94; --down:#ff8a80; --warn:#f2c35a;
  --accent:#f2a9c8; --accent2:#f2a9c8; --fill:#e07aa6; --on-fill:#2a0a19; --line-a:#e889b0;
  --index:#bcb0b6; --hold:#5ccf94; --mk:#7f7179;
  --s1:#e889b0; --s2:#e08a66; --s3:#5cbfa5;
  --hero:#3d1027; --on-hero:#ffffff; --on-hero2:#efd3df;
  --pa-wash:#2a1720; --pa-rose:#4a2535; --pa-gold:#d9a55a;
}
[data-app="portfoliaa"] #brand .mark,[data-app="portfoliaa"] #brand .word{display:none}
.pa-word{font:600 1.375rem/1 var(--serif);letter-spacing:-.01em;color:var(--ink)}
.pa-word b{font-weight:600;color:var(--accent)}
.pa-page{max-width:var(--max);margin:0 auto;padding:28px 16px 40px;display:flex;flex-direction:column;gap:22px}
.pa-read{max-width:760px}
.pa-read section{display:flex;flex-direction:column;gap:10px}
.pa-hero{display:flex;flex-direction:column;gap:8px;max-width:760px}
.pa-h1{font:600 clamp(2rem,1.4rem + 2.4vw,2.75rem)/1.08 var(--serif);letter-spacing:-.02em}
.pa-h2{font:600 1.5rem/1.2 var(--serif);letter-spacing:-.01em}
.pa-h3{font:600 1.1875rem/1.25 var(--serif)}
.pa-gap{margin-top:8px}
.pa-banner{display:flex;gap:10px;align-items:flex-start;background:var(--pa-wash);border-radius:12px;padding:12px 14px;font-size:0.875rem;color:var(--ink2)}
.pa-banner .ico{color:var(--accent);margin-top:2px}
.pa-banner b{color:var(--ink)}
/* the board */
.pa-board{border:1px solid var(--line);border-radius:16px;background:var(--bg);overflow:hidden}
.pa-board-head,.pa-row{display:grid;grid-template-columns:3rem minmax(0,2.3fr) minmax(0,1.5fr) minmax(0,1fr) minmax(0,.9fr) 2.75rem;gap:16px;align-items:center;padding:18px 20px}
.pa-board-head{font-size:0.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding-block:12px}
.pa-list{list-style:none;margin:0;padding:0}
.pa-row{border-bottom:1px solid var(--line)}
.pa-row:last-child{border-bottom:0}
.pa-row.sig{background:linear-gradient(90deg,var(--pa-wash),transparent 70%)}
.pa-n{font:500 1rem var(--serif);color:var(--muted)}
.pa-who{display:flex;flex-direction:column;gap:3px;min-width:0}
.pa-name{all:unset;cursor:pointer;font:600 1.1875rem/1.25 var(--serif);color:var(--ink);overflow-wrap:anywhere}
.pa-name:hover{color:var(--accent)}
.pa-name:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.pa-line{color:var(--ink2);font-size:0.9375rem}
.pa-meta{color:var(--muted);font-size:0.8125rem}
.pa-row-foot{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.pa-spark{cursor:pointer;min-width:0}
.pa-num{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.pa-num b{font-size:1.375rem;font-weight:600;letter-spacing:-.01em}
.pa-num span{font-size:0.8125rem;color:var(--muted)}
.pa-vs.up{color:var(--up)} .pa-vs.down{color:var(--down)}
.down{color:var(--down)}
.pa-open{all:unset;cursor:pointer;display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--line);color:var(--accent)}
.pa-open:hover{background:var(--pa-wash)}
.pa-open:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:820px){
  .pa-board-head{display:none}
  .pa-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"who who" "spark spark" "num fall";gap:10px 16px;padding:16px}
  .pa-n,.pa-open{display:none}
  .pa-who{grid-area:who} .pa-spark{grid-area:spark} .pa-num{grid-area:num;align-items:flex-start;text-align:left} .pa-num.fall{grid-area:fall;align-items:flex-end;text-align:right}
}
/* faces */
.pa-faces{display:inline-flex;align-items:center}
.pa-av{display:inline-grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;font:600 0.8125rem/1 var(--f);color:#fff;border:2px solid var(--bg);margin-left:-8px;flex:none;letter-spacing:.02em}
.pa-faces .pa-av:first-child{margin-left:0}
.pa-av.t0{background:#8e2457} .pa-av.t1{background:#b0466f} .pa-av.t2{background:#5c1838} .pa-av.t3{background:#9a5a3c}
.pa-av.co{background:var(--pa-wash);color:var(--accent);border-color:var(--pa-rose)}
.pa-av.more{background:var(--surface2);color:var(--ink2)}
.pa-av.lg{width:3.25rem;height:3.25rem;font-size:1rem;margin:0}
.pa-av.xl{width:4.5rem;height:4.5rem;font:600 1.375rem/1 var(--serif);margin:0}
/* badges */
.pa-sig,.pa-prev{display:inline-flex;align-items:center;gap:5px;font-size:0.75rem;font-weight:600;letter-spacing:.04em;border-radius:999px;padding:4px 10px;line-height:1.2}
.pa-sig{background:var(--accent);color:var(--on-fill)}
.pa-sig .ico{width:0.8rem;height:0.8rem}
.pa-prev{background:var(--surface2);color:var(--ink2)}
/* teasers under the board */
.pa-teasers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:760px){.pa-teasers{grid-template-columns:minmax(0,1fr)}}
.pa-teaser{border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.pa-teaser p{color:var(--ink2);margin-top:4px}
/* the sheet */
.pa-sh-title{display:flex;flex-direction:column;gap:6px;min-width:0}
.pa-badges{display:flex;gap:6px;flex-wrap:wrap}
.pa-sheet{display:flex;flex-direction:column;gap:18px}
.pa-top{display:flex;flex-direction:column;gap:10px}
.pa-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pa-pair div{display:flex;flex-direction:column}
.pa-pair b{font-size:1.5rem;font-weight:600;overflow-wrap:anywhere}
.pa-pair.big b{font:600 clamp(2rem,1.4rem + 2vw,2.5rem)/1.05 var(--serif)}
.pa-pair span{color:var(--muted);font-size:0.8125rem}
.pa-chart .legend{margin-bottom:6px}
.pa-box{border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.pa-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:520px){.pa-two{grid-template-columns:minmax(0,1fr)}}
.pa-two .k{font-size:0.8125rem;color:var(--muted);font-weight:600}
.pa-two .v{font-size:1.125rem;font-weight:600}
.pa-years{width:100%;border-collapse:collapse;font-size:0.875rem}
.pa-years th{text-align:right;font-weight:600;color:var(--muted);font-size:0.75rem;padding:6px 4px;border-bottom:1px solid var(--line)}
.pa-years td{text-align:right;padding:6px 4px;border-bottom:1px solid var(--grid)}
.pa-years th:first-child,.pa-years td:first-child{text-align:left}
.pa-people{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.pa-person,.pa-company{display:grid;grid-template-columns:3.25rem minmax(0,1fr);gap:12px;align-items:start}
.pa-person .r{color:var(--ink2);font-size:0.875rem}
.pa-company ul{margin:4px 0;padding-left:18px;color:var(--ink2)}
.src{font-size:0.75rem;color:var(--muted)}
.src a{color:var(--accent)}
.pa-sector h4{font-size:0.8125rem;color:var(--muted);font-weight:600;margin:6px 0}
.pa-hold{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.pa-hold li{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:0.8125rem;max-width:100%}
.pa-hold .nm{overflow-wrap:anywhere}
.pa-hold .cat{color:var(--muted);font-size:0.75rem}
.pa-hold .times{color:var(--accent);font-weight:600;font-size:0.75rem}
.pa-basis summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:0.875rem}
.pa-basis ul{margin:8px 0 0;padding-left:18px;color:var(--ink2);font-size:0.8125rem;display:flex;flex-direction:column;gap:4px}
/* the women */
.pa-lgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr));gap:16px}
.pa-lcard{border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:14px;align-items:start}
.pa-lcard h3{font:600 1.1875rem/1.25 var(--serif)}
.pa-lcard .r{color:var(--ink2);font-size:0.875rem}
.pa-lcard .co{color:var(--accent);font-weight:600;font-size:0.875rem;margin-bottom:6px}
.pa-lcard p{margin-bottom:4px}
.pa-facts{margin:4px 0;padding-left:18px;color:var(--ink2)}
.pa-in{font-size:0.8125rem;color:var(--muted)}
.pa-link{all:unset;cursor:pointer;color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.pa-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* how it works */
.pa-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.pa-step{display:grid;grid-template-columns:2.5rem minmax(0,1fr);gap:12px;align-items:start}
.pa-stepn{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--pa-wash);color:var(--accent);font:600 1rem var(--serif)}
.pa-step h3{font-size:1rem;font-weight:600}
.pa-step p{color:var(--ink2)}
.pa-points{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:640px){.pa-points{grid-template-columns:minmax(0,1fr)}}
.pa-point{display:grid;grid-template-columns:1.5rem minmax(0,1fr);gap:10px;align-items:start}
.pa-point .ico{color:var(--accent);margin-top:2px}
.pa-point p{color:var(--ink2);font-size:0.9375rem}