/* =====================================================================
   NEXTAI · the system, in the language of brand book 3.2 ("הסמן").
   Night is the identity, day is available. Four colours and one of them speaks:
   yellow means "here": where the agent writes, what matters, where you are.
   The storm scale is the only other colour, and only in storm context.
   ===================================================================== */
:root{
  color-scheme:dark;
  --bg:#0A0A0B; --surface:#131315; --s2:#1B1B1E; --s3:#242428; --line:#26262B; --line2:#3A3A40;
  --text:#F4F4F1; --text2:#DEDED8; --muted:#A3A39C; --faint:#86867F; --dim:#5E5E64;
  --sig:#FFDA1F; --sigsoft:#FFEE9A; --markink:#0A0A0B;
  --sigtext:#FFDA1F; --agent:#FFDA1F; --caret:#FFDA1F; --sel:#FFDA1F; --selstroke:#131315; --focus:#FFDA1F;
  --stampbg:transparent; --stampfg:#FFDA1F; --stampbd:rgba(255,218,31,.5); --stampcur:#FFDA1F;
  --pillbg:#1B1B1E; --pillbd:rgba(255,218,31,.5);
  --curve:#BDBDB6; --hotband:#FFDA1F; --hotw:3.2px; --hotline:#FFDA1F; --grid:#151518; --grid2:#1E1E22;
  --past:#34343A; --off:#222226; --edge:transparent; --ph:#1F1F23; --ph2:#2A2A2F; --imgop:.9; --hov:#111113;
  --l0:#3E3E45; --l1:#85857F; --l2:#FFDA1F; --l3:#FF9A1F; --l4:#FF4B2B;
  --lt0:#A3A39C; --lt1:#C9C9C2; --lt2:#FFDA1F; --lt3:#FFB14D; --lt4:#FF7A5E;
  --n1:#F4F4F1; --n2:#85857F; --n3:#45454D;
  --inv:#F4F4F1; --invink:#0A0A0B; --up:#F4F4F1; --down:#A3A39C;
  --display:Karantina,"Secular One","IBM Plex Sans Hebrew",Impact,sans-serif;
  --sans:"IBM Plex Sans Hebrew",-apple-system,"Segoe UI",Arial,sans-serif;
  --mono:"IBM Plex Mono","IBM Plex Sans Hebrew",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --r:4px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ color-scheme:dark; } }
/* an explicit light choice in the viewer, or the page's own day view */
:root[data-theme="light"], body.day{
  color-scheme:light;
  --bg:#F4F4F1; --surface:#FFFFFF; --s2:#EDEDEA; --s3:#E2E2DE; --line:#DCDCD6; --line2:#BDBDB6;
  --text:#0A0A0B; --text2:#2A2A2E; --muted:#5A5A60; --faint:#6B6B72; --dim:#A8A8A2;
  --sigtext:#0A0A0B; --agent:#0A0A0B; --caret:#0A0A0B; --sel:#0A0A0B; --selstroke:#0A0A0B; --focus:#0A0A0B;
  --stampbg:#FFDA1F; --stampfg:#0A0A0B; --stampbd:#FFDA1F; --stampcur:#0A0A0B;
  --pillbg:#FFDA1F; --pillbd:#FFDA1F;
  --curve:#55555C; --hotband:#FFDA1F; --hotw:9px; --hotline:#0A0A0B; --grid:#EFEFEB; --grid2:#E4E4DF;
  --past:#D6D6D1; --off:#E8E8E4; --edge:#DCDCD6; --ph:#E2E2DE; --ph2:#D6D6D1; --imgop:1; --hov:#EAEAE6;
  --l0:#C9C9C2; --l1:#8A8A84; --l2:#F2C200; --l3:#EE8A00; --l4:#DD3B1C;
  --lt0:#55555C; --lt1:#36363B; --lt2:#0A0A0B; --lt3:#9A5200; --lt4:#C2361A;
  --n1:#0A0A0B; --n2:#8A8A84; --n3:#C9C9C2;
  --inv:#0A0A0B; --invink:#F4F4F1; --up:#0A0A0B; --down:#5A5A60;
}
/* device prefers light and the viewer has not chosen: same light palette as the
   explicit light block above. Mirrors tokens.css's selector so the two never disagree.
   Without it, --text2 (body copy, deks, captions) stayed on the dark value #DEDED8. */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]):not(:has(body.night)){
    color-scheme:light;
    --bg:#F4F4F1; --surface:#FFFFFF; --s2:#EDEDEA; --s3:#E2E2DE; --line:#DCDCD6; --line2:#BDBDB6;
    --text:#0A0A0B; --text2:#2A2A2E; --muted:#5A5A60; --faint:#6B6B72; --dim:#A8A8A2;
    --sigtext:#0A0A0B; --agent:#0A0A0B; --caret:#0A0A0B; --sel:#0A0A0B; --selstroke:#0A0A0B; --focus:#0A0A0B;
    --stampbg:#FFDA1F; --stampfg:#0A0A0B; --stampbd:#FFDA1F; --stampcur:#0A0A0B;
    --pillbg:#FFDA1F; --pillbd:#FFDA1F;
    --curve:#55555C; --hotband:#FFDA1F; --hotw:9px; --hotline:#0A0A0B; --grid:#EFEFEB; --grid2:#E4E4DF;
    --past:#D6D6D1; --off:#E8E8E4; --edge:#DCDCD6; --ph:#E2E2DE; --ph2:#D6D6D1; --imgop:1; --hov:#EAEAE6;
    --l0:#C9C9C2; --l1:#8A8A84; --l2:#F2C200; --l3:#EE8A00; --l4:#DD3B1C;
    --lt0:#55555C; --lt1:#36363B; --lt2:#0A0A0B; --lt3:#9A5200; --lt4:#C2361A;
    --n1:#0A0A0B; --n2:#8A8A84; --n3:#C9C9C2;
    --inv:#0A0A0B; --invink:#F4F4F1; --up:#0A0A0B; --down:#5A5A60;
  }
}
/* the page's own night view wins over a light viewer */
body.night{
  color-scheme:dark;
  --bg:#0A0A0B; --surface:#131315; --s2:#1B1B1E; --s3:#242428; --line:#26262B; --line2:#3A3A40;
  --text:#F4F4F1; --text2:#DEDED8; --muted:#A3A39C; --faint:#86867F; --dim:#5E5E64;
  --sigtext:#FFDA1F; --agent:#FFDA1F; --caret:#FFDA1F; --sel:#FFDA1F; --selstroke:#131315; --focus:#FFDA1F;
  --stampbg:transparent; --stampfg:#FFDA1F; --stampbd:rgba(255,218,31,.5); --stampcur:#FFDA1F;
  --pillbg:#1B1B1E; --pillbd:rgba(255,218,31,.5);
  --curve:#BDBDB6; --hotband:#FFDA1F; --hotw:3.2px; --hotline:#FFDA1F; --grid:#151518; --grid2:#1E1E22;
  --past:#34343A; --off:#222226; --edge:transparent; --ph:#1F1F23; --ph2:#2A2A2F; --imgop:.9; --hov:#111113;
  --l0:#3E3E45; --l1:#85857F; --l2:#FFDA1F; --l3:#FF9A1F; --l4:#FF4B2B;
  --lt0:#A3A39C; --lt1:#C9C9C2; --lt2:#FFDA1F; --lt3:#FFB14D; --lt4:#FF7A5E;
  --n1:#F4F4F1; --n2:#85857F; --n3:#45454D;
  --inv:#F4F4F1; --invink:#0A0A0B; --up:#F4F4F1; --down:#A3A39C;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-padding-top:calc(84px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:inherit}
button:disabled{cursor:default}
input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:2px}
h1,h2,h3,h4{margin:0;font-weight:700;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
.m{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums}
.lbl{display:block;font-size:12.5px;font-weight:700;letter-spacing:.03em;line-height:1.4;color:var(--muted)}
.blink{animation:blink 1.06s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.app{display:flex;flex-direction:column;min-height:100vh}
#view{flex:1;outline:none}
.wrap{max-width:1440px;margin:0 auto;padding-inline:clamp(16px,3.4vw,48px);padding-block:32px 88px;display:flex;flex-direction:column;gap:56px}
.wrap-home{padding-block-start:24px;gap:48px}

/* ---------- site bar: always night, the logo's stage ---------- */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:#0A0A0B;border-bottom:1px solid #1E1E22;color:#F4F4F1}
.logo{display:flex;direction:ltr;flex:none;align-items:center}
.logo svg{height:22px;width:auto;display:block}
.chan{display:flex;gap:26px;height:100%;flex:1;min-width:0}
.chan a{display:flex;align-items:center;height:100%;padding-top:2px;border-bottom:2px solid transparent;color:#A3A39C;font-size:14px;font-weight:600;white-space:nowrap;flex:none}
.chan a:hover{color:#F4F4F1}
.chan a[aria-current="page"]{color:#F4F4F1;border-bottom-color:#FFDA1F}
.search{display:flex;align-items:center;gap:10px;width:268px;height:38px;padding:0 12px;border-radius:var(--r);background:#131315;border:1px solid #26262B;color:#A3A39C}
.search:focus-within{border-color:#FFDA1F}
.search input{flex:1;min-width:0;border:0;background:transparent;color:#F4F4F1;font-size:13.5px;outline:none}
.search input::placeholder{color:#86867F;opacity:1}
.search kbd{font:500 11.5px/1 var(--mono);padding:3px 6px;border:1px solid #3A3A40;border-radius:3px;color:#86867F}
.bar-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 12px;border-radius:var(--r);border:1px solid #3A3A40;color:#DEDED8;font-size:13px;font-weight:600;white-space:nowrap;flex:none}
.bar-btn:hover{background:#1B1B1E}
.bar :focus-visible{outline-color:#FFDA1F}
@media (max-width:1240px){ .search{width:210px} .chan{gap:20px} }
@media (max-width:1060px){ .search{display:none} }
@media (max-width:860px){
  .logo{height:52px}
  .logo svg{height:19px}
  .bar .theme{display:none}
  .chan{order:5;flex:0 0 100%;height:44px;gap:22px;overflow-x:auto;scrollbar-width:none;padding-inline-end:28px;
        -webkit-mask-image:linear-gradient(to right,transparent 0,#000 36px);mask-image:linear-gradient(to right,transparent 0,#000 36px)}
  .chan::-webkit-scrollbar{display:none}
}

/* ---------- atoms ---------- */
.stamp{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 13px;border-radius:999px;border:1px solid var(--stampbd);background:var(--stampbg);color:var(--stampfg);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap}
.stamp i{width:6px;height:13px;border-radius:1px;background:var(--stampcur);flex:none}
.stamp .m{font-size:12.5px}
.mono{flex:none;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--text2);display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:600;color:var(--text);direction:ltr;line-height:1}
.mono.hl{box-shadow:inset 0 0 0 2px var(--sel)}
mark.w1,mark.w2{unicode-bidi:isolate;color:var(--markink);border-radius:5px;padding:.02em .1em 0;background-color:transparent;background-repeat:no-repeat;background-position:right 60%;background-size:100% 86%;-webkit-box-decoration-break:clone;box-decoration-break:clone}
mark.w1{background-image:linear-gradient(var(--sigsoft),var(--sigsoft))}
mark.w2{background-image:linear-gradient(var(--sig),var(--sig))}
.sweep mark{color:inherit;background-size:0% 86%;animation:sweep .75s cubic-bezier(.2,.7,.2,1) forwards,inkc .3s forwards;animation-delay:var(--d,.6s),calc(var(--d,.6s) + .25s)}
@keyframes sweep{to{background-size:100% 86%}}
@keyframes inkc{to{color:var(--markink)}}
.agent{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.03em;line-height:1.4;color:var(--text)}
.agent i{width:5px;height:12px;border-radius:1px;background:var(--agent);flex:none}
.plate{background:var(--surface);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--edge)}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line2);font-size:13px;font-weight:600;line-height:1;color:var(--text);white-space:nowrap;flex:none}
.chip .m{font-size:12px;color:var(--muted)}
.chip:hover{background:var(--s2)}
.chip[aria-pressed="true"]{background:var(--inv);color:var(--invink);border-color:var(--inv)}
.chip[aria-pressed="true"] .m{color:var(--invink)}
.chip:disabled{color:var(--dim);background:none}
.chip:disabled .m{color:var(--dim)}
.chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* one row of chips; when it is longer than its column it scrolls sideways and fades at its end */
.chips.scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-block:4px;margin-block:-4px}
.chips.scroll::-webkit-scrollbar{display:none}
.chips.scroll.ovf{padding-inline-end:40px}
.feed-head .chips{gap:6px}
.feed-head .chip{padding:0 12px;gap:5px;font-size:12.5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r);border:1px solid var(--inv);background:var(--inv);color:var(--invink);font-size:14px;font-weight:700;line-height:1;white-space:nowrap}
.btn:hover{opacity:.88}
.btn.out{background:transparent;color:var(--text);border-color:var(--line2)}
.btn.out:hover{background:var(--s2);opacity:1}
.btn.full{width:100%}
.icon-btn{width:36px;height:36px;flex:none;border-radius:var(--r);border:1px solid var(--line2);display:inline-flex;align-items:center;justify-content:center;color:var(--text)}
.icon-btn:hover{background:var(--s2)}
.go{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;line-height:1;color:var(--text)}
.go:hover{text-decoration:underline;text-underline-offset:4px}
.badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;line-height:1.4;color:var(--muted);white-space:nowrap}
.badge b{width:24px;height:24px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--text);display:inline-flex;align-items:center;justify-content:center;font:600 11.5px/1 var(--mono);color:var(--text)}
.badge.on b{background:var(--sig);color:#0A0A0B;box-shadow:inset 0 0 0 2px var(--selstroke)}
.badge .m{color:var(--text2)}
button.badge{border-radius:999px;padding:2px 10px 2px 2px;margin:-2px -10px -2px -2px}
button.badge:hover{background:var(--s2);color:var(--text)}
.sec{display:flex;flex-direction:column;gap:18px}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;border-top:2px solid var(--text);padding-top:16px}
.sec-h h2{font-family:var(--display);font-size:clamp(34px,3.6vw,46px);line-height:1;margin-top:4px}
.hint{font-size:14px;color:var(--muted)}
.rail-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-top:2px solid var(--text);padding-top:12px}
.rail-h h2{font-family:var(--display);font-size:30px;line-height:1}
.rail-h .m{font-size:12.5px;color:var(--faint)}
.empty{display:flex;flex-direction:column;gap:6px;padding:22px 24px}
.empty b{font-size:16.5px}
.empty span{font-size:14.5px;color:var(--muted);line-height:1.55}

/* ---------- "מה קורה היום": the whole day in one screen, six tabs ----------
   The block takes about two thirds of the screen height, so the feed always peeks below it.
   Each tab is also a readout: the tab strip alone tells you the day. The panel is a size
   container, so every tab lays itself out for the space it actually has. */
/* the cursor stands before the title, where a Hebrew line begins */
.caret{display:inline-block;width:.24em;height:.72em;background:var(--caret);margin-inline-end:.2em;vertical-align:-.02em}
.dc{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:clamp(564px,79.2vh,984px);border-top:2px solid var(--text);padding-top:14px}
/* a grid, not a flexbox: the panel's row is resolved before it is laid out, so its container units see its real height */
@supports (height:1svh){ .dc{height:clamp(564px,79.2svh,984px)} }
/* the block on its own page has nothing to leave room for: 15% taller on a screen, about a third on a phone */
.dc-head{flex:none;display:flex;align-items:center;gap:8px 22px;padding-bottom:16px;min-width:0}
.dc-head h1{font-family:var(--display);font-size:clamp(34px,3.3vw,48px);line-height:.92;white-space:nowrap}
.dc-meta{display:flex;align-items:center;gap:4px 16px;flex-wrap:wrap;min-width:0;font-size:14px;line-height:1.4;color:var(--muted)}
.dc-meta .m,.dc-meta .v{color:var(--text)}
.dc-act{margin-inline-start:auto;display:flex;align-items:center;gap:10px;flex:none}
.dc-act .btn{min-height:38px;padding:0 14px;font-size:13.5px}

/* the tab strip: folder tabs, the chosen one opens into the panel and carries the cursor */
.dc-tabs{flex:none;display:flex;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.dc-tabs::-webkit-scrollbar{display:none}
.dct{position:relative;flex:1 1 0;min-width:136px;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:11px 16px 12px;border:1px solid transparent;border-bottom-color:var(--edge);border-radius:var(--r) var(--r) 0 0;text-align:right;color:var(--muted)}
.dct:hover{background:var(--hov);color:var(--text2)}
.dct:focus-visible{outline-offset:-4px}
.dct + .dct::before{content:"";position:absolute;inset-block:16px;inset-inline-start:-1px;width:1px;background:var(--line)}
.dct[aria-selected="true"]::before,.dct[aria-selected="true"] + .dct::before{display:none}
.dct[aria-selected="true"]{background:var(--surface);border-color:var(--edge);border-bottom-color:transparent;color:var(--text)}
.dct-l{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;letter-spacing:.02em;line-height:1.2;white-space:nowrap}
.dct-l i{width:5px;height:13px;border-radius:1px;flex:none;background:transparent}
.dct[aria-selected="true"] .dct-l i{background:var(--agent)}
.dct-v{display:flex;align-items:baseline;gap:8px;min-width:0;font-family:var(--display);font-size:26px;line-height:1;color:var(--text2);white-space:nowrap}
.dct[aria-selected="true"] .dct-v{color:var(--text)}
.dct-v small{font:600 12.5px/1 var(--sans);color:var(--muted)}
.dct-v .num{direction:ltr}
.dct-v svg,.dct-v .dm{margin-inline-start:auto;align-self:center;flex:none;overflow:visible}
.dm{display:block;width:44px;height:4px;border-radius:2px;background:var(--s3);position:relative}
.dm i{position:absolute;inset-block:0;inset-inline-start:0;border-radius:2px;background:currentColor}
.clk{display:inline-flex;direction:ltr}
.clk span{display:inline-block;width:.39em;text-align:center}
.clk span.sep{width:.17em}
/* low screens: a slimmer header and tab strip leave the panel its height */
@media (max-height:820px) and (min-width:761px){
  .dc-head{padding-bottom:10px}
  .dc-head h1{font-size:38px}
  .dct{padding:8px 16px 9px;gap:5px}
  .dct-v{font-size:23px}
}

/* the panel */
.dc-panel{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:var(--surface);border:1px solid var(--edge);border-top:0;border-radius:0 0 var(--r) var(--r);container:dcp / size;outline:none}
.dc-panel:focus-visible{box-shadow:inset 0 0 0 2px var(--focus)}
.dc-pane{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);min-width:0;min-height:0;padding:26px;padding:clamp(16px,min(2.4cqw,6.4cqh),30px)}
.dc-pane.in{animation:paneIn .26s cubic-bezier(.2,.7,.2,1) both}
@keyframes paneIn{from{opacity:0;transform:translateY(8px)}}
/* a neighbouring tab slides in from its own side */
.dc-pane.in.from-l{animation-name:paneInL}
.dc-pane.in.from-r{animation-name:paneInR}
@keyframes paneInL{from{opacity:0;transform:translateX(-18px)}}
@keyframes paneInR{from{opacity:0;transform:translateX(18px)}}
.lbl-d{display:none}
.dc-pane.scrolly{overflow-y:auto;overscroll-behavior:contain}

/* shared pieces inside the panel */
.log{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;font-size:13.5px;line-height:1.4;color:var(--muted)}
.log-end{margin-inline-start:auto;display:inline-flex;align-items:center;gap:14px}
.log-end a{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--text)}
.log-end a:hover{text-decoration:underline;text-underline-offset:3px}
.duel-bar{position:relative;height:12px;background:var(--s3);border-radius:2px}
.duel-bar i{position:absolute;inset-block:0;inset-inline-start:0;width:50%;background:var(--text2);border-radius:2px;transition:width 1.1s cubic-bezier(.3,.7,.2,1)}
.duel-bar span{position:absolute;inset-block:-5px;width:2px;background:var(--muted)}
.gauge svg{display:block;width:100%;height:auto;overflow:visible}
.reading{display:flex;align-items:baseline;justify-content:center;gap:14px}
.reading .val{font-family:var(--display);line-height:.86;direction:ltr}
.reading .word{font-family:var(--display);line-height:.9;color:var(--lvt,var(--sigtext))}
.compare{font-size:13.5px;line-height:1.5;color:var(--muted);text-align:center}
.compare .m{color:var(--text)}
.compare > span{white-space:nowrap}
.week{display:flex;align-items:flex-end;gap:6px;padding-top:var(--wpt,22px);border-bottom:1px solid var(--line2)}
.week i{flex:1 1 0;display:block;min-height:4px;border-radius:2px 2px 0 0;position:relative}
.week{position:relative}
.week i::after{content:attr(data-v);position:absolute;bottom:calc(100% + 4px);inset-inline:0;text-align:center;font:500 11px var(--mono);color:var(--faint)}
.week i.today::after{font:600 12px var(--mono);color:var(--lvt)}
/* the month's average as a dashed line across the week: today stands well above it */
.week-avg{position:absolute;inset-inline:0;bottom:calc((100% - var(--wpt,22px)) * var(--p));border-top:1px dashed var(--muted);pointer-events:none}
.week-avg em{position:absolute;inset-inline-start:0;bottom:3px;padding-inline-end:6px;font-style:normal;font-size:11.5px;font-weight:600;line-height:1.2;color:var(--muted);background:var(--surface);white-space:nowrap}
.week-avg .m{color:var(--text2)}
.week-l{display:flex;gap:6px;font-size:11.5px;color:var(--faint);text-align:center}
.week-l span{flex:1 1 0}
.week-l .today{color:var(--text);font-weight:700}

/* the seismograph (also used on the post and story pages) */
.curve{padding-top:8px}
.curve svg{display:block;width:100%;overflow:visible}
.mk{cursor:pointer;outline:none}
.mk:focus-visible circle.dot{stroke:var(--focus);stroke-width:3}
.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:draw 1.4s cubic-bezier(.3,.7,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}

/* 1 · העיקר: the headline, the story, and the moment that changed it */
.ps{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr) minmax(250px,31%);grid-template-rows:auto auto;grid-template-areas:"main side" "log side";align-content:start;column-gap:clamp(24px,3.4cqw,52px);row-gap:8px}
.ps-main{grid-area:main;display:flex;flex-direction:column;gap:16px;gap:clamp(8px,1.8cqh,14px);min-width:0;min-height:0;max-height:100%}
/* the two columns are equal-height siblings: the row can only be as tall as the pane
   box, and each column must give its slack up instead of overflowing it */
.ps-side{grid-area:side;display:flex;flex-direction:column;min-width:0;min-height:0;max-height:100%;padding-inline-start:clamp(20px,2.6cqw,36px);border-inline-start:1px solid var(--line)}
/* the intro paragraph is the flexible one — it absorbs whatever room is left,
   but keeps at least two readable lines */
.ps-text{max-width:70ch;font-size:17px;font-size:clamp(15px,min(4.3cqh,1.6cqw),19px);line-height:1.62;color:var(--text2);flex:0 1 auto;min-height:2.6em;overflow:hidden}
.ps .headline{max-width:14em;font-family:var(--display);font-size:64px;font-size:clamp(34px,min(12cqh,5.2cqw),66px);line-height:1.04;text-wrap:balance;flex:0 0 auto}
.ps-text .t-short{display:none}
.ps .log{grid-area:log;align-self:end}
.ps .log-s{display:none}
.ps{grid-template-rows:auto auto}
.ps-more{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,2.4cqh,18px);border-top:1px solid var(--line2);padding-top:clamp(10px,2.4cqh,16px)}
.mk{grid-column:1/-1;display:flex;flex-direction:column;gap:6px}
.mk-h{margin:0;font:700 13px var(--font-site);letter-spacing:0;color:var(--text2)}
.qs{min-width:0;display:flex;flex-direction:column;gap:4px}
.qs-src{display:flex;justify-content:space-between;gap:8px;font:600 14px var(--font-site);color:var(--text);letter-spacing:0}
.qs-src .qs-t{color:var(--faint);font-weight:500}
.qs-h{margin:0;font-size:clamp(15px,min(3.9cqh,1.4cqw),18px);line-height:1.35;font-weight:700;color:var(--text)}
.qs-d{margin:0;font-size:13.5px;line-height:1.5;color:var(--text2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ps-why{display:flex;align-items:baseline;gap:10px;max-width:66ch;font-size:16px;font-size:clamp(14.5px,min(3.9cqh,1.35cqw),17px);line-height:1.55;color:var(--text)}
.ps-why .agent{flex:none}
.ps-card{display:flex;flex-direction:column;gap:6px;min-width:0;padding-block:12px;border-bottom:1px solid var(--line);text-align:right;color:inherit}
.ps-card:first-child{padding-top:0}
.ps-card:last-child{padding-bottom:0;border-bottom:0}
.ps-card:hover .lbl{color:var(--text)}
/* המדדים בגובה טבעי; השאלה נשארת בגובה טבעי */
.ps-metrics{flex:0 0 auto;align-content:stretch}
.ps-metrics .ps-card{justify-content:flex-start}
.ps-metrics{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border-bottom:1px solid var(--line);padding-bottom:8px}
.ps-metrics .ps-card{padding-block:7px;border-bottom:0}
.ps-metrics .ps-int{background:linear-gradient(225deg,color-mix(in srgb,var(--accent) 7%,transparent),transparent 62%);border-radius:10px;padding-inline:12px;padding-block:9px}
.ps-metrics .ps-fear{padding-inline-start:12px;border-inline-start:1px solid var(--line)}
/* family note under the chart title: up to two lines — a truncated note loses
   the fact it carries, and there is room in the metrics box for it */
.ps-rare{font-size:13px;font-weight:600;line-height:1.32;color:var(--text2);margin-top:1px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ps-metrics .ps-int .lbl,.ps-metrics .ps-fear .lbl{color:var(--text2);font-weight:700;font-size:14px}
.ps-metrics .ps-int .ps-rare{color:var(--text)}
.ps-int{flex:0 0 auto;min-height:0}
.ps-fear{flex:0 0 auto}
/* compact side metrics: value + word on one line, optional weekly bars */
.ps-card.ps-int,.ps-card.ps-fear{padding-block:8px;gap:3px}
.ps-int .ps-read .v,.ps-fear .ps-read .v{font-size:clamp(34px,min(9cqh,3.3cqw),48px)}
.ps-int .ps-read .w,.ps-fear .ps-read .w{font-size:clamp(18px,min(4.6cqh,2cqw),26px)}
.ps-int .ps-read .of{font-size:11.5px;color:var(--faint);margin-inline-start:auto;align-self:center}
.ps-fear .ps-read .of{display:none}
/* compact line chart (demo series for now) */
.lc{display:block;margin-top:2px}
.lc svg{display:block;width:100%;height:46px;overflow:visible}
.lc-line{fill:none;stroke:var(--lvt);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.lc-g{stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.lc-mark{stroke:color-mix(in srgb,var(--lvt) 26%,transparent);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.lc-last{fill:var(--surface);stroke:var(--lvt);stroke-width:2;vector-effect:non-scaling-stroke}
.lc-days{display:flex;justify-content:space-between;direction:ltr;font-size:10.5px;line-height:1;color:var(--faint);margin-top:3px}
.lc-days .today{color:var(--text);font-weight:700}
.ps-read{display:flex;align-items:baseline;gap:8px}
.ps-read .v{font-family:var(--display);font-size:56px;font-size:clamp(42px,min(15cqh,5cqw),78px);line-height:.84;direction:ltr}
.ps-read .of{font-size:13px;color:var(--muted)}
.ps-read .w{font-family:var(--display);font-size:34px;font-size:clamp(28px,min(9cqh,3cqw),46px);line-height:.9;color:var(--lvt)}
.ps-rare{font-size:13.5px;font-weight:600;line-height:1.4;color:var(--text2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* השאלה הפתוחה: משקל ועיצוב, ממלאת את שאר גובה העמודה */
.money{display:inline-flex;align-items:baseline}
.money .cur{font-family:var(--sans);font-weight:700;font-size:.5em;align-self:flex-start;margin-top:.12em;margin-inline-end:.06em}

/* 3 · הסערה: the meter, what heats it, the week */
.pst{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.pst > div{display:flex;flex-direction:column;gap:12px;gap:clamp(8px,2.2cqh,14px);min-width:0;min-height:0;padding-inline:clamp(18px,2.6cqw,40px);border-inline-start:1px solid var(--line)}
.pst > div:first-child{padding-inline-start:0;border-inline-start:0}
.pst > div:last-child,.pst > .pst-w{padding-inline-end:0}
.pst .gauge{position:relative;flex:1 1 auto;min-height:80px}
.pst .gauge svg{position:absolute;inset:0;width:100%;height:100%}
.pst .reading .val{font-size:88px;font-size:clamp(60px,min(21cqh,7.4cqw),124px)}
.pst .reading .word{font-size:52px;font-size:clamp(36px,min(12cqh,4.2cqw),70px)}
.lbl-h{font-weight:500;letter-spacing:0;color:var(--faint)}
.pst.open .lbl-h{display:none}
/* each driver opens its context */
.drvs{display:flex;flex-direction:column;gap:2px;margin-inline:-8px}
.drv2{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:baseline;gap:6px 10px;padding:7px 8px 8px;border-radius:var(--r);font-size:14.5px;line-height:1.4;color:var(--text2);text-align:right}
.drv2:hover{background:var(--s2)}
.drv2 .m{color:var(--text)}
.drv-c{align-self:center;display:flex;color:var(--faint)}
.drv2:hover .drv-c{color:var(--text)}
.drv2 .bar{grid-column:1 / 3;display:block;height:4px;border-radius:2px;background:var(--s3)}
.drv2 .bar i{display:block;height:100%;border-radius:2px;background:var(--text2)}
.drv2[aria-pressed="true"]{background:var(--s2);box-shadow:inset -3px 0 0 var(--sel);color:var(--text)}
.drv2[aria-pressed="true"] .drv-t{font-weight:600}
.drv2[aria-pressed="true"] .bar i{background:var(--lvb,var(--sig))}
.drv2[aria-pressed="true"] .drv-c{color:var(--text)}
/* the open driver: it takes the week's place, and the week comes back when it closes */
.pst:not(.open) > .pst-x,.pst.open > .pst-w{display:none}
.pst > .pst-x{gap:10px;gap:clamp(8px,1.8cqh,14px)}
.drx-top{display:flex;align-items:center;gap:8px;min-height:36px}
.drx-top .lbl{flex:1 1 auto;min-width:0}
.drx-back{display:none}
.drx-nav{display:flex;align-items:center;gap:6px;flex:none}
.drx-nav .icon-btn:disabled{opacity:.35;cursor:default;background:none}
.drx-h{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.drx-h h3{font-family:var(--display);font-size:32px;font-size:clamp(26px,min(8cqh,2.6cqw),40px);line-height:1}
.drx-v{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.drx-v .v{font-family:var(--display);font-size:40px;font-size:clamp(32px,min(10cqh,3.2cqw),50px);line-height:.86;color:var(--lvt,var(--text))}
.drx-v .s{font-size:12px;font-weight:600;line-height:1.2;color:var(--muted);white-space:nowrap}
.pst-x .lay{font-size:15px;font-size:clamp(14px,min(3.8cqh,1.25cqw),16px);line-height:1.55}
.drx-ps{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.drx-p{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);color:inherit}
.drx-p .m{font-size:12.5px;color:var(--muted)}
.drx-p .t{font-size:14px;line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.drx-p:hover .t{text-decoration:underline;text-underline-offset:3px}
.drx-p .mo{width:20px;height:20px;border-radius:50%;background:var(--sig);color:#0A0A0B;font:700 11px/20px var(--mono);text-align:center}
.drx-go{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px 18px;flex-wrap:wrap}
.drx-st{font-weight:500;color:var(--muted)}
/* the drivers add up to the reading */
.drv-sum{display:flex;flex-direction:column;gap:6px;padding-top:10px;border-top:1px solid var(--line)}
.drv-stack{display:flex;gap:2px;height:8px;border-radius:2px;background:var(--s3);overflow:hidden}
.drv-stack i{display:block;height:100%;background:var(--lvb,var(--sig))}
.drv-stack i:nth-child(2n){opacity:.72}
.drv-tot{font-size:13.5px;line-height:1.4;color:var(--muted)}
.drv-tot .m{color:var(--text);font-weight:600}
.pst-how{font-size:13.5px;line-height:1.55;color:var(--muted)}
/* three numbers of the day, read off the curve and the week */
.pst-stats{margin-top:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-top:12px;border-top:1px solid var(--line)}
.pst-s{display:flex;flex-direction:column;gap:4px;min-width:0}
.pst-s .v{font-family:var(--display);font-size:34px;font-size:clamp(28px,min(9cqh,2.7cqw),42px);line-height:.9;color:var(--text);white-space:nowrap}
.pst-s .v small{margin-inline-start:5px;font:600 12.5px/1 var(--sans);color:var(--muted)}
.pst-s .s{font-size:12.5px;line-height:1.35;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.pst-s .s .m{color:var(--text2)}
.pst-s .s .tg{display:block}
.pst-w .week{flex:1 1 auto;min-height:56px}

/* 4 · הסיפורים: the storylines, each in its three layers */
.pss{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(250px,34%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(24px,3.4cqw,52px)}
.pss-list{display:flex;flex-direction:column;min-width:0;border-top:1px solid var(--line)}
.pss-row{display:flex;flex-direction:column;gap:5px;padding:9px 14px 10px;border-bottom:1px solid var(--line);text-align:right;color:inherit}
.pss-row:hover{background:var(--s2)}
.pss-row[aria-pressed="true"]{background:var(--s2);box-shadow:inset -3px 0 0 var(--sel)}
.pss-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.pss-name{font-size:16px;font-weight:700;line-height:1.3}
.pss-top .m{font-size:12.5px;color:var(--muted);white-space:nowrap}
.pss-sub{font-size:13px;line-height:1.4;color:var(--muted)}
.pss-bar{display:block;height:4px;border-radius:2px;background:var(--s3)}
.pss-bar i{display:block;height:100%;border-radius:2px;background:var(--text2)}
.pss-row.lead .pss-bar i{background:var(--sig)}
.pss-chips{display:none}
.pss-d{display:flex;flex-direction:column;gap:10px;gap:clamp(8px,1.9cqh,14px);min-width:0;min-height:0}
.pss-d h3{font-family:var(--display);font-size:40px;font-size:clamp(28px,min(10cqh,3.4cqw),48px);line-height:1.02}
.pss-meta{font-size:13.5px;line-height:1.45;color:var(--muted)}
.pss-meta .m{color:var(--text)}
.lays{display:flex;flex-direction:column;gap:12px;gap:clamp(8px,1.9cqh,14px)}
.lay{max-width:68ch;font-size:16px;font-size:clamp(15px,min(4.2cqh,1.4cqw),17px);line-height:1.6;color:var(--text2)}
.lay b{display:inline-flex;align-items:center;gap:8px;margin-inline-end:8px;vertical-align:1px;font-size:12.5px;font-weight:700;letter-spacing:.03em;line-height:1.4;color:var(--muted)}
.lay.j b{color:var(--text)}
.lay b i{width:5px;height:12px;border-radius:1px;background:var(--agent);flex:none}
.pss-go{margin-top:auto;display:flex;align-items:center;gap:10px 22px;flex-wrap:wrap}
.pss-go .btn{min-height:40px}

/* 5 · הקרב: the duel of the day, and how its needle moved */
.prc{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:14px}
.pr-duel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:clamp(20px,3cqw,44px);padding-bottom:14px;border-bottom:1px solid var(--line)}
.pr-d{display:flex;flex-direction:column;gap:8px;min-width:0}
.pr-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;column-gap:16px}
.pr-side{display:flex;flex-direction:column;gap:2px}
.pr-row > .pr-side:last-child{align-items:flex-end}
.pr-side b{font-size:14.5px;line-height:1.3}
.pr-num{font-family:var(--display);font-size:56px;font-size:clamp(40px,min(13cqh,4.6cqw),74px);line-height:.84;direction:ltr}
.pr-row > .pr-side:last-child .pr-num{color:var(--muted)}
.prc .duel-bar{height:14px;margin-bottom:8px}
.pr-cap .t-short{display:none}
.pr-cap{max-width:62ch;font-size:14.5px;line-height:1.5;color:var(--text2);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.pr-g{display:flex;flex-direction:column;gap:6px;min-width:0;padding-inline-start:clamp(20px,2.6cqw,36px);border-inline-start:1px solid var(--line)}
.pr-path{position:relative;flex:1 1 auto;min-height:74px}
.pr-path svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}

/* 6 · דירוג הכוח: every player, and what moved the chosen one today */
.prk{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(20px,3cqw,44px)}
.prk-list{display:flex;flex-direction:column;min-width:0;min-height:0;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.prk-head,.prk-row{display:grid;grid-template-columns:28px minmax(0,1fr) 64px 38px 34px;align-items:center;column-gap:12px;padding-inline:10px}
.prk-head{flex:none;padding-bottom:6px;border-bottom:1px solid var(--line);font-size:12px;font-weight:700;letter-spacing:.03em;color:var(--muted)}
.prk-head span:last-child{text-align:left}
.prk-row{flex:1 1 0;min-height:40px;border-bottom:1px solid var(--line);text-align:right;color:inherit}
.prk-row:hover{background:var(--s2)}
.prk-row.on{background:var(--s2);box-shadow:inset -3px 0 0 var(--sel)}
.prk-row .rk-pos{font-size:26px;line-height:.9}
.prk-who{display:flex;flex-direction:column;gap:1px;min-width:0}
.prk-n{font-size:15px;font-weight:600;line-height:1.3}
.prk-l{font-size:12.5px;line-height:1.35;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.prk-sp{display:flex;justify-content:center;color:var(--faint)}
.prk-row.up .prk-sp{color:var(--text2)}
.prk-row.down .prk-sp{color:var(--muted)}
.prk-row .dl{text-align:right}
.prk-row .rk-score{font-size:16px;text-align:left}
.prk-d{display:flex;flex-direction:column;gap:10px;gap:clamp(8px,2cqh,14px);min-width:0;min-height:0;padding-inline-start:clamp(20px,2.6cqw,36px);border-inline-start:1px solid var(--line)}
.prk-back{display:none}
.prk-chev{display:none;color:var(--faint)}
.prk-hint{display:none;flex:none;padding-bottom:8px;font-size:13px;color:var(--muted)}
.prk-top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.prk-top h3{font-family:var(--display);font-size:42px;font-size:clamp(30px,min(11cqh,3.8cqw),56px);line-height:.95}
.prk-sc{display:flex;align-items:baseline;gap:10px}
.prk-sc .big{font-family:var(--display);font-size:56px;font-size:clamp(40px,min(14cqh,4.8cqw),72px);line-height:.84;direction:ltr}
.prk-evs{display:flex;flex-direction:column}
.prk-evs > .lbl{padding-bottom:4px}
.prk-ev{display:grid;grid-template-columns:42px 66px minmax(0,1fr) 30px;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.prk-ev:hover .t{text-decoration:underline;text-underline-offset:3px}
.prk-ev .m{font-size:12.5px;color:var(--muted)}
.prk-ev .k{font-size:12px;font-weight:700;line-height:1;padding:4px 6px;border:1px solid var(--line2);border-radius:3px;color:var(--text2);text-align:center}
.prk-ev .t{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.prk-ev .w{font:500 14px/1 var(--mono);text-align:left}
.prk-ev .w.neg{color:var(--muted)}
.prk-take{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:var(--r);background:var(--s2)}
.prk-take p{font-size:14.5px;line-height:1.55;color:var(--text);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.prk-go{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap}

/* 7 · מה הלאה: what is scheduled, and what the agent is watching */
.pss2{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:12px}
.pn-bar{display:flex;flex-direction:column;gap:6px;min-width:0;padding-bottom:10px;border-bottom:1px solid var(--line)}
.pn-bar-row{display:flex;align-items:center;gap:18px;min-width:0}
.pn-clock{flex:none;font-family:var(--display);font-size:52px;font-size:clamp(38px,min(11cqh,4.4cqw),66px);line-height:.84}
.pn-bar-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.pn-bar-t b{font-size:16px;line-height:1.35}
.pn-note{font-size:13.5px;line-height:1.45;color:var(--muted)}
.pn-when{padding-bottom:1px}
.pss-sub{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.pss-sub b{font-weight:700;color:var(--text2)}
.pss2 .pss-d h3{font-size:clamp(26px,min(8cqh,3cqw),40px)}

/* 5 · הכסף */
.pmy{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(24px,3.4cqw,52px)}
.pmy-s{display:flex;flex-direction:column;gap:12px;gap:clamp(8px,2.2cqh,14px);min-width:0;min-height:0}
.pmy-big{display:flex;align-items:flex-end;gap:14px}
.pmy-big .v{font-family:var(--display);font-size:80px;font-size:clamp(54px,min(22cqh,7.2cqw),120px);line-height:.84;direction:ltr}
.pmy-big .t{padding-bottom:6px;font-size:14px;line-height:1.35;color:var(--text2)}
.pmy-big .t > span{display:block}
.pmy-big .t > .pmy-y{display:none}
.pmy-y b{font-weight:600;color:var(--text)}
.pmy-bars{display:flex;flex-direction:column;gap:8px}
.pmy-bar{display:grid;grid-template-columns:80px minmax(0,1fr) 52px;align-items:center;gap:10px;font-size:13.5px;color:var(--text2)}
.pmy-bar .b{display:block;height:8px;border-radius:2px;background:var(--s3)}
.pmy-bar .b i{display:block;height:100%;border-radius:2px;background:var(--text2)}
.pmy-bar .m{text-align:left;color:var(--text)}
.pmy-more{font-size:13.5px;line-height:1.5;color:var(--muted)}
.pmy-job{margin-top:auto;padding:9px 12px;border:1px dashed var(--line2);border-radius:var(--r);font-size:13.5px;line-height:1.45;color:var(--muted)}
.pmy-job b{margin-inline-end:6px;color:var(--text2)}
.pmy-l{display:flex;flex-direction:column;min-width:0;min-height:0;padding-inline-start:clamp(20px,2.6cqw,36px);border-inline-start:1px solid var(--line)}
.pmy-l > .lbl{padding-bottom:4px}
.pmy-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);color:inherit}
.pmy-row:hover .n{text-decoration:underline;text-underline-offset:3px}
.pmy-row .k,.pla-top .k{font-size:11.5px;font-weight:700;line-height:1;padding:4px 6px;border:1px solid var(--line2);border-radius:3px;color:var(--text2);text-align:center;white-space:nowrap}
.pmy-row .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.pmy-row .n{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;line-height:1.3}
.il{font-size:11px;font-weight:700;line-height:1;padding:3px 6px;border-radius:3px;background:var(--inv);color:var(--invink)}
.pmy-row .d{font-size:13px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.pmy-row .a{font-family:var(--display);font-size:28px;line-height:1;direction:ltr}
.pmy-row .a.na{font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--muted);direction:rtl;white-space:nowrap}
.pmy-facts{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.pf{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.45;color:var(--text2)}
.pf-k{font-size:12.5px;font-weight:700;letter-spacing:.02em;color:var(--muted)}
.pf-v b{font-weight:600;color:var(--text)}
/* hiring and layoffs: a column of its own when there is news */
.pmy.has-j{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);grid-template-rows:minmax(0,1fr) auto;row-gap:14px}
.pmy.has-j > .pmy-j{grid-column:1 / -1}
.pmy-j{display:flex;flex-direction:column;gap:10px;gap:clamp(8px,1.8cqh,12px);min-width:0;min-height:0}
.pj-sum{display:flex;gap:10px 28px;flex-wrap:wrap}
.pj-n{display:flex;align-items:baseline;gap:8px;min-width:0}
.pj-n .v{font-family:var(--display);font-size:40px;font-size:clamp(32px,min(10cqh,3.4cqw),50px);line-height:.86}
.pj-n.down .v{color:var(--muted)}
.pj-n .t{font-size:13px;line-height:1.35;color:var(--muted)}
.pj-l{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.pj-row{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);color:inherit}
.pj-row:hover .n{text-decoration:underline;text-underline-offset:3px}
.pj-row .k{font-size:11.5px;font-weight:700;line-height:1;padding:4px 6px;border-radius:3px;background:var(--inv);color:var(--invink);text-align:center;white-space:nowrap}
.pj-row.f .k{background:none;color:var(--text2);box-shadow:inset 0 0 0 1px var(--line2)}
.pj-row .t{display:flex;flex-direction:column;gap:1px;min-width:0}
.pj-row .n{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:600;line-height:1.3}
.pj-row .d{font-size:13px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.pj-row .a{font-family:var(--display);font-size:26px;line-height:1;direction:ltr}
.pj-row.f .a{color:var(--muted)}
.pj-row .a.na{font-family:var(--sans);font-size:12.5px;font-weight:600;direction:rtl}
.pj-note{margin-top:auto;display:flex;flex-direction:column;gap:5px;font-size:13.5px;line-height:1.5;color:var(--text2)}

/* 6 · השקות */
.pla{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:12px}
.pla-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:10px;min-height:0}
.pla-c{display:flex;flex-direction:column;gap:5px;min-width:0;min-height:0;overflow:hidden;padding:12px 14px;border-radius:var(--r);background:var(--s2);color:inherit}
.pla-c:hover{background:var(--s3)}
.pla-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pla-top .m{font-size:12px;color:var(--muted)}
.pla-top .k.o{border-color:var(--text2);color:var(--text)}
.pla-top .mo,.pla-key .mo{margin-inline-start:auto;width:20px;height:20px;flex:none;border-radius:50%;background:var(--sig);color:#0A0A0B;font:700 11px/20px var(--mono);text-align:center}
.pla-h{display:flex;align-items:center;justify-content:space-between;gap:6px 16px;min-width:0}
.pla-key{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.pla-key .mo{margin:0;width:18px;height:18px;font-size:10px;line-height:18px}
.pla-n{font-family:var(--display);font-size:28px;font-size:clamp(22px,min(6.6cqh,2.4cqw),34px);line-height:1}
.pla-w{font-size:13px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.pla-w b{font-weight:600;color:var(--text2)}
.pla-by{display:none;font:600 12px/1 var(--sans);color:var(--muted)}

/* a wide panel: the duel stands as its own column beside the ranking and its detail */
@container dcp (min-width:1000px){
  .prc{grid-template-columns:minmax(250px,25%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(20px,2.6cqw,36px)}
  .pr-duel{display:flex;flex-direction:column;gap:14px;padding:0;padding-inline-end:clamp(20px,2.6cqw,36px);border-bottom:0;border-inline-end:1px solid var(--line);min-height:0}
  .pr-g{flex:1 1 auto;padding:12px 0 0;border-inline-start:0;border-top:1px solid var(--line);min-height:0}
  .pr-cap{-webkit-line-clamp:4}
  .prk{column-gap:clamp(18px,2.4cqw,32px)}
  .prk-head,.prk-row{grid-template-columns:24px minmax(0,1fr) 56px 36px 48px;column-gap:10px;padding-inline:8px}
  .pmy.has-j{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(20px,2.4cqw,36px)}
  .pmy.has-j > .pmy-j{grid-column:auto;padding-inline-start:clamp(20px,2.4cqw,36px);border-inline-start:1px solid var(--line)}
  .pmy.has-j .pmy-l{padding-inline-start:clamp(20px,2.4cqw,36px)}
  .pmy.has-j .pmy-bar{grid-template-columns:72px minmax(0,1fr) 48px}
}
/* a medium panel: the jobs run under money and deals, two to a row; an open driver sits beside the list, in the meter's place */
@container dcp (min-width:721px) and (max-width:999px){
  .pst.open{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
  .pst.open > .pst-g{display:none}
  .pst.open > .pst-d{padding-inline-start:0;border-inline-start:0}
  .pmy.has-j > .pmy-j{padding-top:12px;border-top:1px solid var(--line)}
  .pmy.has-j .pj-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;border-top:0}
  .pmy.has-j .pj-note{margin-top:0}
}
/* short panels (a low laptop screen): the moment list folds into the strip's arrows */
@container dcp (max-height:430px){
  .pss-row{padding:8px 12px 9px;gap:4px}
  .pss-d h3{font-size:clamp(26px,9cqh,36px)}
  .pst-how{display:none}
  .pst-s .s{display:none}
  .pst-stats{padding-top:8px}
  .drv2{padding-block:5px 6px}
  .pst-x .lay{font-size:14px;line-height:1.5}
  .drx-ps .drx-p:nth-child(n+2),.drx-w{display:none}
  .prk-l{display:none}
  .prk-row{min-height:32px}
  .prk-take p{-webkit-line-clamp:2}
  .prk-ev .k{display:none}
  .prk-ev{grid-template-columns:42px minmax(0,1fr) 30px;padding:5px 0}
  .pmy-more,.pf-big,.pf-il{display:none}
  .pj-note{display:none}
  .pj-row{padding:5px 0}
  .pj-row .d{display:none}
  .pla-w{-webkit-line-clamp:1}
  .pn-note{display:none}
  .pss-sub{display:none}
  .pss-row{gap:6px}
  .pss2 .pss-d h3{display:none}
  .prk-take p{-webkit-line-clamp:2}
  .prk-evs > .lbl{display:none}
  .dc-pane.tight .prk-ev .t{-webkit-line-clamp:1}
}
@container dcp (max-height:430px) and (min-width:721px){
}
/* a tall, medium-width panel (a tablet held upright): the story stacks, the moment and its line sit under it */
@container dcp (min-width:721px) and (max-width:900px) and (min-height:520px){
  .ps{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;grid-template-areas:"main" "side" "log";align-content:space-between;row-gap:16px}
  .ps .headline{font-size:clamp(40px,min(14cqh,11cqw),88px)}
  .ps-side{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px;padding:14px 0 0;border-inline-start:0;border-top:1px solid var(--line)}
  .ps-card{padding:0 0 0;border-bottom:0}
  .ps-card + .ps-card{padding-inline-start:18px;border-inline-start:1px solid var(--line)}
}
/* narrow panels (phones, small tablets) */
@container dcp (max-width:720px){
  .dc-pane{padding:14px 16px}
  .ps{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;grid-template-areas:"main" "side" "log";align-content:start;row-gap:10px;align-self:start;height:auto;min-height:max-content;overflow:visible}
  .ps .headline{font-size:clamp(26px,min(8cqh,8.4cqw),36px)}
  .lbl-d{display:inline}
  .icon-btn{width:40px;height:40px}
  .ps-text .t-full{display:none}
  .ps-text .t-short{display:inline}
  .ps-why{display:none}
  .ps-main{gap:10px;max-height:none;height:auto;min-height:max-content;flex:0 0 auto;overflow:visible}
  .dc-pane .ps-main .ps-text{-webkit-line-clamp:unset;display:block;max-height:none;overflow:visible}
  .ps-side{display:flex;flex-direction:column;gap:14px;min-height:auto;max-height:none;padding:14px 0 0;border-inline-start:0;border-top:1px solid var(--line)}
  .ps-card{padding:0;border:0}
  .ps-metrics{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border-bottom:1px solid var(--line);padding-bottom:12px}
  .ps-metrics .ps-card{padding-block:4px;border-bottom:0;flex:0 0 auto}
  .ps-metrics .ps-int{padding-inline-end:10px;background:none;border-radius:0;padding-block:4px}
  .ps-metrics .ps-fear{padding-inline-start:10px}
  .ps-int,.ps-fear{grid-area:auto}
  .ps-read .v{font-size:40px}
  .ps-read .w{font-size:28px}
  .ps-read .of{display:none}
  .ps-rare{font-size:12.5px}
  .ps .log-s{display:flex}
  .ps .log-s .icon-btn{display:none}

  .pst{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);row-gap:12px}
  .pst > div{padding:0;border:0}
  .pst > .pst-g{display:grid;grid-template-columns:minmax(0,1fr) 42%;grid-template-areas:"lbl lbl" "read gauge" "cmp gauge";align-items:center;column-gap:14px;row-gap:4px}
  .pst-g > .lbl{grid-area:lbl}
  .pst-g .reading{grid-area:read;justify-content:flex-start}
  .pst-g .compare{grid-area:cmp;text-align:right}
  .pst-g .gauge{grid-area:gauge;flex:none;height:84px;min-height:0}
  .pst .gauge text{display:none}
  .pst .reading .val{font-size:clamp(52px,15cqw,76px)}
  .pst .reading .word{font-size:clamp(32px,9cqw,46px)}
  .pst > .pst-d{gap:8px}
  .pst-how{display:none}
  .compare > span{display:block}
  .compare .cs{display:none}
  .drv-sum,.pst-stats{display:none}
  .week i:not(.today)::after{display:none}
  .drv2{padding-block:6px 7px}
  .pst.open{grid-template-rows:minmax(0,1fr)}
  .pst.open > div:not(.pst-x){display:none}
  .drx-back{display:inline-flex;align-items:center;gap:4px;min-height:40px;padding-inline-end:8px;font-size:13.5px;font-weight:600;color:var(--text);flex:none}
  .drx-top{justify-content:space-between}
  .drx-top .lbl{display:none}
  .drx-x{display:none}
  .drx-h h3{font-size:clamp(28px,9cqw,40px)}
  .drx-v{font-size:clamp(36px,11cqw,50px)}
  .pst-x .lay{font-size:15px;line-height:1.55}

  .pss{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:14px}
  .pss-list{display:none}
  .pss-chips{display:flex}
  .pss-d h3{display:none}
  .lay b{margin-inline-end:6px}
  .pss-d > .lbl{display:none}
  .pss{row-gap:10px}
  .pss-d{gap:8px}

  .pr-duel{grid-template-columns:minmax(0,1fr);padding-bottom:10px}
  .pr-g{display:none}
  .pr-num{font-size:clamp(32px,10cqw,44px)}
  .pr-row{align-items:center;column-gap:12px}
  .pr-side{flex-direction:row;align-items:baseline;gap:6px}
  .pr-row > .pr-side:last-child{flex-direction:row-reverse;align-items:baseline}
  .prc .duel-bar{margin-bottom:0}
  .pr-cap{-webkit-line-clamp:1}
  .pr-cap .t-full{display:none}
  .pr-cap .t-short{display:inline}
  .prc{row-gap:10px}
  .prk:not(.open) .prk-hint{display:none}
  .prk-row{min-height:36px}
  .prk{grid-template-columns:minmax(0,1fr)}
  .prk:not(.open) .prk-d{display:none}
  .prk.open .prk-list{display:none}
  .prk-d{padding:0;border:0}
  .prk-back{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;min-height:40px;padding-inline-end:8px;font-size:13.5px;font-weight:600;color:var(--text)}
  .prk-head{display:none}
  .prk-row{grid-template-columns:24px minmax(0,1fr) 34px 30px 16px;column-gap:10px;padding-inline:6px}
  .prk-chev{display:flex}
  .prk-row .prk-sp{display:none}
  .prk-l{display:none}
  .prk-ev{grid-template-columns:40px minmax(0,1fr) 30px}
  .prk-ev .k{display:none}
  .prk-top h3{font-size:clamp(30px,10cqw,44px)}
  .prk-sc .big{font-size:clamp(40px,13cqw,56px)}
  /* a player opened on a phone: the detail takes the whole panel, its place in the ranking beside the way back */
  .prc.rk-open{grid-template-rows:minmax(0,1fr)}
  .prc.rk-open .pr-duel{display:none}
  .prk.open .prk-d{display:grid;grid-template-columns:auto minmax(0,1fr);align-content:start;column-gap:12px;row-gap:10px}
  .prk.open .prk-d > *{grid-column:1 / -1}
  .prk.open .prk-d > .prk-back{grid-column:1}
  .prk.open .prk-d > .lbl{grid-column:2;align-self:center;justify-self:end}

  .pn-clock{font-size:clamp(34px,11cqw,48px)}
  .pn-note{display:none}
  .pn-bar-t b{font-size:14.5px}
  .pss2{row-gap:10px}
  .pn-bar{padding-bottom:10px}

  .pmy{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:12px}
  .pmy-l{padding:0;border:0}
  .pmy-l > .lbl{display:none}
  .pmy-bars,.pmy-more{display:none}
  .pmy-big .v{font-size:clamp(48px,15cqw,72px)}
  .pmy-row{grid-template-columns:46px minmax(0,1fr) auto;gap:10px;padding:8px 0}
  .pmy-row .a.na{font-size:0}
  .pmy-row .a.na::after{content:"—";font:28px/1 var(--display);color:var(--muted)}
  .pmy-s{gap:8px}
  .pmy-big .t > span{display:inline}
  .pmy-big .t > .pmy-y{display:block}
  .pmy-facts{display:none}
  .pmy-job{margin-top:0;padding:0;border:0;font-size:13px}
  .pmy.has-j{grid-template-columns:minmax(0,1fr);grid-template-rows:max-content max-content max-content;row-gap:14px;align-content:start}
  .pmy.has-j > .pmy-j{grid-column:auto;padding-top:12px;border-top:1px solid var(--line)}
  .pmy-j > .lbl{display:none}
  .pj-sum{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px}
  .pj-n{flex-direction:column;align-items:flex-start;gap:4px}
  .pj-n .t{font-size:12.5px}
  .pj-n .v{font-size:clamp(30px,9cqw,40px)}
  .pj-row .t{flex-direction:row;align-items:baseline;gap:8px}
  .pj-row .n{flex:none}
  .pj-row .d{flex:1 1 auto;min-width:0;display:block;white-space:nowrap;text-overflow:ellipsis}
  .pj-note{display:none}
  .pj-row{grid-template-columns:52px minmax(0,1fr) auto;gap:10px;padding:7px 0}
  .pj-row .a{font-size:24px}

  /* launches: a list on phones, one launch to a row, newest on top */
  .pla{row-gap:8px}
  .pla-ord{display:none}
  .pla-key{font-size:12px}
  .pla-g{grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid var(--line)}
  .pla-c{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;grid-template-areas:"n k o m" "w w w mo";align-content:center;align-items:center;column-gap:0;row-gap:1px;padding:2px 4px;border-radius:0;background:none;border-bottom:1px solid var(--line)}
  .pla-c:hover{background:var(--s2)}
  .pla-top{display:contents}
  .pla-top .m{grid-area:m;margin-inline-start:10px;font-size:12px;text-align:left}
  .pla-top .k{grid-area:k;margin-inline-start:8px;font-size:11px;padding:3px 5px}
  .pla-top .k.o{grid-area:o;margin-inline-start:4px}
  .pla-top .mo{grid-area:mo;justify-self:end;margin:0;width:18px;height:18px;line-height:18px;font-size:10px}
  .pla-n{grid-area:n;font-size:19px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pla-w{grid-area:w;font-size:12.5px;line-height:1.35;-webkit-line-clamp:1}
}
/* a phone with room to spare: a fuller line for the moment and the duel */
@container dcp (max-width:720px) and (min-height:440px){
  .pr-cap{-webkit-line-clamp:2}
}
/* a tall phone panel: the day's story is told in full, not in its one-line version */
@container dcp (max-width:720px) and (min-height:600px){
  .ps-text .t-full{display:inline}
  .ps-text .t-short{display:none}
}
/* a phone of middling height (a small phone, or one with its browser bars showing): the money keeps its rows to a line */
@container dcp (max-width:720px) and (max-height:600px){
  .pmy.has-j{row-gap:10px}
  .pmy.has-j .pmy-row{padding:5px 0}
  .pmy.has-j .pmy-row .d{display:none}
  .pmy.has-j > .pmy-j{padding-top:8px}
  .pj-row{padding:5px 0}
  .pj-n .v{font-size:30px}
  .drv2{padding-block:4px 5px}
  .pst{row-gap:8px}
  .pst-g .gauge{height:70px}
  .pst-w .week{min-height:36px}
}
@container dcp (max-width:720px) and (max-height:520px){
  .pmy.has-j .pmy-big .v{font-size:46px}
  .pmy.has-j .pmy-s{gap:4px}
  .pmy.has-j .pmy-s > .lbl{display:none}
  .pj-n{flex-direction:row;align-items:baseline;gap:6px}
  .pj-n .v{font-size:26px}
  .pj-n .t{font-size:12px;white-space:nowrap}
  .pj-n .c{display:none}
  .pj-row{padding:4px 0}
}
/* phones as they are held: narrow and low at once. In a phone browser, with its bars showing, this is the
   usual panel (about 340px high), so every tab is laid out for it, not squeezed into it. */
@container dcp (max-width:720px) and (max-height:440px){
  /* העיקר */
  .ps{row-gap:8px}
  .ps-main{gap:8px}
  .ps .headline{font-size:clamp(28px,9.6cqw,36px)}
  .ps-text{font-size:14.5px;line-height:1.5}
  .ps-side{padding-top:8px}
  .ps-rare{display:none}
  .ps-read .v{font-size:36px}
  .ps-read .w{font-size:26px}
  /* עוצמת היום: the tab names the meter, so the meter's own label steps aside */
  .pst{row-gap:10px}
  .pst-g > .lbl{display:none}
  .pst > .pst-g{grid-template-areas:"read gauge" "cmp gauge"}
  .pst-g .gauge{height:60px}
  .pst .reading .val{font-size:46px}
  .pst .reading .word{font-size:30px}
  .compare{font-size:12.5px}
  .compare > span:last-child{display:none}
  .pst > .pst-d{gap:4px}
  .drv2{font-size:13.5px;line-height:1.35;gap:3px 10px;padding-block:4px 5px}
  .drv2 .bar{height:3px}
  .lbl-h{display:none}
  .drx-top .lbl{display:none}
  .drx-top{justify-content:space-between}
  .pst-x .lay{font-size:14px;line-height:1.5}
  .pst-w{gap:6px}
  .pst-w .week{min-height:30px;--wpt:18px}
  /* המרוץ */
  .pr-cap{display:none}
  .pr-duel{padding-bottom:8px}
  .pr-d{gap:6px}
  .prc{row-gap:8px}
  .prk-row{min-height:29px}
  .prk-take p{-webkit-line-clamp:2}
  .prk.open .prk-d{row-gap:8px}
  .prk-evs > .lbl{display:none}
  .prk-ev{padding:5px 0}
  .prk-ev .t{-webkit-line-clamp:1}
  .prk-take{padding:8px 12px}
  .prk-top h3{font-size:30px}
  .prk-sc .big{font-size:36px}
  /* הכסף */
  .pmy-s > .lbl{display:none}
  .pmy{row-gap:8px}
  .pmy-s{gap:6px}
  .pmy-big .v{font-size:44px}
  .pmy-big .t{font-size:13px;padding-bottom:3px}
  .pmy-row{padding:4px 0}
  .pmy-row .n{font-size:14.5px}
  .pmy-row .d{font-size:12.5px}
  .pmy-row .a{font-size:24px}
  .pmy-row .a.na::after{font-size:24px}
  .pj-n .t{font-size:12px}
  .pj-n .v{font-size:30px}
  .pj-row{padding:4px 0}
  .pj-row .d{display:none}
  .pj-row .a{font-size:22px}
  /* השקות: one line a launch, with its maker */
  .pla-w,.pla-top .k.o{display:none}
  .pla-by{display:inline}
  .pla-c{grid-template-areas:"n k o m mo";grid-template-columns:minmax(0,1fr) auto auto auto auto;padding:3px 4px}
  .pla-top .mo{margin-inline-start:6px}
  /* הסיפורים */
  .pn-clock{font-size:34px}
  .pn-bar-t b{font-size:14px}
  .pn-bar{padding-bottom:8px}
  .pss2,.pss{row-gap:8px}
  .pss-chips .chip{min-height:32px}
  .pss-d,.lays{gap:6px}
  .lay{font-size:13.5px;line-height:1.5}
  .pss-go .btn,.pss-meta{display:none}
}
/* the last resort, if a panel still does not fit: denser, then it scrolls inside */
@container dcp (max-width:720px){ .dc-pane.tight{padding:14px 16px} }
.dc-pane.tight .ps .headline{font-size:clamp(30px,min(12cqh,5cqw),64px)}
.dc-pane.tight .ps-text,.dc-pane.tight .lay,.dc-pane.tight .ps-why{font-size:14.5px;line-height:1.5}
.dc-pane.tight .pst-how,.dc-pane.tight .pn-note,.dc-pane.tight .ps-rare,.dc-pane.tight .pmy-more,.dc-pane.tight .pmy-bars{display:none}
.dc-pane.tight .prk-ev{padding:5px 0}
.dc-pane.tight .prk-take{padding:8px 12px}
.dc-pane.tight .pmy-row{padding:6px 0}
.dc-pane.tight .pj-row{padding:5px 0}
.dc-pane.tight .pj-note{display:none}
.dc-pane.tight .pla-w{-webkit-line-clamp:1}
.dc-pane.tight .pst-s .s{display:none}
.dc-pane.tight .pst-x .lay{font-size:14px;line-height:1.5}
.dc-pane.tight .drx-ps .drx-p:nth-child(n+2),.dc-pane.tight .drx-w{display:none}
.dc-pane.tight .prk-evs > .lbl{display:none}
.dc-pane.tight .prk-d{gap:8px}
.dc-pane.tight .prk-top h3{font-size:clamp(28px,min(9cqh,3.2cqw),46px)}
.dc-pane.tight .prk-sc .big{font-size:clamp(36px,min(11cqh,4cqw),60px)}
.dc-pane.tight .pss2{row-gap:10px}
.dc-pane.tight .pn-bar{padding-bottom:8px}
.dc-pane.tight .pss-d,.dc-pane.tight .lays{gap:8px}

/* sideways scrollers fade at the side where more is waiting */
.hs.ovf{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 36px);mask-image:linear-gradient(to right,transparent 0,#000 36px)}
.hs.ovf.mid{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 36px,#000 calc(100% - 36px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 36px,#000 calc(100% - 36px),transparent 100%)}
.hs.ovf.end{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 36px);mask-image:linear-gradient(to left,transparent 0,#000 36px)}

/* ---------- feed + rail ---------- */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(28px,3.6vw,56px);align-items:start}
.feed{display:flex;flex-direction:column;min-width:0}
.feed-head{display:flex;flex-direction:column;gap:16px}
.tabs{display:flex;gap:24px}
.tab{padding:10px 0 9px;border-bottom:2px solid transparent;color:var(--muted);font-size:15px;font-weight:600;line-height:1.2}
.tab:hover{color:var(--text)}
.tab[aria-selected="true"]{color:var(--text);font-weight:700;border-bottom-color:var(--sel)}
.live{align-self:center;margin-top:20px;display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--pillbd);background:var(--pillbg);color:var(--text);font-size:14px;font-weight:600;line-height:1}
body.day .live{color:#0A0A0B}
.live i{width:6px;height:14px;border-radius:1px;background:var(--stampcur);flex:none}
.divider{display:flex;align-items:center;gap:12px;padding-top:26px}
.divider b{font-size:12.5px;font-weight:700;letter-spacing:.03em;color:var(--text);white-space:nowrap}
.divider .m{font-size:12.5px;color:var(--faint);white-space:nowrap}
.divider hr{flex:1;height:1px;border:0;margin:0;background:var(--line)}
.dstorm{display:inline-flex;align-items:baseline;gap:6px;font-family:var(--display);line-height:1;white-space:nowrap}
.dstorm .v{font-size:22px;color:var(--text);direction:ltr}
.dstorm .w{font-size:20px}
.card{display:flex;flex-direction:column;gap:16px;padding:28px 0;border-bottom:1px solid var(--line);scroll-margin-top:96px}
.card.flash{animation:flash 1.8s ease-out}
@keyframes flash{0%,30%{background:var(--s2)}100%{background:transparent}}
.c-meta{display:flex;align-items:center;gap:12px;min-width:0}
.c-src{display:flex;flex-direction:column;gap:2px;min-width:0}
.c-name{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:600;line-height:1.35;color:var(--text)}
a.c-ent:hover{text-decoration:underline;text-underline-offset:3px}
.c-name .ok{display:inline-flex;color:var(--muted)}
.c-sub{font-size:13px;color:var(--muted);line-height:1.4}
.c-meta .badge{margin-inline-start:auto}
.card .c-mb{display:none}
.c-title{font-family:var(--display);font-size:clamp(32px,2.9vw,38px);line-height:1.08}
.c-title a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px}
.c-dek{max-width:66ch;font-size:clamp(16px,1.25vw,17px);line-height:1.6;color:var(--text2)}
.c-why{display:flex;flex-direction:column;gap:4px;max-width:66ch}
.c-why p{font-size:15px;line-height:1.6;color:var(--text2)}
.actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:13.5px;line-height:1.4;color:var(--muted)}
.a-i{display:inline-flex;align-items:center;gap:6px}
.a-i .m{color:var(--text)}
.actions .go{margin-inline-start:auto}
.more{padding-top:28px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.end-note{font-size:14px;color:var(--muted);text-align:center}
.end-note a{color:var(--text);font-weight:600}

/* previews: ours, never an iframe */
.pv{display:flex;max-width:680px;color:inherit}
a.pv:hover,button.pv:hover{background:var(--s2)}
.pv-link{gap:18px;align-items:center;padding:16px 18px}
.pv-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;text-align:right}
.pv-dom{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1.4 var(--mono);color:var(--muted)}
.pv-title{font-size:16px;font-weight:600;line-height:1.45;color:var(--text)}
.pv-desc{font-size:14px;line-height:1.5;color:var(--muted)}
.pv-thumb{flex:none;width:156px;height:104px;object-fit:cover;border-radius:3px;filter:grayscale(1) contrast(1.05);opacity:var(--imgop)}
.pv-video{flex-direction:column;gap:10px;max-width:560px}
.pv-frame{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:var(--r);overflow:hidden;background:var(--ph)}
.pv-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.08) brightness(.82)}
.pv-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;background:#F4F4F1;color:#0A0A0B;display:flex;align-items:center;justify-content:center;padding-left:3px;box-shadow:0 4px 18px rgba(0,0,0,.35)}
.pv-play:hover{transform:translate(-50%,-50%) scale(1.06)}
.pv-dur{position:absolute;bottom:10px;left:10px;padding:3px 8px;border-radius:3px;background:rgba(10,10,11,.86);color:#F4F4F1;font:500 12px/1 var(--mono)}
.pv-cap{display:flex;align-items:baseline;gap:10px;font-size:15px;line-height:1.5;color:var(--text2)}
.pv-cap .m{font-size:12.5px;color:var(--muted);white-space:nowrap}
.pv-post{flex-direction:column;gap:12px;padding:16px 18px}
.pv-who{display:flex;align-items:center;gap:10px}
.pv-av{width:36px;height:36px;flex:none;border-radius:50%;background:var(--ph2)}
.pv-who b{display:block;font-size:14.5px;line-height:1.3}
.pv-who .m{display:block;font-size:12px;line-height:1.3;color:var(--muted)}
.pv-tag{margin-inline-start:auto;font-size:12px;font-weight:600;line-height:1;padding:3px 8px;border:1px solid var(--line2);border-radius:3px;color:var(--text2);white-space:nowrap}
.pv-text{font-size:15.5px;line-height:1.6;color:var(--text);white-space:pre-line;text-align:left}
.pv-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;font:500 12px/1 var(--mono);color:var(--faint)}
.pv-foot a,.pv-foot span.go{font:600 13px/1 var(--sans)}
.pv-paper{flex-direction:column;gap:10px;padding:18px 20px}
.pv-paper .pv-dom{display:flex}
.pv-paper .pt{font-size:17px;font-weight:600;line-height:1.45;color:var(--text);text-align:left}
.pv-paper .pa{font-size:14px;line-height:1.5;color:var(--muted);text-align:left}
.pv-paper .pf{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:10px;font-size:13px;color:var(--muted)}
.pv-quote{flex-direction:column;gap:8px;padding:18px 20px 20px}
.pv-quote q{font-family:var(--display);font-size:clamp(30px,2.8vw,40px);line-height:1.06;quotes:none;color:var(--text)}
.pv-quote span{font-size:14px;color:var(--muted)}
.pv-number{align-items:center;gap:22px;padding:18px 22px;flex-wrap:wrap}
.pv-number .big{font-family:var(--display);font-size:clamp(64px,6vw,96px);line-height:.86;direction:ltr;color:var(--text)}
.pv-number p{max-width:34ch;font-size:15.5px;line-height:1.55;color:var(--text2)}

/* rail */
.rail{display:flex;flex-direction:column;gap:48px;min-width:0}
.rail-note{font-size:12.5px;line-height:1.5;color:var(--faint);padding-top:10px}
.st-row{display:flex;flex-direction:column;gap:7px;padding:14px 0;border-bottom:1px solid var(--line)}
.st-row:hover .st-name{text-decoration:underline;text-underline-offset:3px}
.st-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.st-name{font-size:16px;font-weight:600;line-height:1.35;color:var(--text)}
.st-top .m{font-size:12.5px;color:var(--muted);white-space:nowrap}
.st-sub{font-size:13.5px;line-height:1.45;color:var(--muted)}
.st-bar{display:block;height:4px;border-radius:2px;background:var(--s3)}
.st-bar i{display:block;height:100%;border-radius:2px;background:var(--text2)}
.st-row.lead .st-bar i{background:var(--sig)}
.rk-row{display:grid;grid-template-columns:28px minmax(0,1fr) 36px 36px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
a.rk-row:hover .rk-name{text-decoration:underline;text-underline-offset:3px}
.rk-row.here{background:var(--surface);box-shadow:inset -3px 0 0 var(--sel);padding-inline:12px 8px}
.rk-pos{font-family:var(--display);font-size:30px;line-height:1}
.rk-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.rk-name{font-size:15.5px;font-weight:600;line-height:1.35}
.rk-line{font-size:13px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.rk-full .rk-line{display:block;-webkit-line-clamp:none}
.dl{font:500 12.5px/1 var(--mono);white-space:nowrap;direction:ltr}
.dl.up{color:var(--up)} .dl.down{color:var(--down)} .dl.same{color:var(--faint)}
.rk-score{font:500 17px/1 var(--mono);text-align:left}
.rail .go{padding-top:14px}
.br-row{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.br-row .m{font-size:12.5px;color:var(--muted);padding-top:2px}
.br-row a,.br-row span.t{font-size:14.5px;line-height:1.5;color:var(--text2)}
.br-row a:hover{color:var(--text);text-decoration:underline;text-underline-offset:3px}

/* ---------- post page ---------- */
.art{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(28px,4.6vw,72px);align-items:start}
.art-main{display:flex;flex-direction:column;gap:24px;min-width:0}
.crumbs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
.crumbs a:hover{color:var(--text)}
.crumbs .s{color:var(--dim)}
.art h1{font-family:var(--display);font-size:clamp(46px,5.3vw,76px);line-height:1.06}
.src-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.src-row .c-name{font-size:16px}
.art-dek{max-width:60ch;font-size:clamp(18px,1.5vw,21px);line-height:1.6;color:var(--text2)}
.why-plate{padding:16px 18px 17px;display:flex;flex-direction:column;gap:6px}
.why-plate p{font-size:clamp(16.5px,1.3vw,18px);line-height:1.6;color:var(--text2)}
.body-sec{display:flex;flex-direction:column;gap:10px}
.body-sec h2{display:flex;align-items:center;gap:12px;font-family:var(--display);font-size:clamp(30px,2.8vw,36px);line-height:1.05}
.body-sec h2 i{width:7px;height:22px;background:var(--agent);border-radius:1px;flex:none}
.body-sec p{max-width:64ch;font-size:clamp(17px,1.35vw,18px);line-height:1.75;color:var(--text2)}
.art .pv-thumb,.art .pv-frame img{filter:none;opacity:1}
.srcs a{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.srcs a:hover .sn{text-decoration:underline;text-underline-offset:3px}
.srcs .m{font-size:12.5px;color:var(--faint)}
.srcs .sn{font-size:15px;font-weight:600}
.srcs .sd{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1 var(--mono);color:var(--muted);direction:ltr}
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.react-btns{display:flex;gap:8px}
.react-btns button{flex:1 1 0;min-height:48px;border-radius:var(--r);border:1px solid var(--line2);font-size:15px;font-weight:600;text-align:center}
.react-btns button:hover{background:var(--s2)}
.react-row{display:grid;grid-template-columns:56px minmax(0,1fr) 40px;align-items:center;gap:10px;font-size:13.5px}
.react-row.mine{font-weight:700}
.react-row .bar{height:8px;background:var(--s3);border-radius:1px;display:flex}
.react-row .bar i{display:block;height:100%;transition:width .6s ease-out}
.react-row .m{text-align:left}
.note{font-size:13px;line-height:1.5;color:var(--faint)}
.cmt-form{display:flex;flex-direction:column;gap:10px}
.cmt-form label{font-size:12.5px;font-weight:700;letter-spacing:.03em;color:var(--muted)}
.cmt-form input,.cmt-form textarea{width:100%;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line2);background:var(--surface);color:var(--text);font-size:15px;line-height:1.6;outline:none}
.cmt-form textarea{min-height:96px;resize:vertical}
.cmt-form input:focus,.cmt-form textarea:focus{box-shadow:0 0 0 2px var(--focus)}
.cmt-form input::placeholder,.cmt-form textarea::placeholder{color:var(--faint);opacity:1}
.cmt-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.cmt{display:flex;flex-direction:column;gap:4px;padding:14px 0;border-bottom:1px solid var(--line)}
.cmt b{font-size:14.5px} .cmt .m{font-size:12px;color:var(--faint)} .cmt p{font-size:15.5px;line-height:1.6;color:var(--text2)}
.tl{position:relative;padding-top:6px}
.tl::before{content:"";position:absolute;top:16px;bottom:16px;inset-inline-start:10px;width:1px;background:var(--line2)}
.tl a{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;padding:10px 0}
.tl a:hover .tt{text-decoration:underline;text-underline-offset:3px}
.tl .dot{width:12px;height:12px;border-radius:50%;margin:5px 5px 0;background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--text)}
.tl .me .dot{background:var(--sig);box-shadow:0 0 0 2px var(--selstroke)}
.tl .tm{font:500 12px/1.4 var(--mono);color:var(--faint)}
.tl .tt{font-size:15px;font-weight:600;line-height:1.4;color:var(--text2)}
.tl .me .tt{color:var(--text);font-weight:700}

/* ---------- player, story, channel, search pages ---------- */
.pg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px 40px;flex-wrap:wrap;border-top:2px solid var(--text);padding-top:20px}
.pg-id{display:flex;align-items:center;gap:22px;min-width:0}
.pg-id h1{font-family:var(--display);font-size:clamp(56px,7vw,96px);line-height:.92}
.pg-id .t{display:flex;flex-direction:column;gap:6px;min-width:0}
.pg-head .t.wide{max-width:780px}
.pg-desc{max-width:62ch;font-size:clamp(16.5px,1.4vw,19px);line-height:1.65;color:var(--text2)}
.stats{display:flex;align-items:flex-end;margin-inline-start:auto}
.stat{display:flex;flex-direction:column;gap:6px;padding:0 28px}
.stat:first-child{padding-inline-start:0}
.stat + .stat{border-inline-start:1px solid var(--line)}
.stat .v{display:flex;align-items:baseline;gap:10px}
.stat .big{font-family:var(--display);font-size:clamp(56px,5.5vw,80px);line-height:.9;direction:ltr}
.stat small{font-size:14px;color:var(--muted)}
.chart{padding:14px 0 4px}
.chart svg{display:block;width:100%;height:auto}
.take{padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.take p{font-size:clamp(18px,1.5vw,21px);line-height:1.6;color:var(--text)}
.ev a{display:grid;grid-template-columns:52px 84px minmax(0,1fr) 44px;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.ev a:hover .et{text-decoration:underline;text-underline-offset:3px}
.ev .m{font-size:13px;color:var(--muted)}
.ev .k{font-size:12px;font-weight:700;line-height:1;padding:4px 8px;border:1px solid var(--line2);border-radius:3px;color:var(--text2);text-align:center}
.ev .et{font-size:16px;line-height:1.45}
.ev .w{font:500 15px/1 var(--mono);text-align:left;direction:ltr}
.ev .w.neg{color:var(--muted)}
.fchips{display:flex;gap:8px;flex-wrap:wrap}
.fchips > span{padding:3px 9px;border:1px solid var(--line2);border-radius:3px;font-size:13px;line-height:1.4;color:var(--text2)}
.fchips > span.neg{border-style:dashed}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line)}
.three > div{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px}
.three > div:first-child{padding-inline-start:0}
.three > div + div{border-inline-start:1px solid var(--line)}
.three p{font-size:16px;line-height:1.6;color:var(--text2)}
.res-g{display:flex;flex-direction:column}
.res-g .rail-h{margin-top:8px}

/* the full ranking: one row per player, open it to see what moved them */
.rk-head,.rk-full{display:grid;grid-template-columns:44px 52px minmax(0,1fr) 96px 56px 20px;align-items:center;column-gap:16px;padding-inline:12px}
.rk-head{padding-bottom:10px;font-size:12.5px;font-weight:700;letter-spacing:.03em;line-height:1.4;color:var(--muted)}
.rk-full{width:100%;min-height:84px;padding-block:14px;text-align:right}
.rk-full:hover,.rk-full[aria-expanded="true"]{background:var(--surface)}
.rk-full .rk-pos{line-height:.9}
.rk-full .dl{text-align:right}
.rk-full .rk-score{text-align:left}
.rk-full[aria-expanded="true"] .rk-name{text-decoration:none}
.rk-spark{display:flex;justify-content:center}
.rk-chev{display:flex;justify-content:center;color:var(--muted);transition:transform .2s ease}
.rk-full[aria-expanded="true"] .rk-chev{transform:rotate(180deg);color:var(--text)}
.rk-exp{background:var(--surface);padding:0 12px 20px;display:flex;flex-direction:column}
.rk-exp .ev a:first-child{border-top:1px solid var(--line)}
.rk-exp .take{background:var(--s2)}

/* ---------- footer ---------- */
.foot{background:#0A0A0B;border-top:1px solid #1E1E22;color:#F4F4F1}
.foot nav{display:flex;flex-direction:column;gap:10px}
.foot nav .lbl{color:#A3A39C}
.foot nav a{font-size:14.5px;color:#CFCFC9}
.foot nav a:hover{color:#F4F4F1;text-decoration:underline;text-underline-offset:3px}
.foot :focus-visible{outline-color:#FFDA1F}

/* ---------- drawer, toast ---------- */
.drawer{position:fixed;inset:0;z-index:40;display:flex;justify-content:flex-end}
.drawer .search{width:100%;display:flex}
.drawer nav{display:flex;flex-direction:column}
.drawer nav .lbl{color:#A3A39C;padding-bottom:6px}
.drawer nav a,.drawer nav button{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:44px;border-bottom:1px solid #1E1E22;font-size:15px;font-weight:600;color:#DEDED8;width:100%}
.drawer nav .m{font-size:12px;color:#86867F;font-weight:500}
.drawer :focus-visible{outline-color:#FFDA1F}
.toast{position:fixed;bottom:calc(20px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);z-index:50;max-width:calc(100vw - 32px);padding:11px 16px;border-radius:var(--r);background:var(--inv);color:var(--invink);font-size:14px;font-weight:600;line-height:1.4;box-shadow:0 8px 28px rgba(0,0,0,.35)}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .cols,.art{grid-template-columns:minmax(0,1fr) 340px}
}
@media (max-width:980px){
  .wrap{gap:48px}
  .cols,.art{grid-template-columns:minmax(0,1fr)}
  .dc-meta{display:none}
  .rail{gap:40px}
  .three{grid-template-columns:minmax(0,1fr)}
  .three > div{padding-inline:0}
  .three > div + div{border-inline-start:0;border-top:1px solid var(--line)}
}
@media (max-width:760px){
  .wrap{gap:44px;padding-block:20px 64px}
  .wrap-home{padding-block-start:16px}
  .dc{height:clamp(552px,81.6vh,768px);padding-top:10px}
  @supports (height:1svh){ .dc{height:clamp(552px,81.6svh,768px)} }
  /* phones: the block takes its natural height and the page scrolls; no inner scroll box */
  .dc{height:auto;grid-template-rows:auto auto}
  .dc-panel{flex:none;min-height:auto;container-type:inline-size;overflow:visible}
  .dc-pane{position:relative;inset:auto;height:auto;min-height:max-content}
  .dc-pane.scrolly{overflow:visible}
  /* a phone: slimmer chrome, so the panel keeps its height; sharing stays one tap away, from every tab */
  .dc-head{padding-bottom:10px;gap:8px 10px}
  .dc-head h1{font-size:30px}
  .dc-act{gap:8px}
  .dc-act .stamp{padding:3px 10px 3px 11px;font-size:12.5px}
  .dct{min-width:116px;padding:8px 12px 9px;gap:4px}
  .dct-v{font-size:20px}
  .dct-v .clk{font-size:15px;letter-spacing:0;direction:ltr}
  .dc-tabs{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 16px);mask-image:linear-gradient(to left,transparent 0,#000 16px)}
  .dct-v svg,.dct-v .dm{display:none}
  .chips.scroll{margin-inline:-16px;padding-inline:16px}
  .chips.scroll.ovf{padding-inline-end:40px}
  .c-meta .badge{display:none}
  .card .c-mb{display:flex}
  .c-title{font-size:32px}
  .pv-thumb{width:104px;height:72px}
  .pv-link{padding:14px 16px;gap:14px}
  .duo{grid-template-columns:minmax(0,1fr)}
  .ev a{grid-template-columns:48px minmax(0,1fr) 36px}
  .ev .k{display:none}
  .stats{width:100%}
  .stat{padding:0 18px}
  .rk-row.here{padding-inline:10px 6px}
  .rk-head{display:none}
  .rk-full{grid-template-columns:30px minmax(0,1fr) 40px 18px;grid-template-areas:"pos who score chev" "dl who score chev";column-gap:12px;row-gap:4px;padding-inline:8px;min-height:80px}
  .rk-full .rk-pos{grid-area:pos;align-self:end}
  .rk-full .dl{grid-area:dl;align-self:start}
  .rk-full .rk-who{grid-area:who}
  .rk-full .rk-score{grid-area:score}
  .rk-full .rk-chev{grid-area:chev}
  .rk-full .rk-spark{display:none}
  .rk-exp{padding-inline:8px}
}
@media (max-width:380px){ .st-w{display:none} }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .draw{stroke-dashoffset:0}
  .sweep mark{background-size:100% 86%;color:var(--markink)}
}

/* the block alone on its page */

/* r7 · כותרות נוספות 50/50 מתחת לכותרת הראשית */
.ps-alt{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1.4cqw,16px) clamp(14px,2.2cqw,28px);flex:0 0 auto;padding-top:clamp(8px,1.8cqh,14px);border-top:1px solid var(--line2)}
.alt-i{display:flex;flex-direction:column;gap:2px;min-width:0;color:inherit;text-decoration:none}
.alt-d{font:500 12px var(--font-site);color:var(--faint);letter-spacing:0}
@media (max-width:720px){ .alt-d{font:400 13px var(--font-site);line-height:1.5} }
.alt-h{font:700 clamp(14px,1.4cqw,17px)/1.2 var(--font-site);color:var(--text);text-wrap:balance}
.alt-x{font:400 12px/1.4 var(--font-site);color:var(--text2);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.alt-i:hover .alt-h{text-decoration:underline;text-underline-offset:3px}

/* r7 · חייבים לדעת: כותרת + תיאור לכל פריט */
.mk-i{display:flex;flex-direction:column;gap:2px;padding:7px 0;border-bottom:1px solid var(--line2)}
.mk-i:last-child{border-bottom:0}
.mk-t{margin:0;display:flex;justify-content:space-between;align-items:baseline;gap:10px;font:700 14px/1.3 var(--font-site);color:var(--text);letter-spacing:0}
.mk-tm{font:500 12px var(--font-site);color:var(--faint);white-space:nowrap}
.mk-d{margin:0;font:400 12.5px/1.45 var(--font-site);color:var(--text2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* r7 · חייבים לדעת נכנס בתוך העמודה הצדדית; הרשימה גוללת במקום לחתוך */
.ps-side{overflow:hidden}
.ps-side .ps-more{min-height:0;overflow-y:auto;scrollbar-width:thin;flex:1 1 auto}
.ps-main .ps-text{overflow:hidden;min-height:0;flex:0 0 auto;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;max-height:4.9em}
/* Breathing room between the headline description and the four items below it. */
.ps-main .ps-alt{flex:0 0 auto;padding-top:clamp(14px,3cqh,26px);margin-top:clamp(10px,2cqh,18px)}
