:root{--bg:linear-gradient(160deg,#ffe3f1 0%,#e6e0ff 50%,#d9f6ff 100%);--bar:linear-gradient(90deg,#ff6fb5,#9b5de5);--accent:#9b5de5;--ink:#2b2340;--title:#8f3fd1}
body{background:#f4ecff;background-image:var(--bg);background-attachment:fixed}
.g-top{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;padding:10px;flex:0 0 auto}
.g-stat{font-size:20px;font-weight:800;background:#fff;border-radius:14px;padding:10px 14px}
.g-fit{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:8px;position:relative}
.g-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:10px;min-height:0}
/* memory */
.mem-grid{display:grid;gap:10px}
.mcard{width:var(--cs);height:var(--cs);perspective:600px;padding:0}
.mc-in{position:relative;display:block;width:100%;height:100%;transition:transform .4s;transform-style:preserve-3d;-webkit-transform-style:preserve-3d}
.mcard.up .mc-in{transform:rotateY(180deg)}
.mc-front,.mc-back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:16px;backface-visibility:hidden;-webkit-backface-visibility:hidden;font-size:calc(var(--cs)*.55);box-shadow:0 5px 0 rgba(0,0,0,.12)}
.mc-front{background:linear-gradient(135deg,#ff6fb5,#9b5de5);color:#fff;font-size:calc(var(--cs)*.35)}
.mc-back{background:#fff;transform:rotateY(180deg)}
.mcard.done .mc-back{background:#d9fbe8;animation:bump .5s}
/* math */
.streak{font-size:24px;font-weight:800}
.q{font-size:clamp(48px,10vw,96px);font-weight:900;color:var(--title);background:#fff;border-radius:28px;padding:10px 34px;box-shadow:0 6px 0 rgba(0,0,0,.08)}
.choices{display:grid;grid-template-columns:repeat(2,minmax(120px,200px));gap:14px}
.choice{font-size:44px;font-weight:900;background:#fff;border-radius:22px;height:96px;box-shadow:0 6px 0 rgba(0,0,0,.12);color:var(--ink)}
.choice:active{transform:translateY(4px)}
.choice.right{background:#22b07d;color:#fff;animation:bump .5s}.choice.wrong{background:#ffd6d6;opacity:.6}
.fb{font-size:26px;font-weight:800;min-height:34px;color:var(--title)}
/* spelling */
.sp-pic{font-size:clamp(80px,16vw,140px);line-height:1}
.slots,.letters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.slot{width:64px;height:72px;border-radius:14px;background:#fff;border:3px dashed #c9b6ef;font-size:40px;font-weight:900;display:flex;align-items:center;justify-content:center;text-transform:lowercase;color:var(--ink)}
.slot.fixed{border-style:solid;border-color:#fff}.slot.ok{background:#d9fbe8;border-color:#22b07d}
.ltile{width:72px;height:72px;border-radius:18px;background:var(--accent);color:#fff;font-size:40px;font-weight:900;box-shadow:0 5px 0 rgba(0,0,0,.18)}
.ltile:disabled{opacity:.25}.ltile.wrong{background:#e5484d}
.ltile:active{transform:translateY(4px)}
/* drawing */
.draw-wrap{flex:1;display:flex;flex-direction:column;min-height:0}
.draw-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;padding:8px;flex:0 0 auto;touch-action:pan-x}
.palette{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.sw{width:42px;height:42px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 5px rgba(0,0,0,.25)}
.sw.on{transform:scale(1.2);border-color:#2b2340}
.draw-stage{flex:1;min-height:0;margin:0 8px 8px;display:flex;align-items:center;justify-content:center}
.draw-stage canvas{width:100%;height:100%;background:#fff;border-radius:18px;box-shadow:0 4px 12px rgba(0,0,0,.12);touch-action:none;object-fit:contain}
/* puzzles */
.slide-wrap{display:flex;gap:16px;align-items:center;justify-content:center;flex-wrap:wrap}
.slide-board{position:relative;background:rgba(255,255,255,.6);border-radius:16px}
.stile{position:absolute;border-radius:10px;transition:left .15s,top .15s;box-shadow:0 3px 6px rgba(0,0,0,.2);padding:0}
.stile span{position:absolute;left:6px;top:4px;font-size:16px;font-weight:900;color:#fff;text-shadow:0 1px 2px #000}
.slide-ref{width:110px;height:110px;border-radius:12px;opacity:.9}
.maze-cv{border-radius:14px;box-shadow:0 4px 12px rgba(0,0,0,.12);touch-action:none}
/* arcade */
.arc-cv{position:absolute;inset:0;touch-action:none;background:linear-gradient(#bde0fe,#fff1f6)}
.arc-hud{position:absolute;top:10px;left:0;right:0;display:flex;justify-content:center;gap:16px;z-index:2;pointer-events:none}
.arc-hud span{background:#fff;border-radius:16px;padding:8px 16px;font-size:24px;font-weight:800}
.arc-over{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:3;background:rgba(255,255,255,.35)}
.ov-card{background:#fff;border-radius:28px;padding:24px;text-align:center;max-width:420px;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.ov-card h2{margin:6px 0}.ov-card p{font-size:18px}
.toast .btn{margin-top:10px}
@media (max-width:600px){.choice{font-size:34px;height:80px}.slot{width:48px;height:58px;font-size:30px}.ltile{width:56px;height:56px;font-size:30px}}