:root{--bg:#fdf0d5;--ink:#3d2c22;--ink-soft:#6b5546;--card:#fffaf0;--card-2:#fff3dc;--line:#e6d3b3;--accent:#f4a261;--accent-ink:#7a3e12;--primary:#2a9d8f;--primary-ink:#fff;--danger:#e76f51;--gold:#ffb703;--blue:#219ebc;--purple:#8e7dbe;--ok:#52b788;--shadow:0 6px 0 #3d2c222e, 0 10px 24px #3d2c222e;--radius:22px;--touch:64px;--font:"Nunito", "Trebuchet MS", "Segoe UI Rounded", "Segoe UI", system-ui, sans-serif;font-family:var(--font);color:var(--ink);-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html,body{background:var(--bg);overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{touch-action:none;-webkit-user-select:none;user-select:none}#game{outline:none;width:100vw;height:100vh;display:block;position:fixed;inset:0}#ui{pointer-events:none;z-index:10;position:fixed;inset:0}#ui>*{pointer-events:auto}#ui .passthrough{pointer-events:none}#ui .passthrough>*{pointer-events:auto}button{color:inherit;cursor:pointer;background:0 0;border:none;font-family:inherit}button:focus-visible{outline:4px solid var(--blue);outline-offset:2px}input,select{font-family:inherit;font-size:1.1rem}.btn{min-height:var(--touch);min-width:var(--touch);background:var(--card);box-shadow:var(--shadow);border:3px solid var(--line);border-radius:999px;justify-content:center;align-items:center;gap:10px;padding:0 22px;font-size:1.25rem;font-weight:800;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.btn:active{transform:translateY(4px);box-shadow:0 2px #3d2c222e}.btn.primary{background:var(--primary);color:var(--primary-ink);border-color:#1f776c}.btn.accent{background:var(--accent);color:#fff;border-color:#c97b3c}.btn.gold{background:var(--gold);color:var(--ink);border-color:#c98f00}.btn.danger{background:var(--danger);color:#fff;border-color:#b3502f}.btn.ghost{background:#fffaf0d9}.btn.round{width:var(--touch);border-radius:50%;padding:0;font-size:1.7rem}.btn.small{min-height:48px;padding:0 16px;font-size:1rem}.btn[disabled]{opacity:.45;pointer-events:none}.btn .sub{opacity:.8;font-size:.75rem;font-weight:600;display:block}.stack{flex-direction:column;gap:12px;display:flex}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.grow{flex:1}.center{justify-content:center;align-items:center;display:flex}.muted{color:var(--ink-soft)}.nl{color:var(--ink-soft);font-style:italic}.big-emoji{font-size:3rem;line-height:1}.hidden{display:none!important}.screen{background:radial-gradient(circle at 20% 10%, #fff7e6 0, var(--bg) 55%, #f6d9a8 100%);padding:max(20px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(28px, env(safe-area-inset-left));touch-action:pan-y;flex-direction:column;animation:.25s fadein;display:flex;position:fixed;inset:0;overflow-y:auto}.screen.dim{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#281c148c}.screen h1{letter-spacing:.5px;margin:6px 0 4px;font-size:2.6rem}.screen h2{margin:6px 0;font-size:1.6rem}.title-logo{color:var(--accent-ink);text-shadow:0 4px #ffd6a5;font-size:3.2rem;font-weight:900}@keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{opacity:0;transform:scale(.6)}70%{transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes spin{to{transform:rotate(360deg)}}.panel{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:3px solid var(--line);padding:18px 20px}.modal{flex-direction:column;width:min(1080px,96vw);max-height:94vh;margin:auto;animation:.25s pop;display:flex}.modal-head{align-items:center;gap:14px;margin-bottom:12px;display:flex}.modal-head h2{flex:1;margin:0}.modal-body{touch-action:pan-y;padding-right:4px;overflow-y:auto}.tabs{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.tab{background:var(--card-2);border:3px solid var(--line);border-radius:16px;min-height:54px;padding:0 18px;font-size:1.1rem;font-weight:800}.tab.active{background:var(--accent);color:#fff;border-color:#c97b3c}.profiles{flex-wrap:wrap;justify-content:center;gap:28px;margin:auto 0;display:flex}.profile-card{background:var(--card);width:260px;box-shadow:var(--shadow);border:4px solid var(--line);border-radius:28px;flex-direction:column;align-items:center;gap:10px;padding:22px;font-size:1.5rem;font-weight:900;animation:.3s pop;display:flex}.profile-card:active{transform:translateY(4px)}.profile-card .meta{color:var(--ink-soft);font-size:1rem;font-weight:700}.avatar-face{border:4px solid #3d2c2233;border-radius:50%;width:130px;height:130px;position:relative;overflow:hidden;box-shadow:inset 0 -8px #00000014}.avatar-face .hair{border-radius:50% 50% 40% 40%;height:46%;position:absolute;top:-10%;left:-5%;right:-5%}.avatar-face .eye{background:#2b1b12;border-radius:50%;width:12%;height:14%;position:absolute;top:48%}.avatar-face .eye.l{left:28%}.avatar-face .eye.r{right:28%}.avatar-face .smile{border-bottom:5px solid #8a3b2b;border-radius:0 0 50% 50%;height:10%;position:absolute;top:68%;left:35%;right:35%}.avatar-face .shirt{border-radius:50%;height:40%;position:absolute;bottom:-30%;left:10%;right:10%}.add-card{color:var(--ink-soft);border-style:dashed;justify-content:center;min-height:260px}.form-grid{grid-template-columns:220px 1fr;align-items:center;gap:14px 18px;display:grid}.form-grid label{font-size:1.1rem;font-weight:800}.chips{flex-wrap:wrap;gap:10px;display:flex}.chip-opt{border:3px solid var(--line);background:var(--card-2);border-radius:16px;min-width:56px;min-height:56px;padding:0 16px;font-size:1.1rem;font-weight:800}.chip-opt.on{border-color:var(--primary);background:#d8f3ee}.swatch{width:56px;height:56px;box-shadow:0 0 0 3px var(--line);border:4px solid #fff;border-radius:50%}.swatch.on{box-shadow:0 0 0 5px var(--primary)}.text-input{border:3px solid var(--line);min-height:60px;color:var(--ink);background:#fff;border-radius:16px;width:100%;padding:0 16px;font-size:1.4rem;font-weight:800}.hud-top{top:max(10px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));right:max(12px, env(safe-area-inset-right));pointer-events:none;align-items:flex-start;gap:12px;display:flex;position:fixed}.hud-top>*{pointer-events:auto}.hud-pill{box-shadow:var(--shadow);border:3px solid var(--line);background:#fffaf0eb;border-radius:999px;align-items:center;gap:10px;min-height:56px;padding:6px 16px 6px 8px;font-size:1.15rem;font-weight:900;display:flex}.hud-pill .ico{background:var(--card-2);border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.5rem;display:flex}.xpbar{background:#eadbc2;border-radius:6px;width:120px;height:12px;overflow:hidden}.xpbar>i{background:linear-gradient(90deg, var(--gold), var(--accent));height:100%;display:block}.clock-pill{margin:0 auto}.tracker{top:calc(max(10px, env(safe-area-inset-top)) + 70px);left:max(12px, env(safe-area-inset-left));width:min(380px,40vw);box-shadow:var(--shadow);border:3px solid var(--line);background:#fffaf0f0;border-radius:20px;align-items:center;gap:10px;padding:10px 12px;display:flex;position:fixed}.tracker .emoji{font-size:2.2rem}.tracker .task{font-size:1.15rem;font-weight:900;line-height:1.2}.tracker .level{color:var(--accent-ink);text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;font-weight:800}.tracker .nl{font-size:.95rem}.joystick{left:max(28px, env(safe-area-inset-left));bottom:max(28px, env(safe-area-inset-bottom));touch-action:none;background:#fffaf059;border:4px solid #fffaf0cc;border-radius:50%;width:170px;height:170px;position:fixed}.joystick .knob{width:78px;height:78px;box-shadow:var(--shadow);border:3px solid var(--line);background:#fffaf0f2;border-radius:50%;margin:-39px 0 0 -39px;position:absolute;top:50%;left:50%}.action-btn{right:max(28px, env(safe-area-inset-right));bottom:max(28px, env(safe-area-inset-bottom));border-radius:28px;flex-direction:column;gap:0;min-width:150px;min-height:96px;padding:8px 18px;font-size:1.35rem;position:fixed}.action-btn .emo{font-size:2.2rem}.action-btn.pulse{animation:1.2s infinite glow}@keyframes glow{0%,to{box-shadow:var(--shadow), 0 0 0 0 #f4a261b3}50%{box-shadow:var(--shadow), 0 0 0 14px #f4a26100}}.side-btns{right:max(16px, env(safe-area-inset-right));top:calc(max(10px, env(safe-area-inset-top)) + 76px);flex-direction:column;gap:12px;display:flex;position:fixed}.offline-badge{border:2px solid var(--accent);background:#ffe8d6;border-radius:999px;padding:4px 12px;font-size:.9rem;font-weight:800;position:fixed;bottom:8px;left:50%;transform:translate(-50%)}.mode-badge{background:#e9ecef;border:2px solid #ced4da;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:.85rem;font-weight:900;display:inline-flex}.mode-badge.ai{border-color:var(--primary);color:#145a52;background:#d8f3ee}.convo{left:50%;bottom:max(12px, env(safe-area-inset-bottom));grid-template-columns:auto 1fr auto;align-items:stretch;gap:14px;width:min(1100px,96vw);animation:.25s pop;display:grid;position:fixed;translate:-50%}.convo .who{flex-direction:column;justify-content:center;align-items:center;gap:6px;min-width:130px;padding:10px;display:flex}.convo .who .name{font-size:1.3rem;font-weight:900}.convo .main{flex-direction:column;gap:8px;min-height:150px;max-height:42vh;padding:12px 16px;display:flex;overflow-y:auto}.convo .visual{text-align:center;font-size:4rem;line-height:1;animation:1.6s infinite bob}.convo .subtitle{font-size:1.5rem;font-weight:800;line-height:1.25}.convo .subtitle.faint{opacity:.35;filter:blur(3px)}.convo .you{color:var(--primary);font-size:1.2rem;font-weight:800}.convo .hint-nl{border:2px dashed var(--gold);background:#fff3c4;border-radius:12px;padding:8px 12px;font-size:1.15rem}.convo .side{grid-template-columns:auto repeat(4, var(--touch));grid-template-rows:var(--touch) var(--touch);align-items:center;gap:8px;padding:10px;display:grid}.convo .side .orb-col{flex-direction:column;grid-row:1/3;align-items:center;gap:4px;width:116px;display:flex}.suggestions{flex-wrap:wrap;gap:10px;display:flex}.suggestion{border:3px solid var(--primary);background:#e7f6f3;border-radius:18px;align-items:center;gap:8px;min-height:58px;padding:0 18px;font-size:1.15rem;font-weight:800;display:inline-flex}.mic-orb{background:var(--card-2);border:4px solid var(--line);border-radius:50%;justify-content:center;align-items:center;width:84px;height:84px;font-size:2.6rem;transition:background .2s;display:flex;position:relative}.mic-orb:after{content:"";transform:scale(var(--lvl,1));border:6px solid #0000;border-radius:50%;transition:transform 80ms linear;position:absolute;inset:-10px}.mic-orb.listening{border-color:var(--primary);background:#d8f3ee}.mic-orb.listening:after{border-color:#2a9d8f73}.mic-orb.user_speaking{border-color:var(--ok);background:#b7e4c7}.mic-orb.user_speaking:after{border-color:#52b788b3}.mic-orb.thinking{border-color:var(--gold);background:#fff3c4}.mic-orb.npc_speaking{border-color:var(--accent);background:#ffe8d6}.mic-orb.error{border-color:var(--danger);background:#fde2dc}.mic-label{text-align:center;max-width:116px;font-size:.85rem;font-weight:800;line-height:1.15}.dots i{background:var(--gold);border-radius:50%;width:10px;height:10px;margin:0 3px;animation:.8s infinite bob;display:inline-block}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}.type-row{gap:8px;display:flex}.lesson{width:min(980px,94vw);animation:.25s pop;position:fixed;top:50%;left:50%;translate:-50% -50%}.lesson .options{flex-wrap:wrap;justify-content:center;gap:16px;margin:12px 0;display:flex}.lesson .opt{border:4px solid var(--line);width:170px;height:170px;box-shadow:var(--shadow);background:#fff;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;gap:6px;font-size:1.3rem;font-weight:900;display:flex}.lesson .opt .e{font-size:4.2rem}.lesson .opt.good{border-color:var(--ok);background:#d8f3e2}.lesson .opt.try{border-color:var(--gold)}.lesson .numpad{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.lesson .numpad .btn{border-radius:24px;min-width:110px;min-height:90px;font-size:2.2rem}.lesson .picture{text-align:center;letter-spacing:6px;word-break:break-all;max-width:760px;margin:0 auto;font-size:2.6rem;line-height:1.3}.lesson .progress{gap:6px;display:flex}.lesson .progress i{background:#eadbc2;border-radius:5px;width:26px;height:10px}.lesson .progress i.done{background:var(--ok)}.lesson .progress i.cur{background:var(--accent)}.lesson.mini{width:min(620px,80vw);top:auto;bottom:18px;translate:-50%}.toasts{pointer-events:none;z-index:30;flex-direction:column;align-items:center;gap:10px;display:flex;position:fixed;top:84px;left:50%;transform:translate(-50%)}.toast{background:var(--card);border:3px solid var(--gold);box-shadow:var(--shadow);border-radius:20px;align-items:center;gap:10px;padding:10px 18px;font-size:1.2rem;font-weight:900;animation:.3s pop;display:flex}.toast .e{font-size:1.8rem}.reward{text-align:center}.reward .burst{font-size:5rem;animation:.5s pop,2s .5s infinite bob}.reward .gains{flex-wrap:wrap;justify-content:center;gap:18px;margin:14px 0;font-size:1.5rem;font-weight:900;display:flex}.reward .gain{background:var(--card-2);border:3px solid var(--line);border-radius:18px;padding:10px 18px}.chapter-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;display:grid}.chapter-card{color:#fff;text-align:left;box-shadow:var(--shadow);border:3px solid #00000026;border-radius:22px;flex-direction:column;gap:6px;min-height:130px;padding:14px;display:flex;position:relative}.chapter-card .n{opacity:.9;font-size:.9rem;font-weight:900}.chapter-card .t{text-shadow:0 2px #0003;font-size:1.25rem;font-weight:900}.chapter-card .e{font-size:2.2rem;position:absolute;top:10px;right:12px}.chapter-card.locked{filter:grayscale(.9);opacity:.55}.chapter-card .bar{background:#ffffff59;border-radius:5px;height:10px;margin-top:auto;overflow:hidden}.chapter-card .bar i{background:#fff;height:100%;display:block}.level-list{flex-direction:column;gap:10px;display:flex}.level-row{background:var(--card-2);border:3px solid var(--line);border-radius:18px;align-items:center;gap:14px;padding:10px 14px;display:flex}.level-row .num{border:3px solid var(--line);background:#fff;border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;font-size:1.2rem;font-weight:900;display:flex}.level-row.completed .num{background:var(--ok);color:#fff;border-color:#2d8a5f}.level-row.active .num{background:var(--accent);color:#fff}.level-row.locked{opacity:.5}.level-row .t{font-size:1.15rem;font-weight:900}.clue-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;display:grid}.clue{border:3px dashed var(--gold);background:#fff8e1;border-radius:16px;align-items:center;gap:10px;padding:12px;font-weight:800;display:flex}.clue .e{font-size:2rem}.journal-row{border-bottom:2px dashed var(--line);gap:10px;padding:8px 0;font-size:1.1rem;display:flex}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.shop-item{border:3px solid var(--line);background:#fff;border-radius:20px;flex-direction:column;align-items:center;gap:6px;min-height:160px;padding:12px 8px;font-weight:800;display:flex}.shop-item .e{font-size:2.6rem}.shop-item .sw{border:3px solid var(--line);border-radius:50%;width:44px;height:44px}.shop-item.equipped{border-color:var(--primary);background:#e7f6f3}.shop-item.locked{opacity:.55}.shop-side{flex-direction:column;width:min(470px,46vw);animation:.2s pop;display:flex;position:fixed;top:12px;bottom:12px;right:12px}.deco-bar{touch-action:pan-x;align-items:center;gap:10px;width:min(1060px,96vw);display:flex;position:fixed;bottom:14px;left:50%;overflow-x:auto;transform:translate(-50%)}.deco-item{border:3px solid var(--line);background:#fff;border-radius:18px;flex-direction:column;flex:none;justify-content:center;align-items:center;min-width:104px;min-height:96px;font-size:.85rem;font-weight:800;display:flex}.deco-item .e{font-size:2rem}.deco-item.on{border-color:var(--primary);background:#e7f6f3}.skill-row{border-bottom:2px dashed var(--line);grid-template-columns:210px 1fr;align-items:center;gap:10px;padding:8px 0;display:grid}.stage{gap:6px;display:flex}.stage i{background:#eadbc2;border-radius:7px;width:34px;height:14px}.stage i.on{background:var(--primary)}.stat-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;display:grid}.stat{background:var(--card-2);border:3px solid var(--line);border-radius:18px;padding:12px}.stat b{font-size:1.8rem;display:block}.fw-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;display:grid}.fw{background:var(--card-2);border:3px solid var(--line);border-radius:16px;align-items:center;gap:10px;padding:10px;font-weight:800;display:flex}.fw.done{border-color:var(--ok);background:#e3f5ea}.fw .e{font-size:1.8rem}.loading{background:var(--bg);z-index:50;flex-direction:column;justify-content:center;align-items:center;gap:18px;display:flex;position:fixed;inset:0}.loading .bar{border:3px solid var(--line);background:#eadbc2;border-radius:11px;width:min(420px,70vw);height:22px;overflow:hidden}.loading .bar i{background:linear-gradient(90deg, var(--accent), var(--gold));width:0;height:100%;transition:width .2s;display:block}.spinner{border:6px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:48px;height:48px;animation:.9s linear infinite spin}#rotate-hint{z-index:100;background:var(--bg);color:var(--ink);text-align:center;font-size:1.6rem;font-weight:900;font-family:var(--font);flex-direction:column;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#rotate-hint div{font-size:5rem;animation:1.5s infinite pulse}@media (orientation:portrait) and (max-width:1100px){#rotate-hint{display:flex}}@media (max-height:640px){:root{--touch:56px}.convo .main{min-height:130px}.convo .subtitle{font-size:1.25rem}.joystick,.lesson .opt{width:140px;height:140px}}.convo .visual.demo{font-size:6rem;animation:.35s pop,1.2s .35s infinite bob}.ideas-label{color:var(--accent-ink);align-self:center;font-size:.95rem;font-weight:800}.survival{flex-wrap:wrap;gap:8px;display:flex}.survival-chip{border:2px dashed var(--gold);background:#fff8e1;border-radius:14px;align-items:center;gap:6px;min-height:46px;padding:0 12px;font-size:.95rem;font-weight:800;display:inline-flex}
