.intro-shell{position:relative;isolation:isolate;width:100%;height:100svh;height:100dvh;overflow:hidden;background:var(--yellow)}
.intro-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(255,206,3,.09),transparent 30%,transparent 48%,rgba(17,17,9,.14) 62%,rgba(16,17,8,.8) 100%)}
.intro-header{position:absolute;z-index:3;inset:max(1.4rem,env(safe-area-inset-top)) clamp(1.25rem,3.2vw,3.75rem) auto;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;pointer-events:none}
.intro-logo{width:clamp(12rem,25vw,21rem);height:auto;object-fit:contain;background:#fff;border-radius:.9rem;padding:.7rem .9rem;box-shadow:0 8px 28px #1c19031c;transform-origin:top left;animation:logo-heartbeat 4s ease-in-out infinite}
.intro-election{display:flex;align-items:center;gap:.7rem;min-height:3.5rem;padding:.7rem 1rem;background:#fffffff0;border:1px solid #fff;border-radius:1rem;box-shadow:0 6px 24px #211c0012;font-size:.875rem;font-weight:750;line-height:1.2;letter-spacing:.06em}.intro-election .election-day{font-size:2rem;font-weight:800;line-height:1;letter-spacing:-.07em}.intro-election small{display:block;margin-top:.15rem;font-size:.75rem;font-weight:500;letter-spacing:.15em;color:#777566}
.intro-center{position:absolute;z-index:3;left:50%;top:61%;transform:translate(-50%,-50%);width:max-content;max-width:calc(100% - 11rem);text-align:center}.intro-greeting{margin:0 0 .9rem;color:#fff;font-size:1rem;font-weight:550;line-height:1.5;text-shadow:0 1px 10px #0009;background:#1d1e147a;display:inline-block;border-radius:2rem;padding:.45rem 1rem;backdrop-filter:blur(12px);max-width:100%;overflow-wrap:anywhere}
.enter-link{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1.8rem;min-height:4.6rem;padding:.65rem .65rem .65rem 1.65rem;border:1px solid #fff6;border-radius:1.1rem;background:linear-gradient(120deg,#ffdf4a,var(--yellow));box-shadow:0 14px 40px #18150045,inset 0 1px 0 #ffffffad;color:#17180d;font-size:1.125rem;font-weight:750;letter-spacing:-.025em;text-decoration:none;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s}.enter-link::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,#fff8 50%,transparent 75%);transform:translateX(-130%);transition:transform .65s var(--ease)}.enter-link:hover::before{transform:translateX(130%)}.enter-link:hover{transform:translateY(-4px);box-shadow:0 20px 48px #18150055}.enter-link:active{transform:translateY(0) scale(.98)}.enter-link>span{position:relative;z-index:1}.enter-icon{display:grid;place-items:center;flex:0 0 3.15rem;width:3.15rem;height:3.15rem;border-radius:.75rem;background:var(--ink);color:#fff}.enter-icon svg{width:1.4rem;height:1.4rem}
.intro-bottom{position:absolute;z-index:4;bottom:max(1.4rem,env(safe-area-inset-bottom));left:clamp(1.25rem,3.2vw,3.75rem);right:clamp(1.25rem,3.2vw,3.75rem);display:grid;grid-template-columns:1fr minmax(19rem,26rem) 1fr;align-items:end;gap:1rem}.intro-signature{margin:0;color:#fff;font-size:1rem;font-weight:650;line-height:1.6}.intro-signature span{display:block;font-size:.75rem;font-weight:500;letter-spacing:.12em;opacity:.7}.motion-button{justify-self:end;display:flex;align-items:center;gap:.5rem;min-height:2.8rem;padding:.6rem .85rem;border:1px solid #ffffff2a;border-radius:.8rem;background:#ffffff15;backdrop-filter:blur(12px);color:#fff;font-size:.875rem;transition:background .2s}.motion-button:hover{background:#ffffff2b}.motion-button[aria-pressed="true"]{color:var(--yellow)}
.light-sweep{position:absolute;z-index:2;inset:0;overflow:hidden;pointer-events:none}.light-sweep::after{content:"";position:absolute;inset:-60%;background:linear-gradient(110deg,transparent 42%,#fff0 46%,#fff4 50%,#ffeb7033 52%,transparent 57%);transform:translateX(-110%);animation:light-pass 13s ease-in-out infinite}
@keyframes logo-heartbeat{0%,60%,100%{transform:scale(1)}66%{transform:scale(1.026)}73%{transform:scale(1)}79%{transform:scale(1.014)}}@keyframes light-pass{0%,52%{transform:translateX(-110%)}78%,100%{transform:translateX(110%)}}
@media(max-width:900px){.intro-bottom{grid-template-columns:1fr minmax(18rem,25rem) 1fr;left:1.2rem;right:1.2rem}.intro-signature{font-size:.875rem}.intro-signature span{letter-spacing:.04em}.motion-button span:last-child{display:none}.motion-button{padding:.65rem}.intro-center{top:57%}.intro-logo{width:15rem}}
@media(max-width:650px){.intro-header{inset:max(1rem,env(safe-area-inset-top)) 1rem auto}.intro-logo{width:12.6rem;border-radius:.65rem;padding:.45rem .55rem}.intro-election{padding:.5rem .6rem;border-radius:.7rem;gap:.4rem;font-size:.75rem;min-height:0}.intro-election .election-day{font-size:1.55rem}.intro-election small{font-size:.75rem}.intro-center{top:55%;max-width:calc(100% - 7rem);width:18.5rem}.intro-greeting{font-size:.875rem;margin-bottom:.7rem;padding:.4rem .65rem}.enter-link{font-size:1rem;min-height:4rem;gap:.65rem;border-radius:.9rem;padding:.55rem .55rem .55rem 1rem}.enter-icon{flex-basis:2.6rem;width:2.6rem;height:2.6rem;border-radius:.6rem}.intro-bottom{grid-template-columns:1fr;bottom:max(1rem,env(safe-area-inset-bottom));left:1rem;right:1rem;gap:0}.music-player{justify-self:center;width:min(100%,25rem)}.intro-signature{display:none}.motion-button{position:absolute;right:0;bottom:calc(100% + .75rem);min-height:2.5rem;padding:.55rem}.intro-shade{background:linear-gradient(180deg,#ffce0314,transparent 30%,#0001 40%,#13170752 65%,#11140de6 100%)}}
@media(max-height:600px) and (min-width:651px){.intro-header{top:.9rem}.intro-logo{width:13rem}.intro-election{padding:.5rem .7rem}.intro-center{top:46%}.intro-bottom{bottom:.75rem}.intro-greeting{margin-bottom:.6rem}.enter-link{min-height:3.8rem}.enter-icon{width:2.6rem;height:2.6rem;flex-basis:2.6rem}.intro-signature{font-size:.875rem}}
@media(max-height:600px) and (max-width:650px){.intro-center{top:45%}.intro-header{top:.6rem}.intro-logo{width:10.5rem}.intro-election{display:none}.intro-greeting{font-size:.875rem;margin-bottom:.5rem}.enter-link{min-height:3.3rem}.enter-icon{width:2.3rem;height:2.3rem;flex-basis:2.3rem}.intro-bottom{bottom:.6rem}.motion-button{display:none}}
@media(max-height:410px){.intro-greeting,.intro-election,.intro-signature,.motion-button{display:none}.intro-header{top:.6rem}.intro-logo{width:10rem}.intro-center{top:44%}.intro-bottom{grid-template-columns:1fr minmax(18rem,22rem) 1fr;bottom:.5rem}.music-player{grid-column:2}.light-sweep{display:none}}
@media(max-width:380px){.intro-logo{width:10.4rem}.intro-election{gap:.35rem;padding:.45rem .5rem}.intro-election .election-day{font-size:1.4rem}}
