: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:wrap;justify-content:space-between;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{color:var(--muted);flex-wrap:wrap;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}.dpad,.actionWrap{pointer-events:auto}.dpad{grid-template-rows:52px 52px 52px;grid-template-columns:52px 52px 52px;gap:5px;display:grid}.touchBtn{color:#fff;-webkit-user-select:none;user-select:none;touch-action:none;background:#ffffff24;border:1px solid #ffffff38;border-radius:15px;font-size:22px;font-weight:900}.d-up{grid-area:1/2}.d-left{grid-area:2/1}.d-right{grid-area:2/3}.d-down{grid-area:3/2}.actionBtn{color:#fff;-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:20px;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)}}