:root{--bg:#fff;--ink:#17332a;--mute:#64786f;--line:#e2ece6;--soft:#f3f8f5;--green:#2f8f5b;--green2:#e6f5ec;--deep:#0f3d2a;--sun:#f6b73c;--sun2:#fff4d9;--clay:#d9734e;--clay2:#fbece6;--sky:#cfeeff;--blue:#2b7a9e;--r:20px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:linear-gradient(#eef9f1,#fff 300px) no-repeat #fff;color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif;touch-action:manipulation;-webkit-text-size-adjust:100%}
button,input,select,textarea{font:inherit;color:inherit;touch-action:manipulation}
button{cursor:pointer;border:0;background:none}
a{color:var(--blue);text-decoration:none}
#app{max-width:520px;margin:0 auto;min-height:100vh;padding:0 16px calc(84px + env(safe-area-inset-bottom))}
.top{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:14px 0 10px;position:sticky;top:0;background:rgba(240,250,243,.92);backdrop-filter:blur(8px);z-index:5;margin:0 -16px;padding-left:16px;padding-right:16px}
.brand{display:flex;gap:10px;align-items:center;min-width:0}.brand .logo{font-size:30px}.brand b{display:block;font-size:17px;letter-spacing:-.2px;line-height:1.2}.brand small{display:block;color:var(--mute);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44vw}
.tools{display:flex;gap:6px;flex-shrink:0}.chip{border:1px solid var(--line);border-radius:999px;padding:6px 9px;font-size:13px;background:#fff;white-space:nowrap}.chip.off{opacity:.45}
.card{border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:12px 0;background:#fff}
.card h3{margin:0 0 10px;font-size:15px}.sub{color:var(--mute);font-size:13px}
/* nature hero */
.pool{position:relative;overflow:hidden;border:0;padding:18px 18px 96px;background:linear-gradient(#cdeeff,#e9f8ee 70%);box-shadow:0 10px 28px rgba(47,143,91,.16)}
.pool .scene{position:absolute;left:0;right:0;bottom:0;width:100%;height:112px;display:block}
.pool .cloud{position:absolute;top:14px;width:64px;height:20px;border-radius:20px;background:rgba(255,255,255,.85);animation:drift 38s linear infinite}
.pool .cloud:before{content:"";position:absolute;left:12px;top:-10px;width:28px;height:24px;border-radius:50%;background:inherit}
.pool .cloud.c2{top:48px;width:44px;height:14px;opacity:.7;animation-duration:54s;animation-delay:-22s}
@keyframes drift{from{left:-80px}to{left:105%}}
.pool .sunray{transform-origin:330px 34px;animation:spin 60s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.pool .sway{transform-box:fill-box;transform-origin:50% 100%;animation:sway 5s ease-in-out infinite}.pool .sway.s2{animation-delay:-2s}@keyframes sway{50%{transform:rotate(2.5deg)}}
.pool .pin{position:relative;z-index:1;color:var(--deep)}
.pool .lbl{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;opacity:.8}
.pool .amt{font-size:46px;font-weight:800;letter-spacing:-1.5px;line-height:1.1;margin:2px 0}.pool .amt small{font-size:20px;font-weight:700;margin-right:4px}
.pool .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600;background:rgba(255,255,255,.75);color:var(--deep)}
.pill.live{background:var(--green);color:#fff}.dot{width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.bar{height:8px;border-radius:8px;background:rgba(15,61,42,.12);margin-top:12px;overflow:hidden}.bar i{display:block;height:100%;background:var(--green);border-radius:8px;transition:width .8s}
.pool .hint{font-size:12px;margin-top:6px;opacity:.85}
.btn{display:block;width:100%;border-radius:16px;padding:15px;font-weight:700;font-size:17px;text-align:center;transition:transform .12s}
.btn:active{transform:scale(.97)}.btn.go{background:var(--green);color:#fff;box-shadow:0 8px 20px rgba(47,143,91,.28)}
.btn.sun{background:var(--sun);color:#3b2a00}.btn.ghost{border:1.5px solid var(--line);background:#fff}.btn.sm{padding:10px;font-size:14px;border-radius:12px}
.btn[disabled]{opacity:.5}.btn small{font-size:13px;font-weight:700;background:rgba(255,255,255,.24);border-radius:999px;padding:2px 8px;margin-left:6px}
.play{font-size:20px;padding:18px;margin:14px 0 4px;animation:breathe 4s ease-in-out infinite}@keyframes breathe{50%{transform:scale(1.015)}}
.actpill{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:1.5px solid var(--green);background:var(--green2);border-radius:16px;padding:11px 14px;margin:12px 0;font-size:14px;font-weight:600}
.actpill b{font-size:24px;font-weight:400}.actpill span{flex:1;min-width:0}.actpill small{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--green)}.actpill em{font-style:normal;color:var(--green);font-size:20px}
.actpill.done{border-color:var(--line);background:#fff;color:var(--mute)}
.me{display:flex;gap:10px}.me div{flex:1;background:var(--soft);border-radius:14px;padding:10px;text-align:center}.me b{display:block;font-size:20px}.me span{font-size:11px;color:var(--mute)}
.zone{border-radius:12px;padding:9px 12px;font-size:13px;margin-top:10px;font-weight:600}.zone.in{background:var(--green2);color:#1d6b42}.zone.out{background:var(--sun2);color:#7a5600}
.steps{display:grid;gap:10px;margin-top:10px}.steps div{display:flex;gap:10px;align-items:flex-start;font-size:14px}.steps em{font-style:normal;flex:0 0 30px;height:30px;border-radius:10px;background:var(--green2);display:grid;place-items:center}
details summary{font-weight:700;font-size:15px;cursor:pointer;list-style:none}details summary::-webkit-details-marker{display:none}details summary:after{content:"＋";float:right;color:var(--mute)}details[open] summary:after{content:"－"}
.payline{font-size:12.5px;color:var(--mute);background:var(--soft);border-radius:12px;padding:9px 12px;margin-top:12px}
table.lb{width:100%;border-collapse:collapse;font-size:14px}.lb td{padding:9px 4px;border-bottom:1px solid var(--line)}.lb tr:last-child td{border:0}
.lb .rk{width:34px;font-weight:700;color:var(--mute)}.lb .pt{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}.lb tr.inz .rk{color:var(--green)}.lb tr.cut td{border-bottom:2px dashed var(--green)}.lb tr.self{background:var(--sun2)}
.tag{font-size:10px;border-radius:6px;padding:2px 6px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--soft);color:var(--mute);white-space:nowrap}
.tag.kol{background:#efe7ff;color:#6b3fd4}.tag.business{background:#e1f1f8;color:#1f6585}.tag.individual{background:var(--green2);color:#1d6b42}
.tag.platinum{background:var(--deep);color:#fff}.tag.gold{background:var(--sun2);color:#7a5600}.tag.silver{background:#eef0f4;color:#4a5263}.tag.bronze{background:#f7e9df;color:#8a4b1c}
.led{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}.led:last-child{border:0}.led b{white-space:nowrap}.led small{display:block;color:var(--mute);font-size:12px}
.break{display:grid;gap:6px;font-size:14px}.break div{display:flex;justify-content:space-between}.break .tot{border-top:1px solid var(--line);padding-top:8px;font-weight:800;font-size:16px}
.spons{display:flex;flex-wrap:wrap;gap:8px}.spons a,.spons span.s{border:1px solid var(--line);border-radius:12px;padding:8px 10px;font-size:13px;display:flex;gap:6px;align-items:center;color:var(--ink)}
.cta{background:var(--green2);border:0}.cta h3{color:#1d6b42}
.win{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.win:last-child{border:0}.win img{width:64px;height:64px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}.win q{display:block;color:var(--mute);font-size:13px;margin-top:3px}
.tabs{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:center;padding-bottom:env(safe-area-inset-bottom);z-index:6}
.tabs button{flex:1;max-width:130px;padding:9px 0 8px;font-size:11px;color:var(--mute);display:grid;gap:1px}.tabs button span{font-size:20px}.tabs button.on{color:var(--green);font-weight:700}
.foot{text-align:center;color:var(--mute);font-size:11px;padding:18px 0 6px}
/* quiz stage */
.stage{position:fixed;inset:0;background:linear-gradient(#eef9f1,#fff 260px) #fff;z-index:20;overflow:auto}.stage>div{max-width:520px;margin:0 auto;padding:16px 16px 28px;min-height:100%}
.qtop{display:flex;justify-content:space-between;align-items:center}.dots{display:flex;gap:6px}.dots i{width:26px;height:6px;border-radius:6px;background:var(--line)}.dots i.ok{background:var(--green)}.dots i.no{background:var(--clay)}.dots i.cur{background:var(--deep)}
.score{font-weight:800;font-variant-numeric:tabular-nums}
.timer{height:10px;border-radius:12px;background:rgba(15,61,42,.08);margin:14px 0 4px;overflow:hidden}.timer i{display:block;height:100%;border-radius:12px;background:var(--green);width:100%;transition:background .6s}
.timer.y i{background:#b9c84a}.timer.r i{background:var(--sun)}.tsec{text-align:center;font-weight:800;font-size:24px;font-variant-numeric:tabular-nums;color:var(--deep);opacity:.75}
.qcard{margin:12px 0 14px;font-size:19px;font-weight:700;line-height:1.35;min-height:60px}.qcat{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green);display:block;margin-bottom:6px}
.opt{display:flex;gap:12px;align-items:center;width:100%;text-align:left;border:2px solid var(--line);border-radius:16px;padding:14px;margin:10px 0;font-size:16px;font-weight:600;background:#fff;transition:transform .12s,border-color .25s,background .25s}
.opt:active{transform:scale(.98)}.opt em{font-style:normal;flex:0 0 38px;height:38px;border-radius:12px;background:var(--deep);color:#fff;display:grid;place-items:center;font-weight:800;transition:background .25s}
.opt.ok{border-color:var(--green);background:var(--green2)}.opt.ok em{background:var(--green)}.opt.no{border-color:var(--clay);background:var(--clay2)}.opt.no em{background:var(--clay)}.opt.dim{opacity:.45}
.fact{border-radius:16px;padding:14px;background:var(--soft);margin-top:12px;animation:rise .4s ease}.fact b{display:block;margin-bottom:4px}.fact.ok b{color:#1d6b42}.fact.no b{color:#a2512f}.fact a{display:inline-block;margin-top:8px;font-weight:600;font-size:14px}
@keyframes rise{from{opacity:0;transform:translateY(8px)}}
.res{text-align:center}.res .big{font-size:64px;font-weight:800;letter-spacing:-2px;line-height:1;margin:8px 0 2px;color:var(--deep)}.res h2{margin:8px 0 2px}
.ad{text-align:left;border:1.5px solid var(--sun);background:var(--sun2);border-radius:var(--r);padding:14px;margin:14px 0}.ad .hd{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7a5600;margin-bottom:6px}
.ad h4{margin:0 0 4px;font-size:17px}.ad p{margin:0;font-size:14px}.ad .by{display:flex;gap:8px;align-items:center;margin-top:10px;font-size:13px;font-weight:600}.ad img{height:28px;max-width:90px;object-fit:contain}
.links{text-align:left;font-size:14px}.links a{display:block;padding:7px 0;border-bottom:1px solid var(--line)}
.leaf{position:fixed;top:-28px;font-size:20px;z-index:50;animation:fall ease-in forwards;pointer-events:none}@keyframes fall{to{transform:translate(var(--dx),108vh) rotate(var(--rot))}}
/* modal */
.modal{position:fixed;inset:0;background:rgba(15,61,42,.38);z-index:40;display:flex;align-items:flex-end;justify-content:center}.modal[hidden],.stage[hidden],.toast[hidden]{display:none}
.sheet{background:#fff;width:100%;max-width:520px;border-radius:24px 24px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));max-height:92vh;overflow:auto;animation:rise .3s ease}
.sheet h2{margin:0 0 4px;font-size:19px}.sheet .x{float:right;font-size:22px;color:var(--mute);padding:0 4px}
.actpop{text-align:center;padding-top:6px}.actpop .hero{height:132px;border-radius:22px;background:linear-gradient(135deg,#dff3ff,#e1f7ea);display:grid;place-items:center;margin:12px 0;position:relative;overflow:hidden}
.actpop .hero b{font-size:76px;font-weight:400;line-height:1;animation:artbob 3.4s ease-in-out infinite;filter:drop-shadow(0 8px 10px rgba(0,0,0,.12))}.actpop .hero u{position:absolute;border-radius:50%;background:rgba(255,255,255,.55);width:120px;height:120px;left:-36px;top:-46px}.actpop .hero u+u{left:auto;top:auto;right:-24px;bottom:-40px;width:90px;height:90px}
.actpop .k{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}.actpop h2{font-size:22px;line-height:1.3;margin:6px 0}.strk{display:inline-block;background:var(--sun2);color:#7a5600;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;margin-bottom:8px}
label{display:block;font-size:13px;font-weight:600;margin:12px 0 4px}input,select,textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px;font-size:16px;background:#fff}textarea{min-height:76px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--green)}.chk{display:flex;gap:8px;align-items:flex-start;font-weight:400;font-size:12.5px;color:var(--mute)}.chk input{width:20px;height:20px;flex:0 0 20px;margin-top:1px}
.err{color:#a2512f;font-size:13px;min-height:18px;margin-top:8px}.note{background:var(--soft);border-radius:12px;padding:10px;font-size:13px;color:var(--mute);margin-top:8px}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--deep);color:#fff;border-radius:14px;padding:10px 16px;font-size:14px;z-index:60;max-width:90%;text-align:center}
/* question visuals */
.art{position:relative;height:124px;border-radius:22px;margin-top:8px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(135deg,#dff3ff,#e9f6e4)}
.art.c-malaysia{background:linear-gradient(135deg,#fff4d9,#e6f5ec)}.art.c-action{background:linear-gradient(135deg,#e6f5ec,#dff5fb)}.art.c-planet{background:linear-gradient(135deg,#d4efff,#dff5e6)}.art.c-child{background:linear-gradient(135deg,#fff1e8,#fff4d9)}.art.c-sponsor{background:linear-gradient(135deg,#fff4d9,#ffe9c2)}
.art b{font-size:68px;line-height:1;font-weight:400;animation:artin .6s cubic-bezier(.2,1.4,.4,1) both,artbob 3.4s ease-in-out .6s infinite;filter:drop-shadow(0 8px 10px rgba(0,0,0,.12));z-index:1}
.art i{position:absolute;font-style:normal;font-size:38px;top:50%;animation:artside .7s cubic-bezier(.2,1.3,.4,1) both,artfloat 4.5s ease-in-out .7s infinite}
.art .a1{left:11%;--r:-12deg;animation-delay:.12s,.8s}.art .a2{right:11%;--r:12deg;animation-delay:.22s,1s}
.art u{position:absolute;border-radius:50%;background:rgba(255,255,255,.55)}.art u:nth-of-type(1){width:120px;height:120px;left:-36px;top:-46px}.art u:nth-of-type(2){width:80px;height:80px;right:-20px;bottom:-34px}.art u:nth-of-type(3){width:18px;height:18px;right:30%;top:14px;animation:artfloat 3.5s infinite}
@keyframes artin{from{transform:scale(0) rotate(-20deg);opacity:0}}@keyframes artbob{50%{transform:translateY(-6px) rotate(3deg)}}
@keyframes artside{from{transform:translateY(-50%) scale(0);opacity:0}to{transform:translateY(-50%) rotate(var(--r));opacity:1}}@keyframes artfloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
.art.yay{box-shadow:inset 0 0 0 3px var(--green)}.art.yay b{animation:artyay .8s ease both}.art.oops b{animation:artno .9s ease both}
@keyframes artyay{30%{transform:scale(1.3) rotate(-8deg)}60%{transform:scale(.96) rotate(6deg)}100%{transform:scale(1.08)}}@keyframes artno{30%{transform:rotate(-8deg)}60%{transform:rotate(6deg)}100%{transform:none}}
@media (max-height:700px){.art{height:92px}.art b{font-size:52px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* welcome popup + minimal home */
.modal.center{align-items:center;padding:18px}.modal.center .sheet{border-radius:28px;padding:20px 18px;animation:pop .45s cubic-bezier(.2,1.5,.4,1);box-shadow:0 24px 60px rgba(15,61,42,.3)}
@keyframes pop{from{opacity:0;transform:scale(.8) translateY(20px)}}
.pool{padding-bottom:118px}.pool .amt{font-size:54px}
.minilinks{text-align:center;font-size:13px;color:var(--mute);margin:18px 0 0}.minilinks button{color:var(--blue);font-size:13px;padding:0}

/* ---- v1.5: tree, seeds, sponsors, livelier motion ---- */
.card,.thx,.minilinks{animation:cardin .5s ease both}#view>*:nth-child(2){animation-delay:.06s}#view>*:nth-child(3){animation-delay:.12s}#view>*:nth-child(4){animation-delay:.18s}#view>*:nth-child(5){animation-delay:.24s}
.play{animation:cardin .5s ease .06s both,breathe 4s ease-in-out .6s infinite}
@keyframes cardin{from{opacity:0;transform:translateY(12px)}}
.btn{position:relative;overflow:hidden}.btn.go:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);animation:shine 4.5s ease-in-out infinite}@keyframes shine{0%,60%{left:-60%}100%{left:130%}}
.tabs button span{transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.tabs button.on span{transform:translateY(-3px) scale(1.15)}
.lg{height:22px;max-width:96px;object-fit:contain;vertical-align:middle}.lg.sm{height:20px}.lg.big{height:44px;max-width:180px}.lg.txt{display:inline-flex;align-items:center;height:auto;max-width:none;background:#fff;border:1px solid var(--line);border-radius:8px;padding:3px 8px;font-size:12px;font-weight:700;color:var(--deep)}.lg.txt.big{font-size:17px;padding:8px 14px;border-radius:12px}
.tree{width:100%;height:100%;display:block;overflow:visible}.tree .plant{transform-box:fill-box;transform-origin:50% 100%;animation:sway 5s ease-in-out infinite}
.tree.h-thirsty .plant{filter:saturate(.35) brightness(1.05);transform:rotate(7deg) scaleY(.94);animation:none}.tree.h-ready .plant{filter:saturate(.8)}
.tree .petal circle{animation:petal 4s ease-in infinite}.tree .petal circle:nth-child(2){animation-delay:1.3s}.tree .petal circle:nth-child(3){animation-delay:2.6s}@keyframes petal{0%{transform:translate(0,-30px);opacity:0}20%{opacity:1}100%{transform:translate(-8px,34px);opacity:0}}
.tree.watering .plant{animation:growpop 1.1s cubic-bezier(.2,1.5,.4,1) .9s both,sway 5s ease-in-out 2s infinite}@keyframes growpop{0%{transform:scale(.72)}60%{transform:scale(1.1)}100%{transform:scale(1)}}
.tree .drops circle{animation:drop .7s ease-in both}.tree .drops circle:nth-child(2){animation-delay:.12s}.tree .drops circle:nth-child(3){animation-delay:.24s}.tree .drops circle:nth-child(4){animation-delay:.36s}.tree .drops circle:nth-child(5){animation-delay:.48s}@keyframes drop{0%{transform:translateY(-20px);opacity:0}30%{opacity:1}100%{transform:translateY(84px);opacity:0}}
.mine{padding:14px}.treebox{display:flex;gap:12px;align-items:center;margin-bottom:10px}.treebox .tree{flex:0 0 96px;width:96px;height:92px;background:linear-gradient(#dff3ff,#eaf8ee);border-radius:18px}
.tinfo small{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--green)}.tinfo b{display:block;font-size:19px;line-height:1.2}.tinfo span{font-size:13px;color:var(--mute)}
.actpop .hero .tree{width:150px;height:128px}
.thx{text-align:center;margin:16px 0 0}.thx small{display:block;font-size:11px;color:var(--mute);letter-spacing:.04em;margin-bottom:8px}.thx div{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap}
.nudge{position:fixed;left:50%;top:calc(10px + env(safe-area-inset-top));transform:translateX(-50%);z-index:70;width:min(94%,490px);background:#fff;border:1.5px solid var(--sun);border-radius:18px;padding:11px 12px;display:flex;gap:8px;align-items:center;font-size:14px;font-weight:600;box-shadow:0 14px 34px rgba(15,61,42,.2)}.nudge[hidden]{display:none}.nudge.in{animation:nudgein .6s cubic-bezier(.2,1.4,.4,1)}@keyframes nudgein{from{transform:translate(-50%,-90px);opacity:0}}
.nudge span{flex:1}.nudge button{background:var(--green);color:#fff;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700;white-space:nowrap}.nudge button.x{background:none;color:var(--mute);padding:4px}
.score{display:flex;gap:4px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px}.score.bump{animation:bump .3s ease}@keyframes bump{50%{transform:scale(1.22)}}
.seed{position:fixed;left:0;top:0;font-size:18px;font-style:normal;z-index:55;pointer-events:none;will-change:transform}
.plus{position:fixed;z-index:56;transform:translate(-50%,-50%);font-weight:800;font-size:20px;color:var(--green);text-shadow:0 2px 0 #fff,0 0 12px #fff;pointer-events:none;animation:plus 1.4s ease-out both;white-space:nowrap}@keyframes plus{0%{opacity:0;transform:translate(-50%,-20%) scale(.6)}20%{opacity:1;transform:translate(-50%,-90%) scale(1.15)}100%{opacity:0;transform:translate(-50%,-240%) scale(1)}}
.dots i.pop{animation:dotpop .5s cubic-bezier(.2,1.8,.4,1)}@keyframes dotpop{50%{transform:scaleY(2.4)}}
.opt{animation:optin .45s cubic-bezier(.2,1.2,.4,1) both}.opt:nth-child(2){animation-delay:.07s}.opt:nth-child(3){animation-delay:.14s}@keyframes optin{from{opacity:0;transform:translateX(26px)}}
.opt.ok{animation:okpulse .7s ease}.opt.no{animation:nowob .5s ease}@keyframes okpulse{0%{box-shadow:0 0 0 0 rgba(47,143,91,.5)}40%{transform:scale(1.03)}100%{box-shadow:0 0 0 18px rgba(47,143,91,0)}}@keyframes nowob{25%{transform:translateX(-5px)}60%{transform:translateX(4px)}}
.qcard{animation:cardin .45s ease both}
.backer{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:10px;background:var(--sun2);border-radius:12px;padding:7px 10px}.backer small{font-size:11.5px;font-weight:600;color:#7a5600}
.thxline{display:block;margin-top:6px;font-size:12.5px;font-weight:600;color:#1d6b42}
.art.photo{padding:0;height:150px}.art.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:kenburns 14s ease-in-out infinite alternate}.art.photo b{display:none}@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.12) translateY(-3%)}}
.marks{display:flex;gap:10px;justify-content:center;margin:14px 0 4px}.marks i{font-style:normal;font-size:26px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--green2);animation:markin .5s cubic-bezier(.2,1.7,.4,1) both}.marks i.no{background:var(--soft);filter:saturate(.6)}@keyframes markin{from{transform:scale(0) rotate(-40deg);opacity:0}}
.res .big{display:flex;justify-content:center;align-items:baseline;gap:6px}.res .big small{font-size:30px;animation:artbob 3s ease-in-out infinite}.res .msg{margin:6px 0 12px}
.grown{display:flex;gap:12px;align-items:center;text-align:left;background:linear-gradient(135deg,#dff3ff,#eaf8ee);border-radius:18px;padding:8px 12px;margin:0 0 10px;animation:cardin .5s ease 1.6s both}.grown .tw{flex:0 0 84px;height:82px}.grown small{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--green)}.grown b{font-size:16px;line-height:1.3}
.res .me{animation:cardin .5s ease 1.9s both}.res .zone{animation:cardin .5s ease 2.1s both}
.chase{margin-top:10px;border:1.5px dashed var(--green);border-radius:14px;padding:10px 12px;font-size:14px;font-weight:600;color:var(--deep);animation:cardin .5s ease 2.3s both,chase 2.6s ease-in-out 3s infinite}@keyframes chase{50%{background:var(--green2)}}
.ad{position:relative;overflow:hidden;margin-top:16px;text-align:center;padding:16px}.ad:before{content:"";position:absolute;top:0;bottom:0;left:-50%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);animation:shine 5s ease-in-out 1s infinite}
.ad .adlogo{background:#fff;border-radius:14px;padding:12px;margin:8px 0 10px;display:grid;place-items:center;min-height:68px}.ad .by{justify-content:center}.ad h4{font-size:18px}

/* ---- v1.6: ESG buddy ---- */
.av{width:100%;height:100%;display:block;overflow:visible}.av .aveyes{transform-box:fill-box;transform-origin:50% 50%;animation:blink 4.6s infinite}@keyframes blink{0%,94%,100%{transform:scaleY(1)}96.5%{transform:scaleY(.1)}}
.av .avsprout{transform-box:fill-box;transform-origin:50% 100%;animation:sway 3.6s ease-in-out infinite}.av .avmouth{display:none;transform-box:fill-box;transform-origin:50% 30%}
.talking .av .avsmile{display:none}.talking .av .avmouth{display:block;animation:talk .28s ease-in-out infinite alternate}@keyframes talk{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
.fbuddy{position:fixed;right:12px;bottom:calc(98px + env(safe-area-inset-bottom));width:66px;height:66px;z-index:15;touch-action:none;cursor:grab;filter:drop-shadow(0 8px 12px rgba(15,61,42,.28));animation:floaty 4s ease-in-out infinite;user-select:none;-webkit-user-select:none}.fbuddy[hidden],.bubble[hidden]{display:none}
.fbuddy.drag{animation:none;transform:scale(1.12);cursor:grabbing}.fbuddy.talking{animation:none}@keyframes floaty{50%{transform:translateY(-6px)}}
.bubble{position:fixed;z-index:16;background:#fff;border-radius:18px;padding:12px 14px;box-shadow:0 14px 34px rgba(15,61,42,.22);border:1.5px solid var(--green2);animation:pop .35s cubic-bezier(.2,1.5,.4,1)}.bubble p{margin:0 0 10px;font-size:14.5px;font-weight:600;min-height:42px}
.bubble div{display:flex;gap:8px}.bubble button{flex:1;border-radius:999px;padding:7px 10px;font-size:12.5px;font-weight:700;background:var(--soft)}.bubble button.p{background:var(--green);color:#fff}
.tabs button.tb .tav{width:30px;height:30px;margin:-6px auto 0;display:block;font-size:0}.tabs button{max-width:110px}
.bcanvas{display:flex;gap:12px;align-items:center;background:linear-gradient(135deg,#dff3ff,#eaf8ee);border:0;min-height:168px;position:sticky;top:64px;z-index:4;box-shadow:0 8px 22px rgba(47,143,91,.14)}
.bav{flex:0 0 84px;text-align:center}.bav .av{width:84px;height:84px;animation:floaty 4s ease-in-out infinite}.bav b{display:block;font-size:13px;margin-top:2px;color:var(--deep)}
.bvis{flex:1;min-width:0}.vt{font-weight:800;font-size:15px;color:var(--deep);margin-bottom:6px;animation:cardin .4s ease both}
.vsteps{list-style:none;margin:0;padding:0;display:grid;gap:6px}.vsteps li{display:flex;gap:8px;align-items:flex-start;background:rgba(255,255,255,.8);border-radius:12px;padding:7px 9px;font-size:13px;font-weight:600;animation:optin .45s cubic-bezier(.2,1.2,.4,1) both}.vsteps em{font-style:normal;flex:0 0 20px;height:20px;border-radius:50%;background:var(--green);color:#fff;font-size:11px;display:grid;place-items:center;font-weight:800}
.vstat{text-align:center}.vstat i{font-style:normal;font-size:40px;display:block;animation:artin .6s cubic-bezier(.2,1.4,.4,1) both}.vstat b{display:block;font-size:34px;line-height:1.1;color:var(--deep);animation:pop .5s cubic-bezier(.2,1.5,.4,1) .2s both}.vstat span{font-size:13px;color:var(--mute)}
.vbars{display:grid;gap:8px}.vbars span{font-size:12px;font-weight:700}.vbars u{display:block;height:16px;border-radius:10px;background:rgba(255,255,255,.8);overflow:hidden;text-decoration:none}.vbars u i{display:block;height:100%;width:var(--w);border-radius:10px;background:var(--clay);animation:barin 1.1s cubic-bezier(.2,.8,.2,1) both}.vbars u i.good{background:var(--green)}@keyframes barin{from{width:0}}
.vscene{display:flex;gap:10px;justify-content:center;margin-bottom:6px}.vscene i{font-style:normal;font-size:38px;animation:artin .6s cubic-bezier(.2,1.4,.4,1) both,artbob 3.4s ease-in-out .6s infinite}.vscene i:nth-child(2){animation-delay:.12s,.8s;font-size:46px}.vscene i:nth-child(3){animation-delay:.24s,1s}
.chat{display:grid;gap:8px;margin:12px 0}.msg{display:flex;flex-direction:column;align-items:flex-start;animation:cardin .35s ease both}.msg span{max-width:88%;border-radius:18px 18px 18px 6px;padding:10px 13px;background:#fff;border:1px solid var(--line);font-size:15px;white-space:pre-wrap}
.msg.u{align-items:flex-end}.msg.u span{background:var(--green);color:#fff;border:0;border-radius:18px 18px 6px 18px}.msg button{font-size:12px;color:var(--blue);padding:4px 6px}
.dots3 i{font-style:normal;animation:pulse 1.2s infinite}.dots3 i:nth-child(2){animation-delay:.2s}.dots3 i:nth-child(3){animation-delay:.4s}
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chips button{flex:0 0 auto;border:1.5px solid var(--green);color:var(--deep);background:var(--green2);border-radius:999px;padding:8px 12px;font-size:13px;font-weight:600;white-space:nowrap}
.aiform{display:flex;gap:8px;position:sticky;bottom:calc(84px + env(safe-area-inset-bottom));background:linear-gradient(transparent,#fff 30%);padding:10px 0 6px}.aiform input{flex:1;border-radius:999px;padding:12px 16px}.aiform .btn{width:50px;flex:0 0 50px;padding:0;border-radius:50%;height:50px;font-size:18px}

/* combined standing card */
.stand{border-radius:16px;padding:12px 14px;margin-top:10px;text-align:left;animation:cardin .5s ease 2.1s both}.mine .stand{animation-delay:0s}
.stand.in{background:var(--green2)}.stand.out{background:var(--sun2)}.stand strong{display:block;font-size:14.5px;color:var(--deep)}
.stand .rows{display:grid;gap:6px;margin:8px 0 4px}.stand .rows div{display:flex;gap:8px;align-items:center;background:rgba(255,255,255,.75);border-radius:10px;padding:6px 10px;font-size:13px}
.stand .rows i{font-style:normal;color:var(--green);font-size:11px}.stand .rows i.dn{color:var(--mute)}.stand .rows b{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stand .rows span{color:var(--mute);white-space:nowrap;font-size:12.5px}
.stand small{display:block;font-size:12.5px;color:var(--mute)}.stand small:empty{display:none}

/* ---- v1.7: audio panel, featured buddy tab, live canvas, contribute, tour ---- */
.audiopop{position:fixed;top:calc(62px + env(safe-area-inset-top));right:max(12px,calc(50% - 248px));z-index:30;background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px 14px;width:230px;box-shadow:0 14px 34px rgba(15,61,42,.2);animation:pop .3s cubic-bezier(.2,1.5,.4,1)}.audiopop[hidden]{display:none}
.audiopop label{margin:4px 0 10px;font-size:13px}.audiopop input{padding:0;border:0;accent-color:var(--green);height:28px}
.cta2{margin-top:10px;font-size:15px;padding:13px;border-color:var(--green);color:var(--deep);animation:cardin .5s ease .1s both}
.tabs{overflow:visible}.tabs button.tb{position:relative;color:var(--green);font-weight:800;font-size:12px;padding-top:34px}
.tabs button.tb .tav{position:absolute;left:50%;top:-30px;width:64px;height:64px;margin:0 0 0 -32px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#e6f5ec);border:3px solid #fff;box-shadow:0 8px 20px rgba(47,143,91,.35);padding:5px;transform:none!important;animation:floaty 3.6s ease-in-out infinite}
.tabs button.tb .tav:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--green);opacity:0;animation:ringp 2.6s ease-out infinite}.tabs button.tb .tav:after{content:"✨";position:absolute;right:-6px;top:-4px;font-size:14px;animation:twinkle 2.2s ease-in-out infinite}
@keyframes ringp{0%{transform:scale(.85);opacity:.7}100%{transform:scale(1.35);opacity:0}}@keyframes twinkle{50%{transform:scale(1.4) rotate(20deg);opacity:.5}}
.tabs button.tb.on .tav{box-shadow:0 0 0 3px var(--green),0 10px 24px rgba(47,143,91,.45)}
.bcanvas{display:block;position:static;padding:0;overflow:hidden;min-height:0;border:0;background:#fff;box-shadow:0 10px 26px rgba(47,143,91,.16)}
.sc{position:relative;height:128px;background:linear-gradient(135deg,#dff3ff,#e6f5ec);overflow:hidden}
.sc i{position:absolute;font-style:normal;line-height:1}.sc .m{left:50%;top:50%;font-size:60px;margin:-34px 0 0 -30px;animation:artin .6s cubic-bezier(.2,1.4,.4,1) both,artbob 3.4s ease-in-out .6s infinite;filter:drop-shadow(0 8px 10px rgba(0,0,0,.14))}
.sc .p{font-size:30px;animation:artin .6s cubic-bezier(.2,1.4,.4,1) both,artfloat 4s ease-in-out infinite}.sc .p1{left:12%;top:22%;animation-delay:.15s,.2s}.sc .p2{right:13%;top:16%;animation-delay:.3s,.9s}.sc .p3{right:22%;bottom:10%;font-size:24px;animation-delay:.45s,1.5s}
.sc .glow{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),transparent 65%);animation:breathe 3.5s ease-in-out infinite}
.sc .ring{position:absolute;left:50%;top:50%;width:110px;height:110px;margin:-55px;border-radius:50%;border:2px dashed rgba(47,143,91,.35);animation:spin 26s linear infinite}
.sc .gnd{position:absolute;left:-10%;right:-10%;bottom:-34px;height:60px;border-radius:50%;background:rgba(116,198,144,.35)}
.talking .sc .glow{animation:glowtalk .7s ease-in-out infinite alternate}@keyframes glowtalk{from{transform:scale(.9);opacity:.7}to{transform:scale(1.2);opacity:1}}.talking .sc .ring{animation-duration:6s}.talking .sc .p{animation-duration:.6s,1.6s}
.sc.th-energy{background:linear-gradient(135deg,#fff4d9,#ffe9b8)}.sc.th-energy .p2{animation:artin .6s both,flick 1.1s steps(2) infinite}@keyframes flick{50%{opacity:.25;transform:scale(1.25)}}
.sc.th-water,.sc.th-fashion{background:linear-gradient(135deg,#d4efff,#e9f6ff)}.sc.th-water .p1,.sc.th-water .p2,.sc.th-fashion .p1{animation:artin .5s both,dropfall 1.6s ease-in infinite}.sc.th-water .p2{animation-delay:.3s,.8s}@keyframes dropfall{0%{translate:0 -30px;opacity:0}30%{opacity:1}100%{translate:0 60px;opacity:0}}
.sc.th-recycle .m{animation:artin .6s both,spin 9s linear .6s infinite}.sc.th-recycle .p{animation:artin .6s both,orbit 7s linear infinite}@keyframes orbit{0%{translate:0 0}25%{translate:10px -8px}50%{translate:0 -14px}75%{translate:-10px -8px}100%{translate:0 0}}
.sc.th-food{background:linear-gradient(135deg,#fff1e0,#e6f5ec)}.sc.th-food .p{animation:artin .6s both,hop 1.8s ease-in-out infinite}.sc.th-food .p2{animation-delay:.3s,.4s}.sc.th-food .p3{animation-delay:.45s,.8s}@keyframes hop{0%,100%{translate:0 0}40%{translate:0 -14px}}
.sc.th-family,.sc.th-giving{background:linear-gradient(135deg,#fff0f3,#fff4d9)}.sc.th-family .p1,.sc.th-giving .p1,.sc.th-giving .p3{animation:artin .6s both,rise 3s ease-out infinite}@keyframes rise{0%{translate:0 20px;opacity:0}30%{opacity:1}100%{translate:0 -46px;opacity:0}}
.sc.th-career{background:linear-gradient(135deg,#e7ecff,#dff3ff)}.sc.th-career .m{animation:artin .6s both,launch 3.2s ease-in-out .6s infinite}@keyframes launch{0%,100%{translate:-8px 10px}50%{translate:10px -12px}}.sc.th-career .p{animation:artin .6s both,twinkle 1.8s ease-in-out infinite}
.sc.th-business{background:linear-gradient(135deg,#fff4d9,#e6f5ec)}.sc.th-business .p1{animation:artin .6s both,growup 2.4s ease-in-out infinite}@keyframes growup{0%,100%{transform:scale(1)}50%{transform:scale(1.35) translateY(-4px)}}
.sc.th-wellbeing{background:linear-gradient(135deg,#eef0ff,#e6f5ec)}.sc.th-wellbeing .m{animation:artin .6s both,breathe2 5s ease-in-out .6s infinite}@keyframes breathe2{50%{transform:scale(1.18)}}.sc.th-wellbeing .p{animation:artin .6s both,drift2 9s linear infinite}@keyframes drift2{50%{translate:26px 0}}
.sc.th-truth .m{animation:artin .6s both,scan 3.6s ease-in-out .6s infinite}@keyframes scan{0%,100%{translate:-46px 0}50%{translate:46px 0}}.sc.th-truth .p1{left:44%;top:34%;font-size:34px}
.sc.th-nature .p{animation:artin .6s both,flutter 5s ease-in-out infinite}@keyframes flutter{0%,100%{translate:0 0;rotate:0deg}50%{translate:24px -12px;rotate:25deg}}
.sc.th-planet .m{animation:artin .6s both,spin 22s linear .6s infinite}.sc.th-planet .p1{animation:artin .6s both,drift2 8s linear infinite}
.bavrow{display:flex;gap:10px;align-items:flex-end;margin:-34px 14px 0;position:relative}.bav{flex:0 0 72px;width:72px}.bav .av{width:72px;height:72px;filter:drop-shadow(0 6px 10px rgba(15,61,42,.25))}.bname b{display:block;font-size:17px;line-height:1.1}.bname small{font-size:12px;color:var(--mute)}.bname{padding-bottom:4px}
.bvis{padding:10px 14px 14px}.vsteps li{animation:none}.syn{transition:opacity .45s ease,transform .45s cubic-bezier(.2,1.4,.4,1)}.syn.wait{opacity:0;transform:translateX(22px) scale(.96)}.vsteps li.show{background:var(--green2)}
.vstat{display:flex;gap:10px;align-items:baseline}.vstat b{font-size:34px;animation:none}.vstat.syn.wait{transform:scale(.6)}
.vbars u i{animation:none;transition:width 1.1s cubic-bezier(.2,.8,.2,1),opacity .3s}.vbars u i.syn.wait{width:0;opacity:1;transform:none}.vbars u{background:var(--soft)}
.chero{background:linear-gradient(160deg,#e6f5ec,#fff4d9);border:0;text-align:center;padding:20px 16px}.chero h2{margin:6px 0;font-size:22px;color:var(--deep)}.chero p{margin:0 0 10px;font-size:14.5px}.chero ul{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:6px;text-align:left}.chero li{background:rgba(255,255,255,.8);border-radius:12px;padding:8px 10px 8px 34px;font-size:13.5px;font-weight:600;position:relative}.chero li:before{content:"✓";position:absolute;left:11px;color:var(--green);font-weight:800}
.hearts{display:flex;justify-content:center;gap:8px}.hearts i{font-style:normal;font-size:34px;animation:artbob 3s ease-in-out infinite}.hearts i:nth-child(2){font-size:44px;animation-delay:.4s}.hearts i:nth-child(3){animation-delay:.8s}
.ways{display:grid;gap:10px}.ways>div{display:flex;gap:12px;align-items:center;background:var(--soft);border-radius:14px;padding:10px 12px}.ways em{font-style:normal;font-size:28px}.ways b{display:block;font-size:15px}.ways span{font-size:13px;color:var(--mute)}
.hint2{font-size:12.5px;color:var(--mute);margin-top:10px}
.tour .hero{height:150px}.tour .hero .tree{width:150px;height:140px}.tour .hero .av{width:110px;height:110px;animation:floaty 3s ease-in-out infinite}.tour .hero.t0{background:linear-gradient(135deg,#e6f5ec,#fff4d9)}.tour .hero.t2{background:linear-gradient(135deg,#fff4d9,#ffe9c2)}
.tdots{display:flex;gap:6px;justify-content:center;margin-bottom:14px}.tdots i{width:8px;height:8px;border-radius:50%;background:var(--line);transition:all .3s}.tdots i.on{width:22px;border-radius:8px;background:var(--green)}
.stand{animation:none}.res .stand{animation:cardin .5s ease 2.1s both}
.aiform{background:#fff;padding:10px 0 26px;margin:0 -16px;padding-left:16px;padding-right:16px;box-shadow:0 -10px 16px -8px rgba(255,255,255,.95)}
.fbuddy{bottom:calc(128px + env(safe-area-inset-bottom))}
.aiform{bottom:calc(58px + env(safe-area-inset-bottom))}

/* v1.7.1: share banner, cutoff, small contribute button */
.sharebanner{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:space-between;background:rgba(255,255,255,.88);border-radius:14px;padding:9px 12px;margin-top:12px;font-size:14.5px}.sharebanner b{color:var(--deep)}
.sharebanner span{font-size:12.5px;font-weight:700;color:#a2512f;background:var(--sun2);border-radius:999px;padding:3px 10px;white-space:nowrap}
.hintrow{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-top:6px}.hintrow .hint{margin:0}
.addbtn{flex:0 0 auto;background:var(--green);color:#fff;border-radius:999px;padding:7px 12px;font-size:12.5px;font-weight:700;white-space:nowrap;box-shadow:0 4px 10px rgba(47,143,91,.3);animation:breathe 3s ease-in-out infinite}
.lb tr.cutrow td{border:0;padding:8px 0 12px;text-align:center;font-size:12px;font-weight:700;color:var(--green)}

/* v1.8: 17 SDG icons */
.sdghd{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.sdghd span{font-size:12px;font-weight:700;color:var(--green);white-space:nowrap}
.sdggrid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.sdg{position:relative;aspect-ratio:1;border-radius:14px;background:var(--c);color:#fff;display:grid;place-items:center;box-shadow:0 4px 10px color-mix(in srgb,var(--c) 35%,transparent);animation:sdgin .5s cubic-bezier(.2,1.5,.4,1) both;transition:transform .15s}
.sdg:active{transform:scale(.9)}.sdg b{position:absolute;left:6px;top:3px;font-size:12px;font-weight:800}.sdg i{font-style:normal;font-size:22px;margin-top:6px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18))}
.sdg.seen:after{content:"✓";position:absolute;right:-4px;top:-4px;width:17px;height:17px;border-radius:50%;background:#fff;color:var(--green);font-size:11px;font-weight:900;display:grid;place-items:center;box-shadow:0 2px 5px rgba(0,0,0,.18)}
@keyframes sdgin{from{opacity:0;transform:scale(.4) rotate(-12deg)}}
.sdgpop{text-align:center}.sdgbig{width:118px;height:118px;margin:4px auto 10px;border-radius:30px;background:var(--c);color:#fff;position:relative;display:grid;place-items:center;box-shadow:0 14px 30px color-mix(in srgb,var(--c) 45%,transparent);animation:pop .5s cubic-bezier(.2,1.5,.4,1)}
.sdgbig b{position:absolute;left:12px;top:6px;font-size:24px;font-weight:900}.sdgbig i{font-style:normal;font-size:58px;margin-top:10px;animation:artbob 3s ease-in-out infinite}
.sdgpop .k{font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--c)}.sdgpop h2{margin:4px 0 6px;font-size:21px;line-height:1.25}.sdgpop p{margin:0 0 12px;font-size:15px}
.sdgdo{background:var(--green2);border-radius:14px;padding:10px 12px;font-weight:700;font-size:14.5px;margin-bottom:12px}.sdgdo small{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--green);margin-bottom:2px}
.sdgnav{display:flex;gap:8px}.sdgnav .ghost{flex:0 0 52px;font-size:22px;padding:6px}.sdglink{display:block;margin-top:12px;font-size:13px;font-weight:600}.sdgprog{font-size:12px;color:var(--mute);margin-top:6px}

/* v1.8: logo, language menu, contribution form, voice */
.brand svg.logo{width:42px;height:42px;flex:0 0 42px;filter:drop-shadow(0 4px 8px rgba(47,143,91,.25));animation:floaty 5s ease-in-out infinite}
.langbtn{display:inline-flex;align-items:center;gap:5px;font-weight:700}.langbtn span{font-size:14px}.langbtn i{font-style:normal;font-size:10px;color:var(--mute)}
.langpop{position:fixed;top:calc(62px + env(safe-area-inset-top));right:max(12px,calc(50% - 248px));z-index:31;background:#fff;border:1px solid var(--line);border-radius:18px;padding:8px;width:220px;box-shadow:0 14px 34px rgba(15,61,42,.2);animation:pop .3s cubic-bezier(.2,1.5,.4,1)}.langpop[hidden]{display:none}
.langpop small{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding:4px 8px 6px}
.langpop button{display:flex;gap:10px;align-items:center;width:100%;padding:10px;border-radius:12px;text-align:left}.langpop button:hover{background:var(--soft)}.langpop button.on{background:var(--green2)}
.langpop button b{flex:0 0 40px;font-size:13px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:8px;padding:3px 0}.langpop button span{flex:1;font-size:14.5px;font-weight:600}.langpop button i{font-style:normal;color:var(--green);font-weight:900}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.seg label{margin:0}.seg input{position:absolute;opacity:0;pointer-events:none}
.seg span{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;border:1.5px solid var(--line);border-radius:14px;padding:10px 6px;font-size:12.5px;font-weight:700;line-height:1.25;background:#fff;transition:all .2s;min-height:74px;justify-content:center}.seg span i{font-style:normal;font-size:22px}
.seg input:checked+span{border-color:var(--green);background:var(--green2);color:var(--deep);box-shadow:0 0 0 3px rgba(47,143,91,.15);transform:translateY(-1px)}
.logoup{display:flex;gap:12px;align-items:center}.lprev{flex:0 0 64px;height:64px;border-radius:14px;border:1.5px dashed var(--line);display:grid;place-items:center;font-size:26px;background:var(--soft);overflow:hidden}.lprev img{width:100%;height:100%;object-fit:contain;background:#fff}.logoup input{flex:1;padding:8px}
.hintsm{display:block;font-size:12px;color:var(--mute);margin-top:4px}
.amts{display:flex;gap:6px;margin-top:8px}.amts button{flex:1;border:1.5px solid var(--line);border-radius:999px;padding:7px 0;font-size:13px;font-weight:700;background:#fff}.amts button:active{background:var(--green2)}
.ledwho{display:flex;gap:10px;align-items:center;min-width:0}.ledlogo{width:38px;height:38px;flex:0 0 38px;object-fit:contain;border-radius:10px;border:1px solid var(--line);background:#fff;padding:3px}
.tag.anonymous{background:#eef0f4;color:#4a5263}
.sharebanner em.verified{font-style:normal;font-size:12px;font-weight:700;color:#1d6b42;background:var(--green2);border-radius:999px;padding:3px 10px}
.voicing .sc .glow{animation:glowtalk .5s ease-in-out infinite alternate}.voicing .av .avsmile{display:none}.voicing .av .avmouth{display:block;animation:talk .22s ease-in-out infinite alternate}

/* v1.9.1: guided tour */
#coach{position:fixed;inset:0;z-index:95;animation:cmin .3s ease both}#coach.out{opacity:0;transition:opacity .25s}@keyframes cmin{from{opacity:0}}
.cm-hole{position:fixed;box-shadow:0 0 0 9999px rgba(8,32,22,.66);transition:left .45s cubic-bezier(.2,1,.3,1),top .45s cubic-bezier(.2,1,.3,1),width .45s cubic-bezier(.2,1,.3,1),height .45s cubic-bezier(.2,1,.3,1),border-radius .45s;cursor:pointer}
.cm-hole i{position:absolute;inset:-5px;border-radius:inherit;border:3px solid #a8ecc0;animation:cmring 1.6s ease-out infinite;pointer-events:none}
@keyframes cmring{0%{transform:scale(1);opacity:.95}100%{transform:scale(1.14);opacity:0}}
.cm-tip{position:fixed;left:-999px;top:-999px;background:#fff;border-radius:20px;padding:16px 16px 14px;box-shadow:0 18px 44px rgba(0,0,0,.3);opacity:0;transition:top .4s cubic-bezier(.2,1,.3,1),left .4s cubic-bezier(.2,1,.3,1)}
.cm-tip.in{opacity:1;animation:pop .45s cubic-bezier(.2,1.5,.4,1)}
.cm-tip:before{content:"";position:absolute;left:calc(var(--ax,40px) - 10px);top:-10px;border:10px solid transparent;border-top:0;border-bottom-color:#fff}
.cm-tip.up:before{top:auto;bottom:-10px;border-bottom:0;border-top:10px solid #fff}
.cm-k{font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--green)}.cm-tip h3{margin:4px 0 6px;font-size:18px;line-height:1.25;color:var(--deep)}.cm-tip p{margin:0 0 12px;font-size:14.5px;color:#3c5a4c;line-height:1.45}
.cm-foot{display:flex;gap:8px;align-items:center}.cm-dots{display:flex;gap:5px;flex:1}.cm-dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:all .3s}.cm-dots i.done{background:#a8ecc0}.cm-dots i.on{width:20px;border-radius:8px;background:var(--green)}
.cm-skip{padding:9px 12px;border-radius:999px;font-size:13.5px;font-weight:700;color:var(--mute)}.cm-next{padding:10px 16px;border-radius:999px;background:var(--green);color:#fff;font-size:14px;font-weight:800;box-shadow:0 6px 14px rgba(47,143,91,.3);white-space:nowrap}

/* v1.9.1: now playing chip */
#nowplay{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translate(-50%,-80px);z-index:60;background:rgba(15,61,42,.92);color:#fff;border-radius:999px;padding:8px 14px 8px 12px;font-size:13.5px;font-weight:700;display:flex;gap:8px;align-items:center;box-shadow:0 10px 24px rgba(0,0,0,.2);transition:transform .5s cubic-bezier(.2,1.4,.4,1);pointer-events:none;white-space:nowrap}
#nowplay.show{transform:translate(-50%,0)}#nowplay .eq{display:flex;gap:2px;align-items:flex-end;height:12px}#nowplay .eq b{width:3px;background:#a8ecc0;border-radius:2px;animation:eq .7s ease-in-out infinite alternate}#nowplay .eq b:nth-child(2){animation-delay:.2s}#nowplay .eq b:nth-child(3){animation-delay:.4s}
@keyframes eq{from{height:3px}to{height:12px}}