/* המדינה · בחירות 2026 — dark video zone: /feed (vertical feed) + /record (recorder). Builds on brand.css tokens. */
:root{
  --col-w:min(100vw, calc(100dvh * 9 / 16));
  --glass:rgba(18,19,24,.46);
  --glass-line:rgba(255,255,255,.14);
  --txt:#f4f5f7; --txt-2:rgba(244,245,247,.72); --txt-3:rgba(244,245,247,.5);
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --ease:cubic-bezier(.2,.8,.2,1);
}
body.dz{background:var(--vx-bg);color:var(--txt);color-scheme:dark;min-height:100dvh}

/* dark header variant (desktop on /feed, every width on /record) */
.hm-hdr.on-dark{background:rgba(7,8,11,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--vx-line)}
.hm-hdr.on-dark nav a{color:rgba(255,255,255,.78)}
.hm-hdr.on-dark nav a:hover{color:#fff}
.hm-hdr.on-dark nav a[aria-current="page"]{background:#fff;color:var(--ink)}

/* ---------- FEED ---------- */
body.fd{height:100dvh;overflow:hidden}
.fd-hdr{display:none}
.fd-stage{position:fixed;inset:0;display:flex;justify-content:center;background:radial-gradient(120% 70% at 50% 0%,#11131a 0%,var(--vx-bg) 60%)}
.fd-col{position:relative;width:var(--col-w);height:100%;background:var(--vx-bg);overflow:hidden}
@media (min-width:900px){
  .fd-hdr{display:block;position:fixed;top:0;inset-inline:0}
  .fd-stage{top:58px}
  .fd-col{--col-w:min(100vw, calc((100dvh - 58px) * 9 / 16));margin-block:0;border-inline:1px solid var(--vx-line)}
  .fd-top .wm{display:none}
}
.fd-scroller{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.fd-scroller::-webkit-scrollbar{display:none}

.slide{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;background:var(--vx-card);overflow:hidden;contain:strict;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--vx-card)}
.slide::before,.slide::after{content:"";position:absolute;inset-inline:0;pointer-events:none;z-index:1}
.slide::before{top:0;height:150px;background:linear-gradient(rgba(7,8,11,.62),transparent)}
.slide::after{bottom:0;height:46%;background:linear-gradient(transparent,rgba(7,8,11,.35) 35%,rgba(7,8,11,.86))}
.slide .tap{position:absolute;inset:0;z-index:2}
.slide .loading{position:absolute;inset:0;display:grid;place-items:center;z-index:1;pointer-events:none}
.slide .loading i{width:34px;height:34px;border-radius:50%;border:3px solid rgba(255,255,255,.18);border-top-color:#fff;animation:spin .9s linear infinite}
.slide.ready .loading{display:none}
.slide .vid-err{position:absolute;inset:0;display:grid;place-items:center;z-index:3;text-align:center;color:var(--txt-2);font:500 15px/1.5 var(--f);padding:24px}
@keyframes spin{to{transform:rotate(360deg)}}

/* overlay text block (right side in RTL) */
.meta{position:absolute;z-index:3;bottom:calc(22px + var(--safe-b));inset-inline-start:16px;inset-inline-end:84px;display:grid;gap:8px;pointer-events:none}
.meta .who{font:800 19px/1.2 var(--f);letter-spacing:-.01em;text-shadow:0 1px 12px rgba(0,0,0,.45);overflow-wrap:anywhere}
.meta .row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:500 13.5px/1 var(--f);color:var(--txt-2)}
.chip-party{display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 11px;border-radius:999px;font:700 12.5px/1 var(--f);box-shadow:0 2px 10px rgba(0,0,0,.25)}
.chip-party::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.75}
.meta .views{display:inline-flex;align-items:center;gap:5px}
.meta .views svg{width:15px;height:15px}
.pending{justify-self:start;display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:10px;background:rgba(242,185,33,.16);color:#ffd970;font:700 12.5px/1.2 var(--f);box-shadow:inset 0 0 0 1px rgba(242,185,33,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.pending::before{content:"";width:7px;height:7px;border-radius:50%;background:#f2b921;animation:hmblink 1.6s infinite}

/* action rail — physical left side (inline-end in RTL) */
.rail{position:absolute;z-index:4;inset-inline-end:10px;bottom:calc(26px + var(--safe-b));display:flex;flex-direction:column;align-items:center;gap:16px}
.rail a,.rail button{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;padding:0;color:#fff;font:700 11px/1.15 var(--f);text-align:center;width:66px;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.rail .ic{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--glass);box-shadow:inset 0 0 0 1px var(--glass-line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .18s var(--ease),background .18s}
.rail .ic svg{width:23px;height:23px}
.rail a:active .ic,.rail button:active .ic{transform:scale(.9)}
.rail .say .ic{background:var(--red);box-shadow:0 6px 18px rgba(219,0,0,.45)}

/* top bar */
.fd-top{position:absolute;z-index:6;top:0;inset-inline:0;padding:calc(12px + var(--safe-t)) 16px 0;display:flex;align-items:center;gap:12px;pointer-events:none}
.fd-top > *{pointer-events:auto}
.fd-top .wm{font-size:23px}
.fd-top .lbl{display:inline-flex;align-items:center;gap:8px;font:800 15px/1 var(--f);color:#fff;padding:7px 12px 7px 11px;border-radius:999px;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.dot-live{width:8px;height:8px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(245,22,27,.6);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(245,22,27,.55)}70%{box-shadow:0 0 0 9px rgba(245,22,27,0)}100%{box-shadow:0 0 0 0 rgba(245,22,27,0)}}
.snd{margin-inline-start:auto;width:40px;height:40px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.snd svg{width:20px;height:20px}
.snd[hidden]{display:none}

/* centre flashes */
.flash{position:absolute;z-index:5;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;display:grid;place-items:center;background:rgba(10,10,14,.5);color:#fff;pointer-events:none;animation:flash .7s var(--ease) forwards}
.flash svg{width:38px;height:38px}
@keyframes flash{0%{opacity:0;transform:scale(.7)}20%{opacity:1;transform:scale(1)}70%{opacity:1}100%{opacity:0;transform:scale(1.08)}}
.heart{position:absolute;z-index:5;width:110px;height:110px;margin:-55px 0 0 -55px;pointer-events:none;color:var(--red);filter:drop-shadow(0 6px 22px rgba(219,0,0,.55));animation:heart .9s var(--ease) forwards}
.heart svg{width:100%;height:100%}
@keyframes heart{0%{opacity:0;transform:scale(.3) rotate(var(--rot,0deg))}18%{opacity:1;transform:scale(1.15) rotate(var(--rot,0deg))}32%{transform:scale(.95) rotate(var(--rot,0deg))}70%{opacity:1;transform:scale(1) translateY(-10px) rotate(var(--rot,0deg))}100%{opacity:0;transform:scale(1.25) translateY(-70px) rotate(var(--rot,0deg))}}

/* full-screen states: empty / error / loading */
.state{height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:0 24px calc(40px + var(--safe-b));position:relative;overflow:hidden;background:var(--vx-bg)}
.state .date{position:absolute;inset-inline:0;top:24%;text-align:center;font:900 clamp(120px,46vw,190px)/.8 var(--f);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.14);direction:ltr;user-select:none}
.state .date b{color:var(--red);-webkit-text-stroke:0;font-weight:900}
.state h1{font:900 34px/1.08 var(--f);letter-spacing:-.02em;margin:0 0 12px;max-width:15ch}
.state p{margin:0 0 26px;color:var(--txt-2);font:400 16px/1.55 var(--f);max-width:32ch}
.state .acts{display:flex;flex-wrap:wrap;gap:10px}
.btn-rec{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:0;border-radius:999px;background:var(--red);color:#fff;font:800 18px/1 var(--f);padding:20px 28px;box-shadow:0 12px 34px rgba(219,0,0,.42);transition:transform .18s var(--ease)}
.btn-rec:active{transform:scale(.97)}
.btn-rec .rec-dot{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.28)}
.btn-ghost-d{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font:700 16px/1 var(--f);padding:18px 22px;box-shadow:inset 0 0 0 1px var(--glass-line)}
.state.err{justify-content:center;text-align:center;align-items:center}
.state.err .ic-big{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.07);margin-bottom:18px}
.state.err .ic-big svg{width:30px;height:30px;color:var(--txt-2)}
.state.err h1{font-size:24px;max-width:none}
.state.err p{margin-inline:auto}
.state.load{justify-content:center;align-items:center}
.state.load i{width:38px;height:38px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--red);animation:spin .9s linear infinite}

/* end-of-feed card */
.slide.end{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px;background:linear-gradient(180deg,var(--vx-card),var(--vx-bg))}
.slide.end::before,.slide.end::after{display:none}
.slide.end h2{font:900 26px/1.15 var(--f);margin:0 0 10px}
.slide.end p{color:var(--txt-2);margin:0 0 24px}

/* toast */
.toast{position:fixed;z-index:80;left:50%;bottom:calc(24px + var(--safe-b));transform:translate(-50%,20px);opacity:0;background:#fff;color:var(--ink);font:700 14.5px/1.3 var(--f);padding:12px 18px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:opacity .25s,transform .25s var(--ease);display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast button{border:0;background:var(--ink);color:#fff;border-radius:999px;padding:7px 12px;font:800 13px/1 var(--f)}

/* ---------- RECORD ---------- */
body.rc{overflow-x:hidden}
.rc-main{width:min(100%,520px);margin:0 auto;padding:0 20px calc(32px + var(--safe-b))}
.step{animation:stepin .45s var(--ease)}
@keyframes stepin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* intro */
.intro{min-height:calc(100dvh - 58px);display:flex;flex-direction:column;justify-content:center;padding-block:28px}
.intro .orb{position:relative;width:132px;height:132px;margin:0 0 34px;display:grid;place-items:center}
.intro .orb::before,.intro .orb::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(219,0,0,.5);animation:ripple 2.6s var(--ease) infinite}
.intro .orb::after{animation-delay:1.3s}
.intro .orb span{width:76px;height:76px;border-radius:50%;background:var(--red);box-shadow:0 0 0 8px rgba(219,0,0,.18),0 18px 40px rgba(219,0,0,.45)}
@keyframes ripple{0%{transform:scale(.55);opacity:1}100%{transform:scale(1.25);opacity:0}}
.intro .kick{color:#ff4d4d;margin-bottom:12px}
.intro h1{font:900 clamp(36px,10vw,50px)/1.02 var(--f);letter-spacing:-.03em;margin:0 0 20px}
.rules{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:10px}
.rules li{display:flex;align-items:center;gap:12px;font:500 16px/1.35 var(--f);color:var(--txt-2)}
.rules svg{flex:none;width:20px;height:20px;color:#fff;opacity:.85}
.intro .btn-rec{align-self:stretch}
.intro .alt{margin-top:14px;align-self:center;background:none;border:0;color:var(--txt-2);font:600 14.5px/1 var(--f);text-decoration:underline;text-underline-offset:4px;padding:10px}
.notice{margin:0 0 18px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--glass-line);font:500 15px/1.5 var(--f);color:var(--txt)}
.notice.warn{background:rgba(219,0,0,.12);box-shadow:inset 0 0 0 1px rgba(219,0,0,.4)}

/* camera (full screen, 9:16 column) */
.cam{position:fixed;inset:0;z-index:100;background:#000;display:flex;justify-content:center}
.cam-col{position:relative;width:var(--col-w);height:100%;overflow:hidden;background:#000}
.cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.cam-col::before,.cam-col::after{content:"";position:absolute;inset-inline:0;pointer-events:none;z-index:1}
.cam-col::before{top:0;height:140px;background:linear-gradient(rgba(0,0,0,.55),transparent)}
.cam-col::after{bottom:0;height:340px;background:linear-gradient(transparent,rgba(0,0,0,.72))}
.cam-top{position:absolute;z-index:3;top:calc(12px + var(--safe-t));inset-inline:14px;display:flex;align-items:center;gap:10px}
.x-btn{width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.x-btn svg{width:20px;height:20px}
.timer{margin-inline-start:auto;font:800 15px/1 var(--f);font-variant-numeric:tabular-nums;padding:9px 13px;border-radius:999px;background:rgba(0,0,0,.4);color:#fff;direction:ltr;display:inline-flex;align-items:center;gap:8px}
.timer.rec::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--live);animation:hmblink 1s infinite}
.prompter{position:absolute;z-index:3;top:calc(70px + var(--safe-t));inset-inline:18px;text-align:center;font:800 26px/1.2 var(--f);letter-spacing:-.01em;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.7);padding:6px 4px;animation:stepin .35s var(--ease)}
.cam-bottom{position:absolute;z-index:3;bottom:calc(26px + var(--safe-b));inset-inline:0;display:flex;flex-direction:column;align-items:center;gap:20px}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 16px;max-width:100%;scroll-snap-type:x proximity}
.chips::-webkit-scrollbar{display:none}
.chips button{flex:none;scroll-snap-align:start;border:0;border-radius:999px;padding:10px 14px;background:rgba(255,255,255,.14);color:#fff;font:700 14px/1 var(--f);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:background .18s}
.chips button[aria-pressed="true"]{background:#fff;color:var(--ink)}
.cam.recording .chips{opacity:0;pointer-events:none}
.cam-hint{font:600 13.5px/1.2 var(--f);color:rgba(255,255,255,.82);min-height:17px;text-align:center;padding-inline:20px}
.rec-btn{position:relative;width:96px;height:96px;border:0;padding:0;background:none;border-radius:50%;display:grid;place-items:center}
.rec-btn svg.ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.rec-btn .track{fill:none;stroke:rgba(255,255,255,.85);stroke-width:5}
.rec-btn .prog{fill:none;stroke:var(--red);stroke-width:5;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:283;opacity:0}
.cam.recording .rec-btn .prog{opacity:1}
.rec-btn .core{width:72px;height:72px;border-radius:50%;background:var(--red);transition:all .25s var(--ease);box-shadow:0 6px 22px rgba(219,0,0,.5)}
.cam.recording .rec-btn .core{width:34px;height:34px;border-radius:9px}
.cam.recording .rec-btn .track{stroke:rgba(255,255,255,.3)}
.rec-btn:disabled{opacity:.5}
.count{position:absolute;z-index:4;inset:0;display:grid;place-items:center;pointer-events:none}
.count span{font:900 160px/1 var(--f);color:#fff;text-shadow:0 8px 40px rgba(0,0,0,.5);animation:countin .9s var(--ease) forwards}
@keyframes countin{0%{opacity:0;transform:scale(1.6)}25%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.8)}}

/* review */
.review{padding-top:20px}
.review h2,.done h2,.details h2{font:900 28px/1.1 var(--f);letter-spacing:-.02em;margin:0 0 6px}
.review .sub,.details .sub{color:var(--txt-2);margin:0 0 18px}
.player{position:relative;width:min(100%, calc(56dvh * 9 / 16));aspect-ratio:9/16;margin:0 auto 20px;border-radius:22px;overflow:hidden;background:var(--vx-card);box-shadow:0 20px 50px rgba(0,0,0,.5),inset 0 0 0 1px var(--vx-line)}
.player video{width:100%;height:100%;object-fit:cover;display:block}
.player .play-ic{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:#fff}
.player .play-ic svg{width:60px;height:60px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.5))}
.player .len{position:absolute;bottom:10px;inset-inline-start:10px;font:800 12.5px/1 var(--f);padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.55);direction:ltr}
.two{display:grid;grid-template-columns:1fr 1.6fr;gap:10px}
.two .btn-rec,.two .btn-ghost-d{padding:18px 16px;font-size:17px}

/* details form */
.details{padding-top:20px}
.mini{display:flex;gap:14px;align-items:center;margin-bottom:22px}
.mini video{width:74px;aspect-ratio:9/16;object-fit:cover;border-radius:12px;background:var(--vx-card);flex:none;box-shadow:inset 0 0 0 1px var(--vx-line)}
.mini h2{margin:0 0 4px}
.mini p{margin:0;color:var(--txt-2);font-size:14.5px}
.fld{display:block;margin-bottom:22px}
.fld > span{display:flex;justify-content:space-between;font:800 15px/1 var(--f);margin-bottom:10px}
.fld > span small{font:600 13px/1 var(--f);color:var(--txt-3);direction:ltr}
.inp{width:100%;font:600 18px/1.2 var(--f);color:#fff;background:var(--vx-card);border:0;border-radius:14px;padding:16px;box-shadow:inset 0 0 0 1.5px var(--vx-line);transition:box-shadow .18s}
.inp:focus{outline:0;box-shadow:inset 0 0 0 2px #fff}
.inp::placeholder{color:var(--txt-3)}
.parties{display:flex;flex-wrap:wrap;gap:8px}
.parties button{border:0;border-radius:999px;padding:10px 13px;font:700 14px/1 var(--f);color:var(--txt);background:var(--vx-card);box-shadow:inset 0 0 0 1.5px var(--vx-line);display:inline-flex;align-items:center;gap:7px;transition:background .15s,color .15s,box-shadow .15s}
.parties button i{width:9px;height:9px;border-radius:50%;background:var(--pc,#888);box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.parties button[aria-pressed="true"]{background:var(--pc,#fff);color:var(--pt,var(--ink));box-shadow:none}
.parties button[aria-pressed="true"] i{background:currentColor;opacity:.7}
.parties button.none[aria-pressed="true"]{background:#fff;color:var(--ink)}
.consent{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:14px;background:var(--vx-card);box-shadow:inset 0 0 0 1.5px var(--vx-line);margin-bottom:22px;cursor:pointer;font:500 15px/1.45 var(--f)}
.consent input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:0;border-radius:7px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.45);display:grid;place-items:center;cursor:pointer;transition:background .15s}
.consent input:checked{background:var(--red);box-shadow:none}
.consent input:checked::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg)}
.consent:has(input:checked){box-shadow:inset 0 0 0 1.5px rgba(219,0,0,.6)}
.send{width:100%}
.send:disabled{opacity:.4;box-shadow:none}
.form-err{color:#ff7a7a;font:600 14.5px/1.4 var(--f);margin:-8px 0 14px;min-height:0}

/* upload progress */
.sending{min-height:calc(100dvh - 58px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:18px}
.bar{width:min(100%,320px);height:8px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--red);border-radius:inherit;transition:width .2s linear}
.sending .pct{font:900 44px/1 var(--f);font-variant-numeric:tabular-nums}
.sending p{margin:0;color:var(--txt-2)}

/* done */
.done{min-height:calc(100dvh - 58px);display:flex;flex-direction:column;justify-content:center;padding-block:28px}
.done h2 .tick{color:var(--red);display:inline-block;animation:pop .6s var(--ease) .15s both}
@keyframes pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
.done h2{font-size:40px;line-height:1.05;margin-bottom:14px}
.done p{color:var(--txt-2);margin:0 0 28px;font-size:17px}
.done .acts{display:grid;gap:10px}

@media (prefers-reduced-motion:reduce){
  .heart,.flash,.count span{animation-duration:.01ms!important}
  .fd-scroller{scroll-behavior:auto}
}