:root{--bg:#050816;--card:#ffffff12;--border:#ffffff1f;--text:#fff;--muted:#cbd5e1;--gold:#fbbf24;--cyan:#22d3ee;--good:#22c55e;--bad:#ef4444}*{box-sizing:border-box}body{background:radial-gradient(circle at top left, #22d3ee24, transparent 28%), radial-gradient(circle at top right, #fbbf241f, transparent 25%), var(--bg);min-height:100vh;color:var(--text);justify-content:center;align-items:center;margin:0;padding:14px;font-family:Segoe UI,Arial,sans-serif;display:flex}#gameContainer{width:min(1120px,100%);position:relative}#rotateOverlay{z-index:9999;background:var(--bg);color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;display:none;position:fixed;inset:0}.rotateIcon{font-size:64px;animation:1.8s ease-in-out infinite rotateHint}.rotateText{color:var(--muted);max-width:280px;font-size:18px;font-weight:700}@keyframes rotateHint{0%,to{transform:rotate(0)}50%{transform:rotate(90deg)}}@media (orientation:portrait) and (pointer:coarse){#rotateOverlay{display:flex}#gameContainer{display:none}}:fullscreen body{padding:0}:fullscreen #gameContainer{width:100vw;max-width:none}:fullscreen #gameScreen{height:100dvh}:fullscreen canvas#game3d{border-radius:0;height:100dvh}.screen{background:var(--card);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:26px;padding:22px;box-shadow:0 24px 80px #00000073}.hidden{display:none!important}h1{background:linear-gradient(90deg,#fbbf24,#22d3ee,#a78bfa);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(30px,6vw,56px);line-height:1}h2{color:#e2e8f0;margin:8px 0 16px;font-size:clamp(18px,3vw,28px)}h3{color:var(--gold);justify-content:space-between;align-items:center;gap:10px;margin:18px 0 10px;display:flex}.story{color:var(--muted);margin-bottom:18px;line-height:1.65}.panel{background:#0206178c;border:1px solid #ffffff1a;border-radius:18px;padding:14px}.charGrid{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;display:grid}.charCard{color:#fff;cursor:pointer;background:#ffffff0d;border:2px solid #ffffff1f;border-radius:20px;flex-direction:column;align-items:center;gap:8px;padding:14px;transition:transform .18s,border-color .18s,background .18s;display:flex}.charCard:hover{background:#ffffff1a;transform:translateY(-3px)}.charCard.selected{border-color:var(--cyan);background:#22d3ee24;box-shadow:0 0 28px #22d3ee2e}.charPreview{background:radial-gradient(circle at 50% 25%,#ffffff24,#ffffff0a);border-radius:16px;width:100px;height:130px}.charName{font-size:20px;font-weight:900}.charInfo{color:var(--muted);text-align:center;font-size:13px;line-height:1.4}.controlsText{color:var(--muted);margin-bottom:16px;line-height:1.6}#menuButtons{flex-direction:column;gap:10px;display:flex}button.primary{color:#fff;cursor:pointer;background:linear-gradient(90deg,#f59e0b,#ef4444,#7c3aed);border:none;border-radius:18px;width:100%;padding:15px 20px;font-size:18px;font-weight:900;box-shadow:0 14px 34px #7c3aed40}button.primary:hover{transform:translateY(-2px)}button.secondary{color:#fff;cursor:pointer;background:#ffffff0f;border:1px solid #fff3;border-radius:18px;width:100%;padding:13px 20px;font-size:15px;font-weight:800}button.secondary:hover{background:#ffffff1f}#gameScreen{box-shadow:none;background:0 0;border:none;border-radius:26px;padding:0;position:relative;overflow:hidden}canvas#game3d{background:#0b1020;border:1px solid #ffffff24;border-radius:26px;width:100%;height:min(72vh,640px);display:block}#hud{pointer-events:none;z-index:5;flex-wrap:nowrap;justify-content:space-between;align-items:flex-start;gap:10px;display:flex;position:absolute;top:12px;left:12px;right:12px}.hudPanel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#020617bd;border:1px solid #ffffff24;border-radius:14px;padding:8px 12px;font-size:13px;font-weight:700}#objective{color:#fff;max-width:58%;box-shadow:inset 3px 0 0 var(--gold)}.stats{white-space:nowrap;color:var(--muted);flex-wrap:nowrap;flex-shrink:0;align-self:flex-start;gap:10px;display:flex}.stats b{color:#fff}#panelButtons{z-index:6;gap:8px;display:flex;position:absolute;top:60px;right:12px}.iconBtn{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#020617bd;border:1px solid #fff3;border-radius:14px;width:42px;height:42px;font-size:18px}.iconBtn:hover{background:#22d3ee38}#toast{color:#fff;opacity:0;pointer-events:none;z-index:10;text-align:center;background:#020617eb;border:1px solid #22d3eea6;border-radius:999px;max-width:90%;padding:10px 16px;font-size:14px;font-weight:800;transition:all .25s;position:absolute;top:74px;left:50%;transform:translate(-50%)translateY(-10px)}#toast.show{opacity:1;transform:translate(-50%)translateY(0)}#dialogBox{z-index:20;background:#020617f5;border:2px solid #fbbf248c;border-radius:20px;width:min(940px,94%);padding:16px;position:absolute;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 18px 60px #00000080}#dialogSpeaker{color:var(--gold);margin-bottom:8px;font-size:16px;font-weight:900}#dialogText{color:#f8fafc;min-height:56px;margin-bottom:10px;font-size:17px;line-height:1.55}.dialogChoice{text-align:left;color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff24;border-radius:14px;width:100%;margin-top:8px;padding:12px 14px;font-size:15px;font-weight:700;transition:all .16s;display:block}.dialogChoice:hover{border-color:var(--cyan);background:#22d3ee2e;transform:translate(3px)}.overlayPanel{z-index:30;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#020617eb;padding:20px;position:absolute;inset:0;overflow-y:auto}.pointsBadge{color:#fff;background:#22d3ee2e;border:1px solid #22d3ee80;border-radius:999px;padding:4px 12px;font-size:13px}.skillTree{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:16px;display:grid}.skillBranch{background:#ffffff0d;border:1px solid #ffffff1f;border-radius:16px;padding:14px}.skillBranch h4{color:#fff;margin:0 0 4px}.skillBranch .branchDesc{color:var(--muted);margin-bottom:10px;font-size:12.5px;line-height:1.4}.skillTiers{flex-direction:column;gap:6px;display:flex}.skillTierBtn{color:#fff;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff24;border-radius:10px;justify-content:space-between;align-items:center;padding:8px 10px;font-size:13px;display:flex}.skillTierBtn.unlocked{border-color:var(--good);background:#22c55e24}.skillTierBtn.available{border-color:var(--cyan);box-shadow:0 0 14px #22d3ee40}.skillTierBtn.locked{opacity:.45;cursor:not-allowed}.inventoryList{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:16px;display:grid}.itemCard{background:#ffffff0d;border:1px solid #ffffff1f;border-radius:16px;padding:14px}.itemCard.equipped{border-color:var(--gold);background:#fbbf241f}.itemCard .itemName{margin-bottom:4px;font-weight:900}.itemCard .itemDesc{color:var(--muted);margin-bottom:10px;font-size:12.5px;line-height:1.4}.itemCard button{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #fff3;border-radius:10px;width:100%;padding:7px;font-size:12.5px;font-weight:700}.closePanelBtn{max-width:220px;margin:0 auto;display:block}#touchControls{z-index:8;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 14px;display:none;position:absolute;bottom:12px;left:0;right:0}.joystick,.actionWrap{pointer-events:auto}.joystick{touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(circle,#ffffff14 0%,#ffffff29 100%);border:2px solid #ffffff47;border-radius:50%;width:128px;height:128px;position:relative;box-shadow:inset 0 0 18px #00000059}.joystickKnob{pointer-events:none;background:radial-gradient(circle at 35% 30%,#fff 0%,#cbd5e1 45%,#64748b 100%);border-radius:50%;width:56px;height:56px;margin:-28px 0 0 -28px;transition:transform .12s ease-out;position:absolute;top:50%;left:50%;box-shadow:0 4px 12px #00000073}.joystick.active .joystickKnob{transition:none}.actionBtn{color:#fff;letter-spacing:.5px;-webkit-user-select:none;user-select:none;touch-action:none;background:#22d3ee38;border:2px solid #22d3eea6;border-radius:50%;width:78px;height:78px;font-size:15px;font-weight:900}.resultGrid{grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0;display:grid}.resultCard{text-align:center;background:#02061794;border:1px solid #ffffff1a;border-radius:18px;padding:14px}.resultCard .num{color:var(--gold);font-size:28px;font-weight:900}.small{color:var(--muted);margin-top:6px;font-size:13px}.badges{flex-wrap:wrap;gap:10px;margin:14px 0 18px;display:flex}.badge{background:#ffffff14;border:1px solid #ffffff29;border-radius:999px;padding:10px 14px;font-weight:800}.endingText{color:var(--muted);margin-bottom:10px;line-height:1.65}@media (pointer:coarse){#touchControls{display:flex}}@media (width<=760px){#objective{max-width:100%}.stats{justify-content:space-between;width:100%}.charGrid{grid-template-columns:1fr}#dialogText{font-size:15px}.dialogChoice{padding:11px 12px;font-size:14px}.resultGrid{grid-template-columns:repeat(2,1fr)}}.coachNote{color:#e2e8f0;border-left:4px solid var(--cyan);background:#22d3ee1a;border-radius:14px;margin-bottom:10px;padding:10px 12px;font-size:14px;line-height:1.5}.coachNote.good{border-left-color:var(--good);background:#22c55e1f}.coachNote.medium{border-left-color:var(--gold);background:#fbbf241f}.coachNote.bad{border-left-color:var(--bad);background:#ef44441f}.coachTitle{color:#fff;margin-bottom:4px;font-weight:900}.kpiGood{color:var(--good)!important}.kpiBad{color:var(--bad)!important}.kpiBoard{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-bottom:16px;display:grid}.kpiCard{color:var(--muted);background:#ffffff0d;border:1px solid #ffffff1f;border-radius:16px;padding:14px;font-size:13px;line-height:1.45}.kpiCard.hit{border-color:var(--good)}.kpiCard.miss{border-color:var(--bad)}.kpiHead{color:#fff;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px;font-size:14px;font-weight:800;display:flex}.kpiValue{color:var(--gold);white-space:nowrap;font-size:22px;font-weight:900}.kpiTarget{color:#fff;font-weight:700}.kpiFormula{margin:4px 0;font-family:ui-monospace,Consolas,monospace}.kpiTips{margin:8px 0 0;padding-left:18px}.lessonList{flex-direction:column;gap:10px;margin-bottom:18px;display:flex}.lessonItem{border-left:4px solid var(--cyan);color:var(--muted);background:#ffffff0d;border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.5}.lessonItem strong{color:#fff;margin-bottom:3px;display:block}.lessonItem.good{border-left-color:var(--good)}.lessonItem.medium{border-left-color:var(--gold)}.lessonItem.bad{border-left-color:var(--bad)}#dialogBox{max-height:88%;overflow-y:auto}.objectiveCol{flex-direction:column;flex:0 auto;gap:6px;min-width:0;max-width:46%;display:flex}@media (width<=1000px){.hudTitle,.hudXp{display:none}}.objectiveCol #objective{max-width:100%}.subObjective{color:#bbf7d0;box-shadow:inset 3px 0 0 var(--good);font-size:12.5px}.energyWrap{align-items:center;gap:4px;display:inline-flex}.energyBar{background:#ffffff26;border-radius:99px;width:54px;height:8px;display:inline-block;overflow:hidden}#energyFill{background:linear-gradient(90deg,#22c55e,#a3e635);width:100%;height:100%;transition:width .3s;display:block}#energyFill.low{background:linear-gradient(90deg,#ef4444,#f97316)}#minimap{z-index:6;pointer-events:none;border-radius:50%;width:150px;height:150px;position:absolute;top:112px;right:12px;box-shadow:0 6px 20px #00000073}.interactPrompt{border:1px solid var(--gold);color:#fff;white-space:nowrap;pointer-events:none;z-index:7;background:#020617e0;border-radius:999px;padding:5px 10px;font-size:13px;font-weight:800;position:absolute;transform:translate(-50%,-120%)}@media (height<=500px){#minimap{width:100px;height:100px;top:110px;right:12px}.objectiveCol{max-width:48%}}.noticeGrid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-bottom:16px;display:grid}.noticeCard{color:#1f2937;background:#fef3c7;border-radius:6px;padding:12px 14px;font-size:13.5px;line-height:1.45;transform:rotate(-.4deg);box-shadow:0 6px 16px #00000059}.noticeCard:nth-child(2n){background:#e0f2fe;transform:rotate(.5deg)}.noticeCard h4{margin:0 0 6px}.noticeCard ul{margin:0;padding-left:18px}.kpiGroupTitle{color:#e2e8f0;margin:6px 0 10px}.posLayout{grid-template-columns:minmax(240px,.9fr) 1.4fr;align-items:start;gap:16px;display:grid}.posReceipt{color:#0f172a;background:#f8fafc;border-radius:10px;padding:14px;font-family:ui-monospace,Consolas,monospace;font-size:13px;box-shadow:inset 0 -6px #cbd5e1}.receiptHead{border-bottom:1px dashed #94a3b8;margin-bottom:6px;padding-bottom:6px;font-weight:900}.receiptRow{border-bottom:1px dotted #e2e8f0;grid-template-columns:1fr auto auto;align-items:center;gap:8px;padding:5px 0;display:grid}.receiptRow.scanned{color:#15803d}.redTag{color:#fff;background:#dc2626;border-radius:4px;margin-left:6px;padding:1px 5px;font-size:10px;font-weight:900;display:inline-block}.scanBtn{color:#22d3ee;cursor:pointer;background:#0f172a;border:none;border-radius:6px;padding:5px 9px;font-weight:900}.scanOk{font-weight:900}.receiptNote{color:#475569;margin-top:6px;font-size:12px}.receiptTotal{text-align:right;border-top:2px solid #0f172a;margin-top:8px;padding-top:6px;font-size:16px;font-weight:900}.posQuestion{color:#fff;margin-bottom:8px;font-size:16px;font-weight:800}.posHint{color:#a5f3fc;background:#22d3ee14;border-radius:10px;margin-bottom:6px;padding:8px 10px;font-size:13px}.posOptions{flex-direction:column;gap:6px;margin-bottom:10px;display:flex}.posOptions .dialogChoice{margin-top:0}.choiceCorrect{border-color:var(--good)!important;background:#22c55e2e!important}.choiceWrong{border-color:var(--bad)!important;background:#ef44442e!important}#posNext,#trialNext{max-width:260px}.trialRooms{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px;display:grid}.roomTile{color:#fff;cursor:pointer;background:#22c55e24;border:2px solid #ffffff26;border-radius:14px;flex-direction:column;align-items:center;gap:4px;padding:12px 6px;font-size:13px;display:flex}.roomTile.occupied{background:#7c3aed40;border-color:#a78bfa99}.roomTile:disabled{cursor:default}@media (width<=760px){.posLayout{grid-template-columns:1fr}#hud{flex-wrap:wrap}.objectiveCol{max-width:100%}.stats{white-space:normal;flex-wrap:wrap}}#posNext,#trialNext{z-index:2;position:sticky;bottom:6px}@media (height<=500px){.overlayPanel{padding:10px 14px}.overlayPanel h3{margin:0 0 8px}.posOptions .dialogChoice,#trialOptions .dialogChoice{padding:8px 12px}.posOptions{gap:5px;margin-bottom:6px}.posQuestion{margin-bottom:6px;font-size:14px}.coachNote{margin-bottom:6px;padding:7px 10px;font-size:13px}.posReceipt{padding:10px}.trialRooms{margin-bottom:8px}.roomTile{padding:6px}}