:root{--bg:#0d0f1e;--panel:#161a33;--panel2:#1f2447;--line:#2a3060;--text:#eef0ff;--muted:#9aa0c8;--accent:#ffcc33;--accent2:#5ad1ff;--pink:#ff5c8a;--green:#3ddc97}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Nunito,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
h1,h2,h3,.brand,.f{font-family:Fredoka,Nunito,sans-serif}
a{color:var(--accent2)}
button{font:inherit}
[hidden]{display:none!important}
header{position:sticky;top:0;z-index:20;background:rgba(13,15,30,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:10px 16px}
.brand{font-weight:700;font-size:20px;display:flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap;user-select:none}
.logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--pink));display:grid;place-items:center;color:#1a1030;font-size:18px;font-weight:700}
.brand small{color:var(--accent2);font-weight:600;font-size:15px}
.search{flex:1;display:flex;align-items:center;gap:4px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:0 14px;min-width:0;max-width:520px}
.search input{flex:1;background:none;border:0;color:var(--text);padding:9px 4px;font:inherit;outline:none;min-width:0}
.blog{margin-left:auto;font-weight:800;text-decoration:none;white-space:nowrap;font-size:14px}
@media(max-width:620px){.brand small,.blog{display:none}.brand{font-size:17px}}
.wrap{max-width:1200px;margin:0 auto;padding:16px}
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;background:radial-gradient(circle at 85% 20%,#5b2a86 0,transparent 55%),linear-gradient(135deg,#25195a,#3a1640);border:1px solid var(--line);border-radius:22px;padding:26px;overflow:hidden}
.hero h1{margin:6px 0 8px;font-size:clamp(26px,4.5vw,42px);line-height:1.05}
.hero p{color:#cfd3f5;margin:0 0 18px;max-width:46ch}
.kicker{display:inline-block;background:rgba(255,204,51,.15);color:var(--accent);font-weight:800;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:5px 10px;border-radius:99px}
.hero .acts{display:flex;gap:10px;flex-wrap:wrap}
.mini{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;align-self:center;justify-self:center;width:min(100%,260px);transform:rotate(-4deg)}
.mini span{aspect-ratio:1;display:grid;place-items:center;background:rgba(255,255,255,.07);border-radius:8px;font-family:Fredoka;font-weight:600;font-size:18px;color:#cfd3f5}
.mini span.h{background:var(--accent);color:#1a1030}
@media(max-width:720px){.hero{grid-template-columns:1fr;padding:20px}.mini{display:none}}
.btn{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:9px 14px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.btn:hover{border-color:var(--accent2)}
.btn.pri{background:var(--accent);color:#1a1030;border-color:transparent}
.btn.pri:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.5;cursor:default}
.sec{margin-top:26px}
.sec h2{font-size:20px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.sec h2 .n{color:var(--muted);font-size:14px;font-family:Nunito;font-weight:700}
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none}
.chip{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:999px;padding:8px 15px;font-weight:800;cursor:pointer;white-space:nowrap}
.chip.on{background:var(--accent);color:#1a1030;border-color:transparent}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
@media(max-width:520px){.grid{grid-template-columns:repeat(2,1fr);gap:10px}}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:150px;gap:12px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;transition:transform .15s,border-color .15s}
.card:hover{transform:translateY(-3px);border-color:var(--accent2)}
.thumb{aspect-ratio:4/3;display:grid;place-items:center;font-size:52px;position:relative}
.thumb .em{filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.card.lock .thumb{filter:saturate(.55) brightness(.85)}
.tags{position:absolute;top:8px;left:8px;display:flex;gap:4px}
.tag{background:#10122a;color:var(--accent);font-size:10px;font-weight:800;padding:3px 7px;border-radius:6px;text-transform:uppercase;letter-spacing:.5px}
.soon{position:absolute;bottom:8px;left:8px;background:rgba(16,18,42,.85);color:#cfd3f5;font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px;font-style:normal}
.fav{position:absolute;top:6px;right:6px;width:32px;height:32px;border-radius:50%;border:0;background:rgba(16,18,42,.7);color:#8088b8;font-size:16px;cursor:pointer;display:grid;place-items:center}
.fav.on{color:var(--pink)}
.meta{padding:9px 11px 11px}
.meta .t{font-weight:800;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta .c{color:var(--muted);font-size:12px;font-weight:700}
.ad{border:1.5px dashed #3a4280;border-radius:14px;color:#6c74a8;display:grid;place-items:center;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;min-height:90px;margin:24px 0 0;font-weight:800;text-align:center;padding:8px}
.ad.box{min-height:250px;margin:0}
.empty{color:var(--muted);padding:20px 0}
footer{color:var(--muted);font-size:13px;text-align:center;padding:30px 16px 40px}
/* game view */
.gtop{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.gtop h2{margin:0;flex:1;font-size:24px;min-width:140px}
.glay{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media(max-width:900px){.glay{grid-template-columns:minmax(0,1fr)}}
#stage{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px;position:relative;min-height:440px}
#stage:fullscreen{border-radius:0;overflow:auto;padding:20px}
.side{display:grid;gap:14px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:14px}
.panel h3{margin:0 0 8px;font-size:16px}
.panel p,.panel li{color:#cfd3f5;font-size:14px;margin:0}
.panel ul{margin:0;padding-left:18px;display:grid;gap:4px}
.more{display:grid;gap:8px}
.more .mi{display:flex;gap:10px;align-items:center;cursor:pointer;padding:6px;border-radius:10px}
.more .mi:hover{background:var(--panel2)}
.more .ic{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;font-size:24px;flex:none}
.more b{display:block;font-size:14px}.more small{color:var(--muted);font-weight:700}
/* pre-roll */
.pre{display:grid;place-items:center;gap:14px;min-height:410px;text-align:center}
.pre .lbl{color:var(--muted);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;font-weight:800}
.pre .adv{width:min(100%,420px);aspect-ratio:16/9;border:1.5px dashed #3a4280;border-radius:14px;display:grid;place-items:center;color:#6c74a8;font-weight:800;padding:10px}
/* word search */
.ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
select{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:9px 10px;font:inherit;font-weight:800}
.stats{display:flex;gap:8px;margin:12px 0;flex-wrap:wrap}
.stat{background:var(--panel2);border-radius:10px;padding:6px 12px;font-weight:800;font-size:14px}
.stat span{color:var(--muted);font-weight:700;margin-right:4px}
.ws-body{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;align-items:flex-start}
.ws-grid{--n:9;display:grid;grid-template-columns:repeat(var(--n),1fr);width:min(100%,500px);aspect-ratio:1;background:#0f1230;border-radius:14px;padding:6px;gap:2px;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}
.cell{display:grid;place-items:center;font-family:Fredoka;font-weight:600;font-size:calc(min(84vw,500px) / var(--n) * .52);border-radius:7px;color:#dfe3ff;transition:background .12s,transform .12s}
.cell.f{color:#10122a}
.cell.s{background:var(--accent)!important;color:#10122a;transform:scale(1.06)}
.cell.hint{animation:pulse .45s 4}
@keyframes pulse{50%{background:#fff;color:#10122a;transform:scale(1.2)}}
.ws-side{flex:1;min-width:180px;max-width:500px}
.ws-side h3{margin:0 0 8px;font-size:15px;color:var(--muted)}
.ws-words{display:flex;flex-wrap:wrap;gap:6px}
.w{padding:6px 10px;border-radius:9px;background:var(--panel2);font-weight:800;font-size:13px;letter-spacing:.6px;border-left:4px solid transparent}
.w.done{text-decoration:line-through;opacity:.55}
.ov{position:absolute;inset:0;background:rgba(8,9,20,.86);display:grid;place-items:center;border-radius:inherit;z-index:5;padding:16px}
.ov .box{background:var(--panel2);border:1px solid var(--line);border-radius:20px;padding:24px;text-align:center;width:min(100%,340px)}
.ov h3{font-size:26px;margin:0 0 4px}
.ov .big{font-family:Fredoka;font-size:44px;color:var(--accent);margin:6px 0}
.ov p{color:#cfd3f5;margin:4px 0}
.ov .acts{display:flex;gap:8px;justify-content:center;margin-top:16px;flex-wrap:wrap}
/* quiz */
.qz{max-width:580px;margin:0 auto;padding:6px 0}
.qhead{display:flex;justify-content:space-between;font-weight:800;color:var(--muted);font-size:14px;margin-bottom:8px}
.qbar{height:9px;background:var(--panel2);border-radius:99px;overflow:hidden}
.qbar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--accent));width:100%}
.qq{font-family:Fredoka;font-size:clamp(20px,3.5vw,26px);margin:22px 0 18px;line-height:1.25}
.opts{display:grid;gap:10px}
.opt{text-align:left;padding:15px 16px;border-radius:14px;background:var(--panel2);border:1px solid var(--line);color:var(--text);font-weight:800;font-size:16px;cursor:pointer;display:flex;gap:12px;align-items:center}
.opt:hover:not(:disabled){border-color:var(--accent2)}
.opt .k{width:28px;height:28px;border-radius:8px;background:#10122a;display:grid;place-items:center;font-size:13px;flex:none;color:var(--accent2)}
.opt.ok{background:#1d6a4b;border-color:var(--green)}
.opt.no{background:#6b1f36;border-color:var(--pink)}
.opt:disabled{cursor:default}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:#fff;color:#10122a;font-weight:800;padding:10px 18px;border-radius:12px;opacity:0;transition:.25s;z-index:50;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.chip small{opacity:.6;font-weight:700;margin-left:2px}
.hud{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.hud .btn{padding:6px 12px}
.cv{display:block;margin:0 auto;border-radius:14px;touch-action:none;user-select:none;-webkit-user-select:none;background:#0b0d22}
.tip{text-align:center;color:var(--muted);font-size:13px;margin:10px 0 0}
.board{display:grid;gap:8px;width:min(100%,420px);margin:0 auto;user-select:none;-webkit-user-select:none}
.board .tile{aspect-ratio:1;border-radius:12px;display:grid;place-items:center;font-family:Fredoka;font-weight:700;background:var(--panel2);font-size:clamp(20px,6vw,32px);cursor:pointer;transition:transform .12s,background .15s}
.board .tile:active{transform:scale(.95)}
.g2048{grid-template-columns:repeat(4,1fr);background:#0f1230;padding:8px;border-radius:16px;touch-action:none}
.mem{grid-template-columns:repeat(4,1fr)}
.mem .tile{font-size:clamp(28px,9vw,44px)}
.mem .tile.back{background:linear-gradient(135deg,#6a5cff,#ff5c8a)}
.mem .tile.ok{opacity:.45}
.ttt{grid-template-columns:repeat(3,1fr);width:min(100%,340px)}
.ttt .tile{font-size:clamp(34px,11vw,56px)}
.tile.win{background:#1d6a4b!important}
.ms{grid-template-columns:repeat(9,1fr);gap:3px;width:min(100%,430px)}
.ms .tile{border-radius:6px;font-size:clamp(13px,4.2vw,20px);background:#2c3366}
.ms .tile.open{background:#0f1230;cursor:default}
.ms .tile.boom{background:#6b1f36}
.mole{grid-template-columns:repeat(3,1fr);gap:14px;width:min(100%,360px)}
.hole{aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 70%,#1a0f08 0,#3b2414 55%,#5a3a20 100%);display:grid;place-items:center;font-size:clamp(36px,11vw,60px);cursor:pointer;transition:transform .1s;touch-action:manipulation}
.hole.up{animation:popup .15s ease-out}
.hole.hit{transform:scale(.88);background:radial-gradient(circle,#ffcc33 0,#5a3a20 70%)}
@keyframes popup{from{transform:translateY(12px) scale(.8)}to{transform:none}}
.simon{grid-template-columns:repeat(2,1fr);gap:14px;width:min(100%,340px)}
.pad{aspect-ratio:1;border-radius:24px;opacity:.38;cursor:pointer;transition:opacity .1s,transform .1s;touch-action:manipulation}
.pad.lit{opacity:1;transform:scale(1.04);box-shadow:0 0 30px rgba(255,255,255,.35)}
.lights{grid-template-columns:repeat(5,1fr);width:min(100%,380px)}
.lights .tile{background:#1a1d3a}
.lights .tile.on{background:radial-gradient(circle,#fff6c2 0,#ffcc33 55%,#ff9a00 100%);box-shadow:0 0 18px rgba(255,204,51,.5)}
.slide{grid-template-columns:repeat(4,1fr);width:min(100%,380px)}
.slide .tile{background:linear-gradient(135deg,#5ad1ff,#6a5cff);color:#fff}
.slide .tile.right{background:linear-gradient(135deg,#3ddc97,#13857a)}
.slide .tile.blank{background:transparent;cursor:default}
.c4{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;width:min(100%,430px);margin:0 auto;background:#2347b8;padding:8px;border-radius:16px;user-select:none}
.slot{aspect-ratio:1;border-radius:50%;background:#0d0f1e;cursor:pointer;display:grid;place-items:center}
.slot i{width:88%;height:88%;border-radius:50%;display:block}
.slot i.p1{background:radial-gradient(circle at 35% 35%,#ff8aa8,#e0204f);animation:drop .25s ease-in}
.slot i.p2{background:radial-gradient(circle at 35% 35%,#fff19a,#f4b400);animation:drop .25s ease-in}
.slot i.win{outline:3px solid #fff;outline-offset:-3px}
@keyframes drop{from{transform:translateY(-120px);opacity:.3}to{transform:none}}
.rx{height:min(52vh,380px);border-radius:18px;display:grid;place-content:center;gap:8px;font-family:Fredoka;font-size:clamp(24px,5vw,36px);text-align:center;cursor:pointer;user-select:none;padding:20px;transition:background .1s;touch-action:manipulation}
.rx small{font-family:Nunito;font-size:15px;color:#e6e8ff;font-weight:700}
.kb{display:grid;gap:6px;margin:14px auto 0;max-width:520px;user-select:none}
.kr{display:flex;gap:5px;justify-content:center}
.k{flex:1;max-width:44px;height:50px;border-radius:8px;border:0;background:#3a4170;color:var(--text);font-weight:800;font-size:15px;cursor:pointer;padding:0;touch-action:manipulation}
.k.wide{max-width:70px;flex:1.5;font-size:13px}
.k.hit{background:#2f9e5f}.k.near{background:#c9a227}.k.miss{background:#1a1d3a;color:#5d648f}
.wgrid{display:grid;gap:6px;width:min(100%,300px);margin:0 auto}
.wrow{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.wc{aspect-ratio:1;border:2px solid #2f3566;border-radius:8px;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(22px,7vw,30px);font-weight:700}
.wc.filled{border-color:#6b73a8}
.wc.hit{background:#2f9e5f;border-color:#2f9e5f}.wc.near{background:#c9a227;border-color:#c9a227}.wc.miss{background:#2a2e52;border-color:#2a2e52}
.shake{animation:shake .35s}
@keyframes shake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
.balloons{display:flex;justify-content:center;gap:6px;font-size:clamp(28px,8vw,40px);margin:4px 0 14px}
.balloons span{transition:transform .2s}.balloons .pop{opacity:.5;transform:scale(.8)}
.hword{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:6px}
.hword span{width:clamp(26px,8vw,40px);height:clamp(36px,10vw,50px);border-bottom:3px solid var(--accent2);display:grid;place-items:center;font-family:Fredoka;font-size:clamp(20px,6vw,30px);font-weight:700}
.hword span.sp{border:0}
.hint-line{text-align:center;color:var(--accent2);font-weight:800;margin:4px 0 12px}
.tb-ans,.tb-pool{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;min-height:58px;align-items:center}
.tb-ans{background:#0f1230;border-radius:14px;padding:8px;margin-bottom:12px}
.tb-ph{color:var(--muted);font-weight:700}
.lt{width:clamp(40px,11vw,52px);height:clamp(46px,12vw,58px);border-radius:10px;border:0;background:linear-gradient(180deg,#fff3c4,#ffcc33);color:#2a1f05;font-family:Fredoka;font-size:clamp(20px,6vw,28px);font-weight:700;cursor:pointer;box-shadow:0 3px 0 #b8860b;touch-action:manipulation}
.lt.on{background:linear-gradient(180deg,#d4f4ff,#5ad1ff);box-shadow:0 3px 0 #2a7fa8}
.lt.used{opacity:.2;cursor:default}
.row-btn{display:flex;gap:8px;justify-content:center;margin-top:12px;flex-wrap:wrap}
.alist{display:grid;gap:8px;margin-top:14px;max-width:560px;margin-left:auto;margin-right:auto}
.alist b{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.alist>div>div{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.aw{background:var(--panel2);border-radius:6px;padding:3px 8px;font-weight:800;font-size:13px;letter-spacing:1px;color:#5d648f}
.aw.ok{background:#1d6a4b;color:#fff}
.tline{background:#0f1230;border-radius:14px;padding:16px;font-size:clamp(17px,4.5vw,22px);line-height:1.7;font-weight:700;color:#8a91c4;min-height:120px;margin-bottom:12px}
.tline .cur{color:#10122a;background:var(--accent);border-radius:6px;padding:1px 6px}
.tin{width:100%;background:var(--panel2);border:2px solid var(--line);border-radius:12px;color:var(--text);font:inherit;font-size:20px;font-weight:800;padding:12px 14px;outline:none}
.tin:focus{border-color:var(--accent2)}.tin.err{border-color:var(--pink)}
.mword{text-align:center;font-family:Fredoka;font-size:clamp(34px,10vw,56px);letter-spacing:6px;margin:20px 0}
.mword b{color:var(--accent)}
.mopts{grid-template-columns:repeat(4,1fr);max-width:420px;margin:0 auto}
.mopts .opt{justify-content:center;font-family:Fredoka;font-size:26px}
.crypt{display:flex;flex-wrap:wrap;gap:14px 18px;justify-content:center;margin:6px 0}
.cw{display:flex;gap:3px}
.cc{width:clamp(26px,7.5vw,34px);border:0;background:none;padding:0;cursor:pointer;display:grid;gap:2px;color:var(--text)}
.cc b{height:clamp(30px,8vw,38px);border-bottom:3px solid #4a5290;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(17px,5vw,22px);border-radius:6px 6px 0 0}
.cc small{font-size:11px;color:var(--muted);font-weight:800}
.cc.sel b{background:rgba(255,204,51,.25);border-color:var(--accent)}
.cc.given b{color:var(--green)}
.syn{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:520px;margin:0 auto}
.syn>div{display:grid;gap:8px}
.syn .opt{justify-content:center;padding:13px 8px}
.opt.pick{border-color:var(--accent);background:#4a3d10}
.opts.two{grid-template-columns:1fr 1fr}
.opts.two .opt{justify-content:center;font-size:18px}
.qq.qbig{font-size:clamp(34px,9vw,52px);text-align:center}
.npad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:320px;margin:14px auto 0}
.npad .k,.npad9 .k{max-width:none;height:54px;font-size:22px;font-family:Fredoka}
.npad9{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;max-width:420px;margin:12px auto 0}
.npad9 .k{height:48px}
.npad9 .k:disabled{opacity:.25}
.sdk{display:grid;grid-template-columns:repeat(9,1fr);width:min(100%,430px);margin:0 auto;border:2px solid #8a91c4;border-radius:8px;overflow:hidden;user-select:none}
.sc{aspect-ratio:1;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(16px,5vw,24px);color:#7bdcff;border-right:1px solid #2a3060;border-bottom:1px solid #2a3060;cursor:pointer;background:#141834}
.sc.given{color:#eef0ff;font-weight:700}.sc.peer{background:#1c2148}.sc.same{background:#2b3470}.sc.sel{background:#4a3d10}.sc.bad{color:#ff5c8a}
.sc.br{border-right:2px solid #8a91c4}.sc.bb{border-bottom:2px solid #8a91c4}
.m3{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;width:min(100%,440px);margin:0 auto;background:#0f1230;padding:6px;border-radius:14px;touch-action:none;user-select:none}
.mt{aspect-ratio:1;display:grid;place-items:center;font-size:clamp(22px,7vw,36px);border-radius:8px;background:#1a1f42;cursor:pointer;transition:transform .15s}
.mt.sel{background:#4a3d10;transform:scale(1.08)}.mt.pop{animation:mpop .26s forwards}
@keyframes mpop{to{transform:scale(1.4);opacity:0}}
.nono{display:grid;gap:2px;width:min(100%,460px);margin:0 auto;touch-action:none;user-select:none}
.nono.win .nt.f{background:var(--green)}
.nc{color:#cfd3f5;font-weight:800;font-size:clamp(10px,2.8vw,14px);display:flex;align-items:flex-end;justify-content:center;text-align:center;line-height:1.15;padding:2px}
.nc.rowc{justify-content:flex-end;align-items:center;padding-right:6px;white-space:nowrap}
.nc.done{color:#4a5290}
.nt{aspect-ratio:1;background:#1f2447;border-radius:3px;cursor:pointer;display:grid;place-items:center;color:#6c74a8;font-size:clamp(10px,3vw,16px)}
.nt.f{background:var(--accent2)}.nt.br{margin-right:3px}.nt.bb{margin-bottom:3px}
.bpb{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;width:min(100%,400px);margin:0 auto;background:#0f1230;padding:6px;border-radius:14px}
.bc{aspect-ratio:1;border-radius:5px;background:#1a1f42}.bc.pv{background:rgba(90,209,255,.45)}.bc.pvbad{background:rgba(255,92,138,.35)}
.tray{display:flex;justify-content:space-around;align-items:center;gap:10px;margin-top:14px;min-height:96px;touch-action:none}
.tp{display:grid;gap:2px;padding:8px;border-radius:12px;cursor:grab;border:2px solid transparent}
.tp i{border-radius:3px}.tp.sel{border-color:var(--accent);background:#2a2550}.tp.dead{opacity:.3}.tp.empty{width:60px}
.tubes{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:20px 0}
.tube{width:46px;height:178px;border:3px solid #8a91c4;border-top:0;border-radius:0 0 24px 24px;display:flex;flex-direction:column-reverse;padding:3px;gap:2px;cursor:pointer;transition:transform .15s;overflow:hidden}
.tube i{height:40px;border-radius:4px;flex:none}.tube i:first-child{border-radius:4px 4px 20px 20px}
.tube.up{transform:translateY(-16px);border-color:var(--accent)}.tube.full{border-color:var(--green)}
.pipes{display:grid;gap:3px;width:min(100%,440px);margin:0 auto;background:#0f1230;padding:6px;border-radius:14px}
.pt{aspect-ratio:1;background:#1a1f42;border-radius:6px;cursor:pointer}.pt svg{width:100%;height:100%;display:block}
.jig{display:grid;gap:3px;width:min(100%,440px);margin:0 auto}
.jp{aspect-ratio:1;border-radius:6px;cursor:pointer;border:3px solid transparent;transition:transform .15s}
.jp.sel{border-color:var(--accent);transform:scale(.94)}.jp.ok{cursor:default}.jig.win{gap:0}.jig.win .jp{border-radius:0;border:0}
.ucw{position:relative;width:min(100%,400px);margin:0 auto}
.ucb{position:relative;width:100%;aspect-ratio:1;background:#1a1f42;border-radius:14px;background-image:linear-gradient(#2a3060 1px,transparent 1px),linear-gradient(90deg,#2a3060 1px,transparent 1px);background-size:16.666% 16.666%;touch-action:none;overflow:visible}
.exit{position:absolute;right:-6px;top:33.33%;height:16.66%;display:grid;place-items:center;color:var(--green);font-weight:800;font-size:11px;transform:translateX(100%)}
.car{position:absolute;padding:4px;cursor:grab;transition:left .12s,top .12s}
.car::after{content:'';display:block;width:100%;height:100%;border-radius:10px;background:var(--c);box-shadow:inset 0 -5px 0 rgba(0,0,0,.25)}
.car.red::after{background:linear-gradient(90deg,#ff3b5c,#ff7a8e)}
.bigbox{background:#0f1230;border-radius:16px;min-height:150px;display:grid;place-content:center;gap:6px;text-align:center;font-size:40px;padding:16px}
.bigbox small{font-size:14px;color:var(--muted);font-weight:700}
.dig{font-family:Fredoka;font-size:clamp(30px,9vw,48px);letter-spacing:3px;word-break:break-all}
.dig.op{color:var(--accent)}.wrongtxt{color:var(--pink)}
.bar1{height:6px;background:#1f2447;border-radius:9px;overflow:hidden;margin:8px 0 0}.bar1 i{display:block;height:100%;width:0;background:var(--accent)}
.pat{display:grid;gap:8px;margin:0 auto}
.pc{aspect-ratio:1;background:#1f2447;border-radius:10px;cursor:pointer;transition:background .15s}.pc.lit{background:var(--accent2)}.pc.wrong{background:var(--pink)}
.stw{font-family:Fredoka;font-size:clamp(44px,13vw,72px);font-weight:700;letter-spacing:2px}
.cbtns{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-top:12px}
.cbtns .opt{justify-content:center;font-size:14px}.sw{width:18px;height:18px;border-radius:50%;display:inline-block}
.odd{display:grid;gap:4px;width:min(100%,440px);margin:0 auto;user-select:none}
.odd>div{aspect-ratio:1;display:grid;place-items:center;background:#1a1f42;border-radius:8px;cursor:pointer}
.odd>div.no{background:#6b1f36}.odd>div.ok{background:#1d6a4b}
.spot{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sg{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:#0f1230;padding:4px;border-radius:12px;user-select:none}
.sg>div{aspect-ratio:1;display:grid;place-items:center;font-size:clamp(14px,4.2vw,26px);border-radius:6px;cursor:pointer}
.sg>div.ok{background:#1d6a4b;box-shadow:0 0 0 2px var(--green) inset}.sg>div.no{background:#6b1f36}
.hanoi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;height:240px;margin-top:10px}
.peg{position:relative;display:flex;flex-direction:column-reverse;align-items:center;gap:3px;padding-bottom:10px;border-bottom:6px solid #8a91c4;cursor:pointer;border-radius:8px}
.peg.sel{background:rgba(255,204,51,.08)}
.pole{position:absolute;bottom:0;left:50%;width:6px;height:90%;background:#4a5290;transform:translateX(-50%);border-radius:3px}
.peg i{height:22px;border-radius:8px;z-index:1;transition:transform .15s}.peg i.lift{transform:translateY(-24px)}
.rev{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;width:min(100%,440px);margin:0 auto;background:#0b4a2c;padding:5px;border-radius:12px}
.rc{aspect-ratio:1;background:#147a46;border-radius:4px;display:grid;place-items:center;cursor:pointer;position:relative}
.rc.can::after{content:'';width:22%;height:22%;border-radius:50%;background:rgba(0,0,0,.35)}
.rc i{width:82%;height:82%;border-radius:50%}.rc i.bk{background:radial-gradient(circle at 35% 35%,#555,#0a0a0a)}.rc i.wh{background:radial-gradient(circle at 35% 35%,#fff,#cfcfcf)}
.chk{display:grid;grid-template-columns:repeat(8,1fr);width:min(100%,440px);margin:0 auto;border-radius:10px;overflow:hidden;border:4px solid #5a3a20}
.cq{aspect-ratio:1;background:#f0d9b5;display:grid;place-items:center}.cq.dk{background:#8b5a33;cursor:pointer}
.cq.sel{background:#c9a227}.cq.dest{background:#2f9e5f}
.cq i{width:78%;height:78%;border-radius:50%;display:grid;place-items:center;font-size:clamp(10px,3vw,16px);font-style:normal;box-shadow:inset 0 -4px 0 rgba(0,0,0,.3)}
.cq i.pr{background:#e0204f}.cq i.pb{background:#222}.cq i.mv{outline:2px solid #ffcc33}
.dots{width:min(100%,380px);margin:0 auto}.dots svg{width:100%;display:block}.hitl{cursor:pointer}
.cgk{display:grid;grid-template-columns:64px 1fr 64px;grid-template-rows:auto auto;gap:8px;background:#5a3a20;padding:10px;border-radius:40px;max-width:640px;margin:0 auto}
.house{grid-row:1/3;border-radius:30px;background:#3b2414;display:grid;place-content:center;text-align:center;gap:4px}
.house b{font-family:Fredoka;font-size:26px}.house small{font-size:10px;color:#e0c9a8;font-weight:800}
.house.ai{grid-column:1}.house.me{grid-column:3}
.rowt,.rowb{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;grid-column:2}
.hl{aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#2a170b,#4a2e18);display:grid;place-content:center;text-align:center;position:relative}
.hl b{font-family:Fredoka;font-size:clamp(13px,3.6vw,18px);z-index:1}
.hl .seeds{position:absolute;inset:18%;font-size:9px;line-height:7px;color:#f5deb3;overflow:hidden;word-break:break-all;opacity:.55}
.hl.can{cursor:pointer;box-shadow:0 0 0 2px var(--accent)}.hl.last{box-shadow:0 0 0 3px var(--green)}
.rules{margin-top:12px;color:var(--muted);font-size:13px}.rules summary{cursor:pointer;font-weight:800;color:var(--text)}
@media(max-width:520px){.cgk{grid-template-columns:42px 1fr 42px;padding:6px;gap:5px;border-radius:24px}.rowt,.rowb{gap:3px}.hl .seeds{display:none}.house b{font-size:20px}.house small{font-size:8px}#stage{padding:10px}}
.kc{max-width:560px;margin:0 auto}
.kc-top{position:relative;text-align:center;padding:10px 0 4px;overflow:hidden}
.kc-n{font-family:Fredoka;font-size:clamp(28px,8vw,40px);font-weight:700}
.kc-ps{color:var(--muted);font-weight:800;font-size:13px;margin-bottom:10px}
.kc-tip{color:var(--muted);font-size:12px;margin-top:8px}
.kuih{width:min(60vw,210px);aspect-ratio:1.25;border:0;border-radius:18px;padding:0;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;transform:rotate(-6deg);box-shadow:0 14px 0 rgba(0,0,0,.25),0 0 40px rgba(255,92,138,.25);touch-action:manipulation}
.kuih span{flex:1}.kuih span:nth-child(odd){background:#e84a7f}.kuih span:nth-child(even){background:#f7e9d7}.kuih span:nth-child(3){background:#3bbf7a}.kuih span:nth-child(6){background:#c2185b}
.kuih.tap{animation:ktap .15s}@keyframes ktap{50%{transform:rotate(-6deg) scale(.92)}}
.kfloat{position:absolute;font-family:Fredoka;font-weight:700;color:var(--accent);pointer-events:none;animation:kfl .8s forwards;font-size:22px}
@keyframes kfl{to{transform:translateY(-70px);opacity:0}}
.kc-shop{display:grid;gap:8px;margin-top:12px}
.kitem{display:flex;align-items:center;gap:12px;background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:10px 12px;color:var(--text);text-align:left;cursor:pointer}
.kitem:disabled{opacity:.45;cursor:default}.kitem .ki{font-size:28px}.kitem span:nth-child(2){flex:1}.kitem b{display:block}.kitem small{color:var(--muted);font-weight:700}.kitem em{font-style:normal;font-weight:800;color:var(--accent)}
.logo-img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(90,209,255,.35))}
.hero-logo{width:min(100%,300px);justify-self:center;align-self:center;filter:drop-shadow(0 10px 30px rgba(255,204,51,.25));animation:float 4s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px) rotate(-1.5deg)}}
@media(max-width:720px){.hero-logo{order:-1;width:170px;margin:-6px 0 -4px}}
@media(prefers-reduced-motion:reduce){.hero-logo{animation:none}}
.clue{display:flex;align-items:center;gap:8px;background:#0f1230;border-radius:12px;padding:8px;margin-bottom:10px;max-width:430px;margin-left:auto;margin-right:auto}
.clue span{flex:1;font-weight:700;font-size:15px;text-align:center}.clue b{color:var(--accent2);margin-right:4px}
.clue button{background:var(--panel2);border:0;color:var(--text);width:34px;height:34px;border-radius:8px;font-size:20px;cursor:pointer}
.cwg{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;width:min(100%,330px);margin:0 auto}
.cwc{aspect-ratio:1;background:#eef0ff;color:#10122a;border-radius:4px;position:relative;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(22px,7vw,30px);font-weight:700;cursor:pointer}
.cwc small{position:absolute;top:2px;left:4px;font-size:10px;font-family:Nunito;font-weight:800;color:#555}
.cwc.blk{background:#10122a;cursor:default}.cwc.hl{background:#cfe9ff}.cwc.sel{background:#ffcc33}.cwc.bad{color:#e0204f}.cwc.rev{color:#2a7fa8}.cwc.ok{background:#bff0d6}
.ladder{display:grid;gap:6px;justify-items:center;margin:4px 0 6px}
.lw{display:flex;gap:5px}.lw span{width:42px;height:46px;border-radius:8px;background:var(--panel2);display:grid;place-items:center;font-family:Fredoka;font-size:24px;font-weight:700}
.lw span.chg{background:#3a4170;color:var(--accent)}.lw.start span{background:#2a3570}.lw.goal span{background:#1d6a4b}.lw.input span{border:2px dashed #4a5290;background:transparent}.lw.goal.ok span{background:#2f9e5f}
.lgcur{text-align:center;font-family:Fredoka;font-size:26px;font-weight:700;min-height:36px;color:var(--accent);letter-spacing:3px}
.lgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:min(100%,340px);margin:0 auto;touch-action:none;user-select:none}
.lc{aspect-ratio:1;border-radius:12px;background:linear-gradient(180deg,#fff3c4,#ffcc33);color:#2a1f05;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(26px,8vw,36px);font-weight:700;box-shadow:0 4px 0 #b8860b}
.lc.on{background:linear-gradient(180deg,#d4f4ff,#5ad1ff);box-shadow:0 4px 0 #2a7fa8}
.wcslots{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:8px}
.wcw{display:flex;gap:3px}.wcw span{width:30px;height:32px;border-radius:6px;background:#2a3060;display:grid;place-items:center;font-family:Fredoka;font-weight:700;font-size:18px}
.wcw span.ok{background:#3ddc97;color:#10122a}.wcw span.rv{background:#5ad1ff;color:#10122a}
.wheel{width:min(80vw,280px);margin:0 auto;touch-action:none;user-select:none}.wheel svg{width:100%;display:block}
.chain{background:#0f1230;border-radius:14px;padding:10px;height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.cm{align-self:flex-start;background:var(--panel2);padding:6px 12px;border-radius:12px;font-weight:800;letter-spacing:1px}.cm span{display:block;font-size:10px;color:var(--muted);letter-spacing:0}
.cm.me{align-self:flex-end;background:#2a3570}
.duel{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;background:#0f1230;border-radius:14px;padding:10px;margin-bottom:12px;text-align:center}
.duel b{display:block;font-size:14px}.duel span{font-family:Fredoka;font-size:26px}.duel small{display:block;color:var(--muted);font-size:11px}.duel .vs{font-family:Fredoka;color:var(--accent)}
.opt em.cpu{margin-left:auto;font-style:normal}
.flag{width:min(70%,240px);display:block;margin:0 auto 12px;border-radius:6px;box-shadow:0 4px 18px rgba(0,0,0,.4)}
.mjw{width:min(100%,520px);margin:0 auto}
.mj{position:relative;aspect-ratio:1.32;margin-top:8px}
.mt2{position:absolute;width:11.4%;height:18.4%;background:linear-gradient(180deg,#fffaf0,#efe3c6);border-radius:7px;box-shadow:2px 3px 0 #b49a66,3px 5px 0 #6b5a3a;display:grid;place-items:center;font-size:clamp(16px,5vw,28px);cursor:pointer}
.mt2.lock{filter:brightness(.72)}.mt2.sel{background:linear-gradient(180deg,#fff3a8,#ffcc33)}.mt2.hint{outline:3px solid #3ddc97}
.sokw{width:min(100%,400px);margin:0 auto}.sok{display:grid;gap:0;background:#2b2f45;border-radius:12px;overflow:hidden;touch-action:none}
.sk{aspect-ratio:1;display:grid;place-items:center;font-size:clamp(16px,6vw,30px);background:#d9c7a0}.sk.wall{background:#5a3a20;box-shadow:inset 0 -4px 0 #3b2414}.sk.goal{background:#e8d9b0;color:#c9a227;font-size:clamp(12px,4vw,20px)}
.sk span.on{filter:drop-shadow(0 0 6px #3ddc97) hue-rotate(60deg)}
.dpad{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(2,46px);gap:6px;justify-content:center;margin-top:12px}
.dpad button{border:0;border-radius:10px;background:var(--panel2);color:var(--text);font-size:18px;cursor:pointer}.dpad [data-d=U]{grid-column:2}.dpad [data-d=L]{grid-column:1;grid-row:2}.dpad [data-d=D]{grid-column:2;grid-row:2}.dpad [data-d=R]{grid-column:3;grid-row:2}
.kak{display:grid;gap:2px;width:min(100%,380px);margin:0 auto;background:#0f1230;padding:3px;border-radius:10px}
.kb{aspect-ratio:1;background:#2a3060;border-radius:4px}.kb svg{width:100%;height:100%;display:block}
.kw{aspect-ratio:1;background:#eef0ff;color:#10122a;border-radius:4px;display:grid;place-items:center;font-family:Fredoka;font-size:clamp(20px,6vw,28px);font-weight:700;cursor:pointer}
.kw.sel{background:#ffcc33}.kw.bad{color:#e0204f;background:#ffd6de}.kw.ok{background:#bff0d6}
.flow{width:min(100%,420px);margin:0 auto;touch-action:none;user-select:none}.flow svg{width:100%;display:block;border-radius:10px}
.btube{width:44px;height:184px;border:3px solid #8a91c4;border-top:0;border-radius:0 0 24px 24px;display:flex;flex-direction:column-reverse;align-items:center;padding:4px 0;gap:4px;cursor:pointer}
.btube i{width:36px;height:36px;border-radius:50%;flex:none;transition:transform .15s}.btube i.up{transform:translateY(-34px)}.btube.full{border-color:var(--green)}
.hexb{width:min(100%,400px);margin:0 auto;touch-action:none}.hexb svg{width:100%;display:block}
.tp.hx{padding:4px}
.chb{display:grid;grid-template-columns:repeat(8,1fr);width:min(100%,420px);margin:0 auto;border:4px solid #5a3a20;border-radius:6px;overflow:hidden;user-select:none}
.cs{aspect-ratio:1;display:grid;place-items:center;position:relative;cursor:pointer;font-size:clamp(24px,7.5vw,40px);line-height:1}
.cs.l{background:#f0d9b5}.cs.d{background:#b58863}.cs.sel{background:#e8d26a}.cs.dest::after{content:'';position:absolute;width:30%;height:30%;border-radius:50%;background:rgba(0,0,0,.25)}.cs.win{background:#7fd09b}
.cs span.w{color:#fff;-webkit-text-stroke:1.2px #222;text-shadow:0 1px 0 #222}.cs span.b{color:#1a1a1a}
.cs small{position:absolute;font-size:9px;font-weight:800;color:rgba(0,0,0,.45)}.cs .rk{top:1px;left:2px}.cs .fl{bottom:0;right:2px}
.sol{max-width:560px;margin:0 auto;user-select:none;--cw:min(12.4vw,72px)}
.srow,.trow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.trow{margin-top:10px;min-height:340px}
.slot,.col{position:relative}.col{min-height:calc(var(--cw)*1.4)}
.cd{width:100%;aspect-ratio:.7;border-radius:6px;background:#fff;color:#111;position:relative;box-shadow:0 1px 3px rgba(0,0,0,.45);cursor:pointer;overflow:hidden}
.cd b{position:absolute;top:2px;left:3px;font-size:clamp(10px,3.2vw,15px);line-height:1;display:flex;flex-direction:column;align-items:center}.cd b i{font-style:normal;font-size:.9em}
.cd span{position:absolute;bottom:6%;right:8%;font-size:clamp(16px,5.5vw,28px);line-height:1}.cd.r{color:#d0213a}
.cd.back{background:repeating-linear-gradient(45deg,#3a6bff 0 6px,#2a4fc0 6px 12px);border:2px solid #fff}
.cd.empty{background:transparent;border:2px dashed #4a5290;box-shadow:none;display:grid;place-items:center;color:#4a5290;font-size:20px}
.pos{position:absolute;left:0;right:0}
.kb,.kw{min-width:0;overflow:hidden}
.g3load{min-height:380px;display:grid;place-content:center;gap:14px;text-align:center;color:var(--muted);font-weight:800}
.spin3{width:42px;height:42px;border:4px solid #2a3060;border-top-color:var(--accent);border-radius:50%;animation:sp3 .8s linear infinite;margin:0 auto}@keyframes sp3{to{transform:rotate(1turn)}}
.g3{position:relative;width:100%;border-radius:14px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;background:#000}
.g3 canvas{display:block}
.g3hud{position:absolute;top:8px;left:8px;right:8px;display:flex;justify-content:space-between;gap:6px;pointer-events:none}
.g3hud>div{background:rgba(10,12,30,.6);color:#fff;font-weight:800;font-size:14px;padding:5px 10px;border-radius:10px;min-height:0}.g3hud>div:empty{visibility:hidden}
.sw3{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px;border:2px solid #fff}
.g3big{position:absolute;top:22%;left:50%;transform:translate(-50%,-10px);font-family:Fredoka;font-size:clamp(22px,6vw,36px);font-weight:700;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.4);opacity:0;transition:.2s;pointer-events:none;white-space:nowrap}.g3big.on{opacity:1;transform:translate(-50%,0)}
.g3arrow{position:absolute;top:48px;left:50%;transform:translateX(-50%);display:grid;justify-items:center;pointer-events:none;color:#fff}.g3arrow span{font-size:30px;text-shadow:0 2px 6px #000;display:block}.g3arrow small{font-weight:800;text-shadow:0 1px 3px #000}
.g3flash{position:absolute;inset:0;opacity:0;pointer-events:none}.g3flash.on{animation:fl3 .45s}@keyframes fl3{0%{opacity:.45}100%{opacity:0}}
.joy{position:absolute;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.35);opacity:0;pointer-events:none;transition:opacity .15s}.joy.on{opacity:1}
.joy i{position:absolute;left:50%;top:50%;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.6);transform:translate(-50%,-50%)}
.jbtn{position:absolute;right:14px;bottom:16px;width:78px;height:78px;border-radius:50%;border:3px solid rgba(255,255,255,.7);background:rgba(255,204,51,.75);color:#3a2a05;font-family:Fredoka;font-weight:700;font-size:15px;touch-action:none}
@media(hover:hover) and (pointer:fine){.jbtn{width:64px;height:64px;font-size:13px;opacity:.75}}
.bui{position:absolute;left:8px;right:8px;bottom:8px;display:grid;gap:6px;pointer-events:auto}
.bcols,.btools{display:flex;gap:5px;justify-content:center;flex-wrap:wrap}
.bcols button{width:30px;height:30px;border-radius:8px;border:2px solid rgba(255,255,255,.5);cursor:pointer;box-shadow:inset 0 -4px 0 rgba(0,0,0,.2)}
.bcols button.on{border-color:#fff;transform:scale(1.15);box-shadow:0 0 0 2px #10122a}
.btools button{min-width:38px;height:34px;border-radius:9px;border:0;background:rgba(16,18,42,.8);color:#fff;font-weight:800;cursor:pointer;padding:0 8px}
.btools button.on{background:#ffcc33;color:#10122a}
.bkt{display:block;width:84%;height:84%;margin:auto;border-radius:6px;background:var(--c);box-shadow:inset 0 -5px 0 rgba(0,0,0,.22),inset 0 3px 0 rgba(255,255,255,.25);position:relative}
.bkt::before{content:'';position:absolute;inset:18%;background:radial-gradient(circle at 25% 25%,rgba(255,255,255,.35) 0 14%,transparent 15%),radial-gradient(circle at 75% 25%,rgba(255,255,255,.35) 0 14%,transparent 15%),radial-gradient(circle at 25% 75%,rgba(255,255,255,.35) 0 14%,transparent 15%),radial-gradient(circle at 75% 75%,rgba(255,255,255,.35) 0 14%,transparent 15%)}
.mt .bkt{width:88%;height:88%}
.bcgrid{display:grid;gap:5px;width:min(100%,360px);margin:0 auto;background:#237841;padding:8px;border-radius:12px}
.bcc{aspect-ratio:1;background:rgba(0,0,0,.18);border-radius:6px;display:grid;cursor:pointer}.bcc.bad{outline:3px solid #ff3b5c}
.bcpal{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}.bcpal button{width:46px;height:46px;border-radius:10px;border:2px solid transparent;background:var(--panel2);display:grid;cursor:pointer;padding:4px}.bcpal button.on{border-color:var(--accent)}
.bcpal .btn{width:auto;height:46px}
.morse{font-family:monospace;font-size:clamp(30px,9vw,46px);letter-spacing:4px;color:var(--accent);margin-bottom:8px;text-align:center}
.lineup{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:10px;max-width:560px;margin:0 auto}
.sus{background:linear-gradient(180deg,#2a3060,#1a1f42);border:2px solid var(--line);border-radius:14px;padding:8px 6px 10px;display:grid;justify-items:center;cursor:pointer;position:relative;min-height:150px}
.sus .hat{font-size:30px;height:30px;line-height:30px}.sus .face{font-size:52px;line-height:1;margin-top:-6px}.sus .acc{font-size:24px;height:24px;margin-top:-34px;margin-bottom:10px}.sus .shirt{width:62px;height:28px;border-radius:14px 14px 4px 4px;margin-top:2px}
.sus b{position:absolute;top:6px;left:8px;font-size:12px;color:var(--muted)}.sus.ok{border-color:var(--green);background:#1d6a4b}.sus.no{border-color:var(--pink);background:#6b1f36}
.lineup .sus:only-child{max-width:160px;margin:0 auto;transform:scale(1.2);margin-top:20px;margin-bottom:20px}
.clues{background:#0f1230;border-radius:14px;padding:12px 14px;margin-bottom:12px;font-weight:700;font-size:14px;line-height:1.6}.clues h4{margin:0 0 6px;font-size:14px;color:var(--accent)}
.suspects{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
.sus2{background:var(--panel2);border:2px solid var(--line);border-radius:12px;padding:8px;text-align:center;cursor:pointer}.sus2 b{display:block;margin-top:4px}.sus2 small{display:block;color:var(--muted);font-size:10.5px;line-height:1.3}
.sus2.ok{border-color:var(--green);background:#1d6a4b}.sus2.no{border-color:var(--pink);background:#6b1f36}
.sus2 .av{position:relative;width:60px;height:70px;margin:0 auto}
.sus2 .head{position:absolute;left:15px;top:12px;width:30px;height:30px;border-radius:50%;background:#ffd6a5}
.sus2 .hair{position:absolute;left:12px;top:8px;width:36px;height:20px;border-radius:18px 18px 4px 4px}
.sus2 .hat2{position:absolute;left:10px;top:2px;width:40px;height:10px;border-radius:4px;background:#222;box-shadow:8px -8px 0 -2px #222,16px -8px 0 -2px #222}
.sus2 .gl{position:absolute;left:16px;top:16px;font-size:20px}
.sus2 .coat{position:absolute;left:8px;top:44px;width:44px;height:26px;border-radius:14px 14px 4px 4px}
.wgrid.safe{width:min(100%,260px)}
a.brand{color:var(--text);text-decoration:none}
.catnav{max-width:1200px;margin:0 auto;display:flex;gap:6px;overflow-x:auto;padding:0 16px 10px;scrollbar-width:none}
.catnav a{flex:none;color:var(--muted);text-decoration:none;font-weight:800;font-size:13px;padding:5px 11px;border-radius:999px;background:var(--panel);border:1px solid var(--line)}
.catnav a:hover{color:var(--text);border-color:var(--accent2)}
a.card{display:block;color:var(--text);text-decoration:none}
.crumbs{font-size:13px;color:var(--muted);margin:0 0 12px;font-weight:700}.crumbs a{color:var(--accent2);text-decoration:none}
.gtop h1{margin:0;flex:1;font-size:clamp(20px,5vw,28px);min-width:160px}
.panel h2.ph{margin:0 0 8px;font-size:16px}
a.mi{color:var(--text);text-decoration:none}
.about{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin-top:22px;line-height:1.65;color:#d8dbf5}
.about h1{margin:0 0 10px;font-size:28px;color:var(--text)}.about h2{font-size:20px;margin:18px 0 6px;color:var(--text)}.about h2:first-child{margin-top:0}.about h3{font-size:16px;margin:16px 0 4px;color:var(--text)}
.about p{margin:6px 0}.about ul{margin:6px 0;padding-left:20px}.about a{color:var(--accent2)}
.about.page{max-width:820px;margin:10px auto 0}
.cathero{background:linear-gradient(135deg,#25195a,#3a1640);border:1px solid var(--line);border-radius:20px;padding:22px}
.cathero h1{margin:0 0 8px;font-size:clamp(24px,5vw,38px)}.cathero p{color:#cfd3f5;margin:6px 0;max-width:75ch;line-height:1.6}
.sec h2 a{color:var(--text);text-decoration:none}.sec h2 a:hover{color:var(--accent2)}
.seeall{text-align:right;margin:10px 0 0}
.chips a.chip{text-decoration:none}
.azlist{columns:2 160px;padding-left:18px;color:var(--muted);line-height:1.9}.azlist a{color:#cfd3f5;text-decoration:none}.azlist a:hover{color:var(--accent2)}
.sitefoot{border-top:1px solid var(--line);margin-top:40px;padding:26px 16px 40px;text-align:left}
.fcols{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.fcols div{display:grid;gap:6px;align-content:start}.fcols b{color:var(--text);margin-bottom:4px}.fcols a{color:var(--muted);text-decoration:none;font-size:14px}.fcols a:hover{color:var(--accent2)}
.sitefoot>p{max-width:1200px;margin:22px auto 0;color:var(--muted);font-size:13px}
#stage .g3load{min-height:300px}