@font-face{font-family:Heebo;src:url(../assets/fonts/heebo-latin.woff2) format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Heebo;src:url(../assets/fonts/heebo-latin-ext.woff2) format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Heebo;src:url(../assets/fonts/heebo-hebrew.woff2) format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:'JetBrains Mono';src:url(../assets/fonts/jbmono-latin.woff2) format('woff2');font-weight:300 500;font-display:swap}
:root{--bg:#07080a;--bg-rgb:7,8,10;--ink:#eceef2;--ink-rgb:236,238,242;--hi:#fff;--body:#d6d9df;--body2:#c4c8d1;--mute:#b3b8c3;--dim:#7d8391;--faint:rgba(236,238,242,.12);--accent:#ff6b3d;--accent-rgb:255,107,61;--panel:#0a0b0e;--card:rgba(10,11,14,.9);--media:#0d0e11;--shadow:rgba(0,0,0,.6);--on-ink:#0a0b0d;--ease:cubic-bezier(.2,.7,.2,1);--safe-b:env(safe-area-inset-bottom,0px);--mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color-scheme:dark}
html[data-theme=light]{--bg:#f3f0e8;--bg-rgb:243,240,232;--ink:#17191e;--ink-rgb:23,25,30;--hi:#000;--body:#30343c;--body2:#3d424b;--mute:#4d525c;--dim:#80848c;--faint:rgba(23,25,30,.14);--accent:#ea5525;--accent-rgb:234,85,37;--panel:#faf8f3;--card:rgba(250,248,243,.93);--media:#e6e2d8;--shadow:rgba(60,50,30,.16);--on-ink:#f6f4ee;color-scheme:light}
html.theme-anim,html.theme-anim *,html.theme-anim *::before,html.theme-anim *::after{transition:background-color .6s var(--ease),color .6s var(--ease),border-color .6s var(--ease),box-shadow .6s var(--ease)!important}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:400 16px/1.5 Heebo,system-ui,-apple-system,Segoe UI,Arial,sans-serif;-webkit-font-smoothing:antialiased}
html.js body{overflow:hidden}
button{font:inherit;color:inherit;cursor:pointer}
a{color:var(--ink)}
.mono{font-family:var(--mono)}
:focus-visible{outline:1px solid var(--accent);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;inset-inline-start:12px;top:-60px;z-index:50;background:var(--ink);color:var(--bg);padding:8px 14px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
#web{position:fixed;inset:0;display:block;touch-action:none;outline:none;user-select:none;-webkit-user-select:none}
#web.cutting{cursor:crosshair}
html:not(.js) #web{display:none}

/* top bar */
.topbar{position:fixed;top:0;inset-inline:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:calc(14px + env(safe-area-inset-top,0px)) clamp(16px,3vw,40px) 10px;pointer-events:none}
.topbar>*{pointer-events:auto}
.mark{background:none;border:0;font:500 12px/1 var(--mono);letter-spacing:.3em;color:var(--ink);padding:8px 0;display:flex;align-items:center;gap:10px;white-space:nowrap}
.mark i{width:8px;height:8px;border-radius:50%;border:1px solid var(--accent);position:relative;flex:none}
.mark i::after{content:"";position:absolute;inset:2px;border-radius:50%;background:var(--accent)}
.ctrls{display:flex;gap:6px}
.chip{background:rgba(var(--bg-rgb),.7);border:1px solid var(--faint);border-radius:3px;padding:8px 12px;font:400 12.5px/1.2 var(--mono);letter-spacing:.04em;color:var(--mute);transition:color .2s,border-color .2s;display:flex;align-items:center;gap:7px;white-space:nowrap}
.chip:hover,.chip[aria-pressed=true]{color:var(--ink);border-color:rgba(var(--ink-rgb),.4)}
.chip:lang(he),[dir=rtl] .chip{font-family:Heebo,sans-serif;font-size:14px;letter-spacing:0}
#langBtn:lang(en){font-family:var(--mono);font-size:12.5px}
.chip svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3}
.chip b{font-weight:400}
/* mode switcher */
.modes{position:absolute;left:50%;top:calc(12px + env(safe-area-inset-top,0px));transform:translateX(-50%);display:flex;padding:3px;gap:2px;background:rgba(var(--bg-rgb),.72);border:1px solid var(--faint);border-radius:4px}
.mode{display:flex;align-items:center;gap:7px;background:none;border:0;border-radius:2px;padding:7px 11px;font:400 12.5px/1 var(--mono);letter-spacing:.04em;color:var(--mute);transition:color .2s,background .2s}
[dir=rtl] .mode{font-family:Heebo,sans-serif;font-size:14px;letter-spacing:0}
.mode svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linejoin:round;flex:none}
.mode b{font-weight:400}
.mode:hover{color:var(--ink)}
.mode[aria-pressed=true]{background:rgba(var(--ink-rgb),.1);color:var(--hi)}
.mode[aria-pressed=true] svg{stroke:var(--accent)}
@media (max-width:1240px){.mode:not([aria-pressed=true]) b{display:none}.mode{padding:7px 9px}}

/* hero */
.hero{position:fixed;z-index:10;inset-inline-start:clamp(20px,5.4vw,84px);top:50%;transform:translateY(-54%);width:min(440px,32vw);pointer-events:none;transition:opacity .5s var(--ease)}
.hero>*{pointer-events:auto}
.hero-kicker{margin:0 0 18px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:12px}
.hero-kicker::before{content:"";width:24px;height:1px;background:var(--accent)}
.hero h1{margin:0;font-size:clamp(44px,4.8vw,66px);line-height:1;font-weight:600;letter-spacing:-.025em}
.hero-role{margin:16px 0 0;color:var(--ink);font-weight:400;font-size:17px;line-height:1.45}
.hero-intro{margin:14px 0 0;color:var(--body2);font-size:16px;line-height:1.7;font-weight:300}
.hero-cta{display:flex;gap:8px;margin-top:26px;flex-wrap:wrap}
.btn{border:1px solid rgba(var(--ink-rgb),.28);background:rgba(var(--bg-rgb),.4);border-radius:3px;padding:11px 16px;font:400 13.5px/1.2 var(--mono);letter-spacing:.03em;color:var(--ink);transition:border-color .2s,background .2s,color .2s}
[dir=rtl] .btn{font-family:Heebo,sans-serif;font-size:15px;letter-spacing:0}
.btn:hover{border-color:var(--ink)}
.btn-primary{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.btn-primary:hover{background:var(--hi)}
.hero-contact{margin:24px 0 0;font-size:13px;color:var(--mute);display:flex;flex-wrap:wrap;gap:6px 18px}
.hero-contact a,.about-links a{color:var(--mute);text-decoration:none;border-bottom:1px solid var(--faint);padding-bottom:2px}
.hero-contact a:hover,.about-links a:hover{color:var(--ink);border-color:var(--accent)}
body.panel-open .hero{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .3s,visibility 0s .3s}

/* node labels (positioned by the simulation) */
#labels{position:fixed;inset:0;z-index:9;pointer-events:none;overflow:hidden}
.node{position:absolute;left:0;top:0;height:32px;display:flex;align-items:center;gap:8px;padding:0 6px;background:rgba(var(--bg-rgb),.55);border:0;border-radius:3px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .6s var(--ease)}
.node.on{opacity:1;pointer-events:auto}
.node .n{font:500 12px/1 var(--mono);color:var(--accent);letter-spacing:.04em}
.node .t{font:400 13px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hi);transition:color .2s}
[dir=rtl] .node .t{font:500 15px/1 Heebo,sans-serif;letter-spacing:0;text-transform:none}
.node.hot .t,.node:hover .t{color:var(--hi)}
.node.hot{background:rgba(var(--accent-rgb),.12)}

/* section index */
.index{position:fixed;z-index:12;bottom:calc(20px + var(--safe-b));inset-inline-start:clamp(20px,5.4vw,84px);font-size:13px}
.index ol{display:flex;gap:4px 20px;flex-wrap:wrap;margin:0;padding:0;list-style:none;max-width:calc(100vw - 600px)}
.index button{background:none;border:0;padding:5px 0;color:var(--mute);letter-spacing:.03em;font:inherit;transition:color .2s}
[dir=rtl] .index button{font-family:Heebo,sans-serif;font-size:15px;letter-spacing:0}
.index button .n{color:var(--dim);font-family:var(--mono);font-size:11.5px;margin-inline-end:6px}
.index button:hover,.index button[aria-current=true]{color:var(--ink)}
.index button[aria-current=true] .n,.index button:hover .n{color:var(--accent)}

/* HUD */
.hud{position:fixed;z-index:12;bottom:calc(18px + var(--safe-b));inset-inline-end:clamp(16px,3vw,40px);display:grid;justify-items:end;gap:10px;color:var(--dim);transition:opacity .3s}
.hud-tools{display:flex;gap:6px}
.tool{background:rgba(var(--bg-rgb),.7);border:1px solid var(--faint);border-radius:3px;padding:7px 11px;font:400 12.5px/1.2 var(--mono);letter-spacing:.04em;color:var(--mute);display:flex;gap:7px;align-items:center;transition:color .2s,border-color .2s}
.tool b{font-weight:400}
[dir=rtl] .tool b{font-family:Heebo,sans-serif;font-size:14px}
.tool:hover{color:var(--ink);border-color:rgba(var(--ink-rgb),.4)}
.tool[aria-pressed=true]{color:var(--accent);border-color:rgba(var(--accent-rgb),.6)}
body.no-cut #cutBtn{display:none}
.hud-hint{margin:0;font:400 12.5px/1.45 var(--mono);color:var(--mute);letter-spacing:.01em;max-width:440px;text-align:end}
[dir=rtl] .hud-hint{font-family:Heebo,sans-serif;font-size:14px}
.hud-read{display:flex;gap:18px;margin:0;direction:ltr;font-family:var(--mono)}
.hud-read div{display:grid;gap:3px;text-align:right}
.hud-read dt{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.hud-read dd{margin:0;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums;min-width:3ch}
.hud-read dd i{font-style:normal;color:var(--dim);font-size:12px}
body.panel-open .hud{opacity:0;pointer-events:none}

/* about card (fullscreen / immersive) */
.about{display:none;position:fixed;z-index:14;inset-inline-start:24px;bottom:calc(24px + var(--safe-b));width:min(400px,calc(100vw - 48px));background:var(--card);border:1px solid var(--faint);border-radius:4px;padding:18px 22px 20px;box-shadow:0 20px 60px var(--shadow)}
body.immersive .about{display:block}
.about-kicker{margin:0 0 8px;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.about h2{margin:0;font-size:26px;line-height:1.1;font-weight:600;letter-spacing:-.02em}
.about-role{margin:6px 0 0;font-size:14.5px;color:var(--mute);line-height:1.45}
.about-text{margin:12px 0 0;font-size:15.5px;line-height:1.65;color:var(--body);font-weight:300}
.about-links{margin:14px 0 0;font-size:12.5px;display:flex;flex-wrap:wrap;gap:6px 16px}
.about .btn{margin-top:14px;padding:9px 13px;font-size:12.5px}
.about-toggle{position:absolute;top:12px;inset-inline-end:12px;width:32px;height:32px;border:1px solid var(--faint);border-radius:3px;background:none;display:grid;place-items:center;color:var(--mute)}
.about-toggle span{width:8px;height:8px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s var(--ease)}
.about.collapsed .about-toggle span{transform:translateY(2px) rotate(-135deg)}
.about.collapsed .about-body{display:none}
.about.collapsed{padding-bottom:16px}
body.immersive .hero,body.immersive .index,body.immersive #langBtn,body.immersive #listBtn,body.immersive .mark{opacity:0;visibility:hidden;pointer-events:none}
body.immersive.panel-open .about{opacity:0;visibility:hidden}
body.immersive .hud-hint{display:none}

/* panel */
.panel{position:fixed;z-index:30;top:66px;bottom:16px;inset-inline-end:16px;width:min(500px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--faint);border-radius:4px;box-shadow:0 30px 80px var(--shadow);display:flex;flex-direction:column;transform:translateX(calc(100% + 24px));transition:transform .55s var(--ease),visibility .55s;visibility:hidden}
[dir=rtl] .panel{transform:translateX(calc(-100% - 24px))}
.panel.open{transform:none!important;visibility:visible}
.panel[hidden]{display:flex}
.panel-handle{display:none}
.panel-close{position:absolute;top:14px;inset-inline-end:14px;width:36px;height:36px;border-radius:3px;border:1px solid var(--faint);background:transparent;font-size:20px;line-height:1;color:var(--mute);z-index:2}
.panel-close:hover{color:var(--ink);border-color:rgba(var(--ink-rgb),.4)}
.panel-body{overflow:auto;padding:30px 30px 34px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--ink-rgb),.18) transparent}
.p-kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0 50px 14px 0}
[dir=rtl] .p-kicker{margin:0 0 14px 50px;letter-spacing:.04em}
.p-kicker span{color:var(--accent)}
.panel h2{margin:0;font-size:32px;line-height:1.1;font-weight:600;letter-spacing:-.02em}
.p-intro{margin:12px 0 0;color:var(--body2);font-size:16.5px;line-height:1.6;font-weight:300}
.p-toc{display:grid;margin:22px 0 4px;border-top:1px solid var(--faint)}
.p-toc a{display:flex;gap:14px;padding:10px 0;border-bottom:1px solid var(--faint);text-decoration:none;color:var(--body2);font:400 13.5px/1.35 var(--mono);letter-spacing:.01em}
[dir=rtl] .p-toc a{font-family:Heebo,sans-serif;font-size:15.5px}
.p-toc a span{color:var(--dim);font-family:var(--mono);font-size:11.5px;padding-top:2px}
.p-toc a:hover{color:var(--hi)}
.p-toc a:hover span{color:var(--accent)}
.p-item{padding:28px 0 4px}
.p-item+.p-item{border-top:1px solid var(--faint);margin-top:20px}
.p-item h3{margin:0;font-size:21px;font-weight:600;letter-spacing:-.01em}
.p-sub{margin:6px 0 0;color:var(--mute);font-size:13.5px;font-family:var(--mono);letter-spacing:.01em;line-height:1.45}
[dir=rtl] .p-sub{font-family:Heebo,sans-serif;font-size:15px}
.p-body{margin:12px 0 0;color:var(--body);font-size:16.5px;line-height:1.7;font-weight:300}
.p-list{margin:14px 0 0;padding:0;list-style:none;border-top:1px solid var(--faint)}
.p-list li{padding:10px 0;border-bottom:1px solid var(--faint);font-size:15px;color:var(--body)}
.p-list li::before{content:"";display:inline-block;width:6px;height:6px;border:1px solid var(--accent);border-radius:50%;margin-inline-end:12px;vertical-align:2px}
.p-tags{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0;list-style:none}
.p-tags li{font-size:12px;padding:4px 9px;border:1px solid var(--faint);border-radius:3px;color:var(--mute)}
.p-gallery{margin:18px 0 0}
.p-main{margin:0;border-radius:3px;overflow:hidden;background:var(--media);aspect-ratio:16/10;position:relative}
.p-main img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s}
.p-main figcaption{position:absolute;inset-inline:0;bottom:0;padding:24px 14px 10px;font:400 12px/1.35 var(--mono);color:#e4e6ea;background:linear-gradient(transparent,rgba(0,0,0,.8))}
[dir=rtl] .p-main figcaption{font-family:Heebo,sans-serif;font-size:13.5px}
.p-thumbs{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
.p-thumbs button{width:70px;height:46px;border-radius:3px;border:1px solid transparent;padding:0;overflow:hidden;background:none;opacity:.55;transition:opacity .2s}
.p-thumbs button[aria-pressed=true]{opacity:1;border-color:var(--accent)}
.p-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.p-video{margin:10px 0 0;display:grid;gap:8px}
.vtile{position:relative;border-radius:3px;overflow:hidden;aspect-ratio:16/9;border:0;background:#000;padding:0;width:100%;display:block}
.vtile img{width:100%;height:100%;object-fit:cover;display:block;opacity:.82;transition:opacity .2s}
.vtile:hover img{opacity:1}
.vtile span{color:#fff;position:absolute;inset:auto 0 0 0;padding:24px 14px 10px;background:linear-gradient(transparent,rgba(0,0,0,.82));font:400 12.5px/1.3 var(--mono);text-align:start;letter-spacing:.02em}
.vtile::after{content:"";position:absolute;left:50%;top:46%;width:52px;height:52px;margin:-26px;border-radius:50%;border:1px solid rgba(255,255,255,.9);background:rgba(0,0,0,.35) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.5 7.5l7 4.5-7 4.5z' fill='%23ffffff'/%3E%3C/svg%3E") center/24px no-repeat}
.vframe{aspect-ratio:16/9;width:100%;border:0;border-radius:3px;display:block;background:#000}
.p-links{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0}
.p-links a{text-decoration:none;font:400 13px/1.2 var(--mono);padding:9px 13px;border-radius:3px;border:1px solid rgba(var(--ink-rgb),.28);color:var(--ink)}
.p-links a:hover{border-color:var(--accent)}
.p-next{display:block;width:100%;margin:30px 0 0;padding:16px 0;background:none;border:0;border-top:1px solid var(--faint);text-align:end;color:var(--body2);font-size:13px;letter-spacing:.05em}
[dir=rtl] .p-next{font-family:Heebo,sans-serif;font-size:15px;letter-spacing:0}
.p-next:hover{color:var(--hi)}
.p-src{margin:14px 0 0;font-size:12px;color:var(--dim)}

/* list view */
.list{display:none;position:fixed;inset:0;z-index:25;overflow:auto;background:var(--bg);padding:88px clamp(18px,6vw,72px) 60px}
html:not(.js) .list{display:block;position:static}
body.show-list .list{display:block}
body.show-list #index,body.show-list #hud,body.show-list .hero,body.show-list #labels,body.show-list .panel,body.show-list #web{display:none!important}
body.show-list .topbar{z-index:30;background:linear-gradient(var(--bg) 70%,rgba(var(--bg-rgb),0))}
.list-inner{max-width:820px;margin:0 auto}
.lv-hero h1{font-size:clamp(36px,6vw,56px);margin:0;line-height:1;font-weight:600;letter-spacing:-.025em}
.lv-role{color:var(--mute);margin:12px 0 0;font-family:var(--mono);font-size:14px}
[dir=rtl] .lv-role{font-family:Heebo,sans-serif;font-size:15px}
.lv-hero p{color:var(--body);font-weight:300;font-size:17px}
.lv-zone{padding:30px 0;border-bottom:1px solid var(--faint)}
.lv-zone h2{font-size:25px;margin:0 0 4px;font-weight:600}
.lv-num{color:var(--accent);font:400 11px var(--mono);letter-spacing:.1em;margin-inline-end:10px;vertical-align:middle}
.lv-intro{color:var(--mute);margin:0 0 6px;font-weight:300;font-size:16px}
.lv-item{padding:14px 0}
.lv-item h3{margin:0;font-size:19px;font-weight:600}
.lv-sub{margin:3px 0 0;color:var(--mute);font-size:13.5px;font-family:var(--mono)}
[dir=rtl] .lv-sub{font-family:Heebo,sans-serif;font-size:13.5px}
.lv-item p{margin:6px 0 0;color:var(--body);font-weight:300;font-size:16.5px;line-height:1.65}
.lv-item ul{margin:8px 0 0;padding-inline-start:20px;color:var(--body2)}
.lv-media{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.lv-media img{width:150px;height:94px;object-fit:cover;border-radius:2px;display:block}
.lv-video{position:relative;display:block;text-decoration:none;color:var(--ink);font-size:11px}
.lv-video span{color:#fff;position:absolute;inset:auto 0 0 0;padding:4px 8px;background:rgba(0,0,0,.7);font-family:var(--mono)}
.lv-links a{margin-inline-end:4px;color:var(--ink)}
.lv-note{color:var(--dim);font-size:11.5px;margin-top:24px}


/* phones (portrait) */
@media (max-width:760px) and (orientation:portrait),(max-aspect-ratio:4/5){
body.panel-open .node:not(.hot) .t{display:none}
  .topbar{padding-top:calc(12px + env(safe-area-inset-top,0px))}
  .mark{font-size:11px;letter-spacing:.22em}
  .chip{padding:7px 9px;font-size:12px}
  [dir=rtl] .chip{font-size:13.5px}
  .chip.fs b,.chip.lbtn b,.chip.shake b{display:none}
  #shakeBtn{display:none}
  #shakeTool{display:flex}
  body.immersive #shakeBtn{display:flex}
  .chip.lbtn{padding:7px 9px}
  .modes{top:calc(60px + env(safe-area-inset-top,0px))}
  .mode{padding:8px 10px}
  .mode:not([aria-pressed=true]) b{display:none}
  .hero{inset-inline:20px;top:auto;bottom:calc(112px + var(--safe-b));transform:none;width:auto}
  .hero-kicker{margin-bottom:10px;font-size:11px}
  .hero h1{font-size:38px}
  .hero-role{font-size:15px;margin-top:8px}
  .hero-intro{font-size:15px;line-height:1.6;margin-top:8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .hero-cta{margin-top:14px}
  .btn{padding:10px 14px;font-size:13px}
  .hero-contact{display:none}
  .index{inset-inline:0;bottom:calc(8px + var(--safe-b));overflow-x:auto;scrollbar-width:none;padding:0 20px}
  .index::-webkit-scrollbar{display:none}
  .index ol{flex-wrap:nowrap;max-width:none;gap:18px;width:max-content}
  .index button{padding:9px 0}
  .hud{inset-inline:20px;bottom:calc(52px + var(--safe-b));grid-template-columns:1fr auto;align-items:center;justify-items:stretch;gap:8px}
  .hud-hint{display:none}
  .hud-read{gap:12px;order:-1}
  .hud-read div:nth-child(n+5){display:none}
  .hud-read dt{font-size:9.5px}
  .hud-read dd{font-size:12.5px}
  .tool{padding:7px 9px}
  .tool b{display:none}
  .tool span{font-size:14px;line-height:1}
  .m-hint{display:block}
  .panel{top:auto;bottom:0;inset-inline:0;width:100%;max-height:66vh;height:66vh;max-height:66dvh;height:66dvh;border-radius:8px 8px 0 0;border-bottom:0;transform:translateY(105%)!important;padding-bottom:var(--safe-b)}
  .panel.open{transform:translateY(var(--drag,0px))!important}
  .panel-handle{display:flex;justify-content:center;padding:10px 0 2px;touch-action:none;cursor:grab}
  .panel-handle i{width:40px;height:4px;border-radius:3px;background:rgba(var(--ink-rgb),.25)}
  .panel-body{padding:8px 20px 28px}
  .panel h2{font-size:26px}
  .p-intro{font-size:15.5px}
  .p-body{font-size:15.5px}
  .p-toc a{font-size:13px}
  body.panel-open .index{opacity:0;pointer-events:none}
  .node{height:28px;padding:0 5px}
  .node .t{font-size:11.5px;letter-spacing:.08em}
  .node .n{font-size:11px}
  [dir=rtl] .node .t{font-size:13.5px}
  .about{inset-inline:12px;bottom:calc(12px + var(--safe-b));width:auto;padding:16px 18px}
  .about h2{font-size:22px}
  .about-role{font-size:13.5px}
  .about-text{font-size:15px;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
  body.immersive .hud{display:none}
}
.m-hint{display:none;position:fixed;z-index:11;left:0;right:0;top:calc(104px + env(safe-area-inset-top,0px));text-align:center;margin:0;padding:0 16px;font:400 11.5px/1.4 var(--mono);color:var(--mute);pointer-events:none}
[dir=rtl] .m-hint{font-family:Heebo,sans-serif;font-size:13px}
body.panel-open .m-hint,body.show-list .m-hint{display:none!important}
/* phones (landscape) */
@media (max-height:520px) and (orientation:landscape){
  .modes{left:auto;transform:none;inset-inline-end:clamp(16px,3vw,40px);top:56px}
  .mode b{display:none}
  .hero{top:62px;transform:none;width:min(380px,42vw)}
  .hero-kicker{margin-bottom:8px;font-size:11px}
  .hero h1{font-size:32px}
  .hero-role{font-size:14px;margin-top:6px}
  .hero-intro{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;margin-top:6px}
  .hero-cta{margin-top:12px}
  .btn{padding:9px 12px;font-size:12.5px}
  .hero-contact{display:none}
  .hud-hint,.hud-read div:nth-child(n+4){display:none}
  .hud-read dd{font-size:12.5px}
  .tool b{display:none}
  .index{bottom:10px;font-size:12px}
  .index ol{max-width:50vw;gap:2px 14px}
  .panel{top:10px;bottom:10px}
  body.panel-open .index{opacity:0;pointer-events:none}
  .node{height:26px}
  .node .t{font-size:11px;letter-spacing:.08em}
  .about{width:min(340px,44vw);padding:12px 16px}
  .about-text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px}
  .about h2{font-size:20px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
#panel [tabindex="-1"]:focus{outline:none}
body.panel-open .index ol{max-width:calc(100vw - 640px)}

/* SHAKE fx */
#fx{position:fixed;inset:0;width:100%;height:100%;z-index:80;pointer-events:none;display:none}
#fxLetters{position:fixed;inset:0;z-index:79;pointer-events:none;overflow:hidden;display:none;contain:strict}
.fx-l{position:absolute;display:block;white-space:pre;text-align:left;direction:ltr;will-change:transform;transform-origin:50% 55%;pointer-events:none}
html.shaking-letters :is(.mark-t,#heroKicker,#heroName,#heroRole,#aboutKicker,#aboutName,#panelTitle,#labels .node .t){color:transparent!important;transition:none!important}
html.fx-snap :is(.mark-t,#heroKicker,#heroName,#heroRole,#aboutKicker,#aboutName,#panelTitle,#labels .node .t){transition:none!important}
html.shaking .hero,html.shaking .modes{will-change:translate}
.chip.icon{padding:8px 9px}
.chip.icon b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#shakeBtn svg{stroke-width:1.4}
#shakeBtn:hover svg,#shakeTool:hover{color:var(--accent)}
#shakeTool{display:none}
html[data-theme=light] .node{background:rgba(var(--bg-rgb),.72)}
html[data-theme=light] .btn-primary:hover{background:#000;border-color:#000}
html[data-theme=light] .panel-body{scrollbar-color:rgba(23,25,30,.25) transparent}
body.show-list .modes,body.show-list #shakeBtn{display:none!important}
html.shaking-letters #labels .node{background:transparent!important;transition:none!important}
/* top bar density: icon-only secondary chips until there is room for labels */
@media (max-width:1599px){.chip.lbtn b,.chip.fs b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.chip.lbtn,.chip.fs{padding:8px 9px}}
@media (min-width:761px) and (max-width:1060px){.modes{top:calc(58px + env(safe-area-inset-top,0px))}}

/* ---------- mobile QA pass (portrait + landscape phones only; desktop untouched) ---------- */
html.js,html.js body{overscroll-behavior:none}
#menuBtn,.menu{display:none}
.menu[hidden]{display:none!important}
.menu{position:fixed;z-index:45;top:calc(62px + env(safe-area-inset-top,0px));inset-inline-end:calc(12px + env(safe-area-inset-right,0px));min-width:212px;padding:6px;background:var(--panel);border:1px solid var(--faint);border-radius:6px;box-shadow:0 18px 50px var(--shadow)}
.menu button{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 12px;background:none;border:0;border-radius:4px;color:var(--ink);font:400 14px/1.2 var(--mono);letter-spacing:.03em;text-align:start}
.menu button:lang(he),[dir=rtl] .menu button{font-family:Heebo,sans-serif;font-size:16px;letter-spacing:0}
.menu button:active,.menu button:focus-visible{background:rgba(var(--ink-rgb),.08)}
.menu svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3;flex:none;color:var(--mute)}
.menu b{font-weight:400}
@media (max-width:760px) and (orientation:portrait),(max-aspect-ratio:4/5),(max-height:520px) and (orientation:landscape){
  .topbar{padding-inline:calc(12px + env(safe-area-inset-left,0px)) calc(12px + env(safe-area-inset-right,0px));padding-top:calc(8px + env(safe-area-inset-top,0px));padding-bottom:6px}
  .mark{padding:15px 4px 15px 0}
  .ctrls{gap:8px}
  #langBtn,#listBtn,#fsBtn,#shakeBtn{display:none}
  body.immersive #fsBtn{display:flex}
  body.immersive #shakeBtn{display:none}
  #menuBtn{display:flex}
  .menu:not([hidden]){display:block}
  .ctrls .chip{min-width:44px;min-height:44px;justify-content:center;padding:0 12px}
  .ctrls .chip.icon{padding:0}
  .ctrls .chip svg{width:17px;height:17px}
  .tool{min-width:44px;min-height:44px;justify-content:center;padding:0 10px}
  .tool span{font-size:16px}
  .hero-cta .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .node::after{content:"";position:absolute;inset:-8px -4px}
  .m-hint{display:none!important}
}
@media (max-width:760px) and (orientation:portrait),(max-aspect-ratio:4/5){
  .modes{top:calc(62px + env(safe-area-inset-top,0px))}
  .mode{min-height:42px;min-width:44px;justify-content:center;padding:0 12px}
  .hero{bottom:calc(52px + var(--safe-b))}
  .hero-cta{flex-wrap:nowrap;margin-top:14px}
  .hero-cta .btn{flex:1 1 0;min-width:0;padding:0 10px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .index{bottom:calc(4px + var(--safe-b));touch-action:pan-x}
  .index button{min-height:44px;padding:0;font-size:14px}
  .hud{display:flex;align-items:center;justify-content:space-between;gap:12px;inset-inline:calc(16px + env(safe-area-inset-left,0px)) calc(16px + env(safe-area-inset-right,0px));bottom:var(--hud-bottom,220px)}
  .hud-read{display:none}
  .hud-hint{display:block;flex:1 1 auto;min-width:0;text-align:start;font-size:11.5px;line-height:1.4;max-width:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  [dir=rtl] .hud-hint{font-family:Heebo,sans-serif;font-size:13px}
  .hud-tools{flex:none}
  .node{height:30px;padding:0 6px}
  .panel-handle{padding:14px 0 8px;min-height:30px}
  .panel-close,.p-close,#panelClose{min-width:44px;min-height:44px}
}
@media (max-width:760px) and (orientation:portrait) and (max-height:700px),(max-aspect-ratio:4/5) and (max-height:700px){
  .hero-kicker{display:none}
  .hero h1{font-size:32px}
  .hero-role{font-size:14px;margin-top:6px}
  .hero-intro{-webkit-line-clamp:2;font-size:14.5px;line-height:1.5;margin-top:6px}
  .hero-cta{margin-top:12px}
}
@media (max-width:760px) and (orientation:portrait) and (max-height:600px),(max-aspect-ratio:4/5) and (max-height:600px){
  .hero-intro{display:none}
  .hero h1{font-size:28px}
}
@media (max-height:520px) and (orientation:landscape){
  .modes,[dir=rtl] .modes{left:50%;right:auto;transform:translateX(-50%);top:calc(8px + env(safe-area-inset-top,0px))}
  .hero-cta{flex-wrap:nowrap}
  .hero-cta .btn{font-size:12px;white-space:nowrap}
  body.panel-open .node:not(.hot) .t{display:none}
  .mode{min-height:40px;min-width:40px;justify-content:center;padding:0 9px}
  .hero{top:58px;inset-inline-start:calc(20px + env(safe-area-inset-left,0px));width:min(320px,40vw)}
  .hero h1{font-size:28px}
  .hero-kicker{margin-bottom:6px}
  .hero-cta .btn{padding:0 12px}
  .index{display:none}
  .hud{inset-inline-end:calc(12px + env(safe-area-inset-right,0px));bottom:calc(8px + var(--safe-b));display:flex}
  .hud-hint,.hud-read{display:none}
  .node{height:28px}
  .panel{width:min(440px,58vw);top:8px;bottom:8px;inset-inline-end:calc(8px + env(safe-area-inset-right,0px))}
}
@media (max-height:400px) and (orientation:landscape){.hero-intro{display:none}.hero-role{font-size:13px}}
@media (max-width:360px) and (orientation:portrait){.hero-cta .btn{font-size:11.5px;letter-spacing:0;padding:0 6px}}
html.fx-grabbable,html.fx-grabbable *{cursor:grab!important}
html.fx-holding,html.fx-holding *{cursor:grabbing!important;user-select:none!important;-webkit-user-select:none!important}