:root{--dark:#0b1616;--dark2:#122320;--ivory:#f1ebda;--muted:#aab6ad;--lime:#cde9a2;--orange:#eba17b;--gold:#d5c397}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--dark);color:var(--ivory);font-family:'Kanit',sans-serif;font-weight:300;overflow-x:hidden}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}::selection{background:#dbe6aa;color:#0d201e}#grain{position:fixed;inset:0;pointer-events:none;z-index:70;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.24' filter='url(%23n)'/%3E%3C/svg%3E")}#weather{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:25;opacity:.75}.topline{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;justify-content:space-between;align-items:center;padding:27px 5.2%;mix-blend-mode:normal;transition:background .3s}.topline.scrolled{background:rgba(8,19,18,.86);backdrop-filter:blur(14px)}.brand{display:flex;gap:11px;align-items:center;font:700 12px/1.3 'DM Sans',sans-serif;letter-spacing:.19em}.brand em{display:block;font-style:normal;color:#b4bcae;font-size:10px;margin-top:5px}.brand-symbol{font-size:33px;font-weight:300;color:var(--lime)}.top-center,.chapter-count,.sound-label{font:600 10px 'DM Sans',sans-serif;letter-spacing:.26em;color:#dde4d9}.top-actions{display:flex;align-items:center;gap:30px}.icon-btn{background:none;border:0;color:var(--ivory);display:flex;align-items:center;gap:12px}.icon-btn #soundIcon{font-size:20px}.chapter-count{color:#b9cabc}.progress{position:fixed;z-index:65;height:2px;left:0;top:0;width:0;background:var(--lime);box-shadow:0 0 15px var(--lime)}.chapter-dots{position:fixed;z-index:55;right:33px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:19px}.chapter-dots a{width:7px;height:7px;border-radius:50%;background:#dce8d6;opacity:.35;transition:all .3s}.chapter-dots a.active{opacity:1;background:var(--lime);transform:scale(1.5);box-shadow:0 0 16px #cde9a2}.scene{position:relative;min-height:100vh;overflow:hidden}.hero{display:flex;align-items:center;padding:105px 9%;min-height:860px;background:radial-gradient(ellipse at 76% 29%,#304e43 0%,#1b332e 22%,#122b2c 48%,#0b171b 80%)}.moon-glow{position:absolute;width:650px;height:650px;border-radius:50%;background:#a8c8af;filter:blur(115px);opacity:.16;right:4%;top:-10%}.moon{position:absolute;right:25%;top:15%;width:112px;height:112px;border-radius:50%;background:#e5e2c3;box-shadow:0 0 85px 32px #d9e4bd40,0 0 200px 80px #cde9b018}.mountains{position:absolute;bottom:0;left:0;width:100%;height:36%;background:#102523;clip-path:polygon(0 70%,16% 41%,28% 64%,48% 28%,64% 63%,78% 37%,100% 65%,100% 100%,0 100%)}.mountains.far{opacity:.62;bottom:7%;filter:blur(4px)}.mountains.near{background:#0b1b1b;opacity:.95;clip-path:polygon(0 63%,14% 57%,28% 69%,44% 52%,60% 70%,74% 56%,91% 63%,100% 51%,100% 100%,0 100%)}.stars{position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#fff 1px,transparent 1px);background-size:97px 87px,149px 177px;background-position:10px 20px,60px 47px;opacity:.15}.hero-tree{position:absolute;width:min(67vw,850px);right:-7%;bottom:-6%;z-index:2;filter:drop-shadow(0 0 32px #081513);transform-origin:bottom center;animation:treeSway 11s ease-in-out infinite alternate}.hero-tree svg{width:100%;height:auto}.tree-blooms{filter:drop-shadow(0 0 7px #d8d8b7);animation:flowerGlow 5s alternate infinite}.hero-content{position:relative;z-index:5;max-width:700px;margin-top:35px}.eyebrow,.small-index{font:600 11px/1.6 'DM Sans',sans-serif;letter-spacing:.26em;color:var(--lime);display:flex;align-items:center;gap:16px}.eyebrow-line,.dash{display:inline-block;width:32px;height:1px;background:var(--lime)}.hero-preface{font-size:20px;letter-spacing:.05em;color:#d9e1d0;margin:43px 0 5px}.hero h1{font-size:clamp(77px,8.6vw,155px);font-weight:500;line-height:1.2;letter-spacing:-.065em;margin:0;text-shadow:0 15px 30px #020c0a40}.serif-accent{color:var(--lime);font-family:'Noto Serif Thai',serif;font-style:italic;font-weight:300}.hero-caption{font-size:18px;line-height:2;color:#bbcabe;margin:21px 0 47px}.explore{display:flex;align-items:center;gap:18px;width:fit-content;font-size:14px;line-height:1.6}.explore small{font:600 9px 'DM Sans',sans-serif;letter-spacing:.2em;color:#9bb2aa}.explore-circle{border:1px solid #a4bbaa;width:55px;height:55px;border-radius:50%;display:grid;place-items:center;font:24px sans-serif;transition:background .2s,color .2s}.explore:hover .explore-circle{background:var(--lime);color:var(--dark)}.hero-year{position:absolute;left:5%;bottom:35px;font:500 10px 'DM Sans',sans-serif;letter-spacing:.23em;color:#a8baad}.side-caption{position:absolute;right:18px;top:50%;writing-mode:vertical-rl;font:500 10px 'DM Sans',sans-serif;letter-spacing:.27em;color:#a2b7ac}.reveal{transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.3,1);opacity:0;transform:translateY(36px)}.reveal.visible{opacity:1;transform:translateY(0)}.hero .reveal{opacity:1;transform:none}.memory{background:linear-gradient(140deg,#142c2a 0%,#1b302a 56%,#12211f 100%);padding:140px 7% 150px}.memory-atmosphere{position:absolute;width:90vw;height:70vw;top:0;left:-30%;border-radius:50%;background:#9f9f5f;opacity:.09;filter:blur(130px)}.chapter-inner{max-width:1250px;margin:auto;display:grid;grid-template-columns:.85fr 1.15fr;column-gap:6%;align-items:center}.chapter-header{align-self:start}.chapter-header h2{font-weight:500;font-size:clamp(56px,5.5vw,98px);letter-spacing:-.05em;line-height:1.3;margin:45px 0 23px}.chapter-header h2 em{font-family:'Noto Serif Thai',serif;font-weight:300;color:var(--lime)}.chapter-header p{color:#c2cfc4;font-size:18px;line-height:2.15;max-width:470px}.memory-frame{height:min(65vw,670px);min-height:440px;position:relative;border:12px solid #e1ddc71c;padding:10px;background:#0f211f;box-shadow:0 30px 90px #0005;transform:rotate(2deg)}.memory-frame.visible{transform:rotate(2deg)}.frame-image{position:relative;overflow:hidden;height:100%;background:linear-gradient(#324840,#25443c 55%,#11211f 90%)}.frame-image:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 38% 62%,#fff3a55a,transparent 52%),linear-gradient(transparent 55%,#15231ede 95%)}.road{position:absolute;bottom:-3%;left:-20%;width:150%;height:35%;background:#152420;clip-path:polygon(48% 0,65% 0,100% 100%,0 100%);filter:blur(3px)}.lamp{position:absolute;left:38%;bottom:15%;height:62%;width:20px}.lamp-pole{position:absolute;bottom:0;left:8px;background:#0c1717;height:90%;width:7px}.lamp-top{position:absolute;top:0;left:-36px;width:87px;height:18px;background:#0b1616;border-radius:40% 40% 20% 20%;z-index:1}.lamp-glow{position:absolute;top:10px;left:-19px;width:55px;height:42px;background:#ffde9c;border-radius:0 0 70% 70%;box-shadow:0 0 40px 17px #f8e0a85c,0 0 130px 60px #ecd7972a}.frame-caption{position:absolute;bottom:21px;right:22px;font:500 10px 'DM Sans',sans-serif;letter-spacing:.13em;color:#e5e3d0}.memory-note{grid-column:1;align-self:end;margin-top:-130px;font-size:20px;color:#d5dacb;line-height:1.8}.memory-note span{display:block;color:var(--lime);font:700 12px 'DM Sans',sans-serif;letter-spacing:.3em;margin-bottom:18px}.scent{background:radial-gradient(ellipse at 50% 28%,#263b33,#0b1a18 70%);padding:130px 5% 140px}.scent-inner{max-width:1250px;margin:auto;text-align:center;position:relative;z-index:2}.scent .small-index{justify-content:center}.scent-typography{margin:40px 0 12px;font-size:clamp(65px,9vw,148px);font-weight:500;letter-spacing:-.055em;line-height:1.4}.scent-typography .italic{font-family:'Noto Serif Thai',serif;color:var(--lime);font-style:italic;font-weight:300}.scent-divider{color:#b7cdbb;font-size:20px;letter-spacing:.02em;font-weight:300}.scent-intro{font-size:18px;color:#c0cdc3;line-height:2.1;max-width:750px;margin:42px auto 80px}.duality{display:grid;grid-template-columns:1fr 1fr;position:relative;gap:16px;text-align:left}.duality-side{min-height:425px;position:relative;overflow:hidden;padding:35px 46px 37px;border:1px solid #fff2;transition:transform .3s,box-shadow .3s}.duality-side:hover{transform:translateY(-8px);box-shadow:0 30px 45px #0004}.duality-side.nice{background:linear-gradient(145deg,#40574a,#1e4136)}.duality-side.bad{background:linear-gradient(145deg,#5a3934,#302524)}.team-number{font:600 10px 'DM Sans',sans-serif;letter-spacing:.2em;color:#dedfd3}.duality-symbol{position:absolute;right:35px;top:68px;font-size:120px;color:#ffffff1c;line-height:1}.duality-side h3{font:500 clamp(58px,6vw,92px) 'Noto Serif Thai',serif;letter-spacing:-.05em;margin:63px 0 0}.duality-side p{font-size:17px;line-height:1.9;margin:4px 0 35px}.duality-sign{font-size:14px;color:#e6e0cead}.versus{position:absolute;z-index:2;left:50%;top:47%;transform:translate(-50%,-50%);width:67px;height:67px;display:grid;place-items:center;background:#e9e4d4;color:#1a2a25;border-radius:50%;font:700 19px 'DM Sans',sans-serif;box-shadow:0 5px 25px #0003}.scent-footnote{color:#9dab9d;margin-top:32px;font-size:13px}.scent-ripple{position:absolute;border:1px solid #e0e7b622;border-radius:50%;height:75vw;width:75vw;left:50%;top:-30vw;transform:translateX(-50%);animation:breathe 9s infinite alternate}.ripple-two{height:100vw;width:100vw;top:-42vw;animation-delay:-4s}.voting{background:#101f1c;min-height:100vh;display:flex;justify-content:center;align-items:center;padding:140px 6% 115px}.voting-aura{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 32%,#41645433,transparent 60%)}.vote-panel,.result-panel{position:relative;z-index:2;width:100%;max-width:1100px;text-align:center}.vote-panel .small-index{justify-content:center}.vote-question span{display:block;margin-top:31px;color:#a8c0a6;font-size:16px}.vote-question h2{font-size:clamp(68px,7.5vw,115px);letter-spacing:-.045em;line-height:1.3;font-weight:500;margin:13px 0 13px}.vote-question h2 em{font-family:'Noto Serif Thai',serif;color:var(--lime);font-weight:300}.vote-question p{font-size:18px;color:#bac9bf;margin:0 0 55px}.vote-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.vote-choice{position:relative;text-align:left;border:1px solid #ffffff26;border-radius:3px;background:#263e34;color:#f1f1df;min-height:385px;padding:33px 39px;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;transition:transform .35s,border-color .35s,box-shadow .35s}.vote-choice.stinky{background:#513730}.vote-choice:hover:not(:disabled),.vote-choice:focus-visible{transform:translateY(-9px);border-color:#ffffffa0;box-shadow:0 25px 65px #0005}.vote-choice:disabled{opacity:.55;cursor:wait}.vote-choice-bg{position:absolute;right:-30px;top:40px;font-size:280px;line-height:1;opacity:.065;z-index:-1;transition:transform .4s}.vote-choice:hover .vote-choice-bg{transform:rotate(20deg) scale(1.1)}.choice-top{display:flex;justify-content:space-between;align-items:center;font:700 11px 'DM Sans',sans-serif;letter-spacing:.17em}.choice-bullet{border:1px solid #fff7;border-radius:50%;width:33px;height:33px;display:grid;place-items:center}.choice-emoji{font-size:38px;margin:46px 0 5px;color:#e2ebbd}.stinky .choice-emoji{color:#f2c1a6}.choice-label{font-size:48px;font-weight:300;line-height:1.4}.choice-label span{font-weight:600;font-size:70px}.choice-description{font-size:16px;color:#ebe5d7bd}.vote-cta{border-top:1px solid #ffffff55;padding-top:20px;margin-top:auto;font-size:15px;display:flex;justify-content:space-between}.vote-cta span{font-size:23px}.vote-disclaimer{font-size:13px;color:#92a89d;margin-top:25px}.hidden{display:none!important}.result-panel{max-width:900px}.result-overline{font:600 11px 'DM Sans',sans-serif;letter-spacing:.3em;color:var(--lime)}.result-stamp{font:700 12px 'DM Sans',sans-serif;letter-spacing:.24em;border:1px solid #e6dfb77d;color:#e6dfb7;display:inline-block;padding:11px 25px;margin-top:38px;transform:rotate(-4deg)}.result-title{font-size:clamp(55px,7vw,98px);font-weight:500;line-height:1.35;letter-spacing:-.04em;margin-top:15px}.result-title em{font-family:'Noto Serif Thai',serif;font-weight:300;color:var(--lime)}.result-subtitle{font-size:16px;color:#bdd0c0}.result-scoreboard{background:#071412bd;border:1px solid #e8f0d32e;margin:40px auto 25px;padding:36px 44px;text-align:left;max-width:690px;box-shadow:0 35px 65px #0006}.score-header{display:flex;justify-content:space-between;font:600 13px 'DM Sans',sans-serif;letter-spacing:.16em;margin:8px 0 14px}.score-header #fragrantPct,.score-header #stinkyPct{font-size:28px;letter-spacing:-.05em}.score-track{height:15px;background:#ffffff17;overflow:hidden;border-radius:30px;margin-bottom:30px}.score-fill{width:0;height:100%;border-radius:30px;transition:width 2.4s cubic-bezier(.14,.75,.25,1)}.score-fill.good{background:linear-gradient(90deg,#739c74,#d2e9a5);box-shadow:0 0 20px #caeaa36a}.score-fill.evil{background:linear-gradient(90deg,#b56855,#f0b397);box-shadow:0 0 20px #e9aa8a62}.total-votes{display:flex;justify-content:center;align-items:center;gap:16px;border-top:1px solid #ffffff1c;padding-top:12px;font-size:12px;color:#9eb4a7}.total-votes strong{font:700 42px 'DM Sans',sans-serif;color:#fff}.total-votes span:last-child{font:600 9px 'DM Sans',sans-serif;letter-spacing:.14em}.winner-line{font-size:22px;color:#d4e8b3;margin:25px auto}.result-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.action-btn{border:1px solid #8fa79c;background:transparent;color:#e7eedf;padding:15px 25px;border-radius:3px;transition:.2s}.action-btn:hover{background:#ffffff1a}.primary-action{background:#d0e6a7;color:#14241b;border-color:#d0e6a7;font-weight:500}.primary-action:hover{background:#ebf6c9}.refresh-note{font:500 11px 'DM Sans',sans-serif;color:#92ac9d;letter-spacing:.08em;margin-top:25px}footer{text-align:center;padding:80px 20px 45px;background:#081412;border-top:1px solid #ffffff12}footer .footer-brand{font:700 clamp(30px,6vw,72px) 'DM Sans',sans-serif;letter-spacing:-.055em}footer .footer-brand span{color:var(--lime)}footer p{color:#b0beae;font-size:15px}footer .footer-small{display:block;margin-top:65px;font:600 9px 'DM Sans',sans-serif;color:#7c9c8d;letter-spacing:.23em}.cinema-curtain{position:fixed;z-index:100;inset:0;background:radial-gradient(ellipse at center,#314d3a,#0b1514 75%);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.cinema-phrase{font-size:clamp(40px,6vw,86px);font-weight:400;line-height:1.4;animation:curtainIn .9s both}.cinema-phrase em{color:var(--lime);font-family:'Noto Serif Thai',serif;font-weight:300}.cinema-loading{width:200px;height:2px;background:#ffffff25;margin-top:48px;overflow:hidden}.cinema-loading span{display:block;width:100%;height:100%;background:var(--lime);transform-origin:left;animation:loading 2.3s linear both}.toast{position:fixed;z-index:120;bottom:25px;left:50%;transform:translate(-50%,120px);background:#e6e9d9;color:#18251f;padding:14px 22px;border-radius:5px;box-shadow:0 16px 45px #0006;transition:transform .3s;font-size:14px;text-align:center}.toast.show{transform:translate(-50%,0)}body.celebrate #weather{opacity:1}@keyframes treeSway{from{transform:rotate(-1deg)}to{transform:rotate(1.4deg)}}@keyframes flowerGlow{from{opacity:.67}to{opacity:1}}@keyframes breathe{to{opacity:.2;transform:translateX(-50%) scale(1.12)}}@keyframes curtainIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes loading{from{transform:scaleX(0)}to{transform:scaleX(1)}}@media(max-width:900px){.top-center,.side-caption{display:none}.hero-tree{width:90vw;right:-28%;opacity:.75}.chapter-inner{display:block}.memory{padding:125px 8%}.memory-frame{min-height:400px;height:65vw;margin-top:75px;max-height:600px}.memory-note{margin-top:35px}.duality-side{padding:30px;min-height:390px}.hero h1{font-size:clamp(65px,10vw,105px)}}@media(max-width:600px){.topline{padding:17px 5%}.top-actions{gap:10px}.sound-label,.chapter-count,.chapter-dots{display:none}.hero{padding:100px 7% 90px;min-height:100svh}.hero-content{margin-top:70px}.hero-tree{width:138vw;right:-58%;bottom:-5%;opacity:.48}.moon{top:18%;right:20%;width:80px;height:80px}.hero h1{font-size:clamp(56px,12vw,87px)}.hero-preface{font-size:16px}.hero-caption{font-size:15px}.eyebrow{font-size:9px;letter-spacing:.15em}.hero-year{font-size:8px}.chapter-header h2{font-size:56px}.chapter-header p,.scent-intro{font-size:16px}.memory{padding:100px 6%}.memory-frame{margin-top:50px;min-height:320px;border-width:6px;height:80vw}.scent{padding:100px 5%}.scent-typography{font-size:58px}.scent-intro{margin-bottom:40px}.duality{grid-template-columns:1fr}.duality-side{min-height:320px;padding:25px 30px}.duality-side h3{margin-top:30px}.versus{top:50%;width:55px;height:55px}.voting{padding:110px 5% 75px}.vote-question h2{font-size:62px}.vote-question p{margin-bottom:35px}.vote-grid{grid-template-columns:1fr;gap:14px}.vote-choice{min-height:280px;padding:22px 29px}.choice-emoji{margin:15px 0 0}.choice-label{font-size:38px}.choice-label span{font-size:59px}.vote-choice-bg{font-size:220px;right:-20px}.vote-cta{margin-top:23px}.result-scoreboard{padding:27px 22px}.score-header{font-size:10px}.result-title{font-size:53px}.total-votes{gap:8px}.total-votes strong{font-size:33px}.total-votes span:last-child{font-size:8px}.action-btn{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* ===== CINEMATIC v2 ===== */
body.intro-on{overflow:hidden}
#spotlight{position:fixed;inset:0;pointer-events:none;z-index:24;background:radial-gradient(520px circle at var(--mx,70%) var(--my,30%),#e6f5c812,transparent 62%);transition:opacity .4s}
#vignette{position:fixed;inset:0;pointer-events:none;z-index:26;background:radial-gradient(ellipse at center,transparent 55%,#02070699 100%)}
#flash{position:fixed;inset:0;pointer-events:none;z-index:160;background:radial-gradient(circle at 50% 45%,#fffef2,#f4f7d8 40%,#dfeac1);opacity:0}
#flash.go{animation:flash 1.3s ease-out}
.letterbox span{position:fixed;left:0;right:0;height:0;background:#000;z-index:90;transition:height 1.1s cubic-bezier(.7,0,.2,1)}
.letterbox span:first-child{top:0}.letterbox span:last-child{bottom:0}
body.cine .letterbox span{height:12vh}
body.shake main,body.shake .topline{animation:shake .7s cubic-bezier(.36,.07,.19,.97)}

/* intro */
.intro{position:fixed;inset:0;z-index:200;background:radial-gradient(ellipse at 50% 40%,#17302a,#050b0a 70%);display:grid;place-items:center;text-align:center;overflow:hidden;transition:clip-path 1.6s cubic-bezier(.77,0,.18,1),opacity .6s 1.4s;clip-path:inset(0 0 0 0)}
.intro-stars{position:absolute;inset:-20%;background-image:radial-gradient(#fff 1px,transparent 1.4px),radial-gradient(#dfeac1 1px,transparent 1.4px);background-size:120px 110px,190px 170px;background-position:0 0,60px 80px;opacity:.18;animation:starDrift 60s linear infinite}
.intro-gate{position:relative;z-index:2;padding:24px;transition:opacity .8s,transform 1.2s,filter .8s}
.intro-mark{font-size:54px;color:var(--lime);animation:spin 18s linear infinite;display:inline-block;text-shadow:0 0 30px #cde9a2aa}
.intro-kicker{font:600 11px 'DM Sans',sans-serif;letter-spacing:.42em;color:#a8c0a6;margin:20px 0 6px}
.intro-title{font-size:clamp(48px,9vw,120px);font-weight:500;letter-spacing:-.05em;line-height:1.25;margin:0;animation:titleIn 2.4s cubic-bezier(.2,.7,.2,1) both}
.intro-title em{font-family:'Noto Serif Thai',serif;font-weight:300;color:var(--lime)}
.intro-hint{color:#9fb5a8;font-size:14px;margin:14px 0 36px}
.intro-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.intro-btn{border:1px solid #8fa79c;background:transparent;color:#e7eedf;padding:16px 28px;border-radius:40px;font-size:16px;transition:.25s}
.intro-btn:hover{background:#ffffff1a;transform:translateY(-2px)}
.intro-btn.primary{background:var(--lime);color:#10211b;border-color:var(--lime);font-weight:500;box-shadow:0 0 0 0 #cde9a280;animation:pulseBtn 2.4s infinite}
.intro-card{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;opacity:0;pointer-events:none;padding:24px}
.intro-card small{font:600 11px 'DM Sans',sans-serif;letter-spacing:.5em;color:#a8c0a6}
.intro-card span{font-size:clamp(26px,4.2vw,56px);font-weight:400;line-height:1.3}
.intro-card b{font:300 clamp(30px,5vw,68px) 'Noto Serif Thai',serif;color:var(--lime)}
.intro-card.show{animation:cardShow 2.6s ease both}
.intro-title-card span{font:700 clamp(56px,11vw,170px)/.95 'DM Sans',sans-serif;letter-spacing:-.06em;background:linear-gradient(100deg,#6f8a7a 20%,#fffbe6 45%,#cde9a2 50%,#6f8a7a 75%);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.intro-title-card.show span{animation:shine 3s ease both}
.intro-title-card.show{animation:cardShow 3s ease both}
.intro.playing .intro-gate{opacity:0;transform:scale(.92);filter:blur(10px);pointer-events:none}
.intro.leaving{clip-path:inset(50% 0 50% 0);opacity:0;pointer-events:none}
.intro-skip{position:absolute;right:24px;bottom:22px;z-index:3;background:none;border:1px solid #ffffff33;color:#cbd6cb;border-radius:30px;padding:8px 18px;font-size:13px;opacity:0;transition:opacity .4s}
.intro.playing .intro-skip{opacity:1}
body.started .hero h1{animation:titleIn 2.2s .2s cubic-bezier(.2,.7,.2,1) both}
body.started .hero-preface{animation:riseIn 1.4s .1s both}
body.started .hero-caption,body.started .explore{animation:riseIn 1.4s .9s both}
body.started .hero .moon{animation:moonRise 3s cubic-bezier(.2,.7,.2,1) both}

/* topline extras */
.live-pill{display:flex;align-items:center;gap:7px;font:600 10px 'DM Sans',sans-serif;letter-spacing:.12em;color:#dde4d9;border:1px solid #ffffff26;border-radius:30px;padding:6px 12px 6px 10px}
.live-pill i,.stat.live i{width:7px;height:7px;border-radius:50%;background:#ff6b5a;box-shadow:0 0 0 0 #ff6b5a99;animation:livePulse 1.8s infinite;display:inline-block}
.live-pill b{font-size:12px;color:#fff}
.eq{display:flex;align-items:flex-end;gap:2px;height:14px}
.eq i{width:2px;height:4px;background:var(--lime);border-radius:2px;transition:height .3s}
body.sound-on .eq i{animation:eq .9s ease-in-out infinite alternate}
body.sound-on .eq i:nth-child(2){animation-delay:-.3s}body.sound-on .eq i:nth-child(3){animation-delay:-.6s}body.sound-on .eq i:nth-child(4){animation-delay:-.15s}

/* hero cinematic layers */
.hero{--p:0}
.moon,.moon-glow{translate:0 calc(var(--p) * 260px)}
.light-rays{position:absolute;right:calc(25% - 340px);top:calc(15% - 300px);width:790px;height:790px;border-radius:50%;background:repeating-conic-gradient(from 0deg,#e8f3c814 0deg 4deg,transparent 4deg 13deg);mask:radial-gradient(circle,#000 8%,transparent 68%);-webkit-mask:radial-gradient(circle,#000 8%,transparent 68%);animation:spin 120s linear infinite;translate:0 calc(var(--p) * 260px);pointer-events:none;mix-blend-mode:screen}
.mountains.far{translate:0 calc(var(--p) * 130px)}
.mountains.near{translate:0 calc(var(--p) * 60px)}
.hero-tree{translate:0 calc(var(--p) * 40px)}
.hero-content{translate:0 calc(var(--p) * 180px);opacity:calc(1 - var(--p) * 1.3)}
.fog{position:absolute;left:-50%;width:200%;height:42%;bottom:-6%;pointer-events:none;z-index:3;background:radial-gradient(ellipse at 20% 60%,#cfe0d214,transparent 45%),radial-gradient(ellipse at 55% 70%,#dbe8d01c,transparent 40%),radial-gradient(ellipse at 85% 55%,#cfe0d212,transparent 45%);filter:blur(18px);animation:fogDrift 38s linear infinite alternate}
.fog-2{bottom:8%;opacity:.7;animation-duration:55s;animation-direction:alternate-reverse}
.fog-3{bottom:auto;top:20%;opacity:.6}
.hero-presented{position:absolute;right:5%;bottom:30px;z-index:6;text-align:right;display:flex;flex-direction:column;gap:2px;font-size:13px;color:#d6dfd2;line-height:1.5}
.hero .hero-presented{opacity:.9}
.hero-presented small{font:600 9px 'DM Sans',sans-serif;letter-spacing:.32em;color:var(--lime)}
.hero-presented span:last-child{font-family:'Noto Serif Thai',serif;color:#e8ecd9}
.reveal{filter:blur(8px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.3,1),filter 1s ease}
.reveal.visible{filter:blur(0)}
.hero .reveal{filter:none}

/* voting extras */
.vote-beams{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.vote-beams i{position:absolute;top:-20%;left:50%;width:30vw;height:140%;background:linear-gradient(180deg,#e9f5d01f,transparent 75%);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);transform-origin:50% 0;animation:beam 9s ease-in-out infinite alternate;filter:blur(6px)}
.vote-beams i:nth-child(1){margin-left:-38vw;animation-delay:-3s}
.vote-beams i:nth-child(2){margin-left:-15vw;opacity:.7}
.vote-beams i:nth-child(3){margin-left:8vw;animation-delay:-6s}
.step-label{display:flex;align-items:center;justify-content:center;gap:12px;font-size:17px;color:#dfe7d6;margin:0 0 16px}
.step-label span{font:700 11px 'DM Sans',sans-serif;letter-spacing:.1em;border:1px solid var(--lime);color:var(--lime);width:30px;height:30px;border-radius:50%;display:grid;place-items:center}
.province-picker{margin:0 auto 40px;max-width:640px}
.picker-row{display:flex;gap:10px}
.picker-row select{flex:1;min-width:0;appearance:none;-webkit-appearance:none;background:#0a1714 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23cde9a2' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 18px center;border:1px solid #ffffff33;color:var(--ivory);font:inherit;font-size:17px;padding:15px 44px 15px 20px;border-radius:40px;transition:border-color .3s,box-shadow .3s}
.picker-row select:focus{outline:none;border-color:var(--lime);box-shadow:0 0 0 4px #cde9a222}
.province-picker.need select{border-color:var(--orange);animation:nudge .5s}
.locate-btn{flex:none;border:1px solid #ffffff33;background:#ffffff0d;color:#e7eedf;border-radius:40px;padding:0 20px;font-size:14px;transition:.2s}
.locate-btn:hover{background:#ffffff1f}
.province-picker small{display:block;margin-top:10px;font-size:12px;color:#8aa194}
.vote-choice:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(380px circle at var(--x,50%) var(--y,50%),#ffffff26,transparent 60%);opacity:0;transition:opacity .3s}
.vote-choice:hover:before{opacity:1}
.vote-choice.chosen{animation:chosen 1s both;border-color:#fff}

/* curtain */
.cinema-curtain{overflow:hidden;background:#050b0a}
.curtain-left,.curtain-right{position:absolute;top:0;bottom:0;width:50.5%;background:repeating-linear-gradient(90deg,#3b1714 0 30px,#521f1a 30px 60px);box-shadow:inset 0 0 120px #000;z-index:0}
.curtain-left{left:0;animation:curtainL 1s cubic-bezier(.7,0,.3,1) both}
.curtain-right{right:0;animation:curtainR 1s cubic-bezier(.7,0,.3,1) both}
.cinema-curtain.open .curtain-left{animation:curtainOpenL 1.2s cubic-bezier(.7,0,.3,1) both}
.cinema-curtain.open .curtain-right{animation:curtainOpenR 1.2s cubic-bezier(.7,0,.3,1) both}
.cinema-phrase,.cinema-count,.cinema-loading{position:relative;z-index:1}
.cinema-phrase{animation:curtainIn 1.2s .6s both;text-shadow:0 10px 40px #000}
.cinema-count{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font:700 clamp(120px,22vw,300px)/1 'DM Sans',sans-serif;color:#fffbe6;text-shadow:0 0 60px #cde9a2aa}
.cinema-count.tick{animation:countZoom .9s cubic-bezier(.2,.8,.2,1) both}
.cinema-curtain.counting .cinema-phrase,.cinema-curtain.counting .cinema-loading{animation:fadeAway .4s both}
.cinema-loading span{animation-duration:4.4s}

/* result */
.result-panel.enter .result-stamp{animation:stamp .8s .5s cubic-bezier(.2,1.6,.4,1) both}
.result-panel.enter .result-title{animation:titleIn 1.6s both}
.result-panel.enter .result-scoreboard{animation:riseIn 1.2s .3s both}
.winner-line{text-shadow:0 0 24px #cde9a288;font-weight:400}
.result-panel.enter .winner-line{animation:riseIn 1s 2.2s both}
.share-block{margin:50px auto 34px;padding:34px 30px;border:1px solid #e8f0d32e;background:linear-gradient(160deg,#122721cc,#0a1513ee);text-align:left;max-width:900px;position:relative;overflow:hidden}
.share-block:before{content:'';position:absolute;inset:-1px;background:linear-gradient(120deg,transparent 30%,#cde9a222 50%,transparent 70%);background-size:250% 100%;animation:shine 6s linear infinite;pointer-events:none}
.share-head h3{font-size:clamp(26px,3.4vw,38px);font-weight:500;margin:12px 0 24px;line-height:1.4}
.share-head h3 em{font-family:'Noto Serif Thai',serif;font-weight:300;color:var(--lime)}
.share-layout{display:grid;grid-template-columns:210px 1fr;gap:28px;align-items:start}
.share-card{margin:0;text-align:center}
.share-card img{width:100%;aspect-ratio:4/5;object-fit:cover;background:#0b1616;border:1px solid #ffffff2a;box-shadow:0 24px 50px #0008;transform:rotate(-3deg);transition:transform .4s}
.share-card img:hover{transform:rotate(0) scale(1.03)}
.share-card figcaption{font-size:11px;color:#92ac9d;margin-top:14px}
.share-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.share-btn{display:flex;align-items:center;gap:12px;border:1px solid #ffffff22;background:#ffffff08;color:#eef2e6;padding:9px 14px 9px 9px;border-radius:50px;font-size:14px;text-align:left;transition:transform .2s,background .2s,border-color .2s}
.share-btn b{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:var(--ink,#fff);font:700 13px 'DM Sans',sans-serif}
.share-btn[data-net=line] b{font-size:9px;letter-spacing:.02em}
.share-btn:hover{transform:translateY(-3px);background:#ffffff14;border-color:var(--edge,var(--brand))}
.share-btn.wide{grid-column:1/-1}
.result-actions .action-btn{display:inline-block}

/* map */
.map-scene{background:radial-gradient(ellipse at 30% 20%,#1d3a33,#0a1715 65%);padding:130px 5% 120px}
.map-aura{position:absolute;width:70vw;height:70vw;left:-10%;top:10%;border-radius:50%;background:#cde9a2;opacity:.05;filter:blur(120px)}
.map-inner{position:relative;z-index:2;max-width:1280px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:start}
.map-header h2{font-size:clamp(46px,4.6vw,80px);font-weight:500;letter-spacing:-.045em;line-height:1.3;margin:32px 0 18px}
.map-header h2 em{font-family:'Noto Serif Thai',serif;font-weight:300;color:var(--lime)}
.map-header p{color:#c2cfc4;font-size:16px;line-height:2}
.map-kpis{display:grid;gap:12px;margin-top:30px}
.map-kpis div{display:flex;align-items:center;gap:18px;border-top:1px solid #ffffff1c;padding-top:12px}
.map-kpis strong{font:700 46px/1 'DM Sans',sans-serif;min-width:80px}
.map-kpis .good strong{color:#b9e08f}.map-kpis .bad strong{color:#f2a789}
.map-kpis span{font-size:14px;color:#b4c4b8;line-height:1.5}
.map-kpis small{color:#7f978a}
.map-stage{position:relative;position:sticky;top:90px}
#thaiMap{width:100%;height:auto;max-height:80vh;display:block;margin:auto;overflow:visible;filter:drop-shadow(0 20px 40px #0009)}
.province{stroke:#081210;stroke-width:.7;stroke-linejoin:round;cursor:pointer;transition:fill 1s ease,opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1),filter .2s;opacity:0;transform:translateY(-14px);transform-box:fill-box;transform-origin:center}
#thaiMap.revealed .province{opacity:1;transform:none;transition-delay:var(--delay),var(--delay),var(--delay),0s}
#thaiMap.revealed.settled .province{transition-delay:0s}
.province:hover,.province:focus-visible{filter:brightness(1.35) drop-shadow(0 0 6px #fff8);stroke:#fffbe6;stroke-width:1.2;outline:none}
.province.selected{stroke:var(--lime);stroke-width:2}
.province.mine{stroke:#fff;stroke-width:1.8;stroke-dasharray:4 3;animation:dash 1.2s linear infinite}
.ping{fill:none;stroke:#fffbe6;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:ping 2.4s ease-out forwards}
.map-scan{position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,#cde9a2,transparent);box-shadow:0 0 30px 8px #cde9a244;opacity:0;pointer-events:none}
#mapStage.scanning .map-scan{animation:scan 2.2s ease-in-out}
.map-tip{position:absolute;z-index:5;pointer-events:none;background:#f1ebdaf2;color:#13211c;padding:10px 14px;border-radius:6px;box-shadow:0 12px 30px #0007;display:flex;flex-direction:column;gap:2px;font-size:13px;min-width:150px;opacity:0;transform:translateY(6px);transition:opacity .15s,transform .15s}
.map-tip.show{opacity:1;transform:none}
.map-tip strong{font-size:16px;font-weight:600}
.map-tip span{font:600 9px 'DM Sans',sans-serif;letter-spacing:.18em;color:#5d6d63;text-transform:uppercase;margin-bottom:4px}
.map-tip em{font-style:normal}.tip-good{color:#3d7a35}.tip-bad{color:#b34f35}
.map-toggle{display:flex;gap:4px;justify-content:center;margin-bottom:14px;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:30px;padding:4px;width:fit-content;margin-inline:auto}
.map-toggle button{background:none;border:0;color:#c9d6cb;padding:8px 16px;border-radius:30px;font-size:13px}
.map-toggle button.active{background:var(--lime);color:#10211b}
.map-legend{display:flex;flex-direction:column;gap:8px;align-items:center;margin-top:16px;font-size:12px;color:#a9bbad}
.map-legend>div{display:flex;align-items:center;gap:10px}
.legend-lean i,.legend-heat i{width:150px;height:8px;border-radius:8px;background:linear-gradient(90deg,#ea8062,#decf96,#a8d678)}
.legend-heat i{background:linear-gradient(90deg,#283e3a,#5d7856,#d6be6e,#f09656,#ffecbe)}
.legend-empty i{width:14px;height:14px;border-radius:3px;background:#1b2d2a;border:1px solid #ffffff22}
.map-legend .legend-heat,.map-stage.heat .legend-lean{display:none}
.map-stage.heat .legend-heat{display:flex}
.map-side{display:flex;flex-direction:column;gap:18px}
.province-card,.rank-block,.region-block{background:#071412bd;border:1px solid #e8f0d32e;padding:20px 22px}
.province-card h4{font-size:28px;font-weight:500;margin:8px 0 2px}
.province-card p{margin:0 0 14px;color:#a9bbad;font-size:14px}
.pc-bar{display:flex;height:10px;border-radius:10px;overflow:hidden;background:#ffffff14}
.pc-bar i{display:block;height:100%;width:0;transition:width 1s cubic-bezier(.2,.8,.2,1)}
#pcGood{background:linear-gradient(90deg,#739c74,#d2e9a5)}#pcBad{background:linear-gradient(90deg,#f0b397,#b56855)}
.pc-nums{display:flex;justify-content:space-between;font-size:13px;margin-top:8px;color:#d6dfd2}
.rank-block h4,.region-block h4{margin:0 0 10px;font-weight:500;font-size:16px;color:#d4e8b3}
.rank-block.bad h4{color:#f2b49a}
.rank-block ol{margin:0;padding:0;list-style:none;counter-reset:r}
.rank-block li{counter-increment:r;display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid #ffffff12;font-size:14px;cursor:pointer}
.rank-block li:before{content:counter(r);font:700 11px 'DM Sans',sans-serif;color:#7f978a;width:18px}
.rank-block li span:first-of-type{flex:1}
.rank-block li em{font-style:normal;color:#a9bbad;font-size:12px}
.rank-block li.empty{color:#7f978a;cursor:default}.rank-block li.empty:before{content:''}
.region-row{margin:10px 0}
.region-row div{display:flex;justify-content:space-between;font-size:13px;color:#d6dfd2;margin-bottom:5px}
.region-row div em{font-style:normal;color:#93a99b;font-size:12px}
.region-row .pc-bar{height:6px}

/* stats */
.stats-band{position:relative;display:grid;grid-template-columns:repeat(4,1fr);background:#0a1715;border-top:1px solid #ffffff12}
.stat{padding:56px 20px;text-align:center;border-right:1px solid #ffffff12;display:flex;flex-direction:column;gap:6px}
.stat:last-child{border-right:0}
.stat strong{font:700 clamp(40px,5vw,68px)/1 'DM Sans',sans-serif;letter-spacing:-.04em;background:linear-gradient(180deg,#fffbe6,#cde9a2);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{font-size:15px;color:#d6dfd2;display:flex;align-items:center;justify-content:center;gap:8px}
.stat small{font:600 9px 'DM Sans',sans-serif;letter-spacing:.3em;color:#7c9c8d}

/* credits */
.credits{padding:110px 20px 50px}
.credits-roll{margin-bottom:70px;display:flex;flex-direction:column;align-items:center;gap:10px}
.credit-role{font:600 10px 'DM Sans',sans-serif;letter-spacing:.45em;color:var(--lime)}
.credit-org{font-size:clamp(26px,4vw,48px);font-weight:400;line-height:1.35;margin-top:10px}
.credit-uni{font:300 clamp(28px,4.4vw,54px) 'Noto Serif Thai',serif;color:var(--lime);line-height:1.3}
.credit-en{font:600 10px 'DM Sans',sans-serif;letter-spacing:.35em;color:#9eb4a7;margin-top:8px}
.footer-data{display:block;margin-top:14px;font-size:11px;color:#6f8a7c}
.footer-data a{text-decoration:underline}

@keyframes fadeAway{to{opacity:0;transform:scale(.9);filter:blur(8px)}}
@keyframes flash{0%{opacity:0}8%{opacity:1}100%{opacity:0}}
@keyframes shake{0%,100%{transform:none}15%{transform:translate(-9px,5px) rotate(-.4deg)}30%{transform:translate(8px,-6px) rotate(.4deg)}45%{transform:translate(-6px,4px)}60%{transform:translate(5px,-3px)}75%{transform:translate(-3px,2px)}}
@keyframes starDrift{to{transform:translate(-120px,-60px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes titleIn{from{opacity:0;filter:blur(24px);letter-spacing:.1em;transform:scale(1.08)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes riseIn{from{opacity:0;transform:translateY(30px);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes moonRise{from{opacity:0;transform:translateY(120px) scale(.7)}to{opacity:1;transform:none}}
@keyframes cardShow{0%{opacity:0;transform:scale(1.12);filter:blur(16px)}22%{opacity:1;transform:scale(1);filter:blur(0)}78%{opacity:1;transform:scale(.97);filter:blur(0)}100%{opacity:0;transform:scale(.94);filter:blur(10px)}}
@keyframes shine{from{background-position:100% 0}to{background-position:-100% 0}}
@keyframes pulseBtn{0%{box-shadow:0 0 0 0 #cde9a270}70%{box-shadow:0 0 0 18px #cde9a200}100%{box-shadow:0 0 0 0 #cde9a200}}
@keyframes livePulse{0%{box-shadow:0 0 0 0 #ff6b5a99}70%{box-shadow:0 0 0 8px #ff6b5a00}100%{box-shadow:0 0 0 0 #ff6b5a00}}
@keyframes eq{from{height:3px}to{height:14px}}
@keyframes fogDrift{from{transform:translateX(0)}to{transform:translateX(25%)}}
@keyframes beam{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
@keyframes nudge{0%,100%{transform:none}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
@keyframes chosen{0%{transform:scale(1)}40%{transform:scale(1.05);box-shadow:0 0 80px #fffbe688}100%{transform:scale(1)}}
@keyframes curtainL{from{transform:translateX(-100%)}to{transform:none}}
@keyframes curtainR{from{transform:translateX(100%)}to{transform:none}}
@keyframes curtainOpenL{from{transform:none}to{transform:translateX(-100%)}}
@keyframes curtainOpenR{from{transform:none}to{transform:translateX(100%)}}
@keyframes countZoom{0%{opacity:0;transform:scale(2.4);filter:blur(12px)}35%{opacity:1;transform:scale(1);filter:blur(0)}100%{opacity:0;transform:scale(.7)}}
@keyframes stamp{0%{opacity:0;transform:rotate(-4deg) scale(3)}100%{opacity:1;transform:rotate(-4deg) scale(1)}}
@keyframes dash{to{stroke-dashoffset:-14}}
@keyframes ping{from{transform:scale(1);opacity:1}to{transform:scale(7);opacity:0}}
@keyframes scan{0%{top:0;opacity:0}10%{opacity:1}90%{opacity:1}100%{top:100%;opacity:0}}

@media(max-width:1100px){.map-inner{grid-template-columns:1fr 1fr}.map-header{grid-column:1/-1}.map-kpis{grid-template-columns:repeat(3,1fr)}.map-kpis div{flex-direction:column;align-items:flex-start;gap:6px}}
@media(max-width:900px){.hero-presented{right:auto;left:7%;bottom:60px;text-align:left}.share-layout{grid-template-columns:1fr}.share-card img{max-width:220px}.stats-band{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat{border-bottom:1px solid #ffffff12}.light-rays{display:none}}
@media(max-width:700px){.map-inner{grid-template-columns:1fr}.map-stage{position:relative;top:0}#thaiMap{max-height:none;max-width:420px}.map-kpis strong{font-size:34px;min-width:0}}
@media(max-width:600px){.live-pill span{display:none}.live-pill{padding:5px 9px}.picker-row{flex-direction:column}.locate-btn{padding:13px 20px}.share-block{padding:26px 18px}.share-grid{grid-template-columns:1fr 1fr}.share-btn{font-size:12px;gap:8px}.share-btn b{width:30px;height:30px}.hero-presented{font-size:11px;bottom:48px}.hero-year{bottom:22px}.stat{padding:38px 12px}.stat span{font-size:13px}.intro-btn{width:100%}.map-scene{padding:100px 5% 80px}.result-actions .action-btn{text-align:center}}
@media(hover:none){#spotlight{display:none}}
@media(prefers-reduced-motion:reduce){.province{opacity:1;transform:none}.reveal{filter:none}.hero-content{opacity:1}}

/* ===== v3: polish ===== */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.tree-blooms{filter:none;animation:none}
.bloom{animation:bloomTwinkle 4.6s ease-in-out infinite;animation-delay:calc(var(--d) * -1);transform-box:fill-box;transform-origin:center}
.bloom .halo{animation:halo 4.6s ease-in-out infinite;animation-delay:calc(var(--d) * -1)}
.canopy-top{animation:leafShimmer 7s ease-in-out infinite alternate}
.scent-trails{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;mix-blend-mode:screen}
.scent-trails path{fill:none;stroke:url(#trailG);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:380 1500;animation:trail 10s linear infinite;filter:blur(1px)}
.trails-scent{z-index:1;opacity:.55}.trails-scent path{stroke:url(#trailG2)}
.scent-trails path:nth-of-type(2){animation-duration:13s;animation-delay:-5s;stroke-width:1.5}
.scent-trails path:nth-of-type(3){animation-duration:15s;animation-delay:-9s;stroke-width:1.2}
.scent-trails path:nth-of-type(4){animation-duration:11s;animation-delay:-2s;stroke-width:1.8}

.line{display:block;overflow:hidden;padding:.16em .05em .22em;margin:-.16em -.05em -.22em}
.line>span{display:inline-block;transform:translateY(108%) rotate(2.5deg);opacity:0;transition:transform 1.3s cubic-bezier(.16,1,.3,1),opacity 1s ease;transition-delay:calc(var(--i) * .16s + .15s)}
.reveal.visible .line>span,body.started .hero .line>span{transform:none;opacity:1}
body.started .hero h1{animation:none}

.chapter-card{position:fixed;left:26px;top:50%;z-index:58;pointer-events:none;display:flex;align-items:center;gap:12px;opacity:0;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg)}
.chapter-card small{font:600 10px 'DM Sans',sans-serif;letter-spacing:.42em;color:var(--lime)}
.chapter-card span{font:600 12px 'DM Sans',sans-serif;letter-spacing:.38em;color:#f1ebda;text-shadow:0 4px 20px #000}
.chapter-card i{display:block;width:1px;height:0;background:linear-gradient(0deg,var(--lime),transparent)}
.chapter-card.show{animation:ccIn 3.4s ease both}.chapter-card.show i{animation:ccLine 3.4s ease both}

.province-picker{position:relative;z-index:12}
.combo{position:relative;flex:1;min-width:0}
.combo-btn{width:100%;display:flex;align-items:center;gap:12px;background:#0a1714cc;border:1px solid #ffffff33;color:var(--ivory);font-size:17px;padding:14px 22px;border-radius:40px;text-align:left;transition:border-color .3s,box-shadow .3s}
.combo-btn:hover{border-color:#ffffff70}
.combo.open .combo-btn,.combo-btn:focus-visible{outline:none;border-color:var(--lime);box-shadow:0 0 0 4px #cde9a222,0 0 40px #cde9a222}
.combo-pin{color:var(--lime);font-size:20px;line-height:1}
.combo-value{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#aab6ad}
.combo.has-value .combo-value{color:var(--ivory);font-weight:400}
.combo-caret{width:9px;height:9px;border-right:1.6px solid var(--lime);border-bottom:1.6px solid var(--lime);transform:translateY(-3px) rotate(45deg);transition:transform .3s}
.combo.open .combo-caret{transform:translateY(2px) rotate(-135deg)}
.combo-panel{position:absolute;left:0;right:0;top:calc(100% + 10px);background:#0d1d1af7;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid #cde9a244;border-radius:20px;box-shadow:0 30px 70px #000b;padding:10px;text-align:left;animation:panelIn .28s cubic-bezier(.2,.8,.2,1) both}
.combo-panel[hidden]{display:none}
.combo-panel input{width:100%;background:#ffffff0f;border:1px solid #ffffff22;border-radius:14px;color:var(--ivory);font:inherit;font-size:16px;padding:12px 16px;outline:none}
.combo-panel input:focus{border-color:var(--lime)}
.combo-panel ul{list-style:none;margin:8px 0 0;padding:0;max-height:min(320px,45vh);overflow:auto;overscroll-behavior:contain}
.combo-panel li.group{font:600 10px 'DM Sans',sans-serif;letter-spacing:.22em;color:var(--lime);padding:12px 12px 6px;position:sticky;top:0;background:#0d1d1a;z-index:1}
.combo-panel li.opt{padding:10px 12px;border-radius:12px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;font-size:15px;transition:background .15s}
.combo-panel li.opt em{font-style:normal;color:#7f978a;font-size:12px}
.combo-panel li.opt.active,.combo-panel li.opt:hover{background:#cde9a21f}
.combo-panel li.opt[aria-selected=true]{color:var(--lime)}
.combo-panel li.opt[aria-selected=true] span:after{content:'  ✓'}
.combo-panel li.none{padding:18px;color:#93a99b;text-align:center}
.province-picker.need .combo-btn{border-color:var(--orange);animation:nudge .5s}
#pickerNote{transition:color .3s;line-height:1.7}
#pickerNote.warn{color:#f2b49a}#pickerNote.ok{color:#b9e08f}
.locate-btn{display:flex;align-items:center;gap:10px;justify-content:center}
.locate-btn:disabled{opacity:.7;cursor:wait}
.locate-ico{width:14px;height:14px;border:2px solid var(--lime);border-radius:50%;position:relative;flex:none}
.locate-ico:after{content:'';position:absolute;inset:2px;background:var(--lime);border-radius:50%}
.locate-btn.busy .locate-ico{animation:locPulse 1s ease-in-out infinite}

.vote-choice:hover:not(:disabled),.vote-choice:focus-visible{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-10px);transition:transform .18s ease-out,border-color .35s,box-shadow .35s}
.vote-choice:after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--ang),transparent 0 68%,#fffbe6 82%,#cde9a2 88%,transparent 96%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s;animation:angSpin 3.2s linear infinite;pointer-events:none}
.vote-choice.stinky:after{background:conic-gradient(from var(--ang),transparent 0 68%,#ffe0c4 82%,#f2af8e 88%,transparent 96%)}
.vote-choice:hover:after,.vote-choice:focus-visible:after{opacity:1}
.choice-emoji{display:inline-block;width:fit-content;transition:transform .6s cubic-bezier(.2,1.6,.4,1)}
.vote-choice:hover .choice-emoji{transform:scale(1.3) rotate(-10deg)}

.petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.petals i{position:absolute;top:-20px;width:var(--s,9px);height:var(--s,9px);background:radial-gradient(circle at 40% 40%,#fffbe6,#dfe8c4 60%,transparent 64%);border-radius:50% 0 50% 50%;opacity:0;animation:petalFall linear infinite}
.lamp-glow{animation:flicker 7s infinite}

@keyframes bloomTwinkle{0%,100%{opacity:.7;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
@keyframes halo{0%,100%{opacity:.1}50%{opacity:.85}}
@keyframes leafShimmer{from{opacity:.7}to{opacity:.95}}
@keyframes trail{from{stroke-dashoffset:1880}to{stroke-dashoffset:0}}
@keyframes ccIn{0%{opacity:0;filter:blur(6px)}14%,80%{opacity:1;filter:none}100%{opacity:0;filter:blur(4px)}}
@keyframes ccLine{0%{height:0}40%{height:120px}100%{height:120px}}
@keyframes panelIn{from{opacity:0;transform:translateY(-10px) scale(.98)}}
@keyframes locPulse{50%{transform:scale(1.45);opacity:.5}}
@keyframes angSpin{to{--ang:360deg}}
@keyframes petalFall{0%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:.9}85%{opacity:.7}100%{opacity:0;transform:translate(var(--dx),720px) rotate(600deg)}}
@keyframes flicker{0%,46%,49%,52%,100%{opacity:1}47.5%{opacity:.55}50.5%{opacity:.75}}
@media(max-width:600px){.chapter-card{display:none}.combo-btn{font-size:16px}.scent-trails path{stroke-width:1.4}}
@media(prefers-reduced-motion:reduce){.line>span{transform:none;opacity:1}.scent-trails{display:none}.chapter-card{display:none}}
.map-error{text-align:center;color:#f2b49a}
.combo{z-index:3}

/* share v4 */
.share-btn b{background:var(--brand)}
.share-btn[data-net=instagram] b,.share-btn[data-net=tiktok] b{font-size:17px}
.share-btn[data-net=tiktok] b{text-shadow:-1.5px -1px 0 #25f4ee,1.5px 1px 0 #fe2c55}
.share-btn.done{border-color:var(--lime);background:#cde9a214}
.share-hint{grid-column:1/-1;font-size:12px;color:#92ac9d;margin:14px 0 0;line-height:1.7}
.share-warn{font-size:12.5px;line-height:1.7;color:#f2c9a6;background:#f2af8e14;border:1px solid #f2af8e40;border-radius:12px;padding:10px 14px;margin:12px 0 0}
.share-modal{position:fixed;inset:0;z-index:180;display:grid;place-items:center;padding:16px}
.share-modal[hidden]{display:none}
.sm-backdrop{position:absolute;inset:0;background:#020807cc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .3s both}
.sm-box{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);overflow:auto;display:grid;grid-template-columns:240px 1fr;gap:28px;align-items:start;background:linear-gradient(160deg,#16302a,#0a1513);border:1px solid #cde9a240;border-radius:22px;padding:30px;box-shadow:0 40px 90px #000c;animation:modalIn .45s cubic-bezier(.2,.9,.2,1) both}
.sm-close{position:absolute;right:14px;top:10px;background:none;border:0;color:#cbd6cb;font-size:30px;line-height:1;padding:6px 10px}
.sm-card{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;border:1px solid #ffffff2a;background:#0b1616;box-shadow:0 20px 40px #0009;transform:rotate(-2deg)}
.sm-body h4{font-size:28px;font-weight:500;margin:10px 0 14px}
.sm-steps{margin:0 0 20px;padding:0;list-style:none;counter-reset:s;display:grid;gap:10px}
.sm-steps li{counter-increment:s;display:flex;gap:12px;font-size:15px;line-height:1.6;color:#dfe7d6}
.sm-steps li:before{content:counter(s);flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--lime);color:var(--lime);display:grid;place-items:center;font:700 11px 'DM Sans',sans-serif;margin-top:1px}
.sm-steps li.ok:before{content:'✓';background:var(--lime);color:#10211b}
.sm-actions{display:flex;flex-wrap:wrap;gap:10px}
.sm-actions .action-btn{padding:12px 18px}
@keyframes modalIn{from{opacity:0;transform:translateY(24px) scale(.96)}}
@keyframes fadeIn{from{opacity:0}}
@media(max-width:600px){.sm-box{grid-template-columns:1fr;padding:24px 20px;gap:18px}.sm-card{max-width:180px;margin:0 auto}.sm-body h4{font-size:24px}.sm-actions .action-btn{width:100%}}
.share-warn{grid-column:1/-1}.share-layout .share-hint{margin-top:0}