@layer tokens, mathpop;

@layer tokens {
    :root {
      --night:#100b2f; --night-2:#191047; --paper:#fffdf7; --ink:#191634;
      --coral:#ff596e; --orange:#ff8a34; --sun:#ffd84d; --lime:#b9f453;
      --aqua:#53e8d4; --blue:#5ca9ff; --violet:#8157ff; --lav:#eee8ff;
      --muted:#79738f; --line:#e8e2f3; --shadow:0 20px 60px rgba(31,19,79,.14);
      --surface:#fffdf7; --surface-2:#f8f6fb; --soft:#f2eef8;
    }
}

@layer mathpop {
    * { box-sizing:border-box; }
    html { width:100%;height:100%;background:var(--night);overflow:hidden;overscroll-behavior:none;touch-action:manipulation; }
    body { position:fixed;inset:0;width:100%;height:100%;margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;overflow:hidden;overscroll-behavior:none;touch-action:manipulation;-webkit-overflow-scrolling:auto;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none; }
    button,input { font:inherit; }
    button { border:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;transition:transform .09s ease,filter .09s ease,box-shadow .09s ease; }
    button:not(:disabled):active,button.tap-pressed:not(:disabled){transition-duration:.06s!important;transform:translateY(4px) scale(.975)!important;filter:brightness(.94);}
    input{touch-action:manipulation;user-select:text;-webkit-user-select:text;}
    .display { font-family:"Plus Jakarta Sans",sans-serif; letter-spacing:-.055em; }
    .app {
      width:100%;height:100dvh;max-height:100dvh;position:relative;isolation:isolate;overflow:hidden;overscroll-behavior:none;touch-action:manipulation;
      background:
        radial-gradient(circle at 6% 9%, rgba(83,232,212,.25), transparent 23rem),
        radial-gradient(circle at 94% 8%, rgba(255,89,110,.24), transparent 26rem),
        linear-gradient(155deg,#130c39 0%,#221158 48%,#111937 100%);
    }
    .app::before {
      content:""; position:fixed; inset:0; z-index:-2; opacity:.19; pointer-events:none;
      background-image:radial-gradient(rgba(255,255,255,.7) .7px,transparent .7px);
      background-size:18px 18px; mask-image:linear-gradient(to bottom,#000,transparent 85%);
    }
    .orb { position:fixed; border-radius:999px; filter:blur(1px); opacity:.8; z-index:-1; pointer-events:none; }
    .orb.one { width:260px;height:260px;background:linear-gradient(135deg,var(--coral),var(--orange));top:16%;left:-170px; }
    .orb.two { width:180px;height:180px;background:linear-gradient(135deg,var(--aqua),var(--blue));right:-95px;bottom:14%; }
    .shell { width:min(1440px,100%); margin:auto; padding:22px clamp(16px,3vw,42px) 46px; }
    .topbar { display:flex; align-items:center; gap:20px; color:#fff; margin-bottom:22px; }
    .brand { display:flex;align-items:center;gap:12px; min-width:max-content; }
    .brand-mark { width:46px;height:46px;display:grid;place-items:center;border-radius:15px;background:var(--lime);color:var(--night);font-size:25px;box-shadow:0 5px 0 #669c17;transform:rotate(-6deg); }
    .brand-name { font-size:22px;line-height:1; }
    .brand-name span { color:var(--lime); }
    .brand small { display:block;color:#afa8d2;font-size:10px;letter-spacing:.12em;text-transform:uppercase;margin-top:5px; }
    .run-progress { flex:1; max-width:560px; margin:auto; }
    .progress-meta { display:flex;justify-content:space-between;font-size:11px;color:#bdb7d6;font-weight:700;margin-bottom:7px;text-transform:uppercase;letter-spacing:.09em; }
    .track { height:11px;background:rgba(255,255,255,.12);border-radius:30px;padding:2px;overflow:hidden; }
    .track-fill { height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--aqua),var(--lime),var(--sun));box-shadow:0 0 20px rgba(185,244,83,.75);transition:width .45s cubic-bezier(.2,.8,.2,1); }
    .top-actions { display:flex;gap:9px;align-items:center; }
    .arcade-btn { height:42px;display:flex;align-items:center;gap:8px;border-radius:14px;padding:0 13px;background:linear-gradient(135deg,var(--violet),#5a31ca);color:white;font-weight:800;font-size:11px;box-shadow:0 5px 0 #301681;transition:.18s; }
    .arcade-btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 #301681}.arcade-btn strong{display:flex;align-items:center;gap:4px;color:var(--lime)}
    .icon-btn { width:42px;height:42px;display:grid;place-items:center;border-radius:14px;color:white;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);transition:.2s; }
    .icon-btn:hover { background:rgba(255,255,255,.18);transform:translateY(-2px); }
    .player-chip { display:flex;gap:9px;align-items:center;background:#fff;color:var(--ink);border-radius:16px;padding:6px 12px 6px 6px;box-shadow:0 6px 0 rgba(0,0,0,.18); }
    .avatar { width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--sun),var(--orange));font-weight:800; }
    .player-chip small { display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em; }
    .player-chip strong { font-size:13px;max-width:100px;display:block;overflow:hidden;text-overflow:ellipsis; }
    .game-grid { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.65fr);gap:18px;align-items:start; }
    .main-card { background:var(--paper);border-radius:32px;min-height:680px;padding:clamp(20px,3.2vw,46px);box-shadow:0 25px 0 rgba(4,2,22,.23),var(--shadow);position:relative;overflow:hidden; }
    .main-card::after { content:"";position:absolute;width:270px;height:270px;border-radius:50%;right:-130px;top:-145px;background:linear-gradient(135deg,rgba(129,87,255,.14),rgba(83,232,212,.13)); }
    .question-head { display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:1; }
    .type-pill { display:inline-flex;align-items:center;gap:8px;border-radius:100px;padding:9px 13px;background:var(--lav);color:#6042c6;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.08em; }
    .round-pill { color:var(--muted);font-size:12px;font-weight:700; }
    .question-zone { text-align:center;padding:28px 0 19px;position:relative;z-index:1; }
    .question-kicker { color:var(--coral);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:12px; }
    .question { font-size:clamp(35px,5vw,64px);line-height:1.08;margin:0 auto;max-width:800px; }
    .question.word { font-size:clamp(25px,3vw,40px);line-height:1.28;max-width:760px;letter-spacing:-.035em; }
    .question-sub { color:var(--muted);margin:15px 0 0;font-size:14px; }
    .answer-mode { display:flex;width:min(460px,100%);margin:0 auto 23px;background:#ece7f4;padding:5px;border-radius:17px;position:relative;z-index:1; }
    .mode-btn { flex:1;display:flex;justify-content:center;align-items:center;gap:8px;border-radius:13px;padding:10px 9px;color:#766f89;background:transparent;font-weight:800;font-size:12px;transition:.2s; }
    .mode-btn.active { background:#fff;color:var(--ink);box-shadow:0 5px 14px rgba(42,26,89,.1); }
    .bonus { font-size:9px;background:var(--lime);padding:4px 6px;border-radius:100px;color:#365500;letter-spacing:.04em; }
    .answer-stage { width:min(610px,100%);margin:auto;min-height:322px;position:relative;z-index:1; }
    .choices { display:grid;grid-template-columns:1fr 1fr;gap:13px; }
    .choice {
      min-height:88px;border-radius:21px;background:#fff;border:2px solid var(--line);color:var(--ink);
      font:800 26px "Plus Jakarta Sans";box-shadow:0 7px 0 #ddd5ea;transition:transform .16s,box-shadow .16s,border-color .16s;
    }
    .choice:nth-child(1) { --choice:var(--aqua); }.choice:nth-child(2){--choice:var(--sun)}.choice:nth-child(3){--choice:#ff9fba}.choice:nth-child(4){--choice:#b9a5ff}
    .choice:hover { transform:translateY(-3px) rotate(-.4deg);box-shadow:0 10px 0 #ddd5ea;border-color:var(--choice); }
    .choice:active { transform:translateY(4px);box-shadow:0 3px 0 #ddd5ea; }
    .choice.correct { background:#eaffc8;border-color:#84ca25;box-shadow:0 7px 0 #84ca25; }
    .choice.wrong { background:#ffe8ec;border-color:var(--coral);box-shadow:0 7px 0 #c6344d; }
    .keypad-view { display:none;grid-template-columns:minmax(0,1fr) 245px;gap:14px; }
    .keypad-view.show { display:grid; }
    .input-well { border-radius:24px;background:linear-gradient(135deg,#221456,#161b42);padding:25px;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden; }
    .input-well::after { content:"BONUS ×3";position:absolute;right:-26px;top:23px;transform:rotate(38deg);background:var(--lime);color:#263d00;font-size:9px;font-weight:800;padding:5px 32px; }
    .input-label { color:#a9a1cc;text-transform:uppercase;letter-spacing:.13em;font-size:10px;font-weight:800;margin-bottom:9px; }
    .answer-input { width:100%;background:transparent;border:0;outline:0;color:white;text-align:center;font:800 clamp(47px,7vw,78px) "Plus Jakarta Sans";caret-color:var(--aqua); }
    .answer-input::placeholder { color:#49416e; }
    .input-hint { color:#71699a;font-size:11px;margin-top:6px; }
    .number-pad { display:grid;grid-template-columns:repeat(3,1fr);gap:8px; }
    .num {
      min-height:58px;border-radius:15px;background:#fff;border:1px solid var(--line);box-shadow:0 5px 0 #dcd4e8;color:var(--ink);font:800 20px "Plus Jakarta Sans";transition:.12s;
    }
    .num:hover { background:var(--lav);transform:translateY(-2px);box-shadow:0 7px 0 #dcd4e8; }
    .num:active { transform:translateY(3px);box-shadow:0 2px 0 #dcd4e8; }
    .num.erase { color:var(--coral); }.num.go { grid-column:span 2;background:var(--lime);box-shadow:0 5px 0 #7eae2e;color:#263d00; }
    .feedback { min-height:42px;text-align:center;margin-top:15px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--muted); }
    .feedback.good { color:#4b8300; }.feedback.bad { color:#c22d48; }
    .side { display:grid;gap:16px; }
    .panel { background:rgba(255,255,255,.97);border-radius:25px;padding:22px;box-shadow:0 14px 0 rgba(4,2,22,.18),var(--shadow); }
    .panel-title { display:flex;justify-content:space-between;align-items:center;margin-bottom:16px; }
    .panel-title h2 { font-size:17px;margin:0; }
    .panel-title small { color:var(--muted);font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.1em; }
    .stat-row { display:grid;grid-template-columns:repeat(3,1fr);gap:8px; }
    .stat { border-radius:17px;padding:12px 9px;background:#f5f1fb;text-align:center; }
    .stat i { width:29px;height:29px;border-radius:9px;display:grid;place-items:center;margin:0 auto 7px;font-style:normal; }
    .stat:nth-child(1) i{background:#d7f9f3}.stat:nth-child(2) i{background:#fff1b8}.stat:nth-child(3) i{background:#ffe1e8}
    .stat strong { font:800 19px "Plus Jakarta Sans";display:block; }
    .stat small { color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em;font-weight:700; }
    .streak-card { color:#fff;background:linear-gradient(135deg,#ff5c6c,#ff8b34 70%,#ffd84d);position:relative;overflow:hidden; }
    .streak-card::after { content:"🔥";font-size:95px;position:absolute;right:-14px;bottom:-25px;opacity:.2;transform:rotate(-8deg); }
    .streak-card h2 { margin:0;font-size:27px;position:relative;z-index:1; }
    .streak-card p { margin:5px 0 16px;font-size:12px;color:#fff8;position:relative;z-index:1; }
    .heat { display:flex;gap:5px;position:relative;z-index:1; }
    .heat span { flex:1;height:7px;border-radius:20px;background:#ffffff45; }
    .heat span.hot { background:#fff;box-shadow:0 0 12px #fff; }
    .mission { display:flex;gap:12px;align-items:center;border-radius:18px;background:#f2edff;padding:13px; }
    .mission-icon { width:43px;height:43px;display:grid;place-items:center;border-radius:14px;background:var(--violet);color:white;font-size:20px; }
    .mission b { display:block;font-size:12px; }.mission small { color:var(--muted);font-size:10px; }
    .mini-track { height:5px;background:#dcd4f2;border-radius:10px;margin-top:7px;overflow:hidden; }.mini-track i { display:block;width:0;height:100%;background:var(--violet);transition:.3s; }
    .leaders { display:grid;gap:7px; }
    .leader { display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:8px;padding:8px 9px;border-radius:13px;background:#f8f6fb;font-size:11px; }
    .leader.you { background:#edffcd;outline:1px solid #b9ef58; }
    .rank { width:23px;height:23px;display:grid;place-items:center;border-radius:8px;background:#ebe6f2;font-weight:800; }
    .leader strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.leader b { color:#5b3ebc; }
    .empty-board { color:var(--muted);text-align:center;font-size:11px;padding:12px; }
    .intro, .lesson-modal, .finish-modal, .switch-modal, .bonus-modal { position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px;background:rgba(10,6,33,.72);backdrop-filter:blur(15px); }
    .intro-card { width:min(980px,100%);max-height:calc(100dvh - 24px);border-radius:34px;background:var(--paper);box-shadow:0 30px 0 rgba(0,0,0,.22);overflow:hidden;display:grid;grid-template-columns:.7fr 1.3fr;grid-template-rows:minmax(0,1fr); }
    .intro-art { min-height:470px;padding:35px;color:white;background:linear-gradient(145deg,#24115e,#5f34d4);position:relative;overflow:hidden; }
    .intro-art::before,.intro-art::after { content:"";position:absolute;border-radius:50%; }
    .intro-art::before{width:210px;height:210px;background:var(--coral);left:-90px;bottom:-60px}.intro-art::after{width:145px;height:145px;background:var(--aqua);right:-65px;top:55px}
    .intro-logo { position:relative;z-index:1;font-size:32px; }.intro-logo span{color:var(--lime)}
    .intro-art h1 { font-size:56px;line-height:.98;margin:90px 0 15px;position:relative;z-index:1; }
    .intro-art p { color:#d1c6f5;line-height:1.5;font-size:14px;position:relative;z-index:1; }
    .float-sum { position:absolute;font:800 18px "Plus Jakarta Sans";background:white;color:var(--night);padding:10px 13px;border-radius:14px;box-shadow:0 7px 0 rgba(0,0,0,.2);z-index:2; }
    .float-sum.a{top:92px;right:25px;transform:rotate(8deg)}.float-sum.b{bottom:45px;right:22px;transform:rotate(-7deg);background:var(--lime)}
    .intro-form { padding:24px 30px;display:flex;flex-direction:column;justify-content:safe center;min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable; }
    .eyebrow { color:var(--coral);font-weight:800;font-size:11px;letter-spacing:.13em;text-transform:uppercase; }
    .intro-form h2 { font-size:35px;margin:6px 0 5px; }.intro-form>p { color:var(--muted);font-size:12px;margin:0 0 12px;line-height:1.4; }
    .name-label { font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px; }
    .name-wrap { display:flex;border:2px solid var(--line);border-radius:18px;padding:5px;background:white;transition:.2s; }
    .name-wrap:focus-within { border-color:var(--violet);box-shadow:0 0 0 5px #8157ff18; }
    .name-wrap span { width:42px;display:grid;place-items:center;font-size:20px; }
    .name-input { flex:1;min-width:0;border:0;outline:0;font-weight:800;padding:11px 6px;color:var(--ink);background:transparent;caret-color:var(--violet); }
    .account-mode { display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:5px 0 9px; }
    .account-mode button { min-height:38px;border:2px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font-weight:900;cursor:pointer; }
    .account-mode button.active { border-color:var(--violet);background:var(--violet);color:white; }
    .account-guidance { margin:0 0 7px;padding:7px 9px;border:1px solid color-mix(in srgb,var(--violet) 28%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--violet) 7%,var(--surface));color:var(--muted);font-size:10px;line-height:1.35; }
    .account-guidance strong { color:var(--ink); }
    .password-show { align-self:center;border:0;border-radius:10px;background:var(--soft);color:var(--violet);padding:8px;font-weight:900;cursor:pointer; }
    .account-help { align-self:center;margin-top:7px;color:var(--violet);font-size:11px;font-weight:900; }
    .public-board-notice { display:flex;gap:7px;align-items:flex-start;margin:7px 2px 0;color:var(--muted);font-size:9px;font-weight:700;line-height:1.35; }
    .public-board-notice input { margin:1px 0 0;min-width:17px;min-height:17px;accent-color:var(--violet); }
    .recovery-codes-dialog { width:min(420px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;border:2px solid var(--line);border-radius:24px;background:var(--surface,#fffdf7);color:var(--ink,#191634);padding:24px;box-shadow:0 30px 90px #100b2f66;filter:none;opacity:1;isolation:isolate; }
    .recovery-codes-dialog::backdrop { background:#100b2f9e;backdrop-filter:blur(5px); }
    .recovery-codes-dialog h2 { margin:0 0 10px; }
    .recovery-codes-dialog p { color:var(--muted);line-height:1.45; }
    .recovery-codes-dialog pre { max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:14px;background:var(--soft,#f2eef8);color:var(--ink,#191634);padding:14px;font-weight:800;line-height:1.35;user-select:all; }
    .recovery-code-actions { display:flex;flex-wrap:wrap;gap:8px; }
    .recovery-code-actions button { min-height:48px;margin:0; }
    .recovery-codes-dialog :focus-visible { outline:3px solid var(--violet);outline-offset:3px; }
    .name-tools { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px; }
    .name-tool { min-height:42px;border-radius:14px;padding:8px 10px;background:#eee8ff;color:#4f319e;border:2px solid #dcd1fb;font-weight:800;font-size:11px;box-shadow:0 4px 0 #cbbcec;display:flex;align-items:center;justify-content:center;gap:7px; }
    .name-tool.random { background:#fff1b8;color:#603d00;border-color:#ffd84d;box-shadow:0 4px 0 #e7b928; }
    .name-tool.listening { background:#ffe1e8;color:#a9223a;border-color:var(--coral);box-shadow:0 4px 0 #bd2a43;animation:voicePulse .8s ease-in-out infinite alternate; }
    .name-tool:disabled { opacity:.48;filter:saturate(.2);box-shadow:none; }
    .voice-status { min-height:15px;margin:6px 2px 0;color:var(--muted);font-size:9px;font-weight:700;text-align:center; }
    .touch-keyboard { display:grid;gap:5px;margin-top:5px;padding:8px;border-radius:17px;background:linear-gradient(145deg,#e9e2f6,#f8f5fc);border:1px solid var(--line); }
    .name-key-row { display:flex;justify-content:center;gap:4px; }
    .name-key { flex:1;max-width:48px;height:37px;border-radius:10px;background:white;color:var(--ink);border:1px solid #ddd4ea;box-shadow:0 3px 0 #cec4db;font:800 13px "Plus Jakarta Sans";padding:0; }
    .name-key.wide { max-width:none;flex:1.35;font-size:10px;background:#eee8ff;color:#51339c; }
    .name-key.space { flex:3.2;max-width:none; }
    .name-key.go { background:var(--lime);color:#294300;border-color:#92ce2e;box-shadow:0 3px 0 #72a91b; }
    @keyframes voicePulse { to{transform:scale(1.025);box-shadow:0 4px 0 #bd2a43,0 0 20px #ff596e66} }
    .skill-label { display:block;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin:17px 0 8px; }
    .skill-pick { display:grid;grid-template-columns:1fr 1fr;gap:9px; }
    .skill-btn { text-align:left;border-radius:17px;padding:12px;background:#f3eff8;border:2px solid transparent;color:var(--ink);transition:.18s;position:relative;overflow:hidden; }
    .skill-btn:hover { transform:translateY(-2px);background:#ece6f5; }.skill-btn.active{background:#edffe4;border-color:#9adb39;box-shadow:0 5px 0 #9adb39}.skill-btn.active.hard{background:#f0eaff;border-color:var(--violet);box-shadow:0 5px 0 #6640cf}
    .skill-btn span { display:block;font-size:20px;margin-bottom:3px; }.skill-btn strong{display:block;font-size:12px}.skill-btn small{display:block;color:var(--muted);font-size:9px;line-height:1.3;margin-top:3px}.skill-btn.active::after{content:"✓";position:absolute;right:9px;top:8px;width:19px;height:19px;display:grid;place-items:center;border-radius:7px;background:var(--lime);font-size:11px;font-weight:800}.skill-btn.active.hard::after{background:var(--violet);color:white}
    .start-btn,.primary-btn { margin-top:14px;border-radius:18px;padding:16px 20px;background:var(--night);color:white;font-weight:800;box-shadow:0 7px 0 #050211;transition:.18s;display:flex;align-items:center;justify-content:center;gap:9px; }
    .start-btn:hover,.primary-btn:hover { transform:translateY(-3px);box-shadow:0 10px 0 #050211;background:#29176b; }
    .start-btn:active,.primary-btn:active { transform:translateY(4px);box-shadow:0 3px 0 #050211; }
    .sound-note { display:flex;gap:8px;align-items:center;margin-top:18px;color:var(--muted);font-size:10px;line-height:1.3; }
    .sound-note i { font-style:normal;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#f2eef8; }
    .known-players { margin:8px 0 2px; }.known-players>small{display:block;color:var(--muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}.player-roster{display:flex;flex-wrap:wrap;gap:6px}.roster-btn{display:flex;align-items:center;gap:6px;border-radius:11px;padding:6px 9px;background:#f0ebff;color:#4c329e;font-weight:800;font-size:10px;border:2px solid transparent}.roster-btn span{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:var(--sun);color:var(--night)}.roster-btn.active,.roster-btn:hover{border-color:var(--violet);background:white;transform:translateY(-1px)}
    .home-modal{position:fixed;inset:0;z-index:48;overflow:hidden;overscroll-behavior:none;color:white;background:radial-gradient(circle at 15% 10%,#53e8d43b,transparent 28rem),radial-gradient(circle at 90% 5%,#ff596e42,transparent 32rem),linear-gradient(145deg,#10082f,#291164 62%,#102d47);padding:clamp(14px,3vw,36px)}
    .home-shell{width:min(1180px,100%);min-height:calc(100vh - 72px);margin:auto;display:flex;flex-direction:column}.home-top{display:flex;align-items:center;gap:12px}.home-top .player-chip{margin-left:auto}.home-collection-top{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 13px;border-radius:14px;background:#ffffff16;color:white;border:1px solid #ffffff2b;box-shadow:0 5px 0 #050216;font-weight:800;font-size:11px}.home-collection-top:active{transform:translateY(4px);box-shadow:0 1px 0 #050216}.home-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:center;padding:clamp(35px,7vh,80px) 0 28px}.home-copy h1{font-size:clamp(54px,8vw,104px);line-height:.88;margin:10px 0 20px}.home-copy h1 span{color:var(--lime)}.home-copy p{max-width:610px;color:#c5bee3;line-height:1.55;font-size:15px}.home-wallet{display:inline-flex;gap:9px;align-items:center;background:#ffffff12;border:1px solid #ffffff1f;border-radius:18px;padding:10px 14px;font-weight:800}.home-wallet b{font-size:22px;color:var(--lime)}.home-actions{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-top:25px;max-width:880px}.home-action{min-height:84px;border-radius:23px;padding:16px 20px;text-align:left;font-weight:800;box-shadow:0 8px 0 #060318;transition:.18s}.home-action:hover{transform:translateY(-3px);box-shadow:0 11px 0 #060318}.home-action strong{display:block;font:800 20px "Plus Jakarta Sans"}.home-action small{display:block;margin-top:3px;opacity:.7}.home-action.maths{background:var(--lime);color:#233900}.home-action.quick{background:linear-gradient(135deg,var(--sun),var(--orange));color:#3f2300}.home-action.quick:disabled{cursor:not-allowed;filter:saturate(.4);opacity:.55;transform:none;box-shadow:0 8px 0 #060318}.home-action.arcade{background:linear-gradient(135deg,var(--violet),#5b31d7);color:white}.home-orbit{min-height:330px;display:grid;place-items:center;position:relative}.home-planet{width:230px;height:230px;border-radius:50%;display:grid;place-items:center;font-size:105px;background:linear-gradient(145deg,var(--sun),var(--orange));box-shadow:0 22px 0 #9c451b,0 0 70px #ff8a3466;animation:planetFloat 3s ease-in-out infinite}.orbit-chip{position:absolute;border-radius:17px;padding:12px 15px;background:white;color:var(--night);font-weight:800;box-shadow:0 7px 0 #0004}.orbit-chip.a{left:2%;top:15%;transform:rotate(-7deg)}.orbit-chip.b{right:0;bottom:14%;background:var(--aqua);transform:rotate(7deg)}
    .home-dashboard{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;margin-top:auto}.home-card{background:#ffffff0d;border:1px solid #ffffff17;border-radius:25px;padding:20px}.home-card h2{font-size:22px;margin:0 0 5px}.home-card>p{color:#aaa3cc;font-size:11px;margin:0 0 14px}.skill-map{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.skill-chip{border-radius:16px;padding:11px 8px;text-align:center;background:#ffffff0c;border:1px solid #ffffff10}.skill-chip b{display:block;font-size:19px}.skill-chip small{display:block;font-size:8px;text-transform:uppercase;font-weight:800;letter-spacing:.07em;margin-top:5px}.skill-chip.needs{background:#ff596e24;border-color:#ff596e70}.skill-chip.clear{background:#b9f45320;border-color:#b9f45366}.skill-chip.clear b{text-decoration:line-through;text-decoration-thickness:3px;text-decoration-color:var(--lime)}.home-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.home-stat{border-radius:17px;padding:14px 8px;text-align:center;background:#ffffff0c}.home-stat b{display:block;font:800 24px "Plus Jakarta Sans";color:var(--aqua)}.home-stat small{font-size:8px;color:#aaa3cc;text-transform:uppercase;font-weight:800}.home-note{color:var(--lime);font-size:10px;font-weight:800;margin-top:12px}
    .bonus-card{width:min(560px,100%);background:linear-gradient(145deg,#fffdf7,#efe9ff);border-radius:34px;padding:34px;text-align:center;box-shadow:0 25px 0 #050216;position:relative}.bonus-burst{font-size:64px;line-height:1}.bonus-card h2{font-size:39px;margin:5px 0 8px}.bonus-card>p{color:var(--muted);font-size:13px}.bonus-question{font:800 30px "Plus Jakarta Sans";margin:22px 0}.bonus-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.bonus-options button{min-height:64px;border-radius:18px;background:white;border:2px solid #ded5f2;box-shadow:0 6px 0 #d7cceb;font:800 20px "Plus Jakarta Sans"}.bonus-options button:hover{border-color:var(--violet);transform:translateY(-2px)}.bonus-close{position:absolute;right:14px;top:14px;width:44px;height:44px;border-radius:14px;background:#e8e1f7;color:var(--ink);font-size:24px;font-weight:800;box-shadow:0 4px 0 #cfc4e9}.bonus-skip{margin-top:18px;min-height:48px;border-radius:15px;padding:10px 18px;background:#e8e1f7;color:#4c329e;font-weight:800;box-shadow:0 5px 0 #cfc4e9}.bonus-claim-players{display:grid;gap:9px;margin-top:18px}.bonus-claim-player{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:3px 10px;min-height:62px;border:2px solid #ded5f2;border-radius:17px;background:white;color:var(--ink);padding:9px 12px;text-align:left;box-shadow:0 5px 0 #d7cceb}.bonus-claim-player span{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--sun);font-size:22px}.bonus-claim-player strong{font-size:15px}.bonus-claim-player small{color:var(--muted);font-size:10px}.bonus-claim-player.current{border-color:var(--violet)}
    .idle-celebration{position:fixed;inset:0;z-index:90;display:grid;place-items:center;text-align:center;padding:25px;color:white;background:radial-gradient(circle,#653ce7,#1c0b52 58%,#08031d);overflow:hidden}.idle-celebration::before{content:"";position:absolute;width:150vmax;height:150vmax;background:conic-gradient(transparent,#53e8d444,transparent,#ff596e55,transparent,#ffd84d44,transparent);animation:rewardSpin 12s linear infinite}.idle-card{position:relative;max-width:800px}.idle-emoji{font-size:100px;filter:drop-shadow(0 15px 0 #0004)}.idle-card h2{font-size:clamp(48px,9vw,110px);line-height:.92;margin:8px 0}.idle-card h2 span{color:var(--lime)}.idle-card p{font-size:18px;color:#d1c9ee}.idle-card small{display:block;color:#8f86b7;font-weight:800;margin-top:18px}
    .modal-card { width:min(590px,100%);max-height:calc(100vh - 36px);overflow:auto;background:var(--paper);border-radius:32px;padding:35px;box-shadow:0 25px 0 rgba(0,0,0,.22);position:relative;text-align:center; }
    .lesson-icon { width:76px;height:76px;display:grid;place-items:center;border-radius:25px;background:linear-gradient(135deg,var(--aqua),var(--blue));font-size:35px;margin:0 auto 18px;box-shadow:0 10px 0 #288cbb;transform:rotate(-5deg); }
    .modal-card h2 { font-size:34px;margin:0 0 9px; }.modal-card>p { color:var(--muted);font-size:14px;line-height:1.55;margin:0 auto 22px;max-width:430px; }
    .lesson-box { background:#f0ebff;border-radius:20px;padding:18px;text-align:left;margin:15px 0; }
    .lesson-box small { color:#7151d2;font-weight:800;text-transform:uppercase;letter-spacing:.1em; }.lesson-box b { display:block;font-size:24px;margin:7px 0 3px; }.lesson-box p { margin:0;color:var(--muted);font-size:12px;line-height:1.45; }
    .lesson-actions { display:flex;gap:10px; }.lesson-actions button { flex:1; }
    .ghost-btn { margin-top:14px;border-radius:18px;padding:15px;background:#efebf5;color:var(--muted);font-weight:800; }
    .lesson-question { display:none; }
    .lesson-options { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px; }
    .lesson-options button { border-radius:14px;padding:13px;background:white;border:2px solid #ded5f2;font-weight:800;box-shadow:0 4px 0 #ded5f2; }
    .finish-modal { display:none; }
    .finish-home-btn { position:fixed;z-index:80;pointer-events:auto;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));min-width:96px;min-height:52px;border-radius:17px;padding:0 17px;background:var(--lime);color:#233900;font-weight:800;box-shadow:0 7px 0 #638f1c,0 12px 28px #0005;display:flex;align-items:center;justify-content:center;gap:7px; }
    .finish-home-btn:active { transform:translateY(5px);box-shadow:0 2px 0 #638f1c,0 6px 16px #0004; }
    .finish-score { font:800 72px "Plus Jakarta Sans";color:var(--violet);line-height:1; }.finish-stats { display:flex;justify-content:center;gap:25px;margin:18px 0; }.finish-stats b{display:block;font-size:22px}.finish-stats small{color:var(--muted);text-transform:uppercase;font-size:9px;letter-spacing:.09em}
    .reward-zone { margin:18px 0 5px;padding:17px;border-radius:22px;background:linear-gradient(135deg,#201251,#342078);color:white;position:relative;overflow:hidden; }
    .reward-zone::before { content:"";position:absolute;inset:-40%;background:conic-gradient(from 20deg,transparent,#ffffff10,transparent,#ffffff18,transparent);animation:rewardSpin 8s linear infinite; }
    .reward-kicker { position:relative;color:var(--lime);font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase; }
    .capsule-btn { position:relative;width:100%;background:transparent;color:white;padding:5px 0 2px; }
    .capsule { width:84px;height:104px;margin:8px auto 10px;border-radius:45px;display:grid;place-items:center;font:800 30px "Plus Jakarta Sans";color:var(--night);background:linear-gradient(to bottom,var(--aqua) 0 48%,#fff 48% 52%,var(--coral) 52%);border:5px solid #fff;box-shadow:0 10px 0 #0a0523,0 0 32px #53e8d466;transform:rotate(-5deg); }
    .capsule-btn strong { display:block;font-size:15px; }.capsule-btn small { color:#bdb5e1;font-size:10px; }
    .reward-reveal { position:relative;display:none;grid-template-columns:82px 1fr;gap:14px;align-items:center;text-align:left;padding:8px; }
    .buddy-art { width:82px;height:82px;border-radius:25px;display:grid;place-items:center;font-size:45px;background:linear-gradient(135deg,var(--sun),var(--orange));box-shadow:0 7px 0 #9b4e13; }
    .rarity { display:inline-block;font-size:8px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 7px;border-radius:100px;background:var(--lime);color:#294300; }
    .reward-reveal h3 { font-size:22px;margin:5px 0 2px;color:white; }.reward-reveal p{font-size:10px;color:#beb6de;margin:0;line-height:1.4}.album-count{display:block;color:var(--aqua);font-size:9px;font-weight:800;margin-top:6px;text-transform:uppercase;letter-spacing:.08em}
    .finish-actions { display:none;grid-template-columns:1fr 1fr;gap:10px; }.finish-actions button{margin-top:10px}
    @media (max-height:800px) and (min-width:661px){.finish-modal .modal-card{padding:18px 28px}.finish-modal .lesson-icon{width:52px;height:52px;font-size:26px;margin-bottom:8px}.finish-modal h2{font-size:28px}.finish-score{font-size:48px}.finish-stats{margin:8px 0}.reward-zone{margin:9px 0 4px;padding:10px 14px}.capsule-btn{display:grid;grid-template-columns:64px 1fr;grid-template-rows:1fr 1fr;align-items:center;column-gap:12px;text-align:left}.capsule{width:58px;height:68px;margin:4px;border-width:4px;font-size:22px;grid-row:1/3}.capsule-btn strong{grid-column:2;align-self:end}.capsule-btn small{grid-column:2;align-self:start}.finish-actions button{padding:12px;margin-top:6px}}
    .switch-card { width:min(460px,100%); }
    .switch-art { width:76px;height:76px;display:grid;place-items:center;border-radius:24px;margin:-4px auto 18px;background:linear-gradient(135deg,var(--sun),var(--orange));font-size:37px;box-shadow:0 8px 0 #a65315;transform:rotate(5deg); }
    .switch-actions { display:grid;grid-template-columns:1fr 1.2fr;gap:10px;margin-top:12px; }.switch-actions button{margin-top:0}.danger-btn{background:var(--coral);box-shadow:0 7px 0 #a9223a}.danger-btn:hover{background:#ff405a;box-shadow:0 10px 0 #a9223a}
    .arcade-modal { position:fixed;inset:0;z-index:70;background:linear-gradient(145deg,#0c0828,#21105a 60%,#0e2642);padding:clamp(10px,2vw,24px);overflow:hidden;overscroll-behavior:none;color:white; }
    .arcade-shell { width:min(1120px,100%);min-height:calc(100vh - 48px);margin:auto;display:flex;flex-direction:column; }
    .arcade-top { display:flex;align-items:center;gap:14px;padding:7px 0 20px; }.arcade-top h2{font-size:27px;margin:0}.arcade-top p{margin:2px 0 0;color:#aaa3cc;font-size:10px}.arcade-spacer{flex:1}.arcade-wallet{display:flex;align-items:center;gap:8px;background:#ffffff12;border:1px solid #ffffff18;padding:9px 13px;border-radius:15px;font-weight:800;font-size:12px}.arcade-wallet b{color:var(--lime);font-size:17px}.close-arcade{background:#ffffff12;color:white;width:42px;height:42px;border-radius:14px;display:grid;place-items:center}
    .arcade-hero { display:flex;justify-content:space-between;align-items:end;gap:20px;padding:24px 0 20px; }.arcade-hero h1{font-size:clamp(40px,7vw,76px);line-height:.95;margin:0}.arcade-hero h1 span{color:var(--lime)}.arcade-hero p{max-width:360px;color:#aaa3cc;font-size:13px;line-height:1.5;margin:0}.price-rule{display:inline-flex;align-items:center;gap:7px;background:#b9f4531e;color:var(--lime);border:1px solid #b9f45342;padding:8px 11px;border-radius:100px;font-size:10px;font-weight:800;margin-bottom:10px}
    .arcade-games { display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:30px; }
    .game-tile { border-radius:27px;padding:20px;min-height:345px;position:relative;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 14px 0 #060318;isolation:isolate; }
    .game-tile::before{content:"";position:absolute;width:210px;height:210px;border-radius:50%;right:-90px;top:-85px;background:#ffffff18;z-index:-1}.game-tile.maze{background:linear-gradient(145deg,#18a98f,#08746f)}.game-tile.jump{background:linear-gradient(145deg,#7655ed,#3f2a9d)}.game-tile.blast{background:linear-gradient(145deg,#e84c68,#a9214f)}
    .game-art { height:135px;display:grid;place-items:center;font-size:82px;filter:drop-shadow(0 12px 1px #0003);transition:.25s}.game-tile:hover .game-art{transform:translateY(-7px) rotate(-3deg) scale(1.05)}.game-tile h3{font-size:29px;margin:0 0 7px}.game-tile p{color:#ffffffb5;font-size:11px;line-height:1.45;margin:0 0 16px}.game-meta{display:flex;gap:7px;margin-top:auto}.game-meta span{font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;background:#0002;padding:6px 8px;border-radius:100px}.play-game{margin-top:13px;border-radius:16px;padding:13px;background:white;color:var(--night);font-weight:800;box-shadow:0 6px 0 #0004;display:flex;align-items:center;justify-content:center;gap:7px}.play-game:hover{transform:translateY(-2px);box-shadow:0 8px 0 #0004}.play-game.locked{opacity:.58;filter:grayscale(.45)}
    .game-stage { display:none;flex:1;flex-direction:column;align-items:center; }.game-stage.show{display:flex}.stage-bar{width:min(800px,100%);display:flex;align-items:center;gap:12px;margin-bottom:10px}.stage-bar h3{font-size:21px;margin:0}.stage-stat{background:#ffffff12;border-radius:11px;padding:7px 10px;font-size:10px;font-weight:800}.stage-stat b{color:var(--lime);font-size:14px}.back-lobby{background:#ffffff12;color:white;border-radius:12px;padding:10px 12px;font-weight:800;font-size:10px}
    .canvas-wrap { width:min(800px,100%);position:relative;border-radius:25px;padding:8px;background:linear-gradient(135deg,var(--aqua),var(--violet),var(--coral));box-shadow:0 18px 0 #050216; }
    #gameCanvas { display:block;width:100%;aspect-ratio:16/10;border-radius:18px;background:#100b2f;touch-action:none; }
    .touch-controls { width:min(670px,100%);display:flex;justify-content:center;align-items:center;gap:10px;padding:17px 0;user-select:none;touch-action:none}.touch-btn{width:70px;height:64px;border-radius:20px;background:#ffffff14;color:white;border:1px solid #ffffff16;box-shadow:0 6px 0 #050216;font-size:27px;font-weight:800;-webkit-tap-highlight-color:transparent}.touch-btn:active,.touch-btn.pressed{transform:translateY(5px);box-shadow:0 1px 0 #050216;background:var(--violet)}.touch-btn.action{width:120px;background:var(--coral);font-size:13px;margin-left:14px}.control-tip{color:#8981b4;font-size:9px;text-align:center;margin-top:-8px}
    .game-over { position:absolute;inset:8px;display:none;place-items:center;border-radius:18px;background:#0d082bdc;backdrop-filter:blur(8px);text-align:center;padding:20px}.game-over.show{display:grid}.game-over-card h3{font-size:42px;margin:0 0 5px}.game-over-card p{color:#aaa3cc;margin:0 0 15px;font-size:12px}.game-over-score{font:800 64px "Plus Jakarta Sans";color:var(--lime);line-height:1}.game-over-actions{display:flex;gap:9px;justify-content:center}.game-over-actions button{border-radius:14px;padding:12px 16px;font-weight:800}.game-over-actions .replay{background:var(--lime);color:#233900}.game-over-actions .lobby{background:#ffffff15;color:white}
    .credit-toast { text-align:center;background:#ff596e22;border:1px solid #ff596e55;color:#ff9aaa;border-radius:15px;padding:11px;margin-bottom:14px;font-size:11px;font-weight:800;display:none; }
    .celebration { position:fixed;inset:0;z-index:40;pointer-events:none;display:grid;place-items:center;visibility:hidden; }
    .celebrate-word { color:white;text-shadow:0 7px 0 #4c1bb8,0 3px 18px #050216,0 0 45px #fff7;font-size:clamp(60px,11vw,150px);transform:scale(.2) rotate(-8deg); }
    .coin-fly { position:fixed;z-index:45;pointer-events:none;font-size:30px;filter:drop-shadow(0 4px 1px #a46400); }
    .screen-flash { position:fixed;inset:0;z-index:35;pointer-events:none;opacity:0;background:radial-gradient(circle,#fff 0%,#b9f453 24%,rgba(83,232,212,.2) 68%,transparent); }
    .toast { position:fixed;z-index:60;left:50%;bottom:24px;transform:translate(-50%,30px);opacity:0;color:#fff;background:var(--night);border:1px solid #ffffff24;padding:12px 18px;border-radius:100px;font-weight:800;font-size:12px;box-shadow:0 12px 35px rgba(0,0,0,.28);pointer-events:none; }
    .theme-fab{position:fixed;z-index:96;left:14px;bottom:14px;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:var(--paper);color:var(--ink);border:2px solid #ffffff45;box-shadow:0 8px 0 #050216,0 12px 28px #0004;font-size:24px;-webkit-tap-highlight-color:transparent}.theme-fab:active{transform:translateY(5px);box-shadow:0 3px 0 #050216}.theme-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;background:#08041fc7;backdrop-filter:blur(14px)}.theme-card{width:min(470px,100%);border-radius:32px;background:var(--paper);color:var(--ink);padding:30px;box-shadow:0 24px 0 #050216;text-align:center}.theme-card h2{font-size:34px;margin:7px 0}.theme-card>p{color:var(--muted);font-size:13px;margin:0 0 20px}.theme-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.theme-option{min-height:96px;border-radius:19px;padding:12px 7px;background:#f0ebf8;color:var(--ink);border:3px solid transparent;font-weight:800;box-shadow:0 5px 0 #d8d0e7}.theme-option span{display:block;font-size:28px;margin-bottom:5px}.theme-option.active{border-color:var(--violet);background:#ece6ff;box-shadow:0 5px 0 var(--violet)}.theme-close{width:100%}
    .coin-vault{display:inline-grid;grid-template-columns:58px auto;align-items:center;gap:11px;background:linear-gradient(135deg,#ffd84d,#ff9d32);color:#2b2100;border-radius:22px;padding:8px 16px 8px 8px;font-weight:800;box-shadow:0 8px 0 #9d5115,0 0 35px #ffd84d35}.coin-orb{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:31px;background:#fff5ad;border:3px solid #fff8d0;animation:coinBob 2.2s ease-in-out infinite}.coin-vault b{display:block;font:800 29px "Plus Jakarta Sans";line-height:1}.coin-vault small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;opacity:.68}.collection-card{grid-column:1/-1}.collection-head{display:flex;align-items:end;justify-content:space-between;gap:12px}.collection-count{color:var(--lime);font-weight:800;font-size:11px}.buddy-shelf{display:grid;grid-template-columns:repeat(8,1fr);gap:9px;margin-top:13px}.buddy-slot{min-width:0;border-radius:18px;padding:11px 5px;text-align:center;background:#ffffff0d;border:1px solid #ffffff15;position:relative}.buddy-slot.locked{filter:saturate(0);opacity:.36}.buddy-slot .buddy-emoji{display:block;font-size:34px;filter:drop-shadow(0 6px 2px #0003)}.buddy-slot strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;margin-top:6px}.buddy-slot small{display:block;color:#aaa3cc;font-size:8px;margin-top:2px}.buddy-level{position:absolute;right:5px;top:5px;min-width:20px;height:20px;padding:0 4px;border-radius:8px;display:grid;place-items:center;background:var(--lime);color:#203500;font-size:8px;font-weight:800}.cheese-art{position:relative}.cheese-art::after{content:"🐱 🐱";position:absolute;font-size:25px;right:24%;top:23%;filter:drop-shadow(0 5px 1px #0003)}
    .idle-card h2,.game-over-card h3{text-shadow:0 6px 0 #2a145f,0 3px 18px #050216,0 0 40px #0008}
    .collection-open{margin-top:12px;border-radius:14px;padding:10px 13px;background:var(--violet);color:white;font-weight:800;font-size:11px;box-shadow:0 5px 0 #39218d}.collection-open:active{transform:translateY(4px);box-shadow:0 1px 0 #39218d}.collection-modal{position:fixed;inset:0;z-index:88;display:grid;place-items:center;padding:12px;background:#08041fcc;color:white}.collection-panel{width:min(1120px,100%);height:min(900px,calc(100dvh - 24px));min-height:0;border-radius:28px;background:linear-gradient(145deg,#171044,#28166e);box-shadow:0 24px 0 #050216;display:flex;flex-direction:column;overflow:hidden}.collection-panel-head{display:flex;align-items:center;gap:12px;padding:18px 20px 10px;flex:0 0 auto}.collection-panel-head h2{font-size:30px;margin:0}.collection-panel-head p{color:#bdb7d6;font-size:11px;margin:3px 0 0}.collection-panel-head .arcade-spacer{flex:1}.collection-close{width:44px;height:44px;border-radius:14px;background:#ffffff18;color:white;font-size:23px;flex:0 0 auto}.collection-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:8px 20px 14px;flex:0 0 auto}.collection-tab{border-radius:12px;padding:8px 10px;background:#ffffff12;color:#d5cff0;border:1px solid #ffffff18;font-size:10px;font-weight:800}.collection-tab.active{background:var(--lime);color:#233900;border-color:var(--lime);box-shadow:0 4px 0 #638f1c}.collection-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 20px 10px;padding:9px 12px;border-radius:14px;background:#ffffff0c;color:#aaa3cc;font-size:10px;flex:0 0 auto}.collection-summary strong{color:var(--lime);font-size:13px}.collection-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:0 20px 18px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;min-height:0;flex:1 1 auto;align-content:start}.collection-card-item{min-width:0;min-height:112px;border-radius:16px;padding:10px 6px;text-align:center;background:#ffffff0d;border:1px solid #ffffff14;position:relative}.collection-card-item.locked{filter:saturate(0);opacity:.38}.collection-card-item .buddy-emoji{display:block;font-size:31px;line-height:1.05;filter:drop-shadow(0 5px 2px #0004)}.collection-card-item strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;margin-top:6px}.collection-card-item small{display:block;color:#aaa3cc;font-size:8px;margin-top:3px}.collection-card-item.ultra{background:linear-gradient(145deg,#ffd84d2b,#ff596e28);border-color:#ffd84d88}.collection-card-item.rare{background:#53e8d41c;border-color:#53e8d466}.collection-rarity{position:absolute;right:5px;top:5px;border-radius:7px;padding:3px 4px;font-size:6px;font-weight:800;text-transform:uppercase;background:#ffffff1c;color:#fff}.collection-card-item.ultra .collection-rarity{background:#ffd84d;color:#3b2800}.collection-card-item.rare .collection-rarity{background:#53e8d4;color:#123c3a}
    @keyframes coinBob{50%{transform:translateY(-5px) rotate(7deg)}}
    [data-theme="light"]{--paper:#fffdf7;--ink:#201b3c;--muted:#6d6681;--line:#ddd5ed;--shadow:0 20px 60px rgba(55,35,105,.15)}
    html[data-theme="light"]{background:#f5efff}[data-theme="light"] .home-copy h1 span{color:#69a900;text-shadow:0 2px 0 #fff}[data-theme="light"] .collection-modal{background:#24145dcc}[data-theme="light"] .collection-panel{background:linear-gradient(145deg,#fff9e8,#ebe5ff 65%,#dff7f4);color:var(--ink);box-shadow:0 24px 0 #39218d}[data-theme="light"] .collection-panel-head p,[data-theme="light"] .collection-summary,[data-theme="light"] .collection-card-item small{color:#6d6681}[data-theme="light"] .collection-close{background:#ffffffc9;color:var(--ink);box-shadow:0 4px 0 #cfc4e9}[data-theme="light"] .collection-tab{background:#ffffffb8;color:var(--ink);border-color:#6947bc22}[data-theme="light"] .collection-card-item{background:#ffffffa8;border-color:#6947bc22;box-shadow:0 6px 18px #5f449217}[data-theme="light"] .collection-card-item.locked{opacity:.45}[data-theme="light"] .collection-card-item.rare{background:#53e8d42f}[data-theme="light"] .collection-card-item.ultra{background:#ffd84d55}
    [data-theme="light"] html{background:#f5efff}[data-theme="light"] .app{background:radial-gradient(circle at 5% 6%,#53e8d455,transparent 25rem),radial-gradient(circle at 95% 8%,#ff8a3445,transparent 28rem),linear-gradient(145deg,#fff8de,#eee7ff 55%,#dff9f6)}[data-theme="light"] .app::before{background-image:radial-gradient(#5e44ad55 .8px,transparent .8px)}[data-theme="light"] .topbar{color:var(--ink)}[data-theme="light"] .brand small,[data-theme="light"] .progress-meta{color:#6d6681}[data-theme="light"] .track{background:#4936811c}[data-theme="light"] .icon-btn{color:#4e358f;background:#ffffffb8;border-color:#6e50bf24;box-shadow:0 4px 0 #cfc4e9}[data-theme="light"] .panel{background:#fffdf9}[data-theme="light"] .home-modal{color:var(--ink);background:radial-gradient(circle at 12% 10%,#53e8d45c,transparent 30rem),radial-gradient(circle at 92% 8%,#ff8a3447,transparent 30rem),linear-gradient(145deg,#fff9e5,#eee8ff 62%,#dff8f5)}[data-theme="light"] .home-copy p,[data-theme="light"] .home-card>p,[data-theme="light"] .home-stat small,[data-theme="light"] .buddy-slot small{color:#6d6681}[data-theme="light"] .home-card,[data-theme="light"] .home-stat,[data-theme="light"] .skill-chip,[data-theme="light"] .buddy-slot{background:#ffffffa8;border-color:#6947bc22;box-shadow:0 8px 25px #5f449217}[data-theme="light"] .home-action{box-shadow:0 8px 0 #c7badd}[data-theme="light"] .home-action:hover{box-shadow:0 11px 0 #c7badd}[data-theme="light"] .home-action.arcade{box-shadow:0 8px 0 #39218d}[data-theme="light"] .home-action.arcade:hover{box-shadow:0 11px 0 #39218d}[data-theme="light"] .arcade-modal{color:var(--ink);background:radial-gradient(circle at 10% 8%,#53e8d447,transparent 28rem),linear-gradient(145deg,#fff9e8,#ebe5ff 65%,#dff7f4)}[data-theme="light"] .arcade-top p,[data-theme="light"] .arcade-hero p,[data-theme="light"] .control-tip{color:#6d6681}[data-theme="light"] .arcade-wallet,[data-theme="light"] .close-arcade,[data-theme="light"] .back-lobby,[data-theme="light"] .stage-stat,[data-theme="light"] .touch-btn{background:#ffffffc9;color:var(--ink);border-color:#6b4bbd24}[data-theme="light"] .touch-btn{box-shadow:0 6px 0 #bcb0d7}[data-theme="light"] .touch-btn:active,[data-theme="light"] .touch-btn.pressed{box-shadow:0 1px 0 #bcb0d7;color:white}[data-theme="light"] .arcade-wallet b,[data-theme="light"] .stage-stat b,[data-theme="light"] .collection-count{color:#5c3fc2}[data-theme="light"] .price-rule{color:#3c6800;background:#b9f4535e;border-color:#74a62566}[data-theme="light"] .idle-celebration{color:#fff;background:radial-gradient(circle,#9779f2,#6042bd 58%,#26135d)}[data-theme="light"] .celebrate-word,[data-theme="light"] .idle-card h2,[data-theme="light"] .game-over-card h3{text-shadow:0 6px 0 #402188,0 3px 20px #16073f,0 0 55px #000}
    .hidden { display:none!important; }
    .home-hero>*,.home-dashboard>*,.home-actions>*,.game-grid>*,.arcade-games>*{min-width:0}.home-dashboard{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.home-actions{grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr))}.arcade-games{grid-template-columns:repeat(3,minmax(0,1fr))}.home-card,.main-card,.side,.game-tile{min-height:0}
    .collection-card-item{appearance:none;width:100%;font:inherit;color:inherit;cursor:pointer}.collection-card-item:focus-visible,.collection-tab:focus-visible,.collection-close:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
    .collection-detail-modal{position:fixed;inset:0;z-index:101;display:grid;place-items:center;padding:18px;background:#08041fcc;backdrop-filter:blur(12px)}.collection-detail-card{width:min(430px,100%);max-height:calc(100dvh - 36px);overflow:auto;position:relative;border-radius:30px;padding:30px;text-align:center;background:linear-gradient(145deg,#fff9e8,#ebe5ff 65%,#dff7f4);color:var(--ink);box-shadow:0 24px 0 #050216}.collection-detail-close{position:absolute;right:14px;top:14px;width:42px;height:42px;border-radius:13px;background:#ffffffb8;color:var(--ink);font-size:23px;box-shadow:0 4px 0 #cfc4e9}.collection-detail-art{width:128px;height:128px;margin:0 auto 16px;border-radius:38px;display:grid;place-items:center;font-size:72px;background:linear-gradient(135deg,var(--sun),var(--orange));box-shadow:0 13px 0 #9d5115}.collection-detail-set{display:inline-block;border-radius:100px;padding:6px 10px;background:#53e8d433;color:#167f72;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.collection-detail-card h2{font-size:32px;line-height:1;margin:12px 0 7px}.collection-detail-rarity{display:inline-block;margin:0;padding:6px 10px;border-radius:100px;background:var(--lime);color:#233900;font-size:10px;font-weight:800}.collection-detail-card>p:not(.collection-detail-rarity){color:var(--muted);font-size:13px;line-height:1.5;margin:16px 0}.collection-detail-card>strong{display:block;color:#5c3fc2;font-size:12px}
    [data-theme="dark"] .collection-detail-card{background:linear-gradient(145deg,#171044,#28166e);color:#fff}.collection-detail-card .collection-detail-rarity{color:#233900}.collection-trade{width:100%;min-height:52px;margin-top:16px;border-radius:16px;padding:10px 16px;background:var(--sun);color:#442b00;font-weight:900;box-shadow:0 6px 0 #cf9418}.collection-trade:disabled{opacity:.6;transform:none}
    [data-theme="light"] .home-collection-top{background:#ffffffb8;color:var(--ink);border-color:#6e50bf24;box-shadow:0 5px 0 #cfc4e9}
    @media (max-width:660px){.home-collection-top{min-height:36px;width:38px;padding:0;justify-content:center;font-size:18px}.home-collection-top span{display:none}}
    .shake { animation:shake .42s ease; }
    .reduce-motion *, .reduce-motion *::before, .reduce-motion *::after { animation:none!important;transition-duration:.01ms!important; }
    .power-idle *, .page-hidden * { animation-play-state:paused!important; }
    .power-idle .orb,.page-hidden .orb{filter:none}.power-idle .intro,.power-idle .lesson-modal,.power-idle .finish-modal,.power-idle .switch-modal,.power-idle .bonus-modal,.page-hidden .intro{backdrop-filter:none}
    #gameCanvas{contain:strict}
    @keyframes shake { 0%,100%{transform:translateX(0)}20%{transform:translateX(-11px) rotate(-1deg)}40%{transform:translateX(9px) rotate(1deg)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)} }
    @keyframes rewardSpin { to{transform:rotate(360deg)} }
    @keyframes planetFloat { 50%{transform:translateY(-16px) rotate(4deg)} }
    @media (max-width:950px) {
      .game-grid{grid-template-columns:1fr}.side{grid-template-columns:1fr 1fr}.leader-panel{grid-column:span 2}.main-card{min-height:620px}.run-progress{display:block;min-width:120px;max-width:none}.buddy-shelf{grid-template-columns:repeat(4,1fr)}.home-actions{grid-template-columns:1fr 1fr}.home-action.arcade{grid-column:span 2}
    }
    @media (max-width:660px) {
      .shell{padding:14px 11px 32px}.topbar{gap:7px;margin-bottom:14px}.brand small{display:none}.brand-name{font-size:18px}.brand-mark{width:40px;height:40px}.player-chip small{display:none}.player-chip strong{max-width:54px}.icon-btn{width:38px;height:38px}.arcade-btn{width:42px;padding:0;justify-content:center}.arcade-btn>span{display:none}.main-card{border-radius:24px;padding:20px 14px;min-height:650px}.question-zone{padding:25px 0 17px}.question{font-size:38px}.question.word{font-size:25px}.choice{min-height:76px;font-size:21px}.keypad-view.show{grid-template-columns:1fr}.input-well{min-height:130px}.number-pad{max-width:330px;width:100%;margin:auto}.side{grid-template-columns:1fr}.leader-panel{grid-column:auto}.intro-card{grid-template-columns:1fr}.intro-art{display:none}.intro-form{padding:37px 25px}.modal-card{padding:30px 20px}.lesson-actions{flex-direction:column}.finish-score{font-size:58px}.arcade-modal{padding:9px}.arcade-shell{min-height:calc(100vh - 18px)}.arcade-hero{align-items:start;flex-direction:column}.arcade-hero p{display:none}.arcade-games{grid-template-columns:1fr}.game-tile{min-height:275px}.game-art{height:100px;font-size:64px}.touch-btn{width:54px;height:52px}.touch-btn.action{width:82px;margin-left:3px}.arcade-wallet{padding:8px}.arcade-top p{display:none}.home-modal{padding:12px}.home-shell{min-height:calc(100vh - 24px)}.home-hero{grid-template-columns:1fr;padding:28px 0 18px}.home-copy h1{font-size:55px}.home-orbit{display:none}.home-actions{grid-template-columns:1fr}.home-action.arcade{grid-column:auto}.home-dashboard{grid-template-columns:1fr}.skill-map{grid-template-columns:repeat(3,1fr)}.bonus-card{padding:27px 18px}.bonus-options{grid-template-columns:1fr}.idle-emoji{font-size:72px}.buddy-shelf{grid-template-columns:repeat(2,1fr)}.theme-options{grid-template-columns:1fr}.theme-option{min-height:70px}.theme-option span{display:inline;margin-right:8px}
    }
    .shell{height:100%;display:flex;flex-direction:column;padding-bottom:14px}.topbar{flex:0 0 auto}.game-grid{flex:1;min-height:0}.main-card{height:100%;min-height:0}.home-modal,.arcade-modal{height:100dvh;max-height:100dvh;overflow:hidden;overscroll-behavior:none}.home-shell,.arcade-shell{height:100%;min-height:0}.arcade-shell{min-height:0}.game-stage.show{min-height:0}.canvas-wrap{width:min(800px,calc((100dvh - 205px) * 1.6))}.modal-card{overscroll-behavior:contain}
    @media (max-height:850px){
      .shell{padding:10px 20px 10px}.topbar{margin-bottom:9px}.main-card{padding:18px 24px}.question-zone{padding:11px 0 9px}.question{font-size:clamp(32px,4.2vw,52px)}.question.word{font-size:clamp(22px,2.5vw,31px)}.question-sub{margin-top:7px}.answer-mode{margin-bottom:10px}.answer-stage{min-height:0}.choice{min-height:64px}.feedback{margin-top:9px}.side{grid-template-columns:1fr 1fr;gap:8px;overflow:hidden}.panel{padding:12px;border-radius:18px}.leader-panel{grid-column:span 2}.panel-title{margin-bottom:8px}.streak-card h2{font-size:21px}.streak-card p{margin:3px 0 9px}.mission{padding:8px}.stat{padding:8px 5px}.leader{padding:5px 7px}.home-modal{padding:10px 22px}.home-hero{padding:5px 0 7px;grid-template-columns:1.25fr .75fr}.home-copy h1{font-size:clamp(46px,5.2vw,60px);margin:3px 0 7px}.home-copy>p{display:none}.coin-vault{grid-template-columns:40px auto;padding:5px 11px 5px 5px}.coin-orb{width:40px;height:40px;font-size:22px}.coin-vault b{font-size:22px}.home-actions{margin-top:8px}.home-action{min-height:62px;padding:9px 12px}.home-action strong{font-size:15px}.home-orbit{min-height:170px}.home-planet{width:140px;height:140px;font-size:62px;box-shadow:0 12px 0 #9c451b,0 0 40px #ff8a3466}.orbit-chip{padding:7px 9px;font-size:9px}.home-dashboard{gap:6px}.home-card{padding:8px 11px;border-radius:16px}.home-card h2{font-size:16px}.home-card>p{margin-bottom:5px}.skill-map{gap:4px}.skill-chip{padding:6px 3px}.home-stat{padding:7px 3px}.home-stat b{font-size:18px}.home-note{margin-top:5px}.collection-head p{display:none}.buddy-shelf{gap:4px;margin-top:4px}.buddy-slot{padding:4px 2px}.buddy-slot .buddy-emoji{font-size:23px}.buddy-slot strong{margin-top:2px}.buddy-slot small{display:none}.arcade-modal{padding:8px 18px}.arcade-top{padding:3px 0 7px}.arcade-hero{padding:8px 0 10px}.arcade-hero h1{font-size:48px}.game-tile{min-height:285px}.game-art{height:95px;font-size:58px}.touch-controls{padding:10px 0}.control-tip{margin-top:-3px}
    }
    @media (max-width:660px){
      .shell{padding:7px 7px}.topbar{flex-wrap:wrap;margin-bottom:6px}.run-progress{order:3;flex:0 0 100%;width:100%;margin:0}.progress-meta{font-size:9px;margin-bottom:4px}.track{height:9px}.brand-mark{width:35px;height:35px}.brand-name{font-size:16px}.icon-btn{width:34px;height:34px}.arcade-btn{height:36px;width:38px}.player-chip{padding:4px}.avatar{width:29px;height:29px}.main-card{padding:12px 9px;border-radius:18px}.question-zone{padding:8px 0}.question{font-size:32px}.question.word{font-size:20px}.question-sub{display:none}.answer-mode{margin-bottom:7px}.mode-btn{padding:7px 5px;font-size:10px}.choice{min-height:54px;font-size:18px}.feedback{font-size:11px;min-height:30px}.side{display:none}.home-modal{padding:7px}.home-top{min-height:38px}.home-hero{display:block;padding:7px 0}.home-copy h1{font-size:42px;margin:4px 0 7px;line-height:.9}.home-copy>p{display:none}.coin-vault{grid-template-columns:38px auto;border-radius:16px}.coin-orb{width:38px;height:38px;border-radius:12px}.coin-vault b{font-size:21px}.home-actions{grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px;max-width:none}.home-action,.home-action.quick:disabled{grid-column:auto;min-height:62px;padding:7px;border-radius:15px;box-shadow:0 5px 0 #060318}.home-action strong{font-size:12px;line-height:1.1}.home-action small{font-size:8px;line-height:1.2}.home-dashboard{grid-template-columns:1.25fr .75fr;gap:5px}.home-card{padding:7px;border-radius:14px}.home-card h2{font-size:14px;margin-bottom:2px}.home-card>p,.collection-head p,.home-note{display:none}.skill-map{grid-template-columns:repeat(5,1fr);gap:2px}.skill-chip{padding:4px 1px;border-radius:9px}.skill-chip b{font-size:14px}.skill-chip small{font-size:5px;letter-spacing:0;margin-top:2px}.home-stats{gap:3px}.home-stat{padding:6px 2px;border-radius:9px}.home-stat b{font-size:16px}.home-stat small{font-size:6px}.collection-card{grid-column:1/-1}.collection-count{font-size:8px}.buddy-shelf{grid-template-columns:repeat(8,1fr);gap:3px;margin-top:4px}.buddy-slot{padding:4px 1px;border-radius:10px}.buddy-slot .buddy-emoji{font-size:21px}.buddy-slot strong,.buddy-slot small{display:none}.buddy-level{right:1px;top:1px;min-width:15px;height:15px;font-size:6px}.arcade-modal{padding:6px}.arcade-top{padding:2px 0 5px}.arcade-top h2{font-size:18px}.arcade-hero{padding:5px 0 7px}.arcade-hero h1{font-size:30px}.price-rule{margin-bottom:4px;padding:5px 7px}.arcade-games{grid-template-columns:repeat(3,1fr);gap:5px;padding-bottom:0}.game-tile{min-height:205px;padding:7px;border-radius:14px;box-shadow:0 7px 0 #060318}.game-art{height:48px;font-size:36px}.game-tile h3{font-size:16px;line-height:1;margin-bottom:4px}.game-tile p{display:none}.game-meta{display:grid;gap:2px}.game-meta span{font-size:6px;padding:3px 4px}.play-game{margin-top:5px;padding:8px 3px;font-size:9px;border-radius:10px}.stage-bar{gap:5px;margin-bottom:5px}.stage-bar h3{font-size:15px}.stage-stat{padding:5px;font-size:7px}.back-lobby{padding:7px;font-size:8px}.canvas-wrap{width:min(800px,calc((100dvh - 155px) * 1.6));padding:5px;border-radius:15px}.touch-controls{gap:4px;padding:7px 0}.touch-btn{width:47px;height:45px;border-radius:14px}.touch-btn.action{width:72px;margin-left:1px}.control-tip{font-size:7px}.modal-card{max-height:calc(100dvh - 14px)}
    }
    @media (max-height:850px){
      .intro-card{max-height:calc(100dvh - 16px)}.intro-art{min-height:0}.intro-art h1{font-size:46px;margin:65px 0 12px}.intro-form{padding:14px 25px}.intro-form h2{font-size:30px}.intro-form>p{margin-bottom:8px}.skill-label{margin:9px 0 6px}.skill-btn{padding:8px 10px}.start-btn{margin-top:9px;padding:12px 17px}.sound-note{display:none}.name-key{height:34px}.touch-keyboard{gap:4px;padding:6px}
    }
    @media (max-width:660px){
      .intro{padding:7px;overflow:hidden}.intro-card{height:auto;max-height:calc(100dvh - 14px);border-radius:23px}.intro-form{padding:13px 14px}.intro-form h2{font-size:27px;margin:3px 0}.intro-form>p{display:none}.known-players{max-height:58px;overflow:hidden;margin:5px 0}.player-roster{flex-wrap:nowrap}.roster-btn{flex:0 0 auto}.name-label{margin-top:3px;margin-bottom:4px}.name-wrap{border-radius:14px}.name-input{padding:8px 4px}.name-tools{margin-top:6px;gap:5px}.name-tool{min-height:37px;padding:6px;font-size:9px;border-radius:11px}.voice-status{margin-top:4px;min-height:11px;font-size:8px}.touch-keyboard{margin-top:3px;padding:5px;gap:4px;border-radius:13px}.name-key-row{gap:3px}.name-key{height:32px;border-radius:8px;font-size:11px;box-shadow:0 2px 0 #cec4db}.name-key.wide{font-size:8px}.skill-label{margin:7px 0 4px}.skill-pick{gap:5px}.skill-btn{padding:6px 8px;border-radius:12px}.skill-btn span{display:inline;font-size:15px;margin:0 4px 0 0}.skill-btn strong{display:inline;font-size:10px}.skill-btn small{display:none}.start-btn{margin-top:7px;padding:11px}.sound-note{display:none}
    }
    @media (orientation:portrait) and (max-width:950px){
      .home-hero{grid-template-columns:1fr;gap:10px;padding:18px 0 12px}.home-orbit{min-height:150px}.home-planet{width:150px;height:150px;font-size:68px;box-shadow:0 13px 0 #9c451b,0 0 45px #ff8a3466}.home-dashboard{grid-template-columns:1fr}.game-grid{grid-template-columns:1fr}.game-grid>.side{display:none}.finish-modal{padding:8px}.finish-modal .modal-card{max-height:calc(100dvh - 16px);overflow:hidden;padding:14px 18px;border-radius:24px}.finish-modal .lesson-icon{width:48px;height:48px;font-size:25px;margin-bottom:7px}.finish-modal h2{font-size:26px;margin:4px 0}.finish-score{font-size:44px}.finish-stats{gap:18px;margin:6px 0}.finish-stats b{font-size:18px}.reward-zone{margin:7px 0 3px;padding:8px 12px}.capsule-btn{display:grid;grid-template-columns:58px 1fr;grid-template-rows:1fr 1fr;align-items:center;column-gap:10px;text-align:left}.capsule{width:52px;height:62px;margin:3px;border-width:3px;font-size:20px;grid-row:1/3}.capsule-btn strong{grid-column:2;align-self:end}.capsule-btn small{grid-column:2;align-self:start}.reward-reveal{gap:10px}.buddy-art{width:60px;height:60px;font-size:34px}.finish-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.finish-actions button{padding:10px 8px;margin-top:5px}.finish-home-btn{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));min-width:88px;min-height:48px;border-radius:15px;padding:0 14px}
    }
    /* Kiosk home: the shell owns the viewport. Only explicit cabinets/modals may scroll. */
    .home-modal{height:100dvh;max-height:100dvh;padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(10px,env(safe-area-inset-bottom));}
    .home-shell{height:100%;min-height:0;overflow:hidden;}
    .home-top,.home-hero,.home-dashboard{min-height:0;}
    .home-hero{flex:1 1 auto;overflow:hidden;}
    .home-dashboard{flex:0 1 auto;overflow:hidden;}
    .home-card{min-height:0;overflow:hidden;}
    @media (orientation:portrait) and (max-width:950px) and (max-height:800px){
      .home-hero{grid-template-columns:minmax(0,1.2fr) minmax(150px,.8fr);gap:10px;padding:8px 0;}
      .home-orbit{min-height:0;height:100%;}
      .home-planet{width:min(30vw,150px);height:min(30vw,150px);font-size:min(13vw,68px);}
      .home-copy h1{font-size:clamp(40px,6vw,58px);margin:4px 0 8px;}
      .home-copy>p{font-size:11px;line-height:1.3;margin:0 0 7px;}
      .home-actions{margin-top:8px;gap:6px;}
      .home-action{min-height:62px;padding:8px 10px;}
      .home-action strong{font-size:14px;}
      .home-dashboard{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:7px;}
      .home-dashboard .collection-card{grid-column:1/-1;}
      .home-card{padding:9px 11px;border-radius:16px;}
      .home-card h2{font-size:16px;}
      .home-card>p{margin-bottom:6px;}
      .collection-card{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px;}
      .collection-card .collection-head{min-width:0;}
      .collection-card .buddy-shelf{grid-column:1/-1;}
      .collection-card .collection-open{margin-top:0;}
    }
    @media (orientation:portrait) and (max-width:660px) and (max-height:800px){
      .home-hero{display:block;padding:5px 0 6px;}
      .home-orbit{display:none;}
      .home-copy h1{font-size:42px;margin:4px 0 6px;}
      .home-actions{margin-top:7px;}
      .home-dashboard{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);}
      .home-card{padding:6px 7px;}
      .home-card h2{font-size:14px;}
      .collection-card{padding:7px;}
    }
  .native-icon{font-style:normal;display:inline-grid;place-items:center;line-height:1}
  .native-confetti{position:fixed;inset:0;z-index:9999;pointer-events:none;overflow:hidden}
  .native-confetti i{position:absolute;left:50%;top:52%;width:9px;height:14px;border-radius:3px;animation:native-pop var(--d) cubic-bezier(.12,.7,.24,1) forwards}
  @keyframes native-pop{to{transform:translate(var(--x),55vh) rotate(var(--r));opacity:0}}
  .arcade-public{margin:22px 0 8px;padding:20px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
  .arcade-public h2{margin:5px 0 14px;font-size:clamp(20px,3vw,30px)}
  .arcade-board-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .arcade-mini-board{padding:13px;border-radius:16px;background:var(--surface-2);min-width:0}.arcade-mini-board h3{margin:0 0 8px;font-size:14px}.arcade-mini-row{display:grid;grid-template-columns:22px 1fr auto;gap:6px;padding:6px 0;border-top:1px solid var(--line);font-size:11px}.arcade-mini-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.arcade-report{border:0;background:none;color:var(--muted);font:inherit;cursor:pointer;padding:0 2px}
  @media(max-width:760px){.arcade-board-grid{grid-template-columns:1fr}}
    [hidden]{display:none!important}
    @media(max-width:900px){.intro-card{grid-template-columns:1fr;width:min(620px,100%)}.intro-art{display:none}}
}

/* Versioned Collectable artwork; text/emoji remains available when images fail. */
.collectable-portrait{display:inline-grid;position:relative;width:72px;height:72px;place-items:center;border-radius:20px;overflow:hidden;vertical-align:middle}.collectable-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}.collectable-portrait img.art-loaded{opacity:1}.collectable-portrait:has(img.art-loaded)>.collectable-fallback{visibility:hidden}.buddy-slot .collectable-portrait{width:48px;height:48px;border-radius:14px}.collection-detail-art.has-art{position:relative;width:100%;height:220px;border-radius:22px;overflow:hidden;box-shadow:0 6px 0 #cfc4e9}.collection-detail-art.has-art img{position:absolute;opacity:0}.collection-detail-art.has-art img.art-loaded{opacity:1}.collectable-habitat{inset:0;width:100%;height:100%;object-fit:cover}.collectable-character{inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);object-fit:contain;z-index:2}.collection-detail-art>.collectable-fallback{z-index:1}.collection-detail-art:has(.collectable-character.art-loaded)>.collectable-fallback{visibility:hidden}.collection-detail-close{z-index:3}

.buddy-shelf{grid-template-columns:repeat(5,minmax(0,1fr))}.buddy-slot{font:inherit;color:inherit;cursor:pointer}.buddy-slot:focus-visible{outline:3px solid var(--mint,#53e8d4);outline-offset:3px}#breakthroughArt .collectable-portrait{width:150px;height:150px;margin:0 auto}#collectionFavouriteHint{font-size:13px}#buddyArt .collectable-portrait{width:100%;height:100%}
/* Arcade stage accessibility and readable onboarding. */
.arcade-status{margin:0;padding:10px 18px;background:#100b2f;color:#fff;font-weight:800;min-height:42px}
.game-ready{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#100b2fe8;color:#fff;text-align:center;padding:24px;z-index:3;pointer-events:none}
.game-ready[hidden]{display:none}.game-ready p{font-size:clamp(16px,3vw,24px);max-width:580px}.game-ready strong{font-size:64px;color:#53e8d4}
.arcade-hand{display:flex;gap:10px;align-items:center;justify-content:center;padding:12px;font-weight:800}.arcade-hand input{width:22px;height:22px}.touch-controls.left-handed .action{order:-1}.touch-btn{touch-action:none;min-width:48px;min-height:48px}#gameOverTip{font-size:14px;line-height:1.4}#gameStage button:focus-visible{outline:3px solid #ffd84d;outline-offset:3px}

.arcade-settings{display:flex;flex-wrap:wrap;gap:16px;margin:16px 0}.arcade-settings label{display:flex;align-items:center;gap:8px;font-weight:800}.arcade-settings select{font:inherit;padding:10px;border-radius:12px;border:2px solid #8157ff;background:#fff;color:#17102f}
#controlTip{font-size:14px;line-height:1.5;padding:10px 16px}.game-ready p{line-height:1.5}
