@font-face{font-family:"Cinzel Decorative";font-style:normal;font-weight:900;font-display:swap;src:url("../assets/fonts/cinzel-decorative/cinzel-decorative-900-latin.woff2") format("woff2")}

/* Fixed face-off stage: only fighter pixels and their local light transition. */
html.election-opening-visible{overflow:hidden!important}
#electionOpeningOnline span{font:inherit}
#electionOpening .election-opening-actions #electionOpeningOnline{display:inline-flex;align-items:center;justify-content:center;gap:8px}
#electionOpening #electionOpeningOnline .election-online-indicator{width:6px;height:6px;flex:none;border-radius:50%;background:#55dc85;box-shadow:0 0 6px #55dc8555}
#electionOpeningOnline .election-online-label{display:grid;text-align:center;white-space:nowrap}
#electionOpeningOnline .election-online-label>span{grid-area:1/1}
/* Reserve the longer label's width so the button stays still during each fade. */
#electionOpeningOnline .election-online-label::before{content:'PLAY WITH FRIENDS';visibility:hidden;grid-area:1/1}
#electionOpeningOnline .election-online-copy{grid-area:1/1;opacity:1;animation:election-online-copy 4s linear infinite}
#electionOpeningOnline .election-online-copy-friends{opacity:0;animation-name:election-online-copy-friends}
@keyframes election-online-copy{0%,45%,100%{opacity:1}50%,95%{opacity:0}}
@keyframes election-online-copy-friends{0%,45%,100%{opacity:0}50%,95%{opacity:1}}
#electionOpeningOnline[aria-busy="true"]{cursor:wait}
#electionOpeningOnline[aria-busy="true"] span{animation:election-online-loading 1.2s ease-in-out infinite}
@keyframes election-online-loading{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){#electionOpeningOnline[aria-busy="true"] span{animation:none}}
/* Available with the opening itself, before any deferred game code loads. */
#electionEntryLoading{box-sizing:border-box;width:min(360px,calc(100vw - 48px));max-height:calc(100dvh - 40px);margin:auto;padding:32px 28px 27px;border:1px solid #d3af68;border-radius:2px;background:linear-gradient(145deg,#17150ff7,#080c12fa);color:#f4d89b;text-align:center;direction:ltr;box-shadow:0 24px 90px #000b,inset 0 0 0 4px #d3af680c;overflow:auto;animation:election-entry-popup-in .14s ease-out}
#electionEntryLoading::backdrop{background:#02050bb8}
#electionEntryLoading:focus{outline:none}
#electionEntryLoading .election-entry-loading-kicker{margin:0 0 14px;font:700 10px/1.4 Arial,sans-serif;letter-spacing:2.4px;color:#b5a486}
#electionEntryLoading h2{margin:0;font:900 clamp(34px,8vw,44px)/1.1 Impact,'Arial Black',sans-serif;letter-spacing:2px;color:#f4d89b;text-shadow:2px 2px 0 #6c482a}
#electionEntryLoading .election-entry-loading-track{height:5px;margin:24px 0 18px;overflow:hidden;background:repeating-linear-gradient(90deg,#ddba7926 0 12px,transparent 12px 16px)}
#electionEntryLoading .election-entry-loading-track span{display:block;width:30%;height:100%;background:repeating-linear-gradient(90deg,#e6bd70 0 12px,transparent 12px 16px);animation:election-entry-loading-scan 1.1s linear infinite}
#electionEntryLoadingStatus{margin:0;font:600 10px/1.5 Arial,sans-serif;letter-spacing:1.6px;color:#cbb992}
#electionEntryLoading .election-entry-loading-actions{display:flex;gap:10px;justify-content:center;margin-top:24px}
#electionEntryLoading .election-entry-loading-actions[hidden],#electionEntryLoading[data-state="failed"] .election-entry-loading-track{display:none}
#electionEntryLoading[data-state="failed"] #electionEntryLoadingStatus{margin-top:18px}
#electionEntryLoading button{min-height:44px;padding:10px 15px;border:1px solid #b48e4d;border-radius:0;background:#d7b574;color:#14120d;font:700 11px/1.2 Arial,sans-serif;letter-spacing:1px;cursor:pointer}
#electionEntryLoading button[data-entry-back]{background:transparent;color:#d7c39c;border-color:#d7b57455}
#electionEntryLoading button:focus-visible{outline:2px solid #fff0c5;outline-offset:3px}
@keyframes election-entry-loading-scan{from{transform:translateX(-110%)}to{transform:translateX(345%)}}
@keyframes election-entry-popup-in{from{opacity:0;transform:translateY(5px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#electionEntryLoading{animation:none}#electionEntryLoading .election-entry-loading-track span{animation:none;transform:translateX(115%)}}
#electionOpening{position:fixed;inset:0;z-index:1000;display:block;width:100%;height:100dvh;min-height:0;overflow:hidden;background:#090805;--swap-opacity:1;--swap-flash:0}
#electionOpening .election-opening-tools{position:absolute;z-index:9;top:calc(14px + var(--safe-top,0px));left:calc(14px + var(--safe-left,0px));display:flex;align-items:center;gap:7px}
#electionOpening .election-opening-share{position:static;display:grid;place-items:center;width:40px;height:40px;min-width:0;min-height:0;margin:0;padding:0;border:1px solid #caa8668c;border-radius:50%;background:#07111dcc;color:#ead5a8;box-shadow:inset 0 1px #fff1,0 6px 18px #0007;backdrop-filter:blur(7px);cursor:pointer;transform:none;transition:color .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease}
#electionOpening .election-opening-share svg{display:block;width:18px;height:18px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#electionOpening .election-opening-share:is(:hover,:focus-visible){color:#fff0c8;border-color:#efd38e;background:#111b28e8;box-shadow:inset 0 1px #fff2,0 7px 21px #0009,0 0 14px #d8aa4d2e;transform:translateY(-1px)}
#electionOpening .election-opening-share:active{transform:translateY(0) scale(.96)}
#electionOpening .election-opening-share:focus-visible{outline:2px solid #f0cd83;outline-offset:3px}
#electionOpening .election-opening-share:disabled{cursor:wait;opacity:.62}
#electionOpening .election-opening-share-status{position:absolute;z-index:9;top:calc(61px + var(--safe-top,0px));left:calc(14px + var(--safe-left,0px));max-width:150px;margin:0;padding:0;color:#ead8b4;text-shadow:0 2px 7px #000;font:600 10px/1.3 Arial,sans-serif;direction:rtl;text-align:left;pointer-events:none}
#electionOpening .election-language-toggle{display:grid;place-items:center;width:52px;height:40px;min-width:0;min-height:0;margin:0;padding:0 7px;border:1px solid #caa8668c;border-radius:20px;background:#07111dcc;color:#f5daa0;box-shadow:inset 0 1px #fff1,0 6px 18px #0007;backdrop-filter:blur(7px);font:700 10px/1 var(--font-hebrew-registration);letter-spacing:0;text-shadow:0 0 8px #e5b95b55;cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}
#electionOpening .election-language-toggle:is(:hover,:focus-visible){border-color:#efd38e;background:#111b28e8;transform:translateY(-1px)}
#electionOpening .election-language-toggle:active{transform:translateY(0) scale(.97)}
#electionOpening .election-language-toggle:focus-visible{outline:2px solid #f0cd83;outline-offset:3px}
@media(max-width:700px){#electionOpening .election-opening-tools{top:calc(10px + var(--safe-top,0px));left:calc(10px + var(--safe-left,0px));gap:6px}#electionOpening .election-opening-share{width:36px;height:36px}#electionOpening .election-opening-share svg{width:16px;height:16px}#electionOpening .election-language-toggle{width:48px;height:36px;font-size:9px}#electionOpening .election-opening-share-status{top:calc(52px + var(--safe-top,0px));left:calc(10px + var(--safe-left,0px))}}
#electionOpening .start-backdrop{inset:-1.5%;background-image:url('../assets/election/knesset-background-v3-arcade-live.webp');background-position:center 42%;opacity:1;filter:none;transform-origin:50% 42%;will-change:transform;animation:election-backdrop-breathe 18s ease-in-out infinite alternate}
#electionOpening::before{z-index:1;background:linear-gradient(180deg,#0a0808b0,transparent 38%,#120d0740 62%,#080705 100%)}
#electionOpening .start-vignette{z-index:4;box-shadow:inset 0 0 12vw 2vw #0009;pointer-events:none}
#electionOpening .election-opening-fog{position:absolute;inset:55% -20% 0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 50% 90%,#bf984b24,transparent 66%)}
#electionOpening .election-opening-title{position:absolute;z-index:6;top:4%;left:8%;right:8%;text-align:center;color:#f6eee0;text-shadow:0 3px 16px #000;pointer-events:none}
#electionOpening .eyebrow{color:#dec294;font:700 clamp(10px,1.1vw,14px)/1.4 Arial,sans-serif;letter-spacing:.35em;margin:0 0 5px}
#electionOpening h1{font-family:Impact,'Arial Black',sans-serif;font-size:clamp(36px,6.2vw,78px);font-weight:900;letter-spacing:.065em;line-height:1.05;margin:0;color:#f1d8a1;-webkit-text-stroke:1px #bd854566}
#electionOpening .election-opening-cast{position:absolute;inset:0;z-index:2;pointer-events:none}
#electionOpening .election-opening-candidate{position:absolute;margin:0;left:28%;top:20%;width:44%;height:47%;transform:translateX(-50%)}
#electionOpening .election-opening-candidate[data-slot=right]{left:72%}
#electionOpening .election-cast-body{position:absolute;inset:0;overflow:hidden;opacity:var(--swap-opacity);mask-image:linear-gradient(#000 0 91%,transparent 100%)}
#electionOpening .election-cast-body img{position:absolute;left:50%;bottom:-40%;width:auto!important;max-width:none!important;height:150%;object-fit:contain;transform:translateX(-50%) scaleX(var(--cast-facing,1));transform-origin:50% 83.3333%;filter:saturate(.86) sepia(.075) contrast(1.025) drop-shadow(0 -2px 3px #efd09935) drop-shadow(0 14px 8px #0009)}
#electionOpening .election-opening-candidate[data-art=portrait] img{animation:election-faceoff-breathe 4.4s ease-in-out infinite}
#electionOpening .election-opening-candidate[data-slot=right][data-art=portrait] img{animation-delay:-1.7s}
#electionOpening .election-cast-aura{position:absolute;inset:0 5% 0;pointer-events:none;background:radial-gradient(ellipse at 45% 40%,#e7c47d26,transparent 65%)}
#electionOpening .election-opening-candidate::after{content:"";position:absolute;inset:0;opacity:var(--swap-flash);background:radial-gradient(ellipse,#ffe2a9,transparent 65%);pointer-events:none}
#electionOpening figcaption{position:absolute;top:100%;left:0;width:100%;padding-top:5px;text-align:center;color:#ecd6a5;text-shadow:0 2px 5px #000;white-space:nowrap;font:700 clamp(16px,2vw,26px)/1.2 Arial,sans-serif;opacity:var(--swap-opacity);direction:ltr}
#electionOpening .election-opening-actions{position:absolute;top:73%;left:50%;transform:translateX(-50%);z-index:7;display:flex;flex-direction:column;align-items:center;gap:10px;white-space:nowrap}
#electionOpening .primary-cta{min-width:min(82vw,390px);min-height:64px;height:64px;font-size:1.3rem;animation:none!important;transform:none!important;margin:0}
#electionOpening .election-opening-nav{display:flex;align-items:center;justify-content:center;gap:8px}
#electionOpening .online-entry{margin:0;width:auto;min-width:0;min-height:32px;padding:6px 10px;font:700 11px/1.2 Arial,sans-serif;letter-spacing:.06em;transform:none!important}
#electionOpening .start-legal{position:absolute;inset:auto 5% calc(8px + var(--safe-bottom,0px));width:90%;max-width:none;min-height:0;height:auto;flex:none;background:none;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:8;transform:none;margin:0;padding:0;pointer-events:none}
#electionOpening .start-disclaimer{position:static;display:flex;flex-direction:column;align-items:center;gap:3px;max-width:560px;width:100%;padding:0;margin:0;transform:none;background:none;border:0;box-shadow:none;color:#b3a997;font:400 10px/1.3 Arial,sans-serif;text-align:center;pointer-events:auto}
#electionOpening .start-disclaimer strong,#electionOpening .start-disclaimer span,#electionOpening .start-disclaimer small{display:block;font:inherit;color:inherit;margin:0}
#electionOpening .election-disclaimer-text{display:block;width:100%;margin:0;color:inherit;font:inherit}
#electionOpening .creator-credit{position:static;inset:auto;translate:none;transform:none;display:inline-flex;width:auto;min-height:20px;max-width:none;margin:0;padding:4px 8px;border:1px solid #92704466;border-radius:4px;background:#15100bd9;color:#d6bd89;box-shadow:none;font:600 11px/1.2 Arial,sans-serif;letter-spacing:.1em;pointer-events:auto}
#electionOpening .creator-credit strong{color:#f0d49a}
@keyframes election-faceoff-breathe{0%,100%{translate:0 0;scale:1}50%{translate:0 -.5%;scale:1.006}}
@media(min-width:901px) and (min-height:601px) and (hover:hover) and (pointer:fine){#electionOpening .creator-credit{position:fixed;left:calc(1rem + var(--safe-left,0px));top:calc(1rem + var(--safe-top,0px));right:auto;bottom:auto}}
@media(max-width:700px) and (orientation:portrait){
 #electionOpening .election-opening-title{top:5%;left:3%;right:3%}#electionOpening h1{font-size:clamp(32px,9.3vw,60px)}
 #electionOpening .election-opening-candidate{top:22%;width:54%;height:43%}#electionOpening .election-cast-body img{height:145%;bottom:-35%}
 #electionOpening figcaption{font-size:clamp(13px,3.8vw,20px);padding-top:3px}
 #electionOpening .election-opening-actions{top:72%;gap:9px}#electionOpening .primary-cta{min-height:54px;height:54px;font-size:17px}
 #electionOpening .online-entry{padding:6px 7px;min-height:30px;font-size:9px}#electionOpening .election-opening-nav{gap:5px}
 #electionOpening .start-legal{left:4%;right:4%;width:92%;gap:5px;bottom:calc(7px + var(--safe-bottom,0px))}#electionOpening .start-disclaimer{font-size:8px;line-height:1.25}
}
@media(max-height:600px) and (orientation:landscape){
 #electionOpening .election-opening-title{top:3%;left:15%;right:15%}#electionOpening h1{font-size:clamp(27px,8vh,42px)}#electionOpening .eyebrow{font-size:9px;margin-bottom:3px}
 #electionOpening .election-opening-candidate{top:23%;height:37%;width:40%}#electionOpening .election-cast-body img{height:160%;bottom:-42%}#electionOpening figcaption{font-size:13px;padding-top:2px}
 #electionOpening .election-opening-actions{top:66%;gap:6px}#electionOpening .primary-cta{min-width:250px;min-height:40px;height:40px;font-size:15px}#electionOpening .online-entry{min-height:25px;padding:4px 8px;font-size:9px}
 #electionOpening .start-legal{bottom:calc(4px + var(--safe-bottom,0px));gap:3px}#electionOpening .start-disclaimer{font-size:7.5px;line-height:1.15;gap:1px}#electionOpening .creator-credit{min-height:17px;font-size:10px;padding:2px 6px}
}
@media(prefers-reduced-motion:reduce){#electionOpening *,#electionOpening *::before,#electionOpening *::after{animation:none!important;transition:none!important}#electionOpening .election-cast-body img{translate:none;scale:none}}
/* Desktop hero override: real opaque bodies reach the floor, with shared physical scale. */
@media(min-width:901px) and (min-height:601px){
 #electionOpening .election-opening-title{left:27%;right:27%;top:3%}#electionOpening h1{font-size:clamp(34px,4.2vw,68px)}
 #electionOpening .election-opening-candidate{top:auto;bottom:0;left:25%;width:50%;height:90%}#electionOpening .election-opening-candidate[data-slot=right]{left:75%}
 #electionOpening .election-cast-body{overflow:visible;mask-image:none}#electionOpening .election-cast-body img{height:var(--portrait-height);bottom:var(--portrait-bottom)}
 #electionOpening figcaption{top:auto;bottom:22%;padding:6px 0;font-size:clamp(16px,1.8vw,26px)}
}
/* Midnight architecture and blue-grey atmosphere, retaining the warm central light. */
#electionOpening{background:#060c19}
#electionOpening .start-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#142d51 0%,#1a304b 23%,transparent 48%),linear-gradient(90deg,#10243c 0%,transparent 43% 57%,#10243c 100%);mix-blend-mode:color;pointer-events:none}
#electionOpening::before{background:linear-gradient(180deg,#050c1f77,transparent 40%,#07132626 65%,#050a1499 100%),linear-gradient(90deg,#04102055,transparent 38% 62%,#04102055)}
#electionOpening h1{color:#f3e2bc;-webkit-text-stroke:1px #b4915966}
#electionOpening .election-opening-fog{background:radial-gradient(ellipse at 50% 80%,#deb96b18,transparent 45%),linear-gradient(transparent,#5b759226)}
/* Independent, slow edge slides; the title uses the original game's exact logo font. */
#electionOpening .election-opening-candidate{translate:var(--slide,0%) 0}
#electionOpening .election-cast-body{opacity:var(--swap-opacity,1)}
#electionOpening figcaption{opacity:1}
#electionOpening .election-opening-candidate::after{display:none}
#electionOpening .election-opening-title{top:50%;left:8%;right:8%;transform:translateY(-50%);z-index:6}
#electionOpening h1{font-family:"Cinzel Decorative",Copperplate,"Copperplate Gothic Bold","Times New Roman",serif;font-size:clamp(34px,6.8vw,100px);font-weight:900;letter-spacing:.02em;line-height:.95;color:#f3e2bc;text-shadow:0 3px 0 #432c15,0 7px 12px #000,0 0 32px #000;-webkit-text-stroke:1px #39220f;paint-order:stroke fill}
#electionOpening .eyebrow{text-shadow:0 2px 7px #000,0 0 16px #000}
@media(min-width:901px) and (min-height:601px){#electionOpening .election-opening-candidate{left:10%}#electionOpening .election-opening-candidate[data-slot=right]{left:90%}}
@media(max-width:700px) and (orientation:portrait){#electionOpening h1{font-size:clamp(30px,10vw,60px)}#electionOpening .election-opening-title{left:2%;right:2%}}
@media(max-height:600px) and (orientation:landscape){#electionOpening h1{font-size:clamp(27px,10vh,48px)}}
@media(prefers-reduced-motion:reduce){#electionOpening .election-opening-candidate{translate:none}}
/* The opening uses the same engraved gold title treatment as the share artwork. */
#electionOpening .election-opening-title{display:flex;justify-content:center;left:0;right:0}
#electionOpening h1.logo{display:block;min-width:0;width:min(88vw,880px);margin:0;padding:0;transform:none;filter:none;font-size:inherit;line-height:normal;letter-spacing:normal}
#electionOpening .election-logo-art{display:block;width:100%;height:auto;filter:drop-shadow(0 8px 2px #080401) drop-shadow(0 18px 20px #000c)}
#electionOpening .logo-top,#electionOpening .logo-bottom{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
#electionOpening .election-ambient{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#electionOpening .election-sky-charge{position:absolute;inset:-8% -5% 43%;background:radial-gradient(ellipse at 18% 35%,#62bdff6e,transparent 32%),radial-gradient(ellipse at 79% 25%,#3c92ef62,transparent 35%),radial-gradient(ellipse at 50% 76%,#f3b85e40,transparent 43%);mix-blend-mode:screen;filter:blur(10px);opacity:0;will-change:opacity;animation:election-sky-charge 11.5s steps(1,end) infinite}
#electionOpening .election-horizon-pulse{position:absolute;inset:8% 13% 31%;background:radial-gradient(ellipse at 50% 56%,#ffd98c6b 0,transparent 34%),radial-gradient(ellipse at 50% 65%,#4d8ec83b 0,transparent 58%);mix-blend-mode:screen;will-change:transform,opacity;animation:election-horizon-breathe 6.8s ease-in-out infinite alternate}
#electionOpening .election-light-sweep{position:absolute;inset:-20% -42% 24%;background:linear-gradient(108deg,transparent 37%,#8dc9ff18 45%,#ffe0a02b 49%,transparent 58%);mix-blend-mode:screen;filter:blur(18px);will-change:transform,opacity;animation:election-light-sweep 15s ease-in-out infinite alternate}
#electionOpening .election-central-glow{position:absolute;inset:30% 21% 0;background:radial-gradient(ellipse at 50% 65%,#f3b74d58,transparent 64%);mix-blend-mode:screen;animation:election-gold-breathe 7s ease-in-out infinite alternate}
#electionOpening .election-cloud-light{position:absolute;inset:-4% -18% 45%;background:radial-gradient(ellipse at 36% 46%,#78b7ed45,transparent 42%),radial-gradient(ellipse at 69% 38%,#315d9b3f,transparent 48%);mix-blend-mode:screen;filter:blur(22px);animation:election-cloud-drift 13s ease-in-out infinite alternate}
#electionOpening .election-smoke{position:absolute;inset:45% -35% -15%;background:radial-gradient(ellipse at 18% 72%,#8398b75c,transparent 33%),radial-gradient(ellipse at 70% 80%,#435f8670,transparent 41%),radial-gradient(ellipse at 48% 94%,#c4a36525,transparent 34%);filter:blur(20px);animation:election-smoke-drift 12s ease-in-out infinite alternate}
#electionOpening .election-smoke-front{inset:70% -25% -20%;opacity:.8;animation-duration:17s;animation-delay:-8s;animation-direction:alternate-reverse}
#electionOpening .start-embers{z-index:1;inset:10% 0 -20%;background-image:radial-gradient(circle,#ffd17c 0 1.2px,transparent 2px),radial-gradient(circle,#9fc3df 0 1px,transparent 1.7px),radial-gradient(circle,#eab154 0 1.4px,transparent 2.2px);mask-image:linear-gradient(transparent,#000 30%);filter:drop-shadow(0 0 4px #e8bd68)}
#electionOpening .start-embers-near{animation:embers-rise 9s linear -2s infinite}#electionOpening .start-embers-far{animation:embers-rise 14s linear -8s infinite}
@keyframes election-gold-breathe{from{opacity:.32;scale:.96}to{opacity:.9;scale:1.09}}
@keyframes election-backdrop-breathe{from{transform:scale(1.018) translate3d(-.25%,.15%,0)}to{transform:scale(1.04) translate3d(.35%,-.35%,0)}}
@keyframes election-sky-charge{0%,18%,21%,57%,60%,100%{opacity:0}19%{opacity:.22}19.7%{opacity:.78}20.2%{opacity:.12}58%{opacity:.42}58.6%{opacity:.9}59.1%{opacity:.16}}
@keyframes election-horizon-breathe{from{opacity:.3;transform:scale(.94)}to{opacity:.82;transform:scale(1.09)}}
@keyframes election-light-sweep{from{opacity:.16;transform:translate3d(-11%,0,0)}to{opacity:.7;transform:translate3d(12%,1%,0)}}
@keyframes election-cloud-drift{from{transform:translateX(-8%);opacity:.35}to{transform:translateX(12%);opacity:.8}}
@keyframes election-smoke-drift{from{transform:translate3d(-9%,5%,0);opacity:.45}to{transform:translate3d(10%,-7%,0);opacity:.85}}
@media(max-width:700px) and (orientation:portrait){#electionOpening h1.logo{min-width:91vw;padding-inline:0;transform:scaleX(.88)}}
@media(prefers-reduced-motion:reduce){#electionOpening .start-backdrop,#electionOpening .election-ambient *{animation:none!important;transform:none!important}#electionOpening .election-sky-charge{opacity:.12}#electionOpening .election-central-glow{opacity:.4}#electionOpening .election-smoke{opacity:.4}#electionOpening .start-embers{opacity:.3}}
/* Latest desktop framing: upper-body hero zoom, natural lower-screen crop. */
@media(min-width:901px) and (min-height:601px){
 #electionOpening .election-opening-candidate{height:170%;bottom:-80%;left:17%}#electionOpening .election-opening-candidate[data-slot=right]{left:83%}
 #electionOpening figcaption{top:40%;bottom:auto}
}
@media(max-height:600px) and (orientation:landscape){#electionOpening figcaption{display:none}}
/* Approved composition stays still; local smoke masks an independent portrait handoff. */
#electionOpening .election-opening-actions .online-entry{border:0!important;background:none!important;box-shadow:none!important;clip-path:none;color:#ddc9a1!important;font-size:12px;letter-spacing:.12em;padding:4px 10px;min-height:30px}
@keyframes election-faceoff-breathe{0%,100%{translate:0 0;scale:1}50%{translate:0 -.5%;scale:1}}
/* Desktop CTA polish: exactly 50px above the approved position. */
@media(min-width:901px) and (min-height:601px){#electionOpening .election-opening-actions{top:calc(73% - 50px)}}
@media(min-width:901px) and (min-height:601px) and (max-height:680px){#electionOpening .election-opening-title{top:48%}}
#electionOpening .election-opening-actions .online-entry{border:1px solid #b39560!important;background:#101725ed!important;box-shadow:inset 0 1px #ecd5a025,0 4px 12px #0006!important;border-radius:3px;padding:9px 23px;min-height:36px;font-size:12px}
@media(max-height:600px) and (orientation:landscape){#electionOpening .election-opening-actions .online-entry{padding:5px 18px;min-height:27px;font-size:10px}}

/* A quiet editorial link opens the creator note without competing with either play action. */
#electionOpening .election-story-link{appearance:none;border:0;background:none;box-shadow:none;margin:8px 0 0;padding:2px 3px;color:#e6d5b5;font:400 14px/1.35 Arial,sans-serif;letter-spacing:0;direction:rtl;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;cursor:pointer;transform:none;transition:color .18s ease,text-shadow .18s ease}
#electionOpening .election-story-link:hover{color:#fff2d3;text-shadow:0 0 12px #d3a34f99}
#electionOpening .election-story-link:focus-visible{outline:2px solid #e7bd70;outline-offset:4px;border-radius:2px}
#electionOpening .election-story-drawer{position:fixed;inset:0 0 0 auto;width:min(590px,calc(100vw - 22px));max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;background:#fff;color:#181818;overflow:hidden;box-shadow:-18px 0 55px #0005}
#electionOpening .election-story-drawer[open]{display:block;animation:election-story-enter .36s cubic-bezier(.2,.8,.2,1) both}
#electionOpening .election-story-drawer::backdrop{background:#05070c99;backdrop-filter:blur(2px);animation:election-story-backdrop .24s ease-out both}
#electionOpening .election-story-panel{position:relative;display:flex;box-sizing:border-box;flex-direction:column;height:100%;padding:clamp(32px,5vh,58px) clamp(28px,5vw,54px) max(30px,calc(22px + var(--safe-bottom,0px)));overflow:hidden;background:#fff;border-left:1px solid #dedbd4;font-family:"David Libre","Noto Serif Hebrew",Georgia,serif}
#electionOpening .election-story-panel::before{display:none}
#electionOpening .election-story-close{position:absolute;z-index:2;top:max(17px,var(--safe-top,0px));left:18px;display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:0;border:1px solid #d2d0cb;border-radius:50%;background:#fff;color:#333;box-shadow:none;font:300 30px/1 Arial,sans-serif;cursor:pointer;transform:none;transition:background .18s ease,border-color .18s ease,color .18s ease}
#electionOpening .election-story-close:hover{background:#f3f2ef;color:#000;border-color:#999}
#electionOpening .election-story-close:focus-visible{outline:2px solid #222;outline-offset:3px}
#electionOpening .election-story-header{position:relative;display:flex;align-items:center;gap:13px;padding:4px 0 23px;border-bottom:1px solid #dedbd4}
#electionOpening .election-story-avatar{position:relative;display:grid;flex:none;place-items:center;width:62px;height:62px;padding:2px;box-sizing:border-box;overflow:hidden;border-radius:50%;background:transparent;box-shadow:0 3px 12px #a52a7540;text-decoration:none;transition:box-shadow .18s ease}
#electionOpening .election-story-avatar::before{position:absolute;inset:-35%;content:"";background:conic-gradient(#f9ce34,#ee2a7b 38%,#6228d7 72%,#f9ce34);animation:election-story-ring-spin 2.8s linear infinite}
#electionOpening .election-story-avatar:is(:hover,:focus-visible){box-shadow:0 4px 16px #a52a7560}
#electionOpening .election-story-avatar:active{transform:scale(.98)}
#electionOpening .election-story-avatar:focus-visible{outline:2px solid #6228d7;outline-offset:4px}
#electionOpening .election-story-avatar img{position:relative;z-index:1;display:block;width:58px;height:58px;box-sizing:border-box;border:0;border-radius:50%;object-fit:cover;object-position:center;box-shadow:none}
#electionOpening .election-story-header div{min-width:0}
#electionOpening .election-story-header span{display:block;margin-bottom:3px;color:#7d7465;font:700 11px/1.2 "Noto Sans Hebrew",Arial,sans-serif;letter-spacing:.08em}
#electionOpening .election-story-header h2{margin:0;color:#111;font:700 clamp(27px,3vw,36px)/1.12 "David Libre","Noto Serif Hebrew",Georgia,serif;letter-spacing:0}
#electionOpening .election-story-copy{position:relative;flex:1;min-height:0;margin-left:-10px;padding:24px 0 11px 10px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#aaa transparent;scrollbar-width:thin}
#electionOpening .election-story-copy p{margin:0 0 1.08em;color:#292929;font:400 19px/1.68 "David Libre","Noto Serif Hebrew",Georgia,serif;text-align:right}
#electionOpening .election-story-copy strong{color:#111;font-weight:700}
#electionOpening .election-story-copy a{color:inherit;font-weight:400;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
#electionOpening .election-story-copy a:hover{color:#000;text-decoration-thickness:2px}
#electionOpening .election-story-copy a:focus-visible{outline:2px solid #222;outline-offset:3px;border-radius:2px}
#electionOpening .election-story-signature{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:15px;border-top:1px solid #dedbd4}
#electionOpening .election-story-signature strong{color:#111;font:700 14px/1.3 "David Libre","Noto Serif Hebrew",Georgia,serif}
#electionOpening .election-story-signature a{color:#333;font:400 14px/1.3 "David Libre","Noto Serif Hebrew",Georgia,serif;text-decoration:underline;text-underline-offset:4px}
#electionOpening .election-story-signature a:hover{color:#000}
#electionOpening .election-story-signature a:focus-visible{outline:2px solid #222;outline-offset:4px;border-radius:2px}
#electionOpening .election-story-socials{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;direction:ltr}
#electionOpening .election-story-socials a{display:grid;gap:1px;min-width:92px;min-height:42px;box-sizing:border-box;padding:6px 10px;border:1px solid #d7d3cb;border-radius:5px;background:#faf9f6;color:#292929;font-family:"Noto Sans Hebrew",Arial,sans-serif;text-align:left;text-decoration:none;transition:background .18s ease,border-color .18s ease,transform .18s ease}
#electionOpening .election-story-socials a:hover{border-color:#999;background:#f1efea;transform:translateY(-1px)}
#electionOpening .election-story-socials a:focus-visible{outline:2px solid #222;outline-offset:2px}
#electionOpening .election-story-socials span{font-size:12px;font-weight:700;line-height:1.2}
#electionOpening .election-story-socials small{color:#746e64;font-size:10px;font-weight:400;line-height:1.2}
#electionOpening .election-story-copy .election-story-disclaimer{margin:25px 0 4px;padding-top:13px;border-top:1px solid #dedbd4;color:#777;font:400 9px/1.45 "Noto Sans Hebrew",Arial,sans-serif;text-align:right}
@keyframes election-story-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes election-story-ring-spin{to{transform:rotate(1turn)}}
@keyframes election-story-backdrop{from{opacity:0}to{opacity:1}}
@media(max-width:700px){#electionOpening .election-story-link{font-size:13px}#electionOpening .election-story-drawer{width:100vw}#electionOpening .election-story-panel{padding:25px 21px max(24px,calc(18px + var(--safe-bottom,0px)))}#electionOpening .election-story-header{padding-top:max(4px,var(--safe-top,0px));padding-left:52px}#electionOpening .election-story-avatar{width:58px;height:58px}#electionOpening .election-story-avatar img{width:54px;height:54px}#electionOpening .election-story-copy{padding-top:19px}#electionOpening .election-story-copy p{font-size:18px;line-height:1.62}#electionOpening .election-story-copy .election-story-disclaimer{font-size:8px;line-height:1.35}}
@media(max-width:430px){#electionOpening .election-story-signature{align-items:flex-start;flex-direction:column;gap:10px}#electionOpening .election-story-socials{width:100%}#electionOpening .election-story-socials a{flex:1;min-width:0}}
@media(max-height:600px) and (orientation:landscape){#electionOpening .election-story-link{font-size:11px;text-underline-offset:3px}#electionOpening .election-story-panel{padding-top:18px;padding-bottom:16px}#electionOpening .election-story-header{padding:0 0 12px}#electionOpening .election-story-avatar{width:54px;height:54px}#electionOpening .election-story-avatar img{width:50px;height:50px}#electionOpening .election-story-header h2{font-size:24px}#electionOpening .election-story-copy{padding-top:12px}#electionOpening .election-story-copy p{font-size:17px;line-height:1.52;margin-bottom:.85em}#electionOpening .election-story-signature{padding-top:12px}}
@media(prefers-reduced-motion:reduce){#electionOpening .election-story-link,#electionOpening .election-story-close{transition:none}#electionOpening .election-story-avatar::before,#electionOpening .election-story-drawer[open],#electionOpening .election-story-drawer::backdrop{animation:none}}

/* Incoming art passes in front of outgoing art; both remain fully opaque. */
#electionOpening .election-opening-candidate[data-layer=outgoing]{z-index:2}
#electionOpening .election-opening-candidate[data-layer=active]{z-index:2}
#electionOpening .election-opening-candidate[data-layer=incoming]{z-index:3}
/* Only the two visible figures and the next incoming figure are promoted.
   Keep filters, silhouettes and breathing unchanged on desktop and mobile. */
#electionOpening .election-opening-candidate{will-change:translate}
#electionOpening .election-opening-candidate .election-cast-body img{will-change:translate}
#electionOpening .election-opening-candidate[data-layer=prepared] img{animation-play-state:paused}
#electionOpening .election-opening-candidate[data-layer=prepared][data-slot=left]{translate:-250vw 0!important}
#electionOpening .election-opening-candidate[data-layer=prepared][data-slot=right]{translate:250vw 0!important}
@media(max-width:900px) and (orientation:portrait),(max-height:600px) and (orientation:landscape){
 #electionOpening .election-opening-candidate[data-layer=prepared][data-slot]{translate:0px 0!important;visibility:hidden;z-index:1}
 /* Giant mobile portraits extend well beyond the screen. Keep their grading
    while avoiding two blurred alpha-shadow surfaces for each moving image. */
 #electionOpening .election-cast-body img{filter:saturate(.86) sepia(.075) contrast(1.025)}
}
#electionOpening .election-opening-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:saturate(.86) sepia(.075) contrast(1.025)}
#electionOpening[data-cast-renderer=canvas] .election-opening-candidate{visibility:hidden!important;will-change:auto;translate:0px 0!important}
#electionOpening[data-cast-renderer=canvas] .election-cast-body img{animation:none!important;will-change:auto;filter:none}
#electionOpening[data-cast-renderer=static] .election-opening-canvas{visibility:hidden}
/* Mobile shares the approved upper-body close-up, with full faces kept inside each edge. */
@media(max-width:900px) and (orientation:portrait){
 #electionOpening .election-opening-candidate{top:auto;bottom:-55%;height:140%;width:100%;left:calc(20% - 20px)}#electionOpening .election-opening-candidate[data-slot=right]{left:calc(80% + 20px)}
 #electionOpening .election-cast-body{overflow:visible;mask-image:none}#electionOpening .election-cast-body img{height:var(--portrait-height);bottom:var(--portrait-bottom)}
}
@media(max-height:600px) and (orientation:landscape){
 #electionOpening .election-opening-candidate{top:auto;bottom:-80%;height:170%;width:50%;left:17%}#electionOpening .election-opening-candidate[data-slot=right]{left:83%}
 #electionOpening .election-cast-body{overflow:visible;mask-image:none}#electionOpening .election-cast-body img{height:var(--portrait-height);bottom:var(--portrait-bottom)}
}
/* Keep the opposing shoulder out of each face area on narrow portrait screens. */
@media(max-width:900px) and (orientation:portrait){
}

/* Mobile silhouettes overlap naturally; no internal half-screen crop. */
@media(max-width:900px) and (orientation:portrait){#electionOpening .election-opening-candidate{clip-path:none}#electionOpening .election-opening-candidate[data-layer=active],#electionOpening .election-opening-candidate[data-layer=outgoing]{z-index:var(--rest-depth,2)}#electionOpening .election-opening-candidate[data-layer=incoming]{z-index:4}}
/* Match the approved selection scene's grading; preserve all opening ambient motion. */
#electionOpening .start-backdrop{background:linear-gradient(180deg,#02071522,transparent 43%,#0207134f),radial-gradient(ellipse at 50% 68%,#9d773b22,transparent 68%),url('../assets/election/knesset-background-v3-arcade-live.webp') center 42%/cover no-repeat;filter:none;opacity:1}
#electionOpening .start-backdrop::after{display:none}
#electionOpening::before{background:linear-gradient(180deg,#03081422,transparent 38%,#03081433),linear-gradient(90deg,#02071022,transparent 35% 65%,#02071022)}

/* Portrait phones get a true vertical composition; rotation restores the full arena. */
@media(max-width:900px) and (orientation:portrait){
  #electionOpening .start-backdrop{inset:-1.5%;background:linear-gradient(180deg,#02071517,transparent 44%,#0207135c),radial-gradient(ellipse at 50% 69%,#9d773b1f,transparent 65%),url('../assets/election/knesset-background-v3-arcade-live-mobile.webp') center 50%/cover no-repeat;animation-name:election-mobile-backdrop-breathe;transform-origin:50% 44%}
  #electionOpening .election-sky-charge{inset:-6% -30% 39%}
  #electionOpening .election-horizon-pulse{inset:15% -16% 34%}
  #electionOpening .election-light-sweep{inset:-12% -58% 22%;background:linear-gradient(158deg,transparent 38%,#8dc9ff14 46%,#ffe0a025 50%,transparent 59%)}
  #electionOpening .election-cloud-light{inset:-3% -34% 42%}
  #electionOpening .election-smoke{inset:47% -52% -18%}
}
@media(max-width:900px) and (orientation:landscape){
  #electionOpening .start-backdrop{background:linear-gradient(180deg,#02071522,transparent 43%,#0207134f),radial-gradient(ellipse at 50% 68%,#9d773b22,transparent 68%),url('../assets/election/knesset-background-v3-arcade-live.webp') center 42%/cover no-repeat;animation-name:election-backdrop-breathe;transform-origin:50% 42%}
}
@keyframes election-mobile-backdrop-breathe{from{transform:scale(1.012) translate3d(0,.18%,0)}to{transform:scale(1.034) translate3d(0,-.45%,0)}}

/* Latest credit placement: centered between the two actions and the legal copy. */
@media(min-width:901px) and (min-height:601px){#electionOpening .creator-credit{position:static;inset:auto;translate:none;transform:none}}
/* Extra separation keeps the rendered gold logo readable on small screens. */
@media(max-width:900px),(max-height:600px){
  #electionOpening h1.logo{width:min(94vw,880px)}
  #electionOpening .election-logo-art{filter:drop-shadow(0 5px 1px #080401) drop-shadow(0 10px 12px #000e)}
}

/* Mobile opening: reserve a reliable footer zone and use the tall viewport above it. */
@media(max-height:600px) and (orientation:landscape){
  #electionOpening h1.logo{width:min(68vw,72dvh,600px)}
}

@media(max-width:900px) and (orientation:portrait){
  #electionOpening .election-opening-title{top:46%}
  #electionOpening .election-opening-candidate{bottom:-48%}
  /* Lift only the shorter portraits so their faces clear the centered logo. */
  #electionOpening .election-opening-candidate[data-fighter=netanyahu]{bottom:-45%}
  #electionOpening .election-opening-candidate[data-fighter=lapid]{bottom:-44%}
  #electionOpening .election-opening-candidate[data-fighter=eisenkot]{bottom:-41.5%}
  #electionOpening .election-opening-candidate[data-fighter=bennett]{bottom:-40%}
  #electionOpening .election-opening-candidate[data-fighter=abbas]{bottom:-40%}
  #electionOpening .election-opening-candidate[data-fighter=deri]{bottom:-39%}
  #electionOpening .election-opening-candidate[data-fighter=ben-gvir]{bottom:-39.5%}
  #electionOpening .election-opening-candidate[data-fighter=lieberman]{bottom:-45%}
  #electionOpening .election-opening-candidate[data-fighter=goldknopf]{bottom:-39%}
  #electionOpening .election-opening-actions{top:auto;bottom:clamp(112px,18vh,180px)}
}
@media(max-width:700px) and (orientation:portrait) and (max-height:700px){
  #electionOpening .election-opening-title{top:44%}
  #electionOpening .election-opening-actions{gap:7px}
  #electionOpening .election-story-link{margin-top:6px}
}

/* Preserve the full desktop composition through the awkward mid-height range. */
@media(min-width:901px) and (min-height:601px) and (max-height:719px){
  html.election-opening-visible{overflow-x:hidden!important;overflow-y:auto!important}
  html.election-opening-visible body{min-height:720px!important;overflow:visible!important}
  html.election-opening-visible body>main{position:fixed;inset:0;width:100%;height:100dvh;overflow:hidden}
  #electionOpening{position:absolute;inset:0 0 auto;height:720px;min-height:720px}
}

/* A short landscape viewport must scroll instead of compressing the actions,
   creator credit and legal copy into the same vertical space. */
@media(orientation:landscape) and (max-height:539px){
  html.election-opening-visible{overflow-x:hidden!important;overflow-y:auto!important}
  html.election-opening-visible body{min-height:540px!important;overflow:visible!important}
  html.election-opening-visible body>main{width:100%;height:540px;min-height:540px;overflow:hidden}
  #electionOpening{position:absolute;inset:0 0 auto;height:540px;min-height:540px}
}

/* Desktop composition: retain roster height ratios while giving the face-off more vertical presence. */
@media(min-width:901px) and (min-height:601px){
  #electionOpening .election-opening-candidate{height:180%;bottom:-83%}
  #electionOpening .election-opening-title{top:calc(48.5% - 100px)}
  #electionOpening .election-opening-actions{top:calc(73% - 66px);gap:15px}
  #electionOpening .election-story-link{margin-top:14px}
}

/* Progressive opening paint: backdrop, logo, actions, then the first face-off. */
#electionOpening .start-backdrop,#electionOpening .election-ambient,#electionOpening .election-opening-fog,#electionOpening .start-vignette{opacity:0;visibility:hidden;transition:opacity .38s ease,visibility 0s linear .38s}
#electionOpening .election-opening-title,#electionOpening .election-opening-actions,#electionOpening .start-legal{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .42s ease,visibility 0s linear .42s}
#electionOpening .election-opening-tools,#electionOpening .election-opening-share-status{opacity:0;visibility:hidden;pointer-events:none}
#electionOpening .election-opening-cast{opacity:0;visibility:hidden;transition:opacity .56s cubic-bezier(.2,.72,.2,1),visibility 0s linear .56s}
#electionOpening:is([data-stage="backdrop"],[data-stage="logo"],[data-stage="actions"],[data-stage="images"]) .start-backdrop,
#electionOpening:is([data-stage="backdrop"],[data-stage="logo"],[data-stage="actions"],[data-stage="images"]) .election-ambient,
#electionOpening:is([data-stage="backdrop"],[data-stage="logo"],[data-stage="actions"],[data-stage="images"]) .election-opening-fog,
#electionOpening:is([data-stage="backdrop"],[data-stage="logo"],[data-stage="actions"],[data-stage="images"]) .start-vignette{opacity:1;visibility:visible;transition-delay:0s}
#electionOpening:is([data-stage="logo"],[data-stage="actions"],[data-stage="images"]) .election-opening-title{opacity:1;visibility:visible;transition-delay:0s}
#electionOpening:is([data-stage="actions"],[data-stage="images"]) .election-opening-actions,
#electionOpening:is([data-stage="actions"],[data-stage="images"]) .start-legal,
#electionOpening:is([data-stage="actions"],[data-stage="images"]) .election-opening-tools{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .42s ease;transition-delay:0s}
#electionOpening:is([data-stage="actions"],[data-stage="images"]) .election-opening-share-status{opacity:1;visibility:visible;transition-delay:0s}
#electionOpening[data-stage="images"] .election-opening-cast{opacity:1;visibility:visible;transition-delay:0s}
@media(prefers-reduced-motion:reduce){#electionOpening .start-backdrop,#electionOpening .election-ambient,#electionOpening .election-opening-fog,#electionOpening .start-vignette,#electionOpening .election-opening-title,#electionOpening .election-opening-actions,#electionOpening .election-opening-cast,#electionOpening .start-legal{transition:none!important}}
