:root{
  --ivory:#FBF9F4; --cream:#F5EFE1; --sage:#E5F1EA; --green:#0F6B45; --green-d:#08291C; --green-l:#1F9D66; --emerald:#12B07A;
  --gold:#E3A62F; --gold-l:#F7DC92; --amber:#B7790F; --coral:#E8684A; --violet:#5B3FA8;
  --ink:#1D2125; --muted:#5F656B; --line:#E4DDCB; --white:#fff; --red:#C2412F;
  --serif:'Fraunces',Georgia,'Times New Roman',serif; --sans:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --r:16px; --shadow:0 1px 2px rgba(8,41,28,.06),0 10px 30px rgba(8,41,28,.08);
  --shadow-lg:0 30px 60px -20px rgba(8,41,28,.35),0 12px 24px -12px rgba(8,41,28,.2);
  --grad-gold:linear-gradient(135deg,#F7DC92 0%,#E3A62F 45%,#E8684A 100%);
  --grad-green:linear-gradient(135deg,#08291C 0%,#0F6B45 55%,#1F9D66 100%);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--ivory);color:var(--ink);font:17px/1.65 var(--sans);overflow-x:clip}
img{max-width:100%;display:block}
a{color:var(--green);text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.12;margin:0 0 .5em;color:var(--green-d);letter-spacing:-.015em}
h1{font-size:clamp(2.4rem,6.4vw,4.8rem)} h2{font-size:clamp(1.8rem,3.8vw,2.8rem)} h3{font-size:1.3rem}
p{margin:0 0 1em;max-width:68ch}
::selection{background:var(--gold-l);color:var(--green-d)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
.wrap{width:min(1180px,100% - 2.5rem);margin-inline:auto}
.narrow{width:min(780px,100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:99}
.grad-text{background:var(--grad-gold);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s ease-in-out infinite}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font:700 .78rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:.9rem}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--grad-gold);border-radius:2px}

/* scroll progress */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:var(--grad-gold);z-index:60;pointer-events:none}

/* buttons */
.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.5rem;border-radius:999px;border:2px solid var(--green);background:var(--green);color:#fff;font:600 1rem var(--sans);text-decoration:none;cursor:pointer;transition:background .25s var(--ease),color .25s,transform .25s var(--ease),box-shadow .25s,border-color .25s}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.btn:hover::after{transform:translateX(120%)}
.btn:hover{background:var(--green-d);border-color:var(--green-d);transform:translateY(-2px);box-shadow:0 12px 24px -10px rgba(15,107,69,.6)}
.btn:active{transform:translateY(0)}
.btn--ghost{background:transparent;color:var(--green)} .btn--ghost:hover{background:var(--green);color:#fff}
.btn--gold{background:var(--grad-gold);background-size:150% 150%;border-color:transparent;color:#2a1a02}
.btn--gold:hover{background:var(--grad-gold);background-position:100% 0;border-color:transparent;box-shadow:0 14px 28px -10px rgba(232,104,74,.65)}
.btn--danger{background:var(--red);border-color:var(--red)} .btn--danger:hover{background:#952f22;border-color:#952f22}
.btn--sm{padding:.45rem 1rem;font-size:.9rem} .btn--block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.btn .arr{transition:transform .25s var(--ease)} .btn:hover .arr{transform:translateX(4px)}

/* top bar */
.topbar{position:sticky;top:0;z-index:40;background:rgba(251,249,244,.78);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:background .3s,border-color .3s,box-shadow .3s}
.topbar.scrolled{background:rgba(251,249,244,.94);border-color:var(--line);box-shadow:0 8px 30px -18px rgba(8,41,28,.35)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:74px;transition:min-height .3s}
.topbar.scrolled .wrap{min-height:62px}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--green-d)}
.brand__mark{width:40px;height:40px;border-radius:50%;background:var(--grad-green);color:var(--gold-l);display:grid;place-items:center;font:700 1.2rem var(--serif);box-shadow:0 0 0 3px var(--ivory),0 0 0 5px var(--gold);transition:transform .5s var(--ease)}
.brand:hover .brand__mark{transform:rotate(-12deg) scale(1.06)}
.brand__logo{height:44px;width:auto;max-width:150px;object-fit:contain;transition:transform .5s var(--ease)}
.brand:hover .brand__logo{transform:scale(1.06)}
.topbar.scrolled .brand__logo{height:38px}
.footer .brand__logo,.side .brand__logo{background:#fff;border-radius:10px;padding:3px}
.brand__name{font:700 1.3rem var(--serif);letter-spacing:.03em}
.nav{display:flex;align-items:center;gap:1.5rem}
.nav a{position:relative;text-decoration:none;color:var(--ink);font-weight:500;font-size:.95rem;padding:.3rem 0}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--grad-gold);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.nav a:not(.btn):hover::after,.nav a[aria-current=page]::after{transform:scaleX(1);transform-origin:left}
.nav a[aria-current=page]{color:var(--green)}
.nav .btn{color:#fff}
.burger{display:none;background:#fff;border:1px solid var(--line);border-radius:10px;padding:.5rem .75rem;font-size:1.2rem;cursor:pointer;color:var(--green-d)}
@media(max-width:1000px){
  .burger{display:block}
  .nav{position:absolute;top:100%;left:0;right:0;background:rgba(251,249,244,.98);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1.25rem;border-bottom:1px solid var(--line);box-shadow:var(--shadow);clip-path:inset(0 0 100% 0);opacity:0;visibility:hidden;transition:clip-path .4s var(--ease),opacity .3s,visibility 0s .4s}
  .nav.open{clip-path:inset(0 0 0 0);opacity:1;visibility:visible;transition:clip-path .4s var(--ease),opacity .3s}
  .nav a{padding:.85rem 0;border-bottom:1px solid var(--line)}
  .nav a:not(.btn)::after{display:none}
  .nav .btn{margin-top:.9rem}
}

/* hero */
.hero{position:relative;overflow:hidden;color:#F3EEDD;background:var(--green-d);min-height:min(92vh,860px);display:flex;align-items:center;isolation:isolate}
.hero__bg{position:absolute;inset:-6% 0;z-index:-2;background-size:cover;background-position:center;transform:translate3d(0,var(--py,0),0) scale(1.08);animation:kenburns 26s ease-in-out infinite alternate;will-change:transform}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(900px 500px at 85% 15%,rgba(227,166,47,.35),transparent 60%),
  radial-gradient(700px 500px at 0% 100%,rgba(18,176,122,.35),transparent 60%),
  linear-gradient(100deg,rgba(8,41,28,.95) 0%,rgba(8,41,28,.82) 45%,rgba(8,41,28,.45) 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:90px;z-index:-1;background:linear-gradient(to top,var(--ivory),transparent)}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;padding:5rem 0 6.5rem;align-items:center}
.hero__kicker{display:inline-flex;align-items:center;gap:.6rem;color:var(--gold-l);font-weight:600;letter-spacing:.08em;margin-bottom:1.2rem;padding:.4rem 1rem .4rem .5rem;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px)}
.hero__kicker::before{content:"✝";display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--grad-gold);color:#2a1a02;font-size:.85rem}
.hero h1{color:#fff;margin-bottom:.35em;text-shadow:0 4px 30px rgba(0,0,0,.25)}
.hero h1 em{font-style:italic;background:var(--grad-gold);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s ease-in-out infinite}
.hero .lead{font-size:1.22rem;color:#E4DECB;max-width:48ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.hero .btn--ghost{color:#fff;border-color:rgba(255,255,255,.55);backdrop-filter:blur(4px)} .hero .btn--ghost:hover{background:#fff;color:var(--green-d);border-color:#fff}
.hero__scroll{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);width:26px;height:42px;border:2px solid rgba(255,255,255,.55);border-radius:14px;z-index:2}
.hero__scroll::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:scrolldot 1.8s ease-in-out infinite}
.orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;z-index:-1;animation:float 12s ease-in-out infinite}
.orb--1{width:280px;height:280px;background:#E3A62F;top:8%;right:6%}
.orb--2{width:220px;height:220px;background:#12B07A;bottom:6%;left:-60px;animation-delay:-4s}
@media(max-width:860px){.hero{min-height:auto}.hero .wrap{grid-template-columns:1fr;padding:3.5rem 0 5rem}.hero__scroll{display:none}}

/* ballot slip */
.slip{background:rgba(251,249,244,.97);color:var(--ink);border-radius:14px;padding:1.5rem 1.6rem 1.3rem;box-shadow:0 40px 80px -20px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.4);transform:rotate(2deg);position:relative;max-width:420px;justify-self:end;width:100%;animation:slipfloat 7s ease-in-out infinite}
.slip::before{content:"";position:absolute;inset:-14px;border-radius:22px;background:var(--grad-gold);opacity:.35;filter:blur(22px);z-index:-1}
.slip::after{content:"";position:absolute;left:14px;right:14px;bottom:-8px;height:8px;background:radial-gradient(circle at 6px 0,rgba(251,249,244,.97) 5px,transparent 5.5px) 0 0/12px 8px repeat-x}
.slip h3{font-size:1.05rem;margin:0;color:var(--green-d)} .slip small{color:var(--muted)}
.slip__head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid var(--green);padding-bottom:.7rem;margin-bottom:.5rem}
.slip__row{display:flex;align-items:center;gap:.7rem;padding:.4rem 0;border-bottom:1px dashed var(--line);font-size:.92rem;opacity:0;transform:translateX(12px);animation:rowin .6s var(--ease) forwards}
.slip__row:nth-child(2){animation-delay:.5s}.slip__row:nth-child(3){animation-delay:.65s}.slip__row:nth-child(4){animation-delay:.8s}.slip__row:nth-child(5){animation-delay:.95s}.slip__row:nth-child(6){animation-delay:1.1s}.slip__row:nth-child(7){animation-delay:1.25s}.slip__row:nth-child(8){animation-delay:1.4s}
.slip__box{width:18px;height:18px;border:1.5px solid var(--green);border-radius:4px;flex:none;position:relative;transition:background .3s}
.slip__row.on .slip__box{background:var(--sage)}
.slip__row.on .slip__box::after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid var(--green);border-width:0 2.5px 2.5px 0;transform:rotate(40deg) scale(0);animation:tick .4s var(--ease) forwards;animation-delay:1.8s}
.slip__foot{margin-top:.9rem;display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.92rem}
.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);display:inline-block;position:relative}
.dot--on{background:#22c271;box-shadow:0 0 0 4px rgba(34,194,113,.25)} .dot--on::after{content:"";position:absolute;inset:0;border-radius:50%;background:#22c271;animation:ping 1.6s cubic-bezier(0,0,.2,1) infinite}
.dot--lock{background:var(--gold)}

/* sections */
.section{padding:5.5rem 0;position:relative}
.section--cream{background:var(--cream)} .section--sage{background:var(--sage)}
.section--green{background:var(--grad-green);color:#EAF2EC;overflow:hidden;isolation:isolate}
.section--green::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(600px 300px at 90% 0%,rgba(227,166,47,.25),transparent 70%),radial-gradient(500px 300px at 0% 100%,rgba(18,176,122,.3),transparent 70%)}
.section--green h2,.section--green h3{color:#fff}
.section__head{margin-bottom:2.6rem;max-width:64ch}
.section__head p{color:var(--muted);font-size:1.1rem}
.section--green .section__head p{color:#CFE2D5}
.section--green .eyebrow{color:var(--gold-l)}
.page-head{position:relative;overflow:hidden;isolation:isolate;color:#fff;padding:6rem 0 4.5rem;background:var(--green-d)}
.page-head::before{content:"";position:absolute;inset:-8% 0;z-index:-2;background:var(--bg,none) center/cover;transform:translate3d(0,var(--py,0),0) scale(1.06);animation:kenburns 30s ease-in-out infinite alternate}
.page-head::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(600px 300px at 90% 10%,rgba(227,166,47,.35),transparent 65%),linear-gradient(100deg,rgba(8,41,28,.94) 0%,rgba(8,41,28,.78) 55%,rgba(15,107,69,.55) 100%)}
.page-head h1{color:#fff;font-size:clamp(2.2rem,5.4vw,3.8rem);margin:0;animation:fadeup .9s var(--ease) both}
.page-head p{color:#DCE8DF;margin:.8rem 0 0;font-size:1.15rem;animation:fadeup .9s .15s var(--ease) both}
.page-head .wrap::before{content:"";display:block;width:56px;height:4px;border-radius:4px;background:var(--grad-gold);margin-bottom:1.2rem;animation:grow .9s var(--ease) both}
.page-head .wrap[style*=flex]::before{display:none}
.grid{display:grid;gap:1.5rem}
.grid--2{grid-template-columns:repeat(2,1fr)} .grid--3{grid-template-columns:repeat(3,1fr)} .grid--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
a.card:hover,.card--hover:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--gold-l)}
.card--flat{box-shadow:none}
.card h3{margin-bottom:.4em}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.pillars>div{position:relative;padding:2rem 1.7rem 1.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);transition:transform .4s var(--ease),box-shadow .4s;overflow:hidden}
.pillars>div::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--grad-gold);transform:scaleX(.25);transform-origin:left;transition:transform .5s var(--ease)}
.pillars>div:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)} .pillars>div:hover::before{transform:scaleX(1)}
.pillars .ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;background:var(--sage);margin-bottom:1rem;transition:transform .5s var(--ease)}
.pillars>div:hover .ico{transform:rotate(-8deg) scale(1.1)}
@media(max-width:760px){.pillars{grid-template-columns:1fr}}

/* timeline */
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s;position:relative}
.step{position:relative;padding:0 1rem 0 0}
.step::before{content:"";position:absolute;top:21px;left:44px;right:0;height:3px;border-radius:3px;background:var(--line)}
.step:last-child::before{display:none}
.step__n{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:700 1.05rem var(--serif);background:#fff;border:2px solid var(--line);color:var(--muted);position:relative;z-index:1;transition:transform .4s var(--ease)}
.step:hover .step__n{transform:scale(1.12)}
.step--done .step__n{background:var(--grad-green);border-color:var(--green);color:#fff}
.step--done::before{background:linear-gradient(90deg,var(--green),var(--emerald))}
.step--current .step__n{background:var(--grad-gold);border-color:var(--gold);color:#2a1a02;box-shadow:0 0 0 6px rgba(227,166,47,.25);animation:pulse 2.4s ease-in-out infinite}
.step h3{font-size:1.12rem;margin:.9rem 0 .15rem}
.step small{color:var(--muted);font-weight:600}
.step--current small{color:var(--amber)} .step--done small{color:var(--green-l)}
@media(max-width:700px){
  .timeline{grid-template-columns:1fr}
  .step{display:grid;grid-template-columns:44px 1fr;column-gap:1rem;padding:0 0 1.5rem}
  .step::before{top:44px;bottom:0;left:20px;right:auto;width:3px;height:auto}
  .step h3{margin:0}
}

/* posts */
.posts{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem 1.4rem;counter-reset:p}
@media(max-width:760px){.posts{grid-template-columns:1fr}}
.post{position:relative;display:grid;grid-template-columns:3.2rem 1fr auto;gap:.4rem 1rem;align-items:center;padding:1.1rem 1.3rem;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:inherit;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s,background .35s}
.post::after{content:"→";color:var(--gold);font-weight:700;transition:transform .35s var(--ease)}
.post:hover{transform:translateX(6px);box-shadow:var(--shadow);border-color:var(--gold-l);background:linear-gradient(90deg,#fff,var(--cream))}
.post:hover::after{transform:translateX(4px)}
.post__n{font:600 1.7rem var(--serif);background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.post h3{margin:0;font-size:1.12rem} .post small{color:var(--muted)}
.post-detail{border:1px solid var(--line);border-radius:var(--r);background:#fff;margin-bottom:1.2rem;overflow:hidden;transition:box-shadow .3s,border-color .3s}
.post-detail:hover,.post-detail[open]{box-shadow:var(--shadow);border-color:var(--gold-l)}
.post-detail>summary{cursor:pointer;padding:1.2rem 1.4rem;display:flex;gap:1rem;align-items:center;list-style:none}
.post-detail>summary::-webkit-details-marker{display:none}
.post-detail>summary::after{content:"+";margin-left:auto;font:600 1.6rem var(--serif);color:var(--gold);transition:transform .3s var(--ease)}
.post-detail[open]>summary::after{transform:rotate(45deg)}
.post-detail[open] .post-detail__body{animation:fadeup .45s var(--ease)}
.post-detail__body{padding:0 1.4rem 1.4rem;border-top:1px solid var(--line)}
.post-detail h4{font:700 .95rem var(--sans);margin:1.2rem 0 .3rem;color:var(--green)}

/* responsibilities: filter chips + role cards + dialog */
.role--green,.vow--green{--c1:#0F6B45;--c2:#12B07A;--tint:#E3F4EA}
.role--violet,.vow--violet{--c1:#4B2E9A;--c2:#8B6CF0;--tint:#EEE9FC}
.role--coral,.vow--coral{--c1:#C24A2C;--c2:#F2946B;--tint:#FDECE5}
.role--gold,.vow--gold{--c1:#A86A05;--c2:#F0B840;--tint:#FDF3D9}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2.4rem}
.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1rem;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--ink);font:600 .92rem var(--sans);cursor:pointer;transition:all .3s var(--ease)}
.chip b{display:grid;place-items:center;min-width:24px;height:24px;padding:0 .4rem;border-radius:999px;background:var(--cream);font-size:.78rem}
.chip:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.chip.is-on{background:var(--green-d);border-color:var(--green-d);color:#fff}.chip.is-on b{background:var(--grad-gold);color:#2a1a02}
.chip--green.is-on{background:#0F6B45;border-color:#0F6B45}.chip--violet.is-on{background:#4B2E9A;border-color:#4B2E9A}
.chip--coral.is-on{background:#C24A2C;border-color:#C24A2C}.chip--gold.is-on{background:#A86A05;border-color:#A86A05}

.roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.4rem}
.role{position:relative;perspective:900px;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.role.is-hidden{display:none}
.role.is-pop{animation:pop .5s var(--ease) both}
.role__hit{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;width:100%;height:100%;min-height:270px;padding:1.6rem 1.5rem 1.4rem;text-align:left;border-radius:22px;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;cursor:pointer;box-shadow:var(--shadow);transform:rotateX(var(--rx,0)) rotateY(var(--ry,0));transform-style:preserve-3d;transition:transform .25s ease-out,box-shadow .4s,border-color .4s}
.role__hit::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(400px circle at var(--mx,50%) var(--my,0%),var(--tint),transparent 60%);opacity:.9;transition:opacity .4s}
.role__hit::after{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--c1),var(--c2))}
.role__hit:hover{box-shadow:0 30px 60px -24px color-mix(in srgb,var(--c1) 55%,transparent);border-color:color-mix(in srgb,var(--c2) 50%,var(--line))}
.role__num{position:absolute;right:.6rem;top:-.4rem;z-index:-1;font:700 6.5rem/1 var(--serif);color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--c2) 45%,transparent);transition:transform .6s var(--ease),-webkit-text-stroke-color .4s}
.role__hit:hover .role__num{transform:translate(-6px,8px) scale(1.08);-webkit-text-stroke-color:var(--c2)}
.role__ico{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;font-size:1.5rem;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 12px 22px -10px var(--c1);margin-bottom:.6rem;transition:transform .5s var(--ease)}
.role__hit:hover .role__ico{transform:rotate(-10deg) scale(1.08)}
.role__group{font:700 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--c1)}
.role__title{font:600 1.3rem/1.2 var(--serif);color:var(--green-d);letter-spacing:-.01em}
.role__pills{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:auto;padding-top:.6rem}
.pill{padding:.25rem .7rem;border-radius:999px;font-size:.8rem;font-weight:700;background:var(--tint);color:var(--c1)}
.pill--on{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff}
.role__more{display:inline-flex;gap:.4rem;font-weight:700;font-size:.9rem;color:var(--c1);opacity:.75;transition:opacity .3s}
.role__hit:hover .role__more{opacity:1}.role__hit:hover .arr{transform:translateX(4px)}
.role__more .arr{transition:transform .3s var(--ease)}

.role-dlg{width:min(680px,100% - 2rem);max-height:min(88vh,900px);padding:0;border:0;border-radius:26px;background:#fff;color:var(--ink);box-shadow:0 40px 100px -20px rgba(0,0,0,.5);overflow:hidden;flex-direction:column}
.role-dlg:focus,.role-dlg:focus-visible{outline:none}
.role-dlg[open]{display:flex;animation:dlgin .45s var(--ease)}
.role-dlg::backdrop{background:rgba(8,41,28,.55);backdrop-filter:blur(6px);animation:fadein .3s}
.role-dlg__head{position:relative;overflow:hidden;isolation:isolate;padding:2rem 2rem 1.6rem;color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2))}
.role-dlg__head .role__num{right:1.2rem;top:-.6rem;font-size:8rem;-webkit-text-stroke:2px rgba(255,255,255,.35)}
.role-dlg__head .role__group{color:rgba(255,255,255,.85)}
.role-dlg__head h2{color:#fff;margin:.4rem 0 .2rem;font-size:clamp(1.6rem,4vw,2.2rem);max-width:20ch}
.role-dlg__head .pill{background:rgba(255,255,255,.2);color:#fff}.role-dlg__head .pill--on{background:#fff;color:var(--c1)}
.role-dlg__x{position:absolute;right:1rem;top:1rem;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.2);color:#fff;font-size:1rem;cursor:pointer;transition:background .2s,transform .3s var(--ease)}
.role-dlg__x:hover{background:rgba(255,255,255,.35);transform:rotate(90deg)}
.role-dlg__body{padding:1.6rem 2rem .6rem;overflow-y:auto}
.role-dlg__lead{font-size:1.08rem}
.role-dlg__body h4{font:700 .78rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--c1);margin:1.4rem 0 .5rem}
.role-dlg__body .checks li::before{background:var(--tint);color:var(--c1)}
.role-dlg__foot{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:flex-end;padding:1rem 2rem 1.5rem;border-top:1px solid var(--line)}
.role-dlg__foot .btn:not(.btn--ghost){background:var(--c1);border-color:var(--c1)}
.role-dlg__foot .btn--ghost{color:var(--c1);border-color:var(--c1)}.role-dlg__foot .btn--ghost:hover{background:var(--c1);color:#fff}
@media(max-width:560px){.role-dlg{width:100%;max-height:92vh;margin:auto 0 0;border-radius:26px 26px 0 0}.role-dlg[open]{animation:sheetin .45s var(--ease)}.role-dlg__head,.role-dlg__body,.role-dlg__foot{padding-inline:1.3rem}}

/* about: drop cap, motto band, vows */
.dropcap{font-size:1.2rem;line-height:1.75;color:#343a40}
.dropcap::first-letter{float:left;font:700 5.2rem/.82 var(--serif);margin:.35rem .7rem 0 0;background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}

.motto{position:relative;overflow:hidden;isolation:isolate;padding:8rem 0 7rem;color:#fff;text-align:center}
.motto__bg{position:absolute;inset:-20% 0;z-index:-2;background-size:cover;background-position:center;transform:translate3d(0,var(--py,0),0)}
.motto::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 360px at 50% 55%,rgba(227,166,47,.28),transparent 70%),linear-gradient(180deg,rgba(8,41,28,.92),rgba(8,41,28,.8) 50%,rgba(8,41,28,.95))}
.motto .eyebrow{color:var(--gold-l);justify-content:center}
.motto .eyebrow::after{content:"";width:28px;height:2px;background:var(--grad-gold);border-radius:2px}
.motto__line{max-width:none;margin:0 auto 2.2rem;font:600 clamp(2.8rem,9vw,7rem)/1.02 var(--serif);letter-spacing:-.03em}
.motto__w{display:inline-block}
.motto__w--hl{font-style:italic;background:var(--grad-gold);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s ease-in-out infinite;padding-right:.08em}
.js .motto__w[data-reveal]{transform:translateY(55%) rotate(5deg);filter:blur(10px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);transition-delay:calc(var(--d,0s) * 2)}
.js .motto__w[data-reveal].is-in{transform:none;filter:none}
.motto__tags{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem}
.motto__tag{display:inline-flex;align-items:center;gap:.6rem;padding:.75rem 1.4rem;border-radius:999px;font-weight:600;font-size:1.05rem;background:rgba(255,255,255,.08);border:1px solid rgba(247,220,146,.35);backdrop-filter:blur(8px);box-shadow:0 0 0 0 rgba(227,166,47,.4);transition:transform .4s var(--ease),background .4s,box-shadow .4s}
.motto__tag:hover{transform:translateY(-4px);background:rgba(255,255,255,.14);box-shadow:0 0 30px -4px rgba(227,166,47,.55)}
.motto__tag i{font-style:normal;color:var(--gold);animation:spin 6s linear infinite;display:inline-block}

.vows{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;align-items:start}
.vow:nth-child(odd){margin-top:2.2rem}
.vow{position:relative;overflow:hidden;isolation:isolate;padding:2.6rem 1.8rem 1.8rem;border-radius:26px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);text-align:center;transition:transform .45s var(--ease),box-shadow .45s}
.vow::before{content:"";position:absolute;inset:auto -30% -55% -30%;height:70%;z-index:-1;background:radial-gradient(closest-side,var(--tint),transparent);transition:transform .6s var(--ease)}
.vow:hover{transform:translateY(-10px);box-shadow:0 34px 60px -26px color-mix(in srgb,var(--c1) 60%,transparent)}
.vow:hover::before{transform:translateY(-25%) scale(1.2)}
.vow__seal{position:relative;width:104px;height:104px;margin:0 auto 1.4rem;border-radius:50%;display:grid;place-items:center}
.vow__seal::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,var(--c1),var(--c2),#F7DC92,var(--c2),var(--c1));animation:spin 8s linear infinite;-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%);mask:radial-gradient(circle,transparent 58%,#000 60%)}
.vow__seal::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px dashed color-mix(in srgb,var(--c2) 40%,transparent);animation:spin 24s linear infinite reverse}
.vow__seal span{position:relative;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;font-size:2rem;background:linear-gradient(135deg,var(--tint),#fff);box-shadow:inset 0 0 0 1px rgba(0,0,0,.04);transition:transform .5s var(--ease)}
.vow:hover .vow__seal span{transform:scale(1.12) rotate(-8deg)}
.vow:hover .vow__seal::before{animation-duration:2.5s}
.vow__n{position:absolute;top:1rem;right:1.3rem;font:700 1rem var(--serif);color:var(--c1);opacity:.5;letter-spacing:.05em}
.vow h3{font-size:1.55rem;margin-bottom:.5rem}
.vow p{color:var(--muted);margin:0 auto 1.3rem}
.vow__proof{display:inline-block;padding:.35rem .9rem;border-radius:999px;font-size:.82rem;font-weight:700;background:var(--tint);color:var(--c1)}
@media(max-width:860px){.vows{grid-template-columns:1fr;max-width:480px;margin-inline:auto}.vow:nth-child(odd){margin-top:0}}

/* candidates page: race summary, seat panels, candidate cards, empty seat */
@property --pv{syntax:'<number>';initial-value:0;inherits:false}
.race{display:grid;grid-template-columns:auto 1fr auto;gap:2.4rem;align-items:center;padding:2rem 2.4rem;margin-bottom:2.6rem;border-radius:28px;background:var(--grad-green);color:#EAF2EC;position:relative;overflow:hidden;isolation:isolate;box-shadow:var(--shadow-lg)}
.race::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(500px 260px at 100% 0%,rgba(227,166,47,.3),transparent 70%),radial-gradient(400px 260px at 0% 100%,rgba(18,176,122,.35),transparent 70%)}
.race h2{color:#fff;font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:.4rem}
.race p{color:#CFE2D5;margin:0}
.race .eyebrow{color:var(--gold-l)}
.race__ring{--pv:0;width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#F7DC92,#E3A62F calc(var(--pv)*1%),rgba(255,255,255,.12) 0);transition:--pv 1.8s var(--ease) .3s;position:relative}
.race.is-in .race__ring{--pv:var(--pct)}
.race__ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--green-d);box-shadow:inset 0 0 20px rgba(0,0,0,.35)}
.race__ring>div{position:relative;font:700 2.4rem/1 var(--serif);color:#fff}
.race__ring span{font-size:1.1rem;color:var(--gold-l)}
.race__stats{display:grid;gap:.6rem;margin:0}
.race__stats>div{display:flex;justify-content:space-between;gap:1.6rem;align-items:baseline;padding:.55rem 1rem;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.race__stats dt{font-size:.85rem;color:#B9D2C2}
.race__stats dd{margin:0;font:700 1.5rem/1 var(--serif);color:#fff}
@media(max-width:900px){.race{grid-template-columns:auto 1fr;padding:1.6rem}.race__stats{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.race__stats>div{flex-direction:column;gap:.3rem}}
@media(max-width:560px){.race{grid-template-columns:1fr;text-align:center}.race__ring{margin:auto}.race .eyebrow{justify-content:center}}

.seats{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.4rem;align-items:start}
@media(max-width:420px){.seats{grid-template-columns:1fr}}
.seat{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);overflow:hidden;scroll-margin-top:90px;transition:transform .4s var(--ease),box-shadow .4s}
.seat:hover{transform:translateY(-6px);box-shadow:0 30px 60px -28px color-mix(in srgb,var(--c1) 55%,transparent)}
.seat:target{box-shadow:0 0 0 3px var(--c2),var(--shadow-lg)}
.seat__head{display:flex;gap:1rem;align-items:center;padding:1.2rem 1.3rem;border-bottom:1px solid var(--line);background:linear-gradient(120deg,var(--tint),#fff 70%)}
.seat__head>div{flex:1;min-width:0}
.seat__head h3{margin:.15rem 0 0;font-size:1.15rem}
.seat__head .role__group{white-space:nowrap;letter-spacing:.1em;font-size:.68rem}
.seat__head .pill{align-self:flex-start;font-size:.74rem;white-space:nowrap}
.seat__num{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:15px;font:700 1.15rem var(--serif);color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 18px -8px var(--c1)}
.seat__cands{display:grid;gap:.7rem;padding:1rem}
.ccard{display:grid;grid-template-columns:76px 1fr;gap:1rem;align-items:center;padding:.6rem;border-radius:16px;text-decoration:none;color:inherit;border:1px solid transparent;transition:background .3s,border-color .3s,transform .3s var(--ease)}
.ccard:hover{background:var(--tint);border-color:color-mix(in srgb,var(--c2) 35%,transparent);transform:translateX(4px)}
.ccard__photo{position:relative;width:76px;height:92px;border-radius:14px;overflow:hidden;box-shadow:0 10px 20px -10px var(--c1)}
.ccard__photo::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.ccard__img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.ccard:hover .ccard__img{transform:scale(1.08)}
.ccard__img--blank{display:grid;place-items:center;font:700 1.6rem var(--serif);color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2))}
.ccard__body{display:grid;gap:.2rem}
.ccard__body strong{font:600 1.1rem var(--serif);color:var(--green-d)}
.ccard__body small{color:var(--muted);line-height:1.4}
.ccard__more{font-size:.85rem;font-weight:700;color:var(--c1)}
.ccard__more .arr{display:inline-block;transition:transform .3s var(--ease)}.ccard:hover .ccard__more .arr{transform:translateX(4px)}

.seat__empty{position:relative;display:grid;justify-items:center;text-align:center;gap:.8rem;margin:1rem;padding:1.6rem 1rem 1.4rem;border-radius:18px;
  background:
    linear-gradient(90deg,var(--c2) 50%,transparent 0) 0 0/16px 2px repeat-x,
    linear-gradient(90deg,var(--c2) 50%,transparent 0) 0 100%/16px 2px repeat-x,
    linear-gradient(0deg,var(--c2) 50%,transparent 0) 0 0/2px 16px repeat-y,
    linear-gradient(0deg,var(--c2) 50%,transparent 0) 100% 0/2px 16px repeat-y,
    color-mix(in srgb,var(--tint) 55%,#fff);
  animation:ants 1.2s linear infinite paused}
.seat:hover .seat__empty{animation-play-state:running}
.seat__empty p{margin:0;color:var(--muted);font-size:.92rem}
.seat__empty p strong{display:block;font:600 1.1rem var(--serif);color:var(--c1)}
.seat__empty .btn{background:var(--c1);border-color:var(--c1)}
.chair{position:relative;width:76px;height:76px;display:grid;place-items:center}
.chair span{font-size:2.6rem;filter:grayscale(.2);animation:float 4s ease-in-out infinite}
.chair::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c2) 35%,transparent),transparent 70%);animation:breathe 4s ease-in-out infinite}
.chair::after{content:"";position:absolute;bottom:2px;left:50%;width:44px;height:8px;margin-left:-22px;border-radius:50%;background:rgba(0,0,0,.12);animation:shadowpulse 4s ease-in-out infinite}
.seat:hover .chair span{animation:wiggle .6s var(--ease)}

/* candidates */
.cand{display:grid;grid-template-columns:84px 1fr;gap:1rem;align-items:center;text-decoration:none;color:inherit}
.cand h3{margin:0 0 .15rem;font-size:1.15rem}
.avatar{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--gold-l);transition:transform .4s var(--ease),border-color .4s}
.cand:hover .avatar{transform:scale(1.07);border-color:var(--gold)}
.avatar--blank{display:grid;place-items:center;background:var(--sage);color:var(--green);font:600 1.5rem var(--serif)}
.avatar--sm{width:44px;height:44px;border-width:2px;font-size:1rem}
.avatar--xl{width:180px;height:180px;border-width:4px;font-size:3rem;box-shadow:0 0 0 8px rgba(255,255,255,.12)}

/* image features (home + pages) */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.feature--rev .feature__media{order:2}
@media(max-width:860px){.feature{grid-template-columns:1fr;gap:2.4rem}.feature--rev .feature__media{order:0}}
.feature__media{position:relative;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,58px);gap:14px}
.feature__media .ph{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg)}
.feature__media .ph:nth-child(1){grid-column:1/5;grid-row:1/6}
.feature__media .ph:nth-child(2){grid-column:4/7;grid-row:3/7;border:6px solid var(--ivory)}
.feature__media .badge-float{position:absolute;left:-10px;bottom:10px;z-index:2;background:#fff;border-radius:16px;padding:.9rem 1.1rem;box-shadow:var(--shadow-lg);display:flex;gap:.8rem;align-items:center;animation:float 6s ease-in-out infinite}
.badge-float b{display:block;font:700 1.6rem/1 var(--serif);color:var(--green-d)} .badge-float span{font-size:.85rem;color:var(--muted)}
.badge-float i{font-style:normal;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--grad-gold);font-size:1.3rem}
.ph{position:relative;overflow:hidden;background:var(--sage)}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s}
.ph:hover img{transform:scale(1.08)}
.checks{list-style:none;padding:0;margin:1.2rem 0 1.6rem;display:grid;gap:.7rem}
.checks li{display:flex;gap:.8rem;align-items:flex-start}
.checks li::before{content:"✓";flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--sage);color:var(--green);font-weight:800;font-size:.85rem;margin-top:.1rem}

/* stats band */
.counters{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:-3.5rem;position:relative;z-index:3}
.counter{background:#fff;border-radius:var(--r);padding:1.5rem 1.4rem;box-shadow:var(--shadow-lg);border:1px solid var(--line);text-align:center;transition:transform .4s var(--ease)}
.counter:hover{transform:translateY(-6px)}
.counter b{display:block;font:700 clamp(2rem,4vw,2.8rem)/1 var(--serif);background:var(--grad-green);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:.35rem}
.counter span{color:var(--muted);font-size:.92rem;font-weight:500}
@media(max-width:800px){.counters{grid-template-columns:repeat(2,1fr);margin-top:-2.5rem}}

/* how-to-vote cards on green */
.vstep{position:relative;padding:1.8rem 1.5rem 1.4rem;border-radius:var(--r);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(8px);transition:transform .4s var(--ease),background .4s,border-color .4s}
.vstep:hover{transform:translateY(-8px);background:rgba(255,255,255,.12);border-color:rgba(247,220,146,.5)}
.vstep__n{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--grad-gold);color:#2a1a02;font:700 1.25rem var(--serif);margin-bottom:1rem;box-shadow:0 10px 20px -8px rgba(232,104,74,.7)}
.vstep p{color:#D3E3D8;margin:0}

/* parallax quote band */
.quote-band{position:relative;overflow:hidden;isolation:isolate;padding:7rem 0;color:#fff;text-align:center}
.quote-band__bg{position:absolute;inset:-20% 0;z-index:-2;background-size:cover;background-position:center;transform:translate3d(0,var(--py,0),0)}
.quote-band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,41,28,.82),rgba(8,41,28,.7)),radial-gradient(600px 300px at 50% 50%,rgba(227,166,47,.25),transparent 70%)}
.quote-band blockquote{margin:0 auto;max-width:30ch;font:500 italic clamp(1.6rem,3.6vw,2.6rem)/1.3 var(--serif)}
.quote-band blockquote::before{content:"“";display:block;font-size:5rem;line-height:.6;background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:.4rem}
.quote-band cite{display:block;margin-top:1.2rem;font:600 .9rem var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--gold-l);font-style:normal}

/* gallery marquee */
.gallery{overflow:hidden;padding:0 0 1rem;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.gallery__track{display:flex;gap:18px;width:max-content;animation:marquee 45s linear infinite}
.gallery:hover .gallery__track{animation-play-state:paused}
.gallery .ph{width:300px;height:210px;border-radius:18px;flex:none;box-shadow:var(--shadow)}
.gallery .ph:nth-child(even){transform:translateY(22px)}

/* forms */
.form{display:grid;gap:1.1rem}
.field label{display:block;font-weight:600;margin-bottom:.3rem;font-size:.95rem}
.field .hint{font-size:.85rem;color:var(--muted);margin-top:.25rem}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=date],input[type=datetime-local],input[type=number],input[type=url],input[type=file],select,textarea{
  width:100%;padding:.8rem 1rem;border:1.5px solid #D3CCB8;border-radius:12px;background:#fff;font:1rem var(--sans);color:var(--ink);transition:border-color .2s,box-shadow .2s}
input:hover,select:hover,textarea:hover{border-color:#B9B19A}
textarea{min-height:120px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--green-l);box-shadow:0 0 0 4px rgba(31,157,102,.18)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem} @media(max-width:620px){.row2{grid-template-columns:1fr}}
.check{display:flex;gap:.7rem;align-items:flex-start;font-weight:400} .check input{margin-top:.35rem;width:1.1rem;height:1.1rem;accent-color:var(--green)}
.auth-box{max-width:520px;margin:3rem auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:2.2rem;box-shadow:var(--shadow-lg);animation:fadeup .7s var(--ease) both}
fieldset{border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.2rem 1.2rem;margin:0}
legend{font:600 1.05rem var(--serif);padding:0 .5rem;color:var(--green)}

/* calendar + countdown */
.cal{display:grid;grid-template-columns:minmax(300px,.9fr) 1.1fr;gap:1.6rem;align-items:stretch}
.cal:not(:has(.countdown)){grid-template-columns:1fr}
.countdown{position:relative;overflow:hidden;isolation:isolate;padding:2rem;border-radius:24px;background:var(--grad-green);color:#EAF2EC;box-shadow:var(--shadow-lg)}
.countdown::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(400px 220px at 100% 0%,rgba(227,166,47,.35),transparent 70%)}
.countdown .eyebrow{color:var(--gold-l)}
.countdown h3{color:#fff;font-size:1.6rem;margin-bottom:.2rem}
.countdown p{color:#CFE2D5;margin-bottom:1.4rem}
.countdown__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.countdown__grid div{text-align:center;padding:.8rem .3rem;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.countdown__grid b{display:block;font:700 clamp(1.6rem,3.4vw,2.3rem)/1 var(--serif);color:#fff;font-variant-numeric:tabular-nums}
.countdown__grid b.tick{animation:tickpop .4s var(--ease)}
.countdown__grid span{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-l)}
.cal__list{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;grid-template-columns:1fr 1fr}
.cal__item{display:flex;gap:1rem;align-items:center;padding:1rem 1.1rem;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s}
.cal__item:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.cal__day{flex:none;display:grid;place-items:center;width:64px;height:68px;border-radius:14px;background:var(--grad-green);color:#fff;text-align:center;line-height:1}
.cal__day b{font:700 1.7rem var(--serif)} .cal__day small{font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-l)}
.cal__txt strong{display:block;font-size:1rem;color:var(--green-d)} .cal__txt small{color:var(--muted)}
.cal__item.is-tbd .cal__day{background:repeating-linear-gradient(135deg,var(--cream) 0 8px,#fff 8px 16px);color:var(--muted);border:1.5px dashed var(--line)}
.cal__item.is-tbd .cal__day small{color:var(--muted)}
.cal__item.is-tbd .cal__txt small{display:inline-block;margin-top:.2rem;padding:.1rem .6rem;border-radius:999px;background:#FDEDC2;color:#80570a;font-weight:700;font-size:.78rem}
.cal__item.is-past{opacity:.6}
.cal__item.is-next{border-color:var(--gold);box-shadow:0 0 0 3px rgba(227,166,47,.2),var(--shadow)}
.cal__item.is-next .cal__day{background:var(--grad-gold);color:#2a1a02}.cal__item.is-next .cal__day small{color:#5b3a05}
@media(max-width:900px){.cal{grid-template-columns:1fr}}
@media(max-width:560px){.cal__list{grid-template-columns:1fr}}

/* admin: branding upload previews */
.brand-up{display:grid;gap:.8rem;align-content:start}
.brand-up__prev{display:flex;align-items:center;justify-content:center;gap:.6rem;height:110px;border-radius:14px;border:1.5px dashed var(--line);background:repeating-conic-gradient(#f3efe4 0 25%,#fff 0 50%) 0 0/18px 18px}
.brand-up__prev img{max-height:80px;max-width:80%;object-fit:contain}
.brand-up__prev--fav{justify-content:flex-start;padding:0 1rem;background:#E8E4D8}
.brand-up__prev--fav img{width:32px;height:32px}
.brand-up__tab{padding:.45rem .9rem;border-radius:10px 10px 0 0;background:#fff;font-size:.85rem;align-self:flex-end;margin-bottom:-1px}
.brand-up__prev--fav>img,.brand-up__prev--fav>.brand__mark{order:0}
fieldset.card legend{font-size:1.15rem}

/* registration: split screen + wizard */
.join{display:grid;grid-template-columns:minmax(320px,.85fr) 1.15fr;min-height:calc(100vh - 74px)}
.join__aside{position:relative;overflow:hidden;isolation:isolate;color:#EAF2EC}
.join__aside::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--bg) center/cover;animation:kenburns 30s ease-in-out infinite alternate}
.join__aside::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(500px 300px at 100% 0%,rgba(227,166,47,.35),transparent 70%),linear-gradient(160deg,rgba(8,41,28,.93),rgba(15,107,69,.85))}
.join__aside-in{position:sticky;top:74px;display:flex;flex-direction:column;gap:2.4rem;padding:3rem clamp(1.5rem,4vw,3.5rem);min-height:calc(100vh - 74px)}
.join__aside .brand{color:#fff}.join__aside .brand__mark{box-shadow:0 0 0 3px rgba(8,41,28,.8),0 0 0 5px var(--gold)}
.join__aside h1{color:#fff;font-size:clamp(2rem,3.6vw,3rem);animation:fadeup .8s var(--ease) both}
.join__aside p{color:#CFE2D5}
.join__aside .eyebrow{color:var(--gold-l)}
.journey{list-style:none;margin:0;padding:0;display:grid;gap:0}
.journey li{position:relative;display:grid;grid-template-columns:44px 1fr;gap:1rem;padding-bottom:1.5rem;animation:fadeup .7s var(--ease) both}
.journey li:nth-child(2){animation-delay:.15s}.journey li:nth-child(3){animation-delay:.3s}
.journey li:not(:last-child)::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:linear-gradient(rgba(247,220,146,.6),rgba(255,255,255,.12))}
.journey b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font:700 1.05rem var(--serif);background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.25)}
.journey .is-now b{background:var(--grad-gold);color:#2a1a02;border-color:transparent;animation:pulse 2.4s ease-in-out infinite}
.journey strong{display:block;color:#fff;font-size:1.05rem}.journey span{font-size:.9rem;color:#B9D2C2}
.join__note{margin-top:auto;padding:.9rem 1.1rem;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);font-size:.9rem;backdrop-filter:blur(6px)}
.join__main{padding:3rem clamp(1.25rem,5vw,4.5rem) 4rem;max-width:760px;width:100%}
.join__login{margin:1.6rem 0 0;color:var(--muted)}
@media(max-width:900px){
  .join{grid-template-columns:1fr}
  .join__aside-in{position:static;min-height:0;gap:1.4rem;padding:2rem 1.25rem}
  .join__aside .brand,.join__note{display:none}
  .journey{grid-template-columns:repeat(3,1fr);gap:.6rem}.journey li{grid-template-columns:1fr;justify-items:center;text-align:center;padding:0;gap:.4rem}
  .journey li::before{display:none}.journey span{display:none}
  .join__main{padding:2rem 1.25rem 3rem}
}

.stepper{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;margin-bottom:2rem;padding-bottom:1rem}
.stepper::after,.stepper__bar{content:"";position:absolute;left:0;bottom:0;height:4px;border-radius:4px}
.stepper::after{right:0;background:var(--line)}
.stepper__bar{z-index:1;width:calc((var(--step,0) + 1) * 25%);background:var(--grad-gold);transition:width .6s var(--ease)}
.stepper__b{display:flex;align-items:center;gap:.6rem;padding:.3rem;border:0;background:none;font:600 .9rem var(--sans);color:var(--muted);cursor:pointer;text-align:left}
.stepper__b b{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;border:2px solid var(--line);font:700 .95rem var(--serif);transition:all .4s var(--ease)}
.stepper__b.is-on{color:var(--green-d)}.stepper__b.is-on b{background:var(--grad-gold);border-color:transparent;color:#2a1a02;transform:scale(1.12);box-shadow:0 8px 16px -6px rgba(232,104,74,.6)}
.stepper__b.is-done b{background:var(--green);border-color:var(--green);color:transparent;position:relative}
.stepper__b.is-done b::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff}
.stepper{display:none}.js .stepper{display:grid}
@media(max-width:560px){.stepper__b span{display:none}.stepper__b{justify-content:center}}

.wstep{border:0;padding:0;margin:0 0 1.6rem;display:grid;gap:1rem;min-width:0}
.wstep legend{padding:0;margin-bottom:1.2rem;font:600 clamp(1.5rem,3vw,2rem)/1.2 var(--serif);color:var(--green-d)}
.wstep legend span{display:block;font:700 .75rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:.3rem}
.js .wizard .wstep{display:none}
.js .wizard .wstep.is-on{display:grid;animation:stepin .5s var(--ease) both}
.js .wizard[data-dir=back] .wstep.is-on{animation-name:stepback}
.wizard__nav{display:flex;gap:.8rem;justify-content:space-between;align-items:center;margin-top:1.4rem}
.wizard__nav [data-prev],.wizard__nav [data-next]{display:none}
.js .wizard__nav [data-next]{display:inline-flex;margin-left:auto}
.js .wizard__nav [data-prev]{display:inline-flex;visibility:hidden}
.js .wizard:not([data-step="0"]) [data-prev]{visibility:visible}
.js .wizard:not([data-step="3"]) [data-submit]{display:none}
.js .wizard[data-step="3"] [data-next]{display:none}
.js .wizard[data-step="3"] [data-submit]{margin-left:auto}

.fl{position:relative}
.fl input{padding:1.45rem 1rem .5rem;height:58px}
.fl label{position:absolute;left:1.05rem;top:1.05rem;font-size:1rem;color:var(--muted);pointer-events:none;transform-origin:0 0;transition:transform .25s var(--ease),color .25s,top .25s var(--ease)}
.fl input:focus+label,.fl input:not(:placeholder-shown)+label,.fl--fixed label{top:.5rem;transform:scale(.78);color:var(--green);font-weight:600}
.fl input.touched:invalid{border-color:var(--red);background:#FFF8F6}
.fl input.touched:invalid+label{color:var(--red)}
.fl input.touched:valid:not(:placeholder-shown){border-color:var(--green-l)}
.fl--pw input{padding-right:3rem}
.eye{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:50%;background:transparent;cursor:pointer;font-size:1.05rem;opacity:.55;transition:opacity .2s,background .2s}
.eye:hover,.eye.on{opacity:1;background:var(--sage)}

.drop{position:relative;display:grid;justify-items:center;text-align:center;gap:.35rem;padding:1.6rem 1rem 1.3rem;border:2px dashed #CFC6AE;border-radius:18px;background:#fff;cursor:pointer;transition:border-color .3s,background .3s,transform .3s var(--ease),box-shadow .3s}
.drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;padding:0;border:0}
.drop:hover,.drop.is-over{border-color:var(--gold);background:#FFFBF0;transform:translateY(-3px);box-shadow:var(--shadow)}
.drop.is-over{transform:scale(1.02)}
.drop:focus-within{outline:3px solid var(--gold);outline-offset:2px}
.drop__ico{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--sage) center/cover;font-size:1.6rem;margin-bottom:.3rem;transition:transform .4s var(--ease)}
.drop:hover .drop__ico{transform:translateY(-4px) rotate(-6deg)}
.drop strong{color:var(--green-d)}
.drop__name{font-size:.9rem;color:var(--green);font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drop small{color:var(--muted);font-size:.8rem;line-height:1.4}
.drop.has-file{border-style:solid;border-color:var(--green-l);background:var(--sage)}
.drop.has-file .drop__ico{background-color:#fff;box-shadow:0 0 0 3px var(--green-l)}
.drop.has-img .drop__ico{font-size:0}

.pwmeter{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;font-size:.85rem;color:var(--muted)}
.pwmeter__bar{flex:1 1 100%;height:6px;border-radius:6px;background:var(--line);overflow:hidden}
.pwmeter__bar i{display:block;height:100%;width:calc(var(--s,0) * 25%);background:var(--sc,var(--red));border-radius:6px;transition:width .4s var(--ease),background .4s}
.pwmeter__match{margin-left:auto;font-weight:700}
.pwmeter__match.ok{color:var(--green-l)}.pwmeter__match.no{color:var(--red)}

.toggle{display:flex;align-items:center;gap:.9rem;padding:1rem 1.1rem;border:1.5px solid var(--line);border-radius:16px;background:#fff;cursor:pointer;transition:border-color .3s,background .3s}
.toggle input{position:absolute;opacity:0;width:1px;height:1px}
.toggle__sw{flex:none;position:relative;width:50px;height:28px;border-radius:999px;background:#D6D0BF;transition:background .3s}
.toggle__sw::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:transform .35s var(--ease)}
.toggle input:checked+.toggle__sw{background:var(--green-l)}
.toggle input:checked+.toggle__sw::after{transform:translateX(22px)}
.toggle:has(input:checked){border-color:var(--green-l);background:var(--sage)}
.toggle input:focus-visible+.toggle__sw{outline:3px solid var(--gold);outline-offset:2px}
.toggle input.touched:invalid+.toggle__sw{box-shadow:0 0 0 2px var(--red)}

/* alerts, badges */
.alert{padding:.95rem 1.15rem;border-radius:12px;border:1px solid;margin:0 0 1.2rem;font-weight:500;animation:fadeup .5s var(--ease) both}
.alert--ok{background:#E3F6EB;border-color:#94D3AF;color:#124b2b}
.alert--err{background:#FCE8E4;border-color:#EBA597;color:#7a241a}
.alert--info{background:#FFF5D9;border-color:#EBCB79;color:#5b4308}
.badge{display:inline-block;padding:.18rem .7rem;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}
.badge--green{background:#D9F2E3;color:#13613a} .badge--amber{background:#FDEDC2;color:#80570a}
.badge--red{background:#F9DCD6;color:#8b2a1f} .badge--grey{background:#ECE9E0;color:#555}

/* vote status banner */
.banner{position:relative;overflow:hidden;display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;border-radius:20px;padding:1.6rem 1.9rem;box-shadow:var(--shadow)}
.banner--lock{background:linear-gradient(120deg,#fff 0%,var(--cream) 100%);border:1px solid var(--line)}
.banner--lock::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--grad-gold)}
.banner--open{background:var(--grad-green);color:#fff}.banner--open h3{color:#fff;margin:0}
.banner--open::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.12) 50%,transparent 60%);animation:sweep 4s ease-in-out infinite}
.banner h3{margin:0 0 .2rem}.banner p{margin:0}

/* voting */
.vote-shell{max-width:620px;margin:0 auto;padding:1.5rem 0 4rem}
.progress{height:8px;background:var(--line);border-radius:4px;overflow:hidden;margin:.6rem 0 1.6rem}
.progress>i{display:block;height:100%;background:var(--grad-gold);transition:width .6s var(--ease)}
.choice{display:block;position:relative;margin-bottom:.8rem}
.choice input{position:absolute;opacity:0}
.choice__box{display:flex;gap:1rem;align-items:center;border:2px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;background:#fff;cursor:pointer;transition:border-color .2s,background .2s,transform .2s var(--ease),box-shadow .2s}
.choice__box:hover{border-color:var(--green-l);transform:translateY(-2px);box-shadow:var(--shadow)}
.choice input:checked+.choice__box{border-color:var(--green);background:var(--sage);box-shadow:0 0 0 4px rgba(31,157,102,.15)}
.choice input:focus-visible+.choice__box{outline:3px solid var(--gold);outline-offset:2px}
.choice__radio{width:24px;height:24px;border-radius:50%;border:2px solid #9a9684;flex:none;display:grid;place-items:center}
.choice input:checked+.choice__box .choice__radio{border-color:var(--green)}
.choice input:checked+.choice__box .choice__radio::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--green);animation:tick .3s var(--ease)}
.choice__name{font-weight:700;font-size:1.05rem}
.choice__box small{color:var(--muted);display:block}
.recap li{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line)}
.recap{list-style:none;padding:0;margin:0 0 1.2rem}
.recap span:first-child{color:var(--muted)} .recap span:last-child{font-weight:700;text-align:right}
.receipt{border:2px dashed var(--gold);background:#fff;padding:1.6rem;text-align:center;border-radius:var(--r);animation:fadeup .6s var(--ease) both}
.receipt__ref{font:700 1.9rem var(--serif);letter-spacing:.05em;color:var(--green-d);margin:.3rem 0 1rem}

/* results */
.result{margin-bottom:2rem}
.bar-row{display:grid;grid-template-columns:minmax(120px,220px) 1fr 80px;gap:1rem;align-items:center;margin:.5rem 0}
.bar{height:16px;background:var(--cream);border-radius:8px;overflow:hidden}.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--green-l));border-radius:8px;transform-origin:left;animation:barin 1.2s var(--ease) both}
.bar-row.win .bar>i{background:var(--grad-gold)} .bar-row.win strong{color:var(--green-d)}
.bar-row span:last-child{text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:560px){.bar-row{grid-template-columns:1fr 70px}.bar-row .bar{grid-column:1/-1;grid-row:2}}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{padding:.75rem .95rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--cream);font-weight:700;font-size:.85rem;white-space:nowrap}
tbody tr{transition:background .2s} tbody tr:hover{background:#FCFAF4}
tr:last-child td{border-bottom:0}
td .btn{margin:.1rem .1rem .1rem 0}
.actions{display:flex;flex-wrap:wrap;gap:.4rem}
.actions form{margin:0}

/* app shell (member + admin) */
.app{background:#F3F1EA;background-image:radial-gradient(900px 500px at 100% -10%,rgba(227,166,47,.10),transparent 60%),radial-gradient(800px 500px at 0% 110%,rgba(18,176,122,.08),transparent 60%);background-attachment:fixed}
.shell{display:grid;grid-template-columns:272px 1fr;min-height:100vh}
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:1.2rem .9rem 1rem;color:#CFE2D5;background:linear-gradient(180deg,#08291C 0%,#0B3a27 55%,#0F4F35 100%);overflow:hidden;isolation:isolate}
.side::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(300px 200px at 100% 0%,rgba(227,166,47,.22),transparent 70%),radial-gradient(260px 220px at 0% 100%,rgba(18,176,122,.25),transparent 70%)}
.side .brand{color:#fff;margin:.2rem .5rem 1.2rem}
.side .brand__mark{box-shadow:0 0 0 3px #08291C,0 0 0 5px var(--gold)}
.side .brand__name em{font:700 .62rem var(--sans);font-style:normal;letter-spacing:.12em;text-transform:uppercase;vertical-align:middle;margin-left:.3rem;padding:.2rem .45rem;border-radius:6px;background:var(--grad-gold);color:#2a1a02}
.side .links{flex:1;overflow-y:auto;margin:0 -.3rem;padding:0 .3rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.side h4{font:700 .68rem var(--sans);color:#86AD97;margin:1.2rem .7rem .4rem;letter-spacing:.12em;text-transform:uppercase}
.side a{position:relative;display:flex;align-items:center;gap:.7rem;color:#DDE9E1;text-decoration:none;padding:.55rem .7rem;margin:1px 0;border-radius:12px;font-size:.93rem;transition:background .25s,color .25s,transform .25s var(--ease)}
.side a i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;font-style:normal;font-size:.95rem;background:rgba(255,255,255,.06);transition:background .25s,transform .35s var(--ease)}
.side a span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(3px)}
.side a:hover i{transform:scale(1.1) rotate(-6deg)}
.side a[aria-current=page]{background:linear-gradient(90deg,rgba(247,220,146,.18),rgba(247,220,146,.04));color:#fff;font-weight:700}
.side a[aria-current=page]::before{content:"";position:absolute;left:-.9rem;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:var(--grad-gold)}
.side a[aria-current=page] i{background:var(--grad-gold);box-shadow:0 6px 14px -6px rgba(232,104,74,.7)}
.side__count{flex:none;min-width:22px;height:22px;padding:0 .4rem;border-radius:999px;display:grid;place-items:center;font-size:.72rem;background:var(--coral);color:#fff;box-shadow:0 0 0 3px rgba(232,104,74,.2);animation:pulse 2.4s ease-in-out infinite}
.side__me{display:flex;align-items:center;gap:.7rem;margin-top:.8rem;padding:.7rem;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.side__me strong{display:block;color:#fff;font-size:.88rem;line-height:1.2}.side__me small{color:#9DC0AB;font-size:.76rem}
.side__av,.me-chip{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font:700 .85rem var(--sans);background:var(--grad-gold);color:#2a1a02}
.main{padding:0 clamp(1rem,3vw,2.4rem) 4rem;min-width:0}
.main>*:not(.main__top){animation:fadeup .55s var(--ease) both}
.main>*:nth-child(3){animation-delay:.05s}.main>*:nth-child(4){animation-delay:.1s}.main>*:nth-child(5){animation-delay:.15s}.main>*:nth-child(6){animation-delay:.2s}
.main__top{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap;margin:0 calc(-1 * clamp(1rem,3vw,2.4rem)) 1.6rem;padding:1.1rem clamp(1rem,3vw,2.4rem);background:rgba(243,241,234,.82);backdrop-filter:saturate(1.5) blur(12px);-webkit-backdrop-filter:saturate(1.5) blur(12px);border-bottom:1px solid rgba(0,0,0,.05)}
.crumb{display:block;font-size:.76rem;font-weight:600;letter-spacing:.06em;color:var(--amber);text-transform:uppercase;margin-bottom:.15rem}
.main h1{font-size:clamp(1.5rem,2.6vw,2rem);margin:0}
.main__tools{display:flex;align-items:center;gap:.6rem}
.chip-date{padding:.4rem .8rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:.82rem;color:var(--muted);white-space:nowrap}
.menu-toggle{display:none}
@media(max-width:900px){
  .shell{grid-template-columns:1fr}
  .side{position:sticky;top:0;z-index:30;height:auto;padding:.7rem 1rem;overflow:visible}
  .side .links,.side__me{display:none}
  .menu-toggle{display:grid;place-items:center;width:42px;height:42px;background:rgba(255,255,255,.12);color:#fff;border:0;border-radius:12px;font-size:1.2rem;cursor:pointer}
  .side-head{display:flex;justify-content:space-between;align-items:center}
  .side .brand{margin:0}
  .side.open .links{display:block;max-height:70vh;margin-top:.6rem;animation:fadeup .35s var(--ease)}
  .main__top{position:static}
  .chip-date{display:none}
}

/* app: welcome banner + ring */
.welcome{position:relative;overflow:hidden;isolation:isolate;display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:2rem 2.2rem;margin-bottom:1.4rem;border-radius:26px;background:var(--grad-green);color:#E4EFE8;box-shadow:var(--shadow-lg)}
.welcome::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(500px 260px at 100% 0%,rgba(227,166,47,.35),transparent 70%),radial-gradient(400px 260px at 0% 100%,rgba(18,176,122,.35),transparent 70%)}
.welcome::after{content:"✝";position:absolute;right:190px;bottom:-40px;z-index:-1;font-size:11rem;line-height:1;color:rgba(255,255,255,.04)}
.welcome h2{color:#fff;font-size:clamp(1.5rem,3vw,2.1rem);margin:.2rem 0 .4rem}
.welcome p{color:#CFE2D5;margin:0}
.welcome .eyebrow{color:var(--gold-l);margin-bottom:.3rem}
.welcome__cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.welcome .btn--ghost{color:#fff;border-color:rgba(255,255,255,.5)}.welcome .btn--ghost:hover{background:#fff;color:var(--green-d)}
.ring{--pv:0;flex:none;position:relative;width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#F7DC92,#E3A62F calc(var(--pv)*1%),rgba(255,255,255,.12) 0);animation:ringfill 1.6s var(--ease) .2s forwards}
.ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:#0A3323;box-shadow:inset 0 0 18px rgba(0,0,0,.35)}
.ring>div{position:relative;text-align:center;line-height:1}
.ring b{font:700 2.4rem var(--serif);color:#fff}.ring b small{font-size:1rem;color:var(--gold-l)}
.ring span{display:block;margin-top:.3rem;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#9DC0AB}
@media(max-width:640px){.welcome{flex-direction:column;align-items:flex-start;padding:1.6rem}.welcome::after{display:none}}

/* app: stat tiles (also used on monitor/attendance/results) */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.6rem}
.stat{--c1:#0F6B45;--c2:#12B07A;--tint:#E3F4EA;position:relative;overflow:hidden;isolation:isolate;background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:1.3rem 1.4rem;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s}
.stats>.stat:nth-child(4n+2),.stat--violet{--c1:#4B2E9A;--c2:#8B6CF0;--tint:#EEE9FC}
.stats>.stat:nth-child(4n+3),.stat--coral{--c1:#C24A2C;--c2:#F2946B;--tint:#FDECE5}
.stats>.stat:nth-child(4n+4),.stat--gold{--c1:#A86A05;--c2:#F0B840;--tint:#FDF3D9}
.stat--green{--c1:#0F6B45;--c2:#12B07A;--tint:#E3F4EA}
.stat::before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;z-index:-1;background:radial-gradient(circle,var(--tint),transparent 70%);transition:transform .6s var(--ease)}
.stat::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--c1),var(--c2));transform:scaleX(.3);transform-origin:left;transition:transform .5s var(--ease)}
.stat:hover{transform:translateY(-5px);box-shadow:0 24px 44px -24px color-mix(in srgb,var(--c1) 55%,transparent)}
.stat:hover::before{transform:scale(1.5)}.stat:hover::after{transform:scaleX(1)}
.stat i{display:grid;place-items:center;width:44px;height:44px;margin-bottom:.8rem;border-radius:13px;font-style:normal;font-size:1.25rem;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 18px -8px var(--c1)}
.stat b{display:block;font:700 2.2rem/1.05 var(--serif);color:var(--c1)}
.stat b small{font-size:1.1rem;color:var(--muted);font-weight:600}
.stat span{color:var(--muted);font-size:.88rem;font-weight:500}

/* app: dashboard blocks */
.dash{display:grid;grid-template-columns:1.2fr 1fr;gap:1.2rem;margin-bottom:1.6rem}
@media(max-width:1000px){.dash{grid-template-columns:1fr}}
.todo{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.todo li{display:flex;align-items:center;gap:.8rem;padding:.75rem .9rem;border-radius:14px;background:#FBFAF6;border:1px solid var(--line);transition:transform .3s var(--ease),border-color .3s,background .3s}
.todo li:hover{transform:translateX(4px);border-color:var(--gold-l);background:#FFFCF3}
.todo i{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;font-style:normal;background:var(--cream)}
.todo span{flex:1;font-size:.93rem;font-weight:500}
.meter{display:grid;grid-template-columns:auto 1fr auto;gap:.8rem;align-items:center;margin-top:1.2rem;font-size:.88rem;color:var(--muted)}
.meter b{color:var(--green-d)}
.dash__title{font-size:1.15rem;margin:0 0 .8rem}
.quick{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.9rem}
.quick__i{--c1:#0F6B45;--c2:#12B07A;--tint:#E3F4EA;display:grid;justify-items:center;gap:.6rem;padding:1.3rem .8rem;border-radius:18px;background:#fff;border:1px solid rgba(0,0,0,.05);box-shadow:var(--shadow);text-decoration:none;color:var(--green-d);font-weight:600;font-size:.92rem;text-align:center;transition:transform .35s var(--ease),box-shadow .35s,background .35s}
.quick__i--violet{--c1:#4B2E9A;--c2:#8B6CF0;--tint:#EEE9FC}.quick__i--coral{--c1:#C24A2C;--c2:#F2946B;--tint:#FDECE5}.quick__i--gold{--c1:#A86A05;--c2:#F0B840;--tint:#FDF3D9}
.quick__i i{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;font-style:normal;font-size:1.45rem;background:var(--tint);transition:transform .4s var(--ease),background .4s}
.quick__i:hover{transform:translateY(-6px);box-shadow:0 24px 40px -22px color-mix(in srgb,var(--c1) 60%,transparent);background:linear-gradient(180deg,#fff,var(--tint))}
.quick__i:hover i{transform:rotate(-8deg) scale(1.1);background:linear-gradient(135deg,var(--c1),var(--c2))}

/* app: cards, tables, forms, buttons inside the shell */
.app .card{border-radius:20px;border:1px solid rgba(0,0,0,.05);box-shadow:var(--shadow);padding:1.5rem 1.6rem}
.app .card>h3:first-child{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;padding-bottom:.8rem;margin-bottom:1rem;border-bottom:1px solid var(--line)}
.app .card>h3:first-child::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--grad-gold);box-shadow:0 0 0 4px rgba(227,166,47,.18)}
.app .main>h2{display:flex;align-items:center;gap:.6rem}
.app .main>h2::before{content:"";width:6px;height:1.1em;border-radius:3px;background:var(--grad-gold)}
.app .table-wrap{border:1px solid rgba(0,0,0,.05);border-radius:20px;box-shadow:var(--shadow);background:#fff}
.app table{font-size:.92rem}
.app th{position:sticky;top:0;z-index:1;background:linear-gradient(180deg,#FBF8EF,#F5EFE1);color:#5b5f63;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;padding:.85rem 1rem;border-bottom:1px solid var(--line)}
.app td{padding:.9rem 1rem;border-bottom:1px solid #EFEBE0}
.app tbody tr{transition:background .2s,box-shadow .2s}
.app tbody tr:hover{background:#FFFCF4;box-shadow:inset 3px 0 0 var(--gold)}
.app td .avatar--sm{display:inline-grid;vertical-align:middle;margin-right:.5rem}
.app td small{color:var(--muted)}
.app fieldset{background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:1.4rem 1.5rem 1.5rem;box-shadow:var(--shadow);position:relative}
.app fieldset legend{float:left;width:100%;display:flex;align-items:center;gap:.6rem;padding:0 0 .8rem;margin-bottom:1rem;border-bottom:1px solid var(--line);font:600 1.1rem var(--serif);color:var(--green-d)}
.app fieldset legend+*{clear:both}
.app fieldset legend::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--grad-gold);box-shadow:0 0 0 4px rgba(227,166,47,.18)}
.app .field label{font-size:.86rem;color:#41464b}
.app input[type=text],.app input[type=email],.app input[type=password],.app input[type=tel],.app input[type=date],.app input[type=datetime-local],.app input[type=number],.app input[type=url],.app select,.app textarea,.app input:not([type]){background:#FCFBF8;border-color:#DDD6C4}
.app input[type=file]{padding:.6rem;background:#FCFBF8;border:1.5px dashed #CFC6AE;cursor:pointer}
.app input[type=file]::file-selector-button{margin-right:.8rem;padding:.45rem .9rem;border:0;border-radius:999px;background:var(--green);color:#fff;font:600 .85rem var(--sans);cursor:pointer;transition:background .2s}
.app input[type=file]::file-selector-button:hover{background:var(--green-d)}
.app input:focus,.app select:focus,.app textarea:focus{background:#fff}
.app .btn--sm{padding:.42rem .95rem;font-size:.85rem}
.app .actions .btn--sm{padding:.36rem .8rem}
.app .badge{display:inline-flex;align-items:center;gap:.35rem;padding:.22rem .7rem .22rem .55rem}
.app .badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
.app .alert{display:flex;gap:.7rem;align-items:center;border-radius:14px;box-shadow:var(--shadow)}
.app .alert::before{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-weight:800;font-size:.85rem;color:#fff}
.app .alert--ok::before{content:"✓";background:#1F9D66}.app .alert--err::before{content:"!";background:var(--red)}.app .alert--info::before{content:"i";background:var(--amber)}
.app .empty{border-radius:18px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.7) 0 12px,rgba(245,239,225,.6) 12px 24px)}
.app .kv{grid-template-columns:120px 1fr;gap:.6rem 1rem}
.app .kv dt{font-size:.86rem}
.app .hbars .bar,.app .meter .bar{height:10px;background:#EEE9DC}
.app .hbars .bar>i,.app .meter .bar>i{background:linear-gradient(90deg,var(--green),var(--emerald))}
.app .main>form.actions,.app .main>p.actions{background:#fff;padding:.7rem;border-radius:16px;box-shadow:var(--shadow);border:1px solid rgba(0,0,0,.05)}
.hbars .r{display:grid;grid-template-columns:60px 1fr 40px;gap:.8rem;align-items:center;font-size:.9rem;margin:.3rem 0}
.hbars .bar{height:12px}
.app--member .main__tools .chip-date{display:none}

.quorum{display:flex;align-items:center;gap:.6rem;font-weight:700;padding:.8rem 1rem;border-radius:12px}
.quorum--ok{background:#D9F2E3;color:#13613a}.quorum--no{background:#FDEDC2;color:#80570a}
.kv{display:grid;grid-template-columns:150px 1fr;gap:.5rem 1rem}.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:600}
.empty{padding:2rem;text-align:center;color:var(--muted);border:1.5px dashed var(--line);border-radius:var(--r);background:rgba(255,255,255,.6)}

/* footer */
.footer{position:relative;overflow:hidden;isolation:isolate;background:var(--green-d);color:#B9CDBF;padding:4.5rem 0 2rem;margin-top:0}
.footer::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 300px at 100% 0%,rgba(227,166,47,.18),transparent 70%),radial-gradient(500px 300px at 0% 100%,rgba(18,176,122,.2),transparent 70%)}
.footer::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad-gold)}
.footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.footer h4{color:#fff;font:700 1rem var(--sans);margin-bottom:.8rem;letter-spacing:.04em}
.footer a{color:#DCE8DF;text-decoration:none;display:block;padding:.2rem 0;transition:color .2s,transform .25s var(--ease)}.footer a:hover{color:var(--gold-l);transform:translateX(4px)}
.footer .brand:hover{transform:none}
.footer .copy{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:1.4rem;font-size:.85rem}
@media(max-width:760px){.footer .wrap{grid-template-columns:1fr}}

/* back to top */
.to-top{position:fixed;right:20px;bottom:20px;z-index:50;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;background:var(--grad-gold);color:#2a1a02;font-size:1.3rem;font-weight:800;box-shadow:0 12px 24px -8px rgba(232,104,74,.6);opacity:0;transform:translateY(20px) scale(.8);pointer-events:none;transition:opacity .3s,transform .4s var(--ease)}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{transform:translateY(-4px)}

/* scroll reveal */
.js [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal=left]{transform:translateX(-40px)} .js [data-reveal=right]{transform:translateX(40px)} .js [data-reveal=zoom]{transform:scale(.92)}
.js [data-reveal].is-in{opacity:1;transform:none}
@media(max-width:860px){.js [data-reveal=left]:not(.is-in),.js [data-reveal=right]:not(.is-in){transform:translateY(34px)}}

/* keyframes */
@keyframes kenburns{from{scale:1}to{scale:1.12}}
@keyframes shimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes slipfloat{0%,100%{transform:rotate(2deg) translateY(0)}50%{transform:rotate(.5deg) translateY(-14px)}}
@keyframes rowin{to{opacity:1;transform:none}}
@keyframes tick{to{transform:rotate(40deg) scale(1)}}
@keyframes ping{75%,100%{transform:scale(2.4);opacity:0}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 6px rgba(227,166,47,.25)}50%{box-shadow:0 0 0 12px rgba(227,166,47,.08)}}
@keyframes fadeup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes grow{from{width:0}to{width:56px}}
@keyframes scrolldot{0%{opacity:0;transform:translateY(0)}40%{opacity:1}80%{opacity:0;transform:translateY(14px)}100%{opacity:0}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes sweep{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
@keyframes pop{from{opacity:0;transform:scale(.9) translateY(14px)}to{opacity:1;transform:none}}
@keyframes dlgin{from{opacity:0;transform:translateY(30px) scale(.96)}to{opacity:1;transform:none}}
@keyframes sheetin{from{transform:translateY(100%)}to{transform:none}}
@keyframes ringfill{to{--pv:var(--pct)}}
@keyframes tickpop{0%{transform:translateY(-30%);opacity:.3}100%{transform:none;opacity:1}}
@keyframes stepin{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
@keyframes stepback{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes ants{to{background-position:16px 0,-16px 100%,0 -16px,100% 16px,0 0}}
@keyframes breathe{0%,100%{transform:scale(.85);opacity:.6}50%{transform:scale(1.1);opacity:1}}
@keyframes shadowpulse{0%,100%{transform:scaleX(1);opacity:.6}50%{transform:scaleX(.7);opacity:.3}}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(10deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes barin{from{transform:scaleX(0)}to{transform:scaleX(1)}}

@media print{.topbar,.footer,.side,.no-print,.to-top,.scroll-progress{display:none!important}.shell{display:block}body{background:#fff}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js [data-reveal],.js .motto__w[data-reveal]{opacity:1;transform:none;filter:none}
  .slip__row{opacity:1;transform:none} .slip__row.on .slip__box::after{transform:rotate(40deg)}
}