@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;600;700&display=swap";:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;--ink: #07101f;--panel: rgba(9, 18, 31, .94);--line: rgba(214, 234, 217, .18);--gold: #f0b84d;--lime: #b8ed65;--orange: #f2773c;--teal: #63ddc5}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;min-height:100%;margin:0;overflow:hidden;overscroll-behavior:none;background:#030812}.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}button{font:inherit;color:inherit}.hidden{display:none!important}.rotate-notice{display:none}.eyebrow{margin:0 0 10px;color:var(--lime);font-family:Barlow Condensed,sans-serif;font-size:13px;font-weight:800;letter-spacing:.22em}.primary-button{min-width:230px;border:1px solid #f8d681;border-radius:3px;padding:15px 24px;background:linear-gradient(180deg,#ef8a42,#c44e2f);box-shadow:0 5px #74251f,0 12px 35px #ec683647;color:#fffbe8;font-family:Barlow Condensed,sans-serif;font-weight:900;letter-spacing:.12em;cursor:pointer;transition:transform .14s,filter .14s}.primary-button:hover{filter:brightness(1.16);transform:translateY(-2px)}.primary-button:active{transform:translateY(3px);box-shadow:0 2px #74251f}.title-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;align-items:center;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#07101f url(/assets/hard-knox-rpg-key-art-v3.png) center/cover no-repeat}.title-screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(2,8,18,.95) 0%,rgba(3,9,18,.78) 34%,transparent 72%),linear-gradient(0deg,rgba(2,6,14,.7),transparent 45%)}.title-screen:before{content:"";z-index:2;position:absolute;top:14px;right:14px;bottom:14px;left:14px;border:1px solid rgba(240,184,77,.35);pointer-events:none}.title-content{z-index:3;width:min(580px,86vw);margin-left:clamp(32px,8vw,130px)}.title-content h1{margin:0;max-width:560px;color:#fff4ce;font-family:Barlow Condensed,sans-serif;font-size:clamp(64px,8vw,118px);font-weight:900;font-style:italic;letter-spacing:-.055em;line-height:.72;text-shadow:4px 6px 0 #45251f,0 0 40px rgba(241,169,70,.18)}.title-content h1 span{display:block;margin:22px 0 9px 8px;color:var(--orange);font-size:.28em;letter-spacing:.23em;line-height:1}.lede{max-width:410px;margin:29px 0 30px;color:#c7d0d4;font-size:15px;line-height:1.65}.microcopy{margin:22px 0 0;color:#778690;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.load-slots{display:flex;flex-wrap:wrap;gap:6px;max-width:470px;margin-top:16px}.load-slots:empty{display:none}.load-slots button{border:1px solid rgba(184,237,101,.35);border-radius:3px;padding:7px 10px;background:#050e16c2;color:#a9b7b3;font:700 9px/1 Barlow Condensed;letter-spacing:.08em;cursor:pointer}.load-slots button:hover{border-color:var(--lime);color:#eef5df}.title-corner{z-index:3;position:absolute;right:34px;bottom:32px;pointer-events:none;color:var(--gold);font:800 13px/1.6 Barlow Condensed,sans-serif;letter-spacing:.18em;text-align:right}.title-corner span{color:#74828b;font-size:9px}.story-screen,.select-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:30px;background:radial-gradient(circle at 50% 0%,#173153,#08111f 48%,#030812)}.story-screen{background:linear-gradient(#02070e9e,#02070ee6),url(/assets/hard-knox-rpg-key-art-v3.png) center/cover no-repeat}.story-panel{width:min(720px,88vw);border-left:4px solid var(--gold);padding:clamp(28px,5vw,58px);background:linear-gradient(110deg,#060f1bf5,#08121ed1);box-shadow:0 25px 90px #000c}.story-panel h2{margin:0;color:#fff1c7;font:900 clamp(46px,7vw,82px)/.9 "Barlow Condensed";letter-spacing:-.025em}.story-panel>p:not(.eyebrow){max-width:610px;margin:24px 0 30px;color:#c6d2cf;font-size:clamp(14px,1.5vw,18px);line-height:1.7}.story-progress{display:flex;gap:8px;margin-bottom:26px}.story-progress i{width:42px;height:4px;background:#41505a}.story-progress i.active{background:var(--gold)}.select-panel{width:min(1120px,96vw)}.select-panel>h2{margin:0 0 23px;color:#eef5e7;font:800 clamp(32px,4vw,54px)/1 "Barlow Condensed",sans-serif;text-transform:uppercase}.hero-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.hero-card{position:relative;min-height:218px;overflow:hidden;border:1px solid var(--line);border-radius:4px;padding:0;background:linear-gradient(160deg,color-mix(in srgb,var(--hero) 35%,#142135),#080e18 68%);cursor:pointer;isolation:isolate}.hero-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(135deg,transparent 0 8px,rgba(255,255,255,.025) 8px 9px)}.hero-card:after{content:"";position:absolute;inset:auto 0 0;height:72%;background:linear-gradient(transparent,#080d17 92%)}.hero-card:hover{border-color:color-mix(in srgb,var(--hero) 80%,white);transform:translateY(-2px)}.hero-card.selected{border:2px solid var(--accent);box-shadow:0 0 0 2px #07101f,0 0 25px color-mix(in srgb,var(--accent) 35%,transparent)}.hero-sprite-preview{position:absolute;left:50%;top:4px;width:168px;height:168px;transform:translate(-50%);background-position:0 0;background-size:400% 400%;background-repeat:no-repeat;image-rendering:pixelated;filter:drop-shadow(0 8px 7px rgba(0,0,0,.5))}.hero-silhouette{position:absolute;left:50%;top:30px;width:76px;height:132px;transform:translate(-50%);filter:drop-shadow(0 8px 7px rgba(0,0,0,.5))}.hero-silhouette .head{position:absolute;left:25px;top:0;width:29px;height:31px;border-radius:45% 45% 40% 40%;background:#c7855f;box-shadow:inset -6px -2px #391e1633}.hero-silhouette .body{position:absolute;left:14px;top:29px;width:52px;height:64px;border-radius:18px 18px 8px 8px;background:var(--hero);box-shadow:inset -9px 0 #0000002e}.hero-silhouette .legs{position:absolute;left:21px;top:86px;width:15px;height:44px;background:#24384f;box-shadow:27px 0 #24384f}.hero-silhouette .weapon{position:absolute;right:2px;top:43px;width:8px;height:86px;transform:rotate(-24deg);transform-origin:center;border-radius:2px;background:#bb874f;box-shadow:0 -11px 0 5px #717981}.hero-card:nth-child(3) .weapon{width:4px;box-shadow:-16px 5px #bccbd0;background:#bccbd0}.hero-card:nth-child(6) .weapon{display:none}.hero-label{z-index:2;position:absolute;left:13px;right:10px;bottom:13px;text-align:left}.hero-label strong{display:block;color:#fff6d7;font:900 24px/.9 Barlow Condensed,sans-serif;text-transform:uppercase}.hero-label span{color:var(--accent);font:700 10px/1.4 Barlow Condensed,sans-serif;letter-spacing:.12em;text-transform:uppercase}.select-footer{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;margin-top:18px;border-top:1px solid var(--line);padding-top:18px}.hero-detail{color:#b7c2c5;font-size:12px;line-height:1.55}.hero-detail strong{color:var(--gold)}.game-shell{position:fixed;top:0;right:0;bottom:0;left:0;height:100dvh;display:grid;place-items:center;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:#030812}.game-viewport{display:contents}#game{display:block;width:min(100vw,calc(100dvh * 16 / 9));height:min(100dvh,56.25vw);aspect-ratio:16 / 9;touch-action:none;image-rendering:auto;background:#0a1420}.vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;box-shadow:inset 0 0 120px #000000b8,inset 0 0 18px #000c}.top-hud{position:absolute;top:max(18px,env(safe-area-inset-top));left:max(22px,env(safe-area-inset-left));display:flex;align-items:center;width:445px;padding:9px 12px 10px 8px;background:linear-gradient(90deg,rgba(4,11,20,.92),rgba(4,11,20,.54),transparent);filter:drop-shadow(0 4px 7px rgba(0,0,0,.5))}.portrait{display:grid;flex:none;place-items:center;width:82px;height:82px;border:3px solid #d9be75;border-radius:50%;background:radial-gradient(circle at 45% 35%,#3c6d6b,#14212b 68%);box-shadow:inset 0 0 0 5px #08111f;color:#fff0c8;font:900 42px/1 Barlow Condensed,sans-serif}.vitals{flex:1;margin-left:-7px}.name-row{display:flex;justify-content:space-between;margin:0 3px 6px 18px;color:#eef1df;font:800 18px/1 Barlow Condensed,sans-serif;letter-spacing:.07em;text-shadow:1px 2px #000}.name-row span{color:var(--gold)}.meter{position:relative;height:15px;overflow:hidden;border:2px solid #101821;background:#171d25;box-shadow:0 0 0 1px #dfd9ab73;transform:skew(-12deg)}.meter i{display:block;width:100%;height:100%;transition:width .18s}.meter span{position:absolute;top:0;right:0;bottom:0;left:0;color:#fff;font:800 9px/11px Inter,sans-serif;text-align:center;transform:skew(12deg);text-shadow:1px 1px #000}.meter.hp{height:21px}.meter.hp i{background:linear-gradient(90deg,#a72336,#ed5848)}.meter.hp span{font-size:11px;line-height:17px}.meter.stamina{width:92%;height:13px;margin-top:4px}.meter.stamina i{background:linear-gradient(90deg,#258d74,#69e6b4)}.meter.mana{width:86%;height:14px;margin-top:4px}.meter.mana i{background:linear-gradient(90deg,#5a48a8,#a26eea)}.meter.xp{width:80%;height:12px;margin-top:4px}.meter.xp i{background:#e5b84e}.currency{display:grid;grid-template-columns:22px auto;grid-template-rows:18px 10px;min-width:74px;margin-left:12px;border-left:1px solid rgba(255,255,255,.18);padding-left:10px}.currency>span{grid-row:1 / 3;color:var(--gold);font-size:21px}.currency strong{font:800 17px/1 Barlow Condensed}.currency small{color:#8d9b9c;font:700 7px/1 Inter;letter-spacing:.15em}.quest-card{position:absolute;top:max(22px,env(safe-area-inset-top));right:max(24px,env(safe-area-inset-right));width:min(380px,34vw);border-right:4px solid var(--gold);padding:14px 18px 15px;background:linear-gradient(90deg,transparent,rgba(4,10,19,.92) 28%);text-align:right;text-shadow:1px 2px #000}.controller-status{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:28px;border-left:2px solid #52616a;padding:6px 9px;background:#040a12b8;color:#8d9ba0;font:700 9px/1 Inter;letter-spacing:.08em;text-shadow:1px 1px #000}.controller-status.connected{border-color:var(--teal);color:#b6f2dd}.quest-card small{display:block;color:var(--gold);font:700 10px/1 Inter;letter-spacing:.18em}.quest-card strong{display:block;margin-top:7px;color:#eff2df;font:800 24px/1 Barlow Condensed;text-transform:uppercase}.quest-card p{margin:8px 0 0;color:#d0dad5;font-size:12px;line-height:1.45}.quest-card b{display:block;margin-top:9px;color:#ffe08c;font:800 10px/1 Inter;letter-spacing:.08em}.quest-card>span{display:block;margin-top:9px;color:#bba1ee;font:700 9px/1 Inter;letter-spacing:.12em}.minimap{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:28px;width:206px;border:1px solid rgba(231,219,169,.45);padding:3px;background:#03080fdb;box-shadow:0 5px 15px #00000059}.minimap canvas{display:block;width:200px;height:126px;opacity:.96}.minimap span{display:block;padding:6px;color:#e0e8dd;font:700 9px/1 Inter;letter-spacing:.14em;text-align:center}.quickbar{position:absolute;left:50%;bottom:max(20px,env(safe-area-inset-bottom));display:flex;gap:6px;transform:translate(-50%)}.slot{display:grid;grid-template-columns:25px auto;align-items:center;min-width:70px;height:36px;border:1px solid rgba(213,225,211,.25);border-radius:3px;padding:4px 6px 4px 4px;background:linear-gradient(#101b25eb,#060c14f2);box-shadow:0 4px 12px #0000004d;color:#aeb9b6;font:700 6px/1 Inter;letter-spacing:.08em}.slot.throwable,.slot.potion{min-width:104px}.slot.boosted{border-color:#8cff72;color:#dfffd1;box-shadow:0 0 18px #62ff6857}.slot kbd{display:grid;place-items:center;width:25px;height:27px;border:1px solid #6f7b75;border-radius:3px;background:#19252c;color:#f0d48d;font:800 13px/1 Barlow Condensed;box-shadow:inset 0 -3px #0000004d}.slot.inventory{cursor:pointer}.slot.inventory:hover{border-color:var(--gold)}.audio-toggle{cursor:pointer}.audio-toggle:hover{border-color:var(--teal)}.mobile-audio-toggle{display:none}.buff-status{position:absolute;left:max(25px,env(safe-area-inset-left));top:126px;display:flex;align-items:center;gap:10px;border-left:3px solid #8cff72;padding:8px 12px;background:#05120ee0;box-shadow:0 0 22px #62ff682e;pointer-events:none}.buff-status strong{color:#caffb5;font:900 15px/1 Barlow Condensed;letter-spacing:.07em}.buff-status span{color:#b7d7b0;font:700 8px/1 Inter;letter-spacing:.07em}.boss-hud{position:absolute;left:50%;top:21px;width:min(420px,46vw);transform:translate(-50%);text-align:center;text-shadow:1px 2px #000}.boss-hud small{display:block;color:#e5bd68;font:700 7px/1 Inter;letter-spacing:.22em}.boss-hud strong{color:#f3ebd3;font:900 20px/1.2 Barlow Condensed;letter-spacing:.1em}.boss-hud>div{height:8px;border:1px solid #d5bb7b;background:#1b1720}.boss-hud i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#7b2037,#dd4c45);transition:width .2s}.dialogue{position:absolute;left:50%;bottom:75px;display:grid;grid-template-columns:72px 1fr;gap:15px;width:min(670px,78vw);transform:translate(-50%);border:1px solid #b39a61;border-radius:4px;padding:13px;background:linear-gradient(110deg,#0f1d26fa,#060c15fa);box-shadow:0 14px 40px #000b}.dialogue-portrait{display:grid;place-items:center;border:1px solid #5eaa9e;background:radial-gradient(circle,#276a68,#0e222c);color:#eff3d7;font:900 42px/1 Barlow Condensed}.dialogue small{color:var(--teal);font:700 10px/1 Inter;letter-spacing:.12em}.dialogue p{min-height:42px;margin:9px 0;color:#f0f1e5;font-size:14px;line-height:1.5}.dialogue span{color:#9aa9a6;font:700 8px/1 Inter;letter-spacing:.1em}.tutorial-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:24px;background:#02070ed1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.tutorial-card{width:min(720px,92vw);border:1px solid #aa915b;border-left:5px solid var(--gold);padding:30px;background:linear-gradient(125deg,#101e29,#08111d);box-shadow:0 25px 90px #000d}.tutorial-card h2{margin:0;color:#fff0bd;font:900 48px/.9 Barlow Condensed}.tutorial-card>p:not(.eyebrow,.tutorial-note){color:#cbd6d1;font-size:14px;line-height:1.6}.tutorial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:22px 0}.tutorial-grid>div{display:grid;gap:5px;border:1px solid rgba(255,255,255,.12);padding:14px;background:#08121c}.tutorial-grid kbd{color:var(--gold);font:900 22px/1 Barlow Condensed}.tutorial-grid strong{color:#eef4e6;font:800 14px/1 Barlow Condensed}.tutorial-grid span{color:#879793;font-size:9px}.tutorial-note{color:#9eb3ac;font-size:11px}.inventory-panel{position:absolute;top:50%;left:50%;width:min(780px,90vw);max-height:88vh;overflow:auto;transform:translate(-50%,-50%);border:1px solid #997f4d;border-radius:5px;padding:22px;background:radial-gradient(circle at 80% 10%,#1e3b3d,#0d1824 52%,#080e18);box-shadow:0 20px 90px #000e,inset 0 0 0 3px #04090fb3}.panel-head{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid rgba(240,184,77,.2);padding-bottom:12px}.panel-head small,.gear-card small,.inventory-grid small{color:var(--gold);font:700 8px/1 Inter;letter-spacing:.16em}.panel-head h2{margin:4px 0 0;font:900 30px/1 Barlow Condensed}.panel-head button{border:0;background:none;color:#96a6a4;font-size:28px;cursor:pointer}.gear-card{display:grid;grid-template-columns:64px 1fr;gap:14px;margin:18px 0;border:1px solid rgba(99,221,197,.25);padding:14px;background:#20534f26}.gear-icon{display:grid;place-items:center;background:#101f27;color:var(--teal);font-size:28px}.gear-card strong{display:block;margin-top:4px;color:#f1edda;font:800 20px/1 Barlow Condensed}.gear-card p{margin:5px 0 0;color:#899897;font-size:10px}.inventory-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.inventory-grid>div{min-height:68px;border:1px solid rgba(255,255,255,.09);padding:12px;background:#03080e59}.inventory-grid strong{display:block;margin:5px 0 3px;color:#dee7d4;font:800 14px/1 Barlow Condensed}.inventory-grid span{color:#82908f;font-size:9px}.panel-tip{margin:16px 0 0;color:#71817f;font-size:9px;line-height:1.5}.combo-manual{margin-top:12px;border:1px solid rgba(240,184,77,.2);padding:12px;background:#040a1173}.combo-manual>small{color:var(--gold);font:800 8px/1 Inter;letter-spacing:.13em}.combo-manual>div{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.combo-move{min-height:82px;border-top:2px solid var(--teal);padding:9px;background:#15272e94}.combo-move b{display:block;color:#fff0c4;font:900 14px/1 Barlow Condensed}.combo-move em{display:block;margin-top:4px;color:var(--teal);font:800 7px/1 Inter;font-style:normal;letter-spacing:.09em}.combo-move span{display:block;margin-top:6px;color:#91a19d;font-size:8px;line-height:1.35}.save-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:14px}.save-row button{border:1px solid rgba(240,184,77,.28);padding:9px;background:#101b25;color:#b7c0b7;font:800 9px/1 Barlow Condensed;letter-spacing:.09em;cursor:pointer}.save-row button:hover{border-color:var(--gold);color:#fff0bc}.end-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:radial-gradient(circle,#0f2d32bd,#02060cf0);text-align:center}.end-screen>div{width:min(520px,84vw)}.end-screen h2{margin:0;color:#fff0bd;font:900 clamp(48px,7vw,86px)/.85 "Barlow Condensed";letter-spacing:-.03em}.end-screen p:not(.eyebrow){margin:22px auto 27px;color:#b4c3be;font-size:12px;line-height:1.65}.touch-controls{display:none}@media(max-width:900px){.hero-grid{grid-template-columns:repeat(3,1fr)}.hero-card{min-height:150px}.hero-silhouette{top:12px;transform:translate(-50%) scale(.72);transform-origin:top}.hero-sprite-preview{width:120px;height:120px}.hero-label strong{font-size:19px}.select-footer{grid-template-columns:1fr}.select-screen{align-items:start}.minimap,.slot:nth-child(3),.slot.inventory,.audio-toggle{display:none}.quest-card{width:42vw}.top-hud{transform:scale(.78);transform-origin:top left}.tutorial-grid{grid-template-columns:repeat(2,1fr)}}@media(pointer:coarse){.quickbar,.minimap{display:none}.touch-controls,.touch-controls button{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.touch-controls button{border:1px solid rgba(219,227,206,.28);background:linear-gradient(180deg,#1b2a34fa,#08111afa);color:#f8f2d3e6}}@media(max-height:600px){.title-content{transform:scale(.86);transform-origin:left center}.select-screen{padding:18px}.hero-card{min-height:135px}.hero-silhouette{transform:translate(-50%) scale(.62);transform-origin:top}.hero-sprite-preview{width:106px;height:106px}.hero-label strong{font-size:18px}.hero-detail{display:none}}@media(orientation:landscape)and (max-height:500px){.title-screen,.story-screen,.select-screen,.tutorial-overlay{place-items:start center;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(86px,calc(env(safe-area-inset-bottom) + 76px)) max(14px,env(safe-area-inset-left))}.title-content{width:min(580px,82vw);margin-top:10px;padding-bottom:74px;transform:none}.title-corner{display:none}.story-panel{width:min(760px,100%);padding:16px 22px 76px}.story-panel h2{font-size:clamp(30px,10vh,44px)}.story-panel>p:not(.eyebrow){margin:12px 0 14px;font-size:12px;line-height:1.45}.story-progress{margin-bottom:0}#journey-button,#story-next,#start-button,#tutorial-start{position:fixed;z-index:30;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));min-width:190px;padding:12px 18px}.select-panel>h2{margin-bottom:10px;font-size:28px}.hero-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.hero-card{min-height:118px}.hero-sprite-preview{top:0;width:96px;height:96px}.hero-label{left:8px;right:6px;bottom:7px}.hero-label strong{font-size:16px}.hero-label span{font-size:7px}.select-footer{grid-template-columns:1fr auto;gap:12px;margin-top:10px;padding-top:10px}.tutorial-card{width:min(900px,100%);padding:14px 18px 72px}.tutorial-card h2{font-size:30px}.tutorial-card>p:not(.eyebrow,.tutorial-note){margin:8px 0;font-size:11px;line-height:1.4}.tutorial-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:10px 0}.tutorial-grid>div{gap:3px;padding:7px}.tutorial-grid kbd{font-size:16px}.tutorial-grid strong{font-size:11px}.tutorial-grid span,.tutorial-note{font-size:8px}}@media(pointer:coarse)and (orientation:landscape){.game-shell{--touch-button-size: clamp(44px, 11dvh, 48px);place-items:center}.game-viewport{position:relative;display:block;width:min(100vw,calc(100dvh * 16 / 9));height:min(100dvh,56.25vw);aspect-ratio:16 / 9;overflow:hidden}#game{width:100%;height:100%}.top-hud{top:6px;left:8px;width:min(268px,45vw);height:58px;padding:4px 7px 5px 4px;transform:none;background:linear-gradient(90deg,#040b14e6,#040b14a8,#040b1414);filter:drop-shadow(0 2px 4px rgba(0,0,0,.52))}.portrait{width:44px;height:44px;border-width:2px;box-shadow:inset 0 0 0 3px #08111f;font-size:22px}.vitals{min-width:0;margin-left:-2px}.name-row{margin:0 2px 3px 8px;font-size:12px;letter-spacing:.05em}.meter{height:7px;border-width:1px;box-shadow:0 0 0 1px #dfd9ab52}.meter span{font-size:5px;line-height:5px}.meter.hp{height:11px}.meter.hp span{font-size:7px;line-height:9px}.meter.stamina,.meter.mana{height:7px;margin-top:2px}.meter.xp{display:none}.currency{grid-template-columns:12px auto;grid-template-rows:16px;min-width:37px;margin-left:5px;padding-left:5px}.currency>span{grid-row:1;font-size:12px}.currency strong{font-size:12px}.currency small{display:none}.quest-card{top:7px;right:8px;width:min(220px,38vw);border-right-width:2px;padding:5px 8px 6px;background:linear-gradient(90deg,transparent,rgba(4,10,19,.88) 24%);transform:none}.quest-card small{font-size:7px;letter-spacing:.14em}.quest-card strong{margin-top:3px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quest-card b{margin-top:4px;font-size:7px}.quest-card p,.quest-card>span{display:none}.buff-status{top:68px;gap:5px;max-width:48vw;border-left-width:2px;padding:5px 8px}.buff-status strong{font-size:11px}.buff-status span{overflow:hidden;font-size:6px;text-overflow:ellipsis;white-space:nowrap}.game-shell:has(.boss-hud:not(.hidden)) .quest-card{display:none}.boss-hud{top:7px;right:8px;left:auto;width:min(280px,42vw);transform:none}.boss-hud strong{font-size:15px}.touch-controls{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:block;width:100%;height:100%;pointer-events:none}.touch-dpad{--dpad-button-size: clamp(40px, 10.5dvh, 44px);position:absolute;left:max(12px,env(safe-area-inset-left));bottom:max(10px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,var(--dpad-button-size));grid-template-rows:repeat(3,var(--dpad-button-size));grid-template-areas:". up ." "left center right" ". down .";gap:0;padding:3px;pointer-events:auto;filter:drop-shadow(0 5px 12px rgba(0,0,0,.44))}.touch-dpad:before{content:"";grid-area:center;width:var(--dpad-button-size);height:var(--dpad-button-size);border:1px solid rgba(222,231,215,.18);border-radius:5px;pointer-events:none;background:linear-gradient(145deg,#13242fe6,#050e16f0);box-shadow:inset 0 0 0 3px #03090f4d}.touch-dpad button,.touch-actions button{display:grid;place-items:center;min-width:0;min-height:0;opacity:.88;font:900 15px/1 Barlow Condensed;box-shadow:0 2px 7px #00000047}.touch-dpad button{z-index:1;width:var(--dpad-button-size);height:var(--dpad-button-size);border-color:#dee7d738;border-radius:5px;background:linear-gradient(145deg,#182d39f0,#061019fa)}.touch-dpad .up{grid-area:up;border-radius:12px 12px 5px 5px}.touch-dpad .left{grid-area:left;border-radius:12px 5px 5px 12px}.touch-dpad .down{grid-area:down;border-radius:5px 5px 12px 12px}.touch-dpad .right{grid-area:right;border-radius:5px 12px 12px 5px}.touch-actions button{width:var(--touch-button-size);height:var(--touch-button-size);border-radius:10px}.touch-actions{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,var(--touch-button-size));grid-template-rows:repeat(2,var(--touch-button-size));gap:3px;border:1px solid rgba(222,231,215,.14);border-radius:13px;padding:4px;pointer-events:auto;background:#030a115c;box-shadow:0 5px 18px #00000057;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.touch-actions small{font:700 6px/1 Inter;letter-spacing:.08em}.touch-j{border-color:#f2773c9e!important;background:linear-gradient(180deg,#973430eb,#4f191cfa)!important}.touch-f{border-color:#b58aec80!important;background:linear-gradient(180deg,#5b3984eb,#2c1948fa)!important}.touch-c{border-color:#f0b84d9e!important;background:linear-gradient(180deg,#96641ef0,#4c2d10fa)!important}.mobile-audio-toggle{position:absolute;right:calc(max(12px,env(safe-area-inset-right)) + var(--touch-button-size) * 3 + 24px);bottom:max(10px,env(safe-area-inset-bottom));display:grid;place-items:center;width:42px;height:36px;border:1px solid rgba(99,221,197,.42);border-radius:9px;pointer-events:auto;background:#061d20b8;color:#f0d48d;font:900 15px/1 Barlow Condensed;opacity:.82}.mobile-audio-toggle span{font:700 6px/1 Inter;letter-spacing:.06em}.game-shell:has(.tutorial-overlay:not(.hidden)) .touch-controls,.game-shell:has(.inventory-panel:not(.hidden)) .touch-controls,.game-shell:has(.end-screen:not(.hidden)) .touch-controls{visibility:hidden;pointer-events:none}#tutorial-start{position:absolute;right:10px;bottom:10px}.dialogue{bottom:calc(max(6px,env(safe-area-inset-bottom)) + var(--touch-button-size) * 2 + 18px)}.inventory-panel,.end-screen{z-index:20}}@media(pointer:coarse)and (orientation:landscape)and (max-height:500px){.controller-status{display:none}}@media(pointer:coarse)and (orientation:portrait){.rotate-notice{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;place-content:center;justify-items:center;gap:10px;padding:max(28px,env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 35%,#173153,#050b15 68%);color:#fff0c2;text-align:center}.rotate-notice div{color:var(--gold);font:900 64px/1 Barlow Condensed,sans-serif}.rotate-notice strong{font:900 34px/1 Barlow Condensed,sans-serif;letter-spacing:.08em}.rotate-notice span{color:#aab8b5;font-size:13px}}