/* ===== SpeakUp English · 2026 look (loads after style.css) ===== */
@font-face{font-family:"Twemoji Country Flags";unicode-range:U+1F1E6-1F1FF,U+1F3F4,U+E0062-E007F;src:url(https://cdn.jsdelivr.net/npm/country-flag-emoji-polyfill@0.1.8/dist/TwemojiCountryFlags.woff2) format("woff2");font-display:swap}
:root{--blue:#7cc4ff;--blue-d:#2878e6;--violet:#7c5cff;--pink:#ff6fa8;--card:rgba(255,255,255,.72);--glass:rgba(255,255,255,.55);--bd:rgba(255,255,255,.7);--sh:0 10px 40px rgba(40,90,200,.16);--r:26px}
.flag{font-family:"Twemoji Country Flags","Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:1.05em;vertical-align:-.08em}
body{background:radial-gradient(1200px 700px at 8% -10%,#cfe6ff 0,transparent 60%),radial-gradient(900px 600px at 100% 0,#ffe0f0 0,transparent 55%),radial-gradient(900px 700px at 50% 110%,#fff1c2 0,transparent 55%),#f3f8ff fixed;font-family:"Inter","Segoe UI Variable","Segoe UI",system-ui,-apple-system,Roboto,"Noto Sans Arabic",sans-serif;letter-spacing:.005em}
body::before{background:linear-gradient(135deg,var(--violet),var(--blue));opacity:.28}body::after{background:linear-gradient(135deg,var(--pink),#ffd36e);opacity:.3}
.card{background:var(--card);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh);transition:transform .25s,box-shadow .25s}
.card:hover{box-shadow:0 14px 50px rgba(40,90,200,.2)}
.top{background:rgba(255,255,255,.62);backdrop-filter:blur(22px) saturate(1.5);border-bottom:1px solid var(--bd);box-shadow:none}
.nav{left:50%;right:auto;transform:translateX(-50%);bottom:10px;width:min(560px,calc(100% - 20px));border-radius:26px;background:rgba(255,255,255,.7);backdrop-filter:blur(22px) saturate(1.5);border:1px solid var(--bd);box-shadow:0 12px 40px rgba(40,90,200,.25)}
.nav button.on{background:linear-gradient(135deg,var(--blue-d),var(--violet));color:#fff;box-shadow:0 6px 18px rgba(80,90,230,.45)}
.btn{background:linear-gradient(135deg,var(--blue-d),var(--violet));box-shadow:0 6px 18px rgba(80,90,230,.35);border-radius:16px}
.btn.big{background:linear-gradient(135deg,#ff6f91,#ff9a62);box-shadow:0 8px 22px rgba(255,111,145,.4)}
.btn.ghost{background:rgba(255,255,255,.8);color:var(--blue-d);box-shadow:inset 0 0 0 2px rgba(124,196,255,.8)}
.brand b{background:linear-gradient(135deg,var(--blue-d),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
input,textarea,select{border-radius:16px}
h2.h{font-size:1.6rem;font-weight:800;background:linear-gradient(135deg,#1f3a5f,#3b5bdb);-webkit-background-clip:text;background-clip:text;color:transparent}
/* auth aurora */
.auth{position:relative;min-height:100vh;display:grid;place-items:center;padding:20px;overflow:hidden}
.aur{position:absolute;inset:-20%;background:conic-gradient(from 0deg at 50% 50%,#7cc4ff,#b69cff,#ff9ac6,#ffd36e,#7cc4ff);filter:blur(90px);opacity:.45;animation:spin 24s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.auth .hero{position:relative;max-width:420px;width:100%}
.lnk{background:none;border:0;color:var(--blue-d);font-weight:600;cursor:pointer;margin-top:8px}
.sel.full,select.full{width:100%;padding:11px 14px;border:2px solid #d4e8fa;background:#fff;font:inherit;margin:6px 0}
/* soap bubble */
.bubw{position:fixed;z-index:200;pointer-events:auto;transform:translate(-50%,-50%)}
.bubble3{width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.95) 0 8%,rgba(255,255,255,.25) 18%,rgba(180,220,255,.25) 55%,rgba(255,150,220,.35) 100%);box-shadow:inset 0 0 18px rgba(255,255,255,.8),inset -6px -8px 20px rgba(255,120,200,.35),inset 8px 8px 18px rgba(120,200,255,.4),0 8px 30px rgba(120,160,255,.35);border:1px solid rgba(255,255,255,.8);animation:bgrow 3s ease-in forwards,bwob 1.1s ease-in-out infinite alternate}
@keyframes bgrow{to{width:220px;height:220px}}@keyframes bwob{to{border-radius:46% 54% 52% 48%/52% 46% 54% 48%}}
.mini{position:absolute;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff,rgba(180,220,255,.4));border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 0 6px rgba(255,255,255,.9)}
.mini.m1{width:14px;height:14px;left:30px;top:-6px;animation:mf1 3s ease-in-out infinite}.mini.m2{width:9px;height:9px;left:-22px;top:20px;animation:mf2 3s ease-in-out infinite}
@keyframes mf1{50%{transform:translate(70px,-60px)}}@keyframes mf2{50%{transform:translate(-60px,50px)}}
.bpop{position:fixed;inset:0;z-index:210;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:rgba(20,30,70,.35);backdrop-filter:blur(6px);animation:fadein .25s}
.bpic{width:170px;height:170px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,var(--blue),var(--pink));display:grid;place-items:center;font-size:4rem;color:#fff;font-weight:800;box-shadow:0 0 0 6px #fff,0 20px 60px rgba(0,0,0,.35);animation:popin .5s cubic-bezier(.2,1.6,.4,1)}
.bpic img{width:100%;height:100%;object-fit:cover}.bpop b{color:#fff;font-size:1.3rem;text-shadow:0 2px 8px rgba(0,0,0,.4)}.bpop small{color:#e8f0ff}
.burst{position:absolute;width:0;height:0}.burst i{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(190,225,255,.9);animation:bs .6s ease-out forwards;transform:rotate(var(--a)) translateX(0)}
@keyframes bs{to{transform:rotate(var(--a)) translateX(150px);opacity:0}}@keyframes popin{from{transform:scale(.2);opacity:0}}@keyframes fadein{from{opacity:0}}.bpop.out{opacity:0;transition:.3s}
.av[data-uid]{cursor:pointer}
/* word sheet */
.sheet{position:fixed;inset:0;z-index:150;background:rgba(20,30,70,.28);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:.25s}
.sheet.open{opacity:1}.sh-in{position:relative;width:min(640px,100%);background:#fff;border-radius:28px 28px 0 0;padding:20px 20px calc(24px + env(safe-area-inset-bottom));box-shadow:0 -16px 50px rgba(0,0,0,.25);max-height:75vh;overflow:auto;transform:translateY(40px);transition:.3s cubic-bezier(.2,1,.3,1)}
.sheet.open .sh-in{transform:none}.sh-x{position:absolute;top:10px;right:12px}.sh-w{font-size:1.7rem;margin:0}.sh-tr{font-size:1.25rem;font-weight:700;color:var(--blue-d);margin:6px 0 10px}
.mn{padding:10px 12px;border-radius:16px;background:#f3f8ff;margin:8px 0}.pill.on,.sv.on{background:var(--yellow)}.sv.on{color:#b78400}
.skel2{height:60px;border-radius:14px;background:linear-gradient(90deg,#eef4fb,#f8fbff,#eef4fb);background-size:200% 100%;animation:sk 1.2s infinite}@keyframes sk{to{background-position:-200% 0}}
.fv.on{color:#ff4d6d;background:#ffe3ea}.fv{margin-left:4px}
.bigw{font-size:2rem}.bigp{font-size:1.4rem;font-weight:700;margin:6px 0}.day .secH{margin-bottom:6px}
/* ambient */
.amb{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}.ambb{border:0;border-radius:20px;padding:14px 8px;background:#f1f6ff;cursor:pointer;display:flex;flex-direction:column;gap:6px;align-items:center;font-size:.8rem;transition:.2s;color:var(--ink)}
.ambb span{font-size:1.8rem}.ambb.on{background:linear-gradient(135deg,#d8f3ff,#e6dcff);box-shadow:0 0 0 2px var(--blue-d),0 8px 22px rgba(80,90,230,.25);animation:pulse 2.4s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 2px var(--violet),0 8px 30px rgba(124,92,255,.4)}}
/* friends */
.od{display:inline-block;width:9px;height:9px;border-radius:50%;background:#c3ccd9;margin-right:6px}.od.on{background:#27c281;box-shadow:0 0 0 4px rgba(39,194,129,.25);animation:pulse2 1.8s infinite}@keyframes pulse2{50%{box-shadow:0 0 0 7px rgba(39,194,129,0)}}
.fr .av{flex:none}.duel{background:linear-gradient(135deg,#fff3d6,#ffe1ea)}
.haha{position:fixed;inset:0;z-index:300;background:rgba(40,20,70,.55);backdrop-filter:blur(6px);display:grid;place-items:center;animation:fadein .2s}
.hh{background:#fff;border-radius:34px;padding:26px;text-align:center;max-width:340px;box-shadow:0 30px 90px rgba(0,0,0,.45);animation:popin .5s cubic-bezier(.2,1.6,.4,1)}
.hpic{position:relative;width:170px;height:170px;margin:0 auto;border-radius:50%;background:linear-gradient(135deg,var(--pink),#ffd36e);display:grid;place-items:center;font-size:4rem;font-weight:800;color:#fff;animation:wobble .5s ease-in-out infinite alternate;box-shadow:0 10px 30px rgba(255,111,168,.5)}
.hpic img{width:100%;height:100%;border-radius:50%;object-fit:cover}.tng{position:absolute;right:-12px;bottom:-4px;font-size:3rem;animation:wobble .4s ease-in-out infinite alternate-reverse}
@keyframes wobble{from{transform:rotate(-9deg) scale(1)}to{transform:rotate(9deg) scale(1.06)}}
.hbub{position:relative;display:inline-block;margin:16px 0 4px;padding:10px 20px;border-radius:20px;background:#ffe27a;font-size:1.8rem;font-weight:900;color:#a14b00;animation:bounce .6s infinite alternate}@keyframes bounce{to{transform:translateY(-8px)}}
/* feed */
.tabs.ft{margin-bottom:12px}.tabs.ft button{flex:1;display:flex;gap:6px;align-items:center;justify-content:center}
.pa{display:flex;gap:8px;align-items:center;margin:10px 0 4px;flex-wrap:wrap}.rt.on{background:#ffe3ea;color:#e0245e}.rs2 span{margin-left:3px;font-size:.75rem}
.rx{display:none;gap:8px;padding:8px;border-radius:20px;background:#f3f7ff;margin:6px 0;flex-wrap:wrap}.rx.show{display:flex;animation:up .25s both}
.rx .r{transition:.2s}.rx .r:hover{transform:scale(1.25) translateY(-4px)}
.mb{margin:6px 0}.lk{display:inline-flex;gap:4px;align-items:center}.lk.on{color:#e0245e}.big-e2{font-size:1.5rem}
/* lessons 3D */
.scene3d{perspective:800px;height:130px;display:flex;align-items:center;justify-content:center;gap:40px;margin:6px 0 10px;position:relative}
.cube{position:relative;width:76px;height:76px;transform-style:preserve-3d;animation:cubespin 14s linear infinite}
.cube i{position:absolute;width:76px;height:76px;display:grid;place-items:center;font-size:2.3rem;font-style:normal;background:rgba(255,255,255,.75);border:1px solid #fff;border-radius:14px;box-shadow:inset 0 0 20px rgba(124,196,255,.4);backface-visibility:visible}
.cube i:nth-child(1){transform:translateZ(38px)}.cube i:nth-child(2){transform:rotateY(90deg) translateZ(38px)}.cube i:nth-child(3){transform:rotateY(180deg) translateZ(38px)}.cube i:nth-child(4){transform:rotateY(-90deg) translateZ(38px)}.cube i:nth-child(5){transform:rotateX(90deg) translateZ(38px)}.cube i:nth-child(6){transform:rotateX(-90deg) translateZ(38px)}
@keyframes cubespin{to{transform:rotateX(360deg) rotateY(720deg)}}
.orbs{display:flex;flex-direction:column;gap:6px}.orbs b{padding:3px 10px;border-radius:99px;background:linear-gradient(135deg,var(--blue),#c9b8ff);color:#fff;font-size:.75rem;animation:float 6s ease-in-out infinite;transform-style:preserve-3d}.orbs b:nth-child(2){animation-delay:-2s}.orbs b:nth-child(3){animation-delay:-4s}
.vc.tilt{transition:transform .15s;transform-style:preserve-3d;will-change:transform}.vpic{position:absolute;right:10px;top:8px;font-size:2rem;filter:drop-shadow(0 6px 6px rgba(0,0,0,.2));animation:float 5s ease-in-out infinite}.vc{position:relative}
/* games */
.gbar{display:flex;align-items:center;gap:10px;margin-bottom:10px}.gbar .gt{flex:1;display:flex;gap:8px;align-items:center;font-size:1.05rem}.duelp{background:linear-gradient(135deg,#ffd36e,#ff9a62);color:#fff}
.gf{position:relative;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(232,240,255,.8));min-height:60vh}
.ghud{display:flex;align-items:center;gap:12px;font-weight:800}.hs{display:flex;gap:6px;align-items:center;background:#fff;border-radius:99px;padding:6px 14px;box-shadow:0 4px 14px rgba(40,90,200,.14)}.hs b{font-size:1.2rem;display:inline-block}.hs .bump{animation:bump .3s}@keyframes bump{50%{transform:scale(1.5);color:var(--pink)}}
.hk{font-size:1.1rem;animation:pulse2 1s infinite}.hl{color:#ff4d6d;display:flex}.hl .i{width:20px;height:20px;fill:#ff4d6d}.ht{background:#fff;border-radius:99px;padding:6px 14px;min-width:50px;text-align:center}.ht.low{color:#fff;background:#ff4d6d;animation:pulse2 .6s infinite}
.gtime{height:8px;border-radius:99px;background:#e1ebfa;margin:10px 0;overflow:hidden}.gtime i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#4fd1a5,#ffd36e,#ff6f91);border-radius:99px;transition:width 1s linear}
.gst{min-height:300px}.rdy{display:grid;place-items:center;text-align:center;min-height:50vh;gap:8px}.cd{font-size:7rem;font-weight:900;background:linear-gradient(135deg,var(--blue-d),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;animation:cdp .65s infinite}@keyframes cdp{from{transform:scale(1.5);opacity:0}}
.card3d{perspective:800px;text-align:center;padding:18px;border-radius:24px;background:#fff;box-shadow:0 14px 40px rgba(40,90,200,.18);animation:cardin .5s both;margin:14px 0}@keyframes cardin{from{opacity:0;transform:rotateX(-40deg) translateY(20px)}}
.qt{font-size:1.35rem;font-weight:700;line-height:1.4}.gap{display:inline-block;min-width:90px;border-bottom:3px dashed var(--blue-d);color:transparent}.bigpic{font-size:5rem;line-height:1.1;animation:float 5s ease-in-out infinite}
.gopts{display:grid;gap:10px;grid-template-columns:1fr 1fr}.gopts.grid{grid-template-columns:repeat(4,1fr)}@media(max-width:520px){.gopts.grid{grid-template-columns:repeat(2,1fr)}}
.gopt{border:0;border-radius:18px;padding:16px 10px;font:inherit;font-weight:700;background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 5px 0 #d4e4fb,0 8px 18px rgba(40,90,200,.12);transition:.12s;animation:optin .4s both;animation-delay:var(--d,0s)}@keyframes optin{from{opacity:0;transform:translateY(16px) scale(.9)}}
.gopt:hover{transform:translateY(-3px)}.gopt:active{transform:translateY(3px);box-shadow:0 1px 0 #d4e4fb}.gopt.ok{background:#d8f8e9;box-shadow:0 5px 0 #4fd1a5;color:#0b7a50}.gopt.bad{background:#ffe0e5;box-shadow:0 5px 0 #ff6f91;color:#b3123c;animation:shk .4s}.gopt.pop{animation:okpop .4s}
@keyframes okpop{50%{transform:scale(1.12)}}.shk{animation:shk .4s}@keyframes shk{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.expl{margin-top:10px;padding:10px 14px;border-radius:14px;background:#fff3d6;color:#7a4b00;text-align:center;font-weight:600}.eo{font-size:2.3rem}
.pt{position:fixed;z-index:400;width:9px;height:9px;border-radius:50%;pointer-events:none;animation:pt .7s ease-out forwards}@keyframes pt{to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
.flt{position:fixed;z-index:400;pointer-events:none;font-size:1.4rem;color:#0fa968;font-weight:900;text-shadow:0 2px 6px rgba(255,255,255,.9);animation:flt .9s ease-out forwards;transform:translateX(-50%)}.flt.neg{color:#e0245e}@keyframes flt{to{transform:translate(-50%,-60px);opacity:0}}
.field{position:relative;height:calc(var(--vh,100vh) - 360px);min-height:220px;border-radius:20px;overflow:hidden;background:linear-gradient(180deg,#dff0ff,#fff6dc 70%,#ffd3dc);border:2px solid #fff}
.fw{position:absolute;top:0;padding:6px 14px;border-radius:99px;font-weight:800;font-size:1.1rem;background:#fff;color:var(--blue-d);box-shadow:0 6px 16px rgba(40,90,200,.25);will-change:transform;white-space:nowrap}.fw.boom{animation:boom .2s forwards}.fw.splat{background:#ffb3c1;color:#b3123c;opacity:.7}@keyframes boom{to{transform:scale(1.8);opacity:0}}
.kbbar{position:fixed;left:0;right:0;bottom:var(--kb,0px);z-index:90;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.92);backdrop-filter:blur(14px);box-shadow:0 -8px 30px rgba(40,90,200,.22)}.fin{flex:1;font-size:1.2rem;font-weight:700;text-align:center;text-transform:lowercase}.fin.shake{animation:shk .3s}
.blanks{font-size:2rem;letter-spacing:.2em;font-weight:800;margin:10px 0;color:var(--blue-d)}.neg{color:#e0245e}
.mgrid{display:grid;gap:10px;margin-top:10px;grid-template-columns:repeat(4,1fr)}.mgrid.c3{grid-template-columns:repeat(3,1fr)}.mc{aspect-ratio:1;border:0;padding:0;background:none;perspective:600px;cursor:pointer}.mf{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .45s}
.mc.up .mf,.mc.done .mf{transform:rotateY(180deg)}.mcb,.mfr{position:absolute;inset:0;display:grid;place-items:center;border-radius:16px;backface-visibility:hidden}.mcb{background:linear-gradient(135deg,var(--blue-d),var(--violet));color:#fff;font-size:1.6rem;font-weight:800}.mfr{background:#fff;transform:rotateY(180deg);box-shadow:inset 0 0 0 3px var(--blue);font-size:.95rem}.mc.done .mfr{background:#d8f8e9;box-shadow:inset 0 0 0 3px #4fd1a5}
.echo{font-size:3rem;min-height:110px;display:grid;place-items:center}.echo small{font-size:1rem;display:block}
.slots{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:14px 0;min-height:54px}.slots i{width:44px;height:50px;border-radius:12px;background:#eef4ff;box-shadow:inset 0 -3px 0 #c9dcfb;display:grid;place-items:center;font-style:normal;font-size:1.5rem;font-weight:800;text-transform:uppercase}.slots i.ok{background:#d8f8e9}.slots i.bad{background:#ffe0e5;animation:shk .4s}.slots.wide{justify-content:flex-start}
.tiles{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:10px 0}.tile{border:0;border-radius:14px;padding:12px 16px;font:inherit;font-size:1.2rem;font-weight:800;background:#fff;box-shadow:0 5px 0 #d4e4fb;cursor:pointer;text-transform:uppercase;color:var(--ink)}.tile.wd{text-transform:none;font-size:1rem;padding:10px 14px}.tile.used{opacity:.25;pointer-events:none}.tile.ph{background:#e8f0ff;text-transform:none;font-size:1rem;padding:8px 12px;box-shadow:none;cursor:default}
.keys{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}.key{width:40px;height:44px;border:0;border-radius:12px;background:#fff;box-shadow:0 4px 0 #d4e4fb;font-weight:800;text-transform:uppercase;cursor:pointer;color:var(--ink)}.key.ok{background:#d8f8e9;box-shadow:0 4px 0 #4fd1a5}.key.bad{background:#ffe0e5;box-shadow:0 4px 0 #ff6f91}.hearts{color:#ff4d6d;display:flex;justify-content:center;gap:4px}
.catw{font-size:2.6rem;font-weight:900;margin:14px 0;min-height:64px}.catw.in{animation:cardin .3s}.flash{animation:flashr .7s}@keyframes flashr{50%{background:#ffe27a}}.tapb{height:84px;font-size:1.6rem}
.sw-word{font-size:3.4rem;font-weight:900;margin:10px 0}.cc{display:flex;gap:8px;align-items:center;justify-content:center}.cc i{width:18px;height:18px;border-radius:50%;display:inline-block}
.res{text-align:center}.res h2{font-size:4rem;margin:0;background:linear-gradient(135deg,var(--blue-d),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}.res .big-e{font-size:3rem;animation:popin .6s}.duelr{margin:10px 0;padding:12px;border-radius:18px;background:#fff3d6}.duelr.win{background:#d8f8e9}.duelr.lose{background:#ffe0e5}
.gc{position:relative;overflow:hidden}.gc::before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;opacity:.25;background:linear-gradient(135deg,var(--blue),var(--violet))}.gc.g1::before{background:linear-gradient(135deg,#ffd36e,#ff6f91)}.gc.g2::before{background:linear-gradient(135deg,#4fd1a5,#7cc4ff)}.gc.g3::before{background:linear-gradient(135deg,#ff9ac6,#b69cff)}.gc.g4::before{background:linear-gradient(135deg,#ffb36e,#ffe27a)}.gc.g5::before{background:linear-gradient(135deg,#7cc4ff,#4fd1a5)}
.gc:hover{transform:translateY(-4px) rotate(-.4deg)}
/* grammar lessons */
.unit{margin:8px 0;border-radius:18px;background:#f3f8ff;padding:6px 12px}.unit summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:8px 0}.whobox{margin:14px 0;padding:14px;border-radius:20px;background:linear-gradient(135deg,#e6f3ff,#efe6ff)}
.mis{display:grid;gap:8px}.bad2,.ok2{padding:10px 14px;border-radius:14px;font-weight:700}.bad2{background:#ffe0e5;color:#b3123c}.ok2{background:#d8f8e9;color:#0b7a50}.gq2{padding:10px 0;border-bottom:1px dashed #d8e5f8}.opt.ok{background:#d8f8e9}.opt.bad{background:#ffe0e5}
.chip.pop{animation:okpop .4s}.btn.tapb{width:100%}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* ===== v5d ===== */
.gscreen{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;background:linear-gradient(160deg,#eaf6ff,#fff8dc);overflow:auto;padding-top:env(safe-area-inset-top)}
.gscreen .gtop{display:flex;align-items:center;gap:10px;padding:12px 16px 12px 16px;padding-right:70px}
.gscreen .gf{flex:1;border-radius:0;box-shadow:none;background:transparent;min-height:0;border:0;padding:8px 14px 120px;overflow:auto}
.gscreen .field{min-height:58vh}
.gclose{position:fixed;top:14px;right:14px;z-index:140;width:52px;height:52px;border-radius:50%;border:0;background:linear-gradient(135deg,#ff9a2e,#ff6a00);color:#fff;display:grid;place-items:center;box-shadow:0 8px 22px rgba(255,106,0,.5);cursor:grab;touch-action:none}
.gclose svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:2.6;pointer-events:none}.gclose:active{cursor:grabbing;transform:scale(1.08)}
.kbbar{z-index:130}
.inw{position:relative;flex:1;display:flex}.inw .fin{width:100%;padding-right:44px}
.clr{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;border:0;background:#e8eef8;color:var(--ink);font-weight:800;cursor:pointer}.clr:hover{background:var(--coral);color:#fff}
.hrow{display:inline-flex;gap:3px;margin-left:8px}.hz svg{width:22px;height:22px;transition:.35s;stroke-width:2}
.hz.full svg{fill:#ff4d6d;stroke:#ff4d6d}.hz.empty svg{fill:transparent;stroke:#b8c4d8}.hz.heal svg{animation:pop .6s}
@keyframes pop{0%{transform:scale(.4)}60%{transform:scale(1.5)}100%{transform:scale(1)}}
.fw.green{background:#d9f9e6;color:#0b8a4a;box-shadow:0 0 0 3px #4fd1a5,0 6px 16px rgba(30,160,100,.35)}
.fw.purple{background:#efe2ff;color:#7a2bd6;box-shadow:0 0 0 3px #a56bff,0 6px 16px rgba(130,60,220,.35)}
.boostb{position:absolute;top:8px;right:10px;background:#a56bff;color:#fff;border-radius:99px;padding:4px 12px;font-weight:800;z-index:3}
main.wide,#main.wide{max-width:none;width:100%}
.pdfc{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:#fff1f0;border:2px solid #ffb3ad;color:var(--ink);text-decoration:none;margin:8px 0}
.pdfi{background:#e5392b;color:#fff;font-weight:800;border-radius:10px;padding:10px 8px;font-size:.8rem}.pdfc small{display:block;color:var(--mut)}
.bdg,.bdg2{display:inline-block;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:99px;background:linear-gradient(135deg,#fff3b0,#ffd0e0);color:#6a3b00;margin-left:4px;vertical-align:middle}
.w.c-s{color:#1e78e6;border-color:#1e78e6}.w.c-d{color:#e5392b;border-color:#e5392b;font-weight:700}.w.c-v{color:#0f9a5a;border-color:#0f9a5a;font-weight:700}.w.c-n{color:#ee7a00;border-color:#ee7a00;font-weight:700}.w.c-a{color:#8e44d6;border-color:#8e44d6}.w.c-p{color:#0b9aa8;border-color:#0b9aa8}.w.c-q{color:#d6247e;border-color:#d6247e;font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}.legend span{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:99px;background:#fff;border:2px solid currentColor}
.legend .c-s{color:#1e78e6}.legend .c-d{color:#e5392b}.legend .c-v{color:#0f9a5a}.legend .c-n{color:#ee7a00}.legend .c-a{color:#8e44d6}.legend .c-p{color:#0b9aa8}.legend .c-q{color:#d6247e}
.easyx{margin:14px 0;padding:12px 14px;border-radius:18px;background:linear-gradient(135deg,#f1fff8,#fffbe6);border:2px dashed #4fd1a5}.easyx h4{margin:0 0 4px}
.wdg{position:fixed;left:12px;bottom:calc(86px + env(safe-area-inset-bottom));z-index:60;width:min(300px,calc(100vw - 24px));background:#fff;border-radius:20px;padding:12px 14px;box-shadow:0 10px 30px rgba(40,90,200,.3);border:2px solid var(--blue);animation:wup .5s}
@keyframes wup{from{transform:translateY(30px);opacity:0}}
.wdg .wh{display:flex;align-items:center;gap:4px;margin-bottom:4px}.wdg .wt{font-weight:700;font-size:1.05rem;margin:4px 0}.wdg .row{margin-top:8px;display:flex;gap:6px}
.wdg.min{width:auto;padding:0;border-radius:50%;border:0}.wmin{width:52px;height:52px;border-radius:50%;border:0;font-size:1.6rem;background:linear-gradient(135deg,var(--blue),var(--yellow));box-shadow:0 8px 20px rgba(40,90,200,.35);cursor:pointer}
.ach-hero{display:flex;gap:16px;align-items:center}.ring{--p:0;width:92px;height:92px;border-radius:50%;display:grid;place-content:center;text-align:center;background:conic-gradient(var(--mint) calc(var(--p)*1%),#e3ecf7 0);position:relative}.ring::before{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff}.ring b,.ring small{position:relative}.ring b{font-size:1.5rem}
.achgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:12px 0}.ach{text-align:center;display:flex;flex-direction:column;gap:4px;align-items:center;opacity:.65}.ach.on{opacity:1;background:linear-gradient(160deg,#fffbe0,#e8fff3)}.ach .ai{font-size:2rem}.ach .bar{width:100%;height:6px;background:#e3ecf7;border-radius:9px;overflow:hidden}.ach .bar i{display:block;height:100%;background:var(--mint)}
.learn .lhead{text-align:center}.learn .lemo{font-size:2.4rem}.learn h3{margin:.2em 0}.lchips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.lbox{position:relative;margin-bottom:10px}.lbox textarea{width:100%;min-height:150px;resize:vertical;border:3px solid transparent;border-radius:20px;padding:16px;font:inherit;font-size:1.05rem;line-height:1.6;background:linear-gradient(#fffdf2,#fffdf2) padding-box,linear-gradient(135deg,#8ecbff,#ffe27a,#ff9ab0) border-box;box-shadow:inset 0 2px 10px rgba(40,90,200,.08),0 8px 24px rgba(40,90,200,.15);box-sizing:border-box}.lbox textarea:focus{outline:0;box-shadow:0 0 0 4px rgba(142,203,255,.5)}.lbox small{position:absolute;right:14px;bottom:10px;color:var(--mut)}
.dchips .chip.on{background:var(--blue-d);color:#fff}.chk{display:flex;gap:8px;align-items:center;margin:10px 0}
.modal{z-index:160}.toast{z-index:170}
.hrow{flex-wrap:nowrap}.ghud .hrow{margin:0 8px}
@media(min-width:900px){.nav{left:0;right:auto;transform:none;top:60px;bottom:0;width:100px;border-radius:0 24px 24px 0;flex-direction:column;justify-content:flex-start;gap:8px;padding:14px 6px;height:auto}.wdg{left:116px;bottom:20px}}
.nbell{position:relative;margin-right:6px}.nbell em{position:absolute;top:-2px;right:-2px;background:var(--coral);color:#fff;border-radius:99px;font-size:.65rem;font-style:normal;padding:1px 6px}
.nrow.new{background:#fff7dc;border-radius:14px}.pfn{cursor:pointer}.pfn:hover{text-decoration:underline}
/* ===== v10: clean professional look ===== */
.btn{border-radius:12px;font-weight:600;letter-spacing:.01em;box-shadow:0 2px 8px rgba(31,58,95,.14);transition:transform .12s,box-shadow .12s,background .12s;display:inline-flex;align-items:center;gap:6px;justify-content:center}
.btn:hover{box-shadow:0 6px 16px rgba(31,58,95,.18)}.btn:active{transform:translateY(1px)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid #d8e2ef;box-shadow:none}.btn.ghost:hover{background:#f4f8fd;border-color:#b9cbe2}
.btn .i,.btn svg{width:18px;height:18px}.btn:disabled{opacity:.55;cursor:not-allowed}
.nbell{position:relative;width:42px;height:42px;border-radius:12px;border:1px solid #d8e2ef;background:#fff;display:grid;place-items:center;cursor:pointer;margin-right:8px;color:var(--ink)}
.nbell svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}.nbell:hover{background:#f4f8fd}
.nbell em{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;line-height:18px;text-align:center;background:#e5392b;color:#fff;border-radius:99px;font-size:.66rem;font-weight:700;font-style:normal;padding:0 5px;box-shadow:0 0 0 2px #fff}
.gfr em{font-style:normal;background:var(--mint);color:#fff;border-radius:99px;padding:0 7px;font-size:.72rem}
.learn .lemo svg{width:40px;height:40px;stroke:#7a5cff;fill:none;stroke-width:1.8}
#wdg.wdg2{position:fixed;left:12px;bottom:calc(86px + env(safe-area-inset-bottom));z-index:60;width:min(320px,calc(100vw - 24px));background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border:1px solid #e3eaf4;border-radius:18px;padding:14px;box-shadow:0 18px 40px rgba(20,40,90,.18);animation:wup .4s}
.w2h{display:flex;align-items:center;gap:10px}.w2h b{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:#5a6b85}.w2h small{display:block;font-size:.7rem;color:#93a2b8}
.w2i{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#2f6fe0,#7a5cff);color:#fff}.w2i svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2}
.w2b{width:30px;height:30px;border-radius:8px;border:0;background:#f1f5fa;display:grid;place-items:center;cursor:pointer;color:#5a6b85}.w2b svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.w2t{font-size:1.35rem;font-weight:800;color:#13294b;margin:10px 0 2px;line-height:1.25}.w2s{font-size:.9rem;color:#5a6b85}.w2m{font-size:.85rem;color:#2f6fe0;margin-top:2px}
.w2a{display:flex;gap:8px;margin-top:12px}.w2btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:10px;padding:9px 10px;font-weight:600;background:#13294b;color:#fff;cursor:pointer}.w2btn.ghost{background:#f1f5fa;color:#13294b}.w2btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
#wdg.wdg2.min{width:auto;padding:0;border-radius:16px;background:transparent;border:0;box-shadow:none}.wmin2{width:54px;height:54px;border-radius:16px;border:0;background:linear-gradient(135deg,#2f6fe0,#7a5cff);display:grid;place-items:center;box-shadow:0 10px 24px rgba(47,111,224,.4);cursor:pointer}.wmin2 svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2}
@media(min-width:900px){#wdg.wdg2{left:116px;bottom:20px}}
.dict .dlis{width:64px;height:64px;margin:8px auto;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#2f6fe0,#7a5cff)}.dict .dlis svg{width:32px;height:32px;stroke:#fff;fill:none;stroke-width:2}
.dbox textarea{width:100%;box-sizing:border-box;min-height:84px;border:2px solid #d8e2ef;border-radius:16px;padding:14px;font:inherit;font-size:1.1rem;resize:none;background:#fff}.dbox textarea:focus{outline:0;border-color:#2f6fe0;box-shadow:0 0 0 4px rgba(47,111,224,.15)}
.dtime{position:relative;height:8px;background:#e3eaf4;border-radius:9px;margin:10px 0;overflow:visible}.dtime i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#4fd1a5,#2f6fe0);border-radius:9px;transition:width 1s linear}.dtime span{position:absolute;right:0;top:-22px;font-size:.8rem;font-weight:700;color:#5a6b85}
.dres{margin-top:10px;padding:12px;border-radius:14px;background:#fff4f2;border:1px solid #ffd2cc}.dres.ok{background:#ecfbf4;border-color:#b6ecd3}.dsent{margin-top:6px;font-size:1.05rem;line-height:1.7}.dsent .dg{color:#0f9a5a;font-weight:700}.dsent .dr{color:#e5392b;font-weight:700;text-decoration:underline}
.gdash .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.gdash .stats div{background:#f4f8fd;border-radius:14px;padding:10px;text-align:center}.gdash .stats b{display:block;font-size:1.3rem}.gdash .stats span{font-size:.75rem;color:#5a6b85}
.gdash table{width:100%;border-collapse:collapse}.gdash td,.gdash th{padding:8px;border-bottom:1px solid #e3eaf4;text-align:left;font-size:.9rem}
@media(max-width:520px){.gdash .stats{grid-template-columns:repeat(2,1fr)}}
.auth .miss,.fi.miss,input.miss,select.miss,textarea.miss{border-color:#e5392b!important;box-shadow:0 0 0 3px rgba(229,57,43,.15)!important}
#msg.err,.err{color:#c62f22}.btn.danger{background:#e5392b}.srow.danger b{color:#c62f22}
.favpost{border:1px solid #e3eaf4;border-radius:14px;padding:12px;margin:8px 0;background:#fff}.favpost .media{max-width:100%;border-radius:12px}
.cmore{display:flex;align-items:center;gap:10px;width:100%;margin:8px 0 4px;padding:10px 14px;border-radius:14px;border:1px solid #d8e2ef;background:linear-gradient(135deg,#f6f9ff,#fff);cursor:pointer;font:inherit;font-weight:600;color:#13294b;transition:background .15s,box-shadow .15s}
.cmore:hover{background:#eef4ff;box-shadow:0 4px 12px rgba(31,58,95,.08)}.cmore .cmt{flex:1;text-align:left}.cmore svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}.cmore.open svg{transform:rotate(180deg)}
.cmav{display:inline-flex}.cmav>*{margin-left:-8px;box-shadow:0 0 0 2px #fff;border-radius:50%}.cmav>*:first-child{margin-left:0}
.applogo{width:72px;height:72px;border-radius:18px;box-shadow:0 8px 20px rgba(31,58,95,.18);margin:4px auto 6px;display:block}
.w3l{width:36px;height:36px;border-radius:10px}.wlogo{padding:0;overflow:hidden;background:#fff}.wlogo img{width:100%;height:100%;object-fit:cover}
@font-face{font-family:"SU Didone";src:url(/fonts/AbrilFatface-Regular.woff) format("woff");font-display:swap}
@font-face{font-family:"SU Script";src:url(/fonts/GreatVibes-Regular.woff) format("woff");font-display:swap}
.sulogo{display:inline-flex;align-items:center;font-family:"SU Didone",Georgia,serif;color:#111;line-height:.8;text-decoration:none}
.sulogo .a{display:flex;flex-direction:column;align-items:flex-end;margin-right:-.06em;position:relative;z-index:1}.sulogo .a b{font-weight:400;font-size:1em}.sulogo .a i{font-style:normal;font-family:Georgia,serif;font-size:.26em;letter-spacing:.45em;margin-top:.18em;margin-right:.2em}
.sulogo .b{font-size:3.9em;letter-spacing:-.07em}
header.top .brand .sulogo{font-size:15px;margin:2px 0 6px}
.auth .hero .sulogo{font-size:30px;margin:8px auto 14px}
.sulogo b,.sulogo .b,.sulogo i{color:#111!important;-webkit-text-fill-color:#111!important;background:none!important}
header.top .brand .sulogo{font-size:12px;margin:0 0 8px}
.auth .hero .sulogo{margin:6px auto 30px}
.sulogo b,.sulogo .b,.sulogo i{color:var(--blue-d)!important;-webkit-text-fill-color:var(--blue-d)!important}
.swrule{font-weight:800;font-size:2rem;letter-spacing:.12em;margin:4px 0 2px}.swrule.ink{color:#2878e6}.swrule.mean{color:#7c5cff}
.nhd{align-items:center;position:sticky;top:0;background:inherit;z-index:2}.nhd h3{margin:0}
.nhd{position:static;background:transparent}
.lgl{display:block;margin:6px 0 2px;font-weight:700}
.cemail{text-align:center}.cemail h3{margin:6px 0}.ce-ic{width:60px;height:60px;margin:0 auto;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#2878e6,#7c5cff)}.ce-ic svg{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:2}
.mailpic{text-align:left;background:#f7f7f7;border:1px solid #dcdcdc;border-radius:16px;padding:14px;margin:12px 0;font-family:Roboto,Arial,sans-serif;color:#111}
.mp-top{display:flex;gap:10px;align-items:center;margin-bottom:10px}.mp-av{width:38px;height:38px;border-radius:50%;background:#f06292;color:#fff;display:grid;place-items:center;font-size:1.1rem;flex:none}
.mp-box{position:relative;border:2.5px solid #2878e6;border-radius:10px;padding:6px 10px;margin:6px 0}.mp-box em{position:absolute;top:-11px;right:-11px;width:22px;height:22px;border-radius:50%;background:#2878e6;color:#fff;font-style:normal;font-weight:700;font-size:.8rem;display:grid;place-items:center}
.mp-box.b1 b{display:block}.mp-box.b1 small{color:#666}.mp-box.b2 h4{margin:0;font-size:1.25rem;line-height:1.2}.mp-box.b3{border-color:#e5392b;background:#fff4f2}.mp-box.b3 em{background:#e5392b}
.mp-link{color:#1a5fd0;text-decoration:underline;font-size:1.05rem}.mp-txt{font-size:.9rem;margin:8px 0}.mp-foot{font-size:.72rem;color:#777;text-align:center;margin:10px 0 0}
.mp-legend{list-style:none;padding:0;margin:0 0 10px;display:flex;flex-direction:column;gap:6px;text-align:start}.mp-legend li{display:flex;gap:8px;align-items:center;font-weight:600}.mp-legend em{width:22px;height:22px;border-radius:50%;background:#2878e6;color:#fff;font-style:normal;display:grid;place-items:center;font-size:.8rem;flex:none}.mp-legend li:last-child em{background:#e5392b}
.vlink{display:block;text-align:center;margin-top:10px;font-weight:600}
@font-face{font-family:"SU Sign";src:url(/fonts/Allura-Regular.woff) format("woff");font-display:swap}
/* v23: menu categories */
.menu details.mcat{border-radius:14px;margin:2px 0}
.menu details.mcat>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;font-weight:700;color:var(--ink);cursor:pointer;user-select:none;position:relative}
.menu details.mcat>summary::-webkit-details-marker{display:none}
.menu details.mcat>summary:hover{background:var(--sky)}
.menu details.mcat>summary .mch{transition:transform .2s;opacity:.7}
.menu details.mcat[open]>summary{background:var(--sky)}
.menu details.mcat[open]>summary .mch{transform:rotate(180deg)}
.menu details.mcat .mcbx{padding:2px 0 6px 14px;border-left:3px solid var(--sky);margin-left:20px}
.menu details.mcat:has(em:not([hidden]))>summary::after{content:'';position:absolute;left:28px;top:9px;width:9px;height:9px;border-radius:50%;background:var(--coral)}
/* v23: one post opened from a notification */
.sback{margin:0 0 10px}
.nhl{animation:nhl 2.6s ease-out 1;border-radius:14px}
.cm.nhl{background:#fff4c2}
@keyframes nhl{0%{box-shadow:0 0 0 0 rgba(255,196,0,.9)}60%{box-shadow:0 0 0 8px rgba(255,196,0,.25)}100%{box-shadow:0 0 0 0 rgba(255,196,0,0)}}
/* v23: banned words list hidden until revealed */
#bwl[hidden]{display:none}
#bwt .i{transition:transform .2s}#bwt.open .i{transform:rotate(180deg)}
/* v23: word card with 3 meanings */
.mn3{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:16px;background:#f3f8ff;margin:8px 0}
.mn3 .mnn{flex:none;width:28px;height:28px;border-radius:50%;background:#2878e6;color:#fff;font-weight:800;display:grid;place-items:center;font-size:.9rem}
.mn3 .mt{margin:0 0 6px;font-size:1.3rem}
.mn3 .mex{background:#fff;border-radius:12px;padding:8px 10px;font-size:.95rem;line-height:1.5}
.mn3 .mex b{color:#2878e6}
.mn3 .mtr{color:var(--mut);margin-top:4px}
/* v24: 4-square loader while waiting */
.skel,.skel2{position:relative}
.skel::after,.skel2::after,.rdy>p.muted:only-child::before{content:'';display:block;width:13px;height:13px;border-radius:4px;background:#2878e6;box-shadow:17px 0 0 #7c5cff,0 17px 0 #7cc4ff,17px 17px 0 #ffd166;animation:sq4 1.2s infinite ease-in-out}
.skel::after,.skel2::after{position:absolute;left:50%;top:50%;margin:-15px 0 0 -15px}
.rdy>p.muted:only-child::before{margin:0 auto 18px;transform-origin:15px 15px}
@keyframes sq4{0%,100%{background:#2878e6;box-shadow:17px 0 0 #7c5cff,0 17px 0 #7cc4ff,17px 17px 0 #ffd166;transform:rotate(0)}25%{background:#7cc4ff;box-shadow:17px 0 0 #2878e6,0 17px 0 #ffd166,17px 17px 0 #7c5cff}50%{background:#ffd166;box-shadow:17px 0 0 #7cc4ff,0 17px 0 #7c5cff,17px 17px 0 #2878e6;transform:rotate(0)}75%{background:#7c5cff;box-shadow:17px 0 0 #ffd166,0 17px 0 #2878e6,17px 17px 0 #7cc4ff}}
@media (prefers-reduced-motion:reduce){.skel::after,.skel2::after,.rdy>p.muted:only-child::before{animation-duration:3s}}
/* v24: real-life phrases cards */
.rlp .rlx{padding:10px 12px;border-radius:14px;background:#f3f8ff;margin:8px 0}
.rlp .rlx small{display:flex;align-items:center;gap:6px;margin-top:4px}
.rlp .rlx small .i{width:14px;height:14px}
/* ===== v25 · SpeakUp Premium ===== */
:root{--gold1:#ffd666;--gold2:#ff9f1c;--goldt:#3b2400;--pv1:#2878e6;--pv2:#7c5cff}
.pbtn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:7px 13px 7px 10px;margin-right:6px;font:800 .82rem/1 inherit;font-family:inherit;color:var(--goldt);background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 6px 18px rgba(255,159,28,.35),inset 0 1px 0 rgba(255,255,255,.6);cursor:pointer;position:relative;overflow:hidden;white-space:nowrap}
.pbtn .i{width:16px;height:16px}
.pbtn::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.7),transparent);animation:pshine 3.2s ease-in-out infinite}
.pbtn.on{background:linear-gradient(135deg,#fff7e0,#ffe6b3);box-shadow:0 0 0 1.5px #f2c14e inset}
.pbtn.on::after{display:none}
@keyframes pshine{0%,60%{left:-60%}100%{left:130%}}
@media (max-width:420px){.pbtn span{display:none}.pbtn{padding:8px}}
.menu .mprem{display:flex;align-items:center;gap:12px;width:100%;margin:4px 0 8px;padding:12px;border-radius:16px;background:linear-gradient(135deg,#fff3cf,#ffe0a3);color:var(--goldt);border:1px solid #f6cf6a;text-align:left}
.menu .mprem .i:first-child{width:26px;height:26px;padding:5px;border-radius:10px;background:linear-gradient(135deg,var(--gold1),var(--gold2));color:var(--goldt)}
.menu .mprem small{display:block;font-weight:500;opacity:.8;font-size:.78rem}
.menu .mprem.on{background:linear-gradient(135deg,#f2f7ff,#e9e4ff);border-color:#d6ccff}
/* paywall */
.pwall{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;background:rgba(14,24,48,.0);backdrop-filter:blur(0);transition:background .25s,backdrop-filter .25s}
.pwall.open{background:rgba(14,24,48,.55);backdrop-filter:blur(6px)}
.pw-card{position:relative;width:100%;max-width:460px;max-height:94vh;overflow:auto;background:#fff;border-radius:28px 28px 0 0;box-shadow:0 -20px 60px rgba(20,40,90,.35);transform:translateY(40px);opacity:0;transition:transform .32s cubic-bezier(.2,.9,.25,1.1),opacity .25s}
.pwall.open .pw-card{transform:none;opacity:1}
@media (min-width:640px){.pwall{align-items:center}.pw-card{border-radius:28px}}
.pw-x{position:absolute;top:12px;right:12px;z-index:3;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.22);color:#fff;display:grid;place-items:center;cursor:pointer}
.pw-hero{position:relative;overflow:hidden;padding:30px 24px 26px;text-align:center;color:#fff;background:linear-gradient(140deg,#1d5fd6 0%,var(--pv1) 40%,var(--pv2) 100%)}
.pw-orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.45}.pw-orb.a{width:180px;height:180px;background:radial-gradient(circle,#8ec5ff,transparent 70%);top:-60px;left:-50px}.pw-orb.b{width:220px;height:220px;background:radial-gradient(circle,#ffd666,transparent 70%);bottom:-120px;right:-70px;opacity:.35}
.pw-crown{position:relative;width:64px;height:64px;margin:0 auto 10px;border-radius:20px;display:grid;place-items:center;color:var(--goldt);background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 10px 26px rgba(255,159,28,.5),inset 0 2px 0 rgba(255,255,255,.6);animation:pfloat 3s ease-in-out infinite}
.pw-crown .i{width:34px;height:34px}.pw-crown.big{width:78px;height:78px;border-radius:24px}.pw-crown.big .i{width:42px;height:42px}
@keyframes pfloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-5px) rotate(3deg)}}
.pw-kick{position:relative;display:inline-block;font-size:.72rem;letter-spacing:.22em;font-weight:800;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.16)}
.pw-hero h2{position:relative;margin:12px 0 6px;font-size:1.55rem;line-height:1.2;color:#fff}
.pw-hero p{position:relative;margin:0;opacity:.92;font-size:.98rem}
.pw-body{padding:18px 20px 22px}
.pw-ben{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px}
.pw-ben li{display:flex;align-items:center;gap:12px}
.pw-ben li b{display:block;color:var(--ink)}.pw-ben li small{color:var(--mut)}
.pw-ic{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center}
.pw-ic .i{width:21px;height:21px}
.pw-ic.b1{background:#e6f0ff;color:#2878e6}.pw-ic.b2{background:#efe9ff;color:#7c5cff}.pw-ic.b3{background:#e3f8f0;color:#1aa874}.pw-ic.b4{background:#fff1d6;color:#e08a00}
.pw-ben.mini{grid-template-columns:1fr 1fr;margin:14px 0}.pw-ben.mini li{gap:8px}.pw-ben.mini .pw-ic{width:32px;height:32px;border-radius:10px}
.pw-plans{display:grid;gap:10px;margin-bottom:14px}
.pw-plan{display:flex;align-items:center;gap:12px;width:100%;padding:14px;border-radius:18px;border:2px solid #e3e9f5;background:#fafcff;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .15s;font:inherit;color:var(--ink)}
.pw-plan:active{transform:scale(.99)}
.pw-plan b{display:block}.pw-plan small{color:var(--mut)}
.pw-plan.on{border-color:#ffb020;background:#fffaf0;box-shadow:0 8px 24px rgba(255,159,28,.18)}
.pw-r{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid #c3cfe2;position:relative}
.pw-plan.on .pw-r{border-color:#ff9f1c}.pw-plan.on .pw-r::after{content:'';position:absolute;inset:3px;border-radius:50%;background:linear-gradient(135deg,var(--gold1),var(--gold2))}
.pw-price{font-weight:900;font-size:1.25rem;white-space:nowrap}.pw-price small{font-weight:600;font-size:.78rem;color:var(--mut)}
.pw-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px 18px;border:0;border-radius:999px;font:900 1.06rem/1 inherit;font-family:inherit;color:var(--goldt);background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 12px 28px rgba(255,159,28,.45),inset 0 1px 0 rgba(255,255,255,.6);cursor:pointer;position:relative;overflow:hidden}
.pw-cta::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);animation:pshine 2.8s ease-in-out infinite}
.pw-cta .i{width:20px;height:20px}
.pw-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:12px 0 4px;font-size:.78rem;color:var(--mut)}
.pw-trust span{display:inline-flex;align-items:center;gap:5px}.pw-trust .i{width:14px;height:14px;color:#1aa874}
.pw-or{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--mut);font-size:.8rem}.pw-or::before,.pw-or::after{content:'';flex:1;height:1px;background:#e3e9f5}
.pw-wait{display:grid;justify-items:center;gap:6px;text-align:center;margin:14px 0 0;padding:14px;border-radius:18px;background:#f3f8ff}
.pw-wait .skel2{width:100%;height:46px;background:none}
.pw-links{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:14px}
.pw-links button{border:0;background:none;color:#2878e6;font:600 .86rem inherit;font-family:inherit;cursor:pointer;padding:6px}
.pw-links i{color:#c3cfe2;font-style:normal}
.pw-key{margin-top:8px;padding:12px;border-radius:16px;background:#f7f9fd}.pw-key label{display:block;font-size:.82rem;color:var(--mut);margin-bottom:6px}
.pwm .card{max-width:440px}
.pw-welcome{text-align:center}.pw-welcome h2{margin:12px 0 6px}.pw-welcome p{color:var(--mut)}
.btn.prem,.pill.prem{background:linear-gradient(135deg,var(--gold1),var(--gold2));color:var(--goldt);border:0}
.btn.prem{box-shadow:0 8px 20px rgba(255,159,28,.35)}
.pill.prem .i{width:13px;height:13px}
/* locked content */
.lvl.premlock{position:relative;overflow:hidden}
.lvl.premlock .ls{filter:blur(4px);opacity:.55;pointer-events:auto}
.lvl.premlock .bar{opacity:.4}
.pr-rib{position:absolute;top:14px;right:-36px;transform:rotate(35deg);padding:5px 44px;font-size:.74rem;font-weight:900;letter-spacing:.08em;color:var(--goldt);background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 4px 12px rgba(255,159,28,.4);display:flex;align-items:center;gap:5px;z-index:2}
.pr-rib .i{width:13px;height:13px}
.pr-unlock{position:absolute;left:50%;top:58%;transform:translate(-50%,-50%);z-index:2;display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border:0;border-radius:999px;font:900 1rem/1 inherit;font-family:inherit;color:var(--goldt);background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 12px 28px rgba(255,159,28,.45);cursor:pointer;white-space:nowrap}
.pr-unlock .i{width:18px;height:18px}
.gc{position:relative}
.gpill{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;font-size:.72rem;font-weight:800}
.gpill .i{width:12px;height:12px}
.gpill.free{background:#e3f8f0;color:#128a5e}.gpill.try{background:#e6f0ff;color:#2878e6}.gpill.lock,.gpill.pro{background:linear-gradient(135deg,var(--gold1),var(--gold2));color:var(--goldt)}
.gc.glock .gi{filter:grayscale(.4)}
.gt-b.plk{position:relative;opacity:.8;padding-right:34px}
.plki{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:7px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold1),var(--gold2));color:var(--goldt)}
.plki .i{width:12px;height:12px}
[data-gb].plk{position:relative;padding-right:34px}
/* certificate preview */
.cp-tabs{display:flex;gap:6px;margin:6px 0 10px}.cp-tabs button{flex:1;padding:8px;border-radius:12px;border:1.5px solid #e3e9f5;background:#fff;font:700 .85rem inherit;font-family:inherit;color:var(--ink);cursor:pointer}.cp-tabs button.on{border-color:#ffb020;background:#fffaf0}
.cp-img{border-radius:16px;overflow:hidden;background:#f3f6fb;min-height:180px;display:grid;place-items:center;box-shadow:0 8px 26px rgba(20,40,90,.12)}
.cp-img img{display:block;width:100%;height:auto}
.certpv .card{max-width:620px}
/* teacher card */
.pmg .pm-pp{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #e9eef6}
.pw-wait[hidden],.pw-key[hidden],.pw-pp[hidden]{display:none}
@media (max-width:480px){.pbtn span{display:none}.pbtn{padding:8px;margin-right:4px}}
.pw-chips{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:2px 0 16px}
.pw-chips span{display:flex;align-items:center;gap:10px;padding:10px;border-radius:16px;background:#f7f9fd;font-weight:700;color:var(--ink);font-size:.92rem}
.pw-chips .pw-ic{width:34px;height:34px;border-radius:11px}
.pw-mem{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:#f7f9fd;margin-bottom:12px}
.pw-mem b{display:block;color:var(--ink)}.pw-mem small{color:var(--mut)}
.pw-man{display:flex;justify-content:center;margin-bottom:12px}
.lvl.premlock,.lvl.premlock.lock{opacity:1;filter:none}
.lvl.premlock>*:not(.pr-rib):not(.pr-unlock){opacity:.75}
.pr-rib{top:24px;right:-44px;padding:6px 52px}