@import url('./fonts.css');
:root{color-scheme:dark;--ink:#090f12;--panel:rgba(10,18,21,.96);--line:#52645755;--gold:#c2af81;--text:#dddccd;--muted:#7a8e85;--mint:#a6cbb1;--purple:#bc9aea;--red:#bc3845;--blue:#497bab;font-family:'DM Sans',sans-serif;font-size:14px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--text)}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:2px solid var(--mint);outline-offset:3px}button:disabled{cursor:default;opacity:.38}button,div,canvas{-webkit-user-select:none;user-select:none}button{border:0}#game-shell{position:relative;width:100%;height:100dvh;overflow:hidden;isolation:isolate}#game{display:block;width:100%;height:100%;outline:none;touch-action:none}.hidden{display:none!important}.grain{position:absolute;inset:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(0deg,transparent,transparent 2px,#000 3px);z-index:2}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;color:var(--gold)}kbd{font-family:inherit;font-size:9px;font-weight:500;border:1px solid #61776c66;padding:3px 5px;border-radius:2px;color:#aeb8ac;white-space:nowrap}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}.icon-button{display:grid;place-items:center;width:34px;height:34px;background:#111a1bcc;border:1px solid #647f6644;color:#a0b3a7}.icon-button:hover{background:#28332d}#top-hud{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:24px 28px 35px;background:linear-gradient(#070d10dc,transparent);pointer-events:none}#top-hud button{pointer-events:auto}.brand{display:flex;align-items:center;gap:11px}.brand-sigil{font-size:29px;color:var(--gold)}.brand b{display:block;font-family:Cinzel,Georgia,serif;font-size:18px;letter-spacing:3px;font-weight:500}.brand small{display:block;font-size:6px;letter-spacing:2px;color:#7d9085;margin-top:3px}.floor-heading{text-align:center;position:absolute;left:50%;transform:translateX(-50%);padding-top:5px}.floor-heading .eyebrow{white-space:nowrap;font-size:9px;letter-spacing:1.6px}.sep{color:#57655e;margin:0 10px}#objective{font-size:11px;color:#96a59b;margin-top:11px;letter-spacing:.4px}.top-actions{display:flex;gap:7px}#army-panel{position:absolute;z-index:4;top:112px;left:29px;pointer-events:none}#army-panel .eyebrow{font-size:9px;color:#9dac9e;letter-spacing:1.7px}#army-count{margin-left:18px;color:var(--gold);font-size:10px}#army-icons{display:flex;margin-top:11px;gap:4px;max-width:160px;flex-wrap:wrap}.bound-icon{position:relative;display:grid;place-items:center;width:27px;height:34px;color:#c3cbb8;background:linear-gradient(#47514366,#11201b99);border:1px solid #809f6855;clip-path:polygon(0 0,100% 0,100% 83%,50% 100%,0 83%)}.bound-icon.empty{color:#667269;opacity:.45}.bound-icon svg{width:19px;height:19px}.bound-icon i{position:absolute;bottom:4px;height:2px;background:#81b795;left:4px;max-width:18px}#army-hint{display:block;margin-top:11px;color:#78877f;font-size:10px}#map-panel{position:absolute;z-index:4;top:94px;right:28px;width:144px;border:1px solid #53655455;background:#050d0cc7;padding:7px 0 0;pointer-events:none}#minimap{width:142px;height:112px;display:block}#map-panel>div{font-size:6px;letter-spacing:1px;padding:8px 6px;border-top:1px solid #71856a33;color:#9aab99;text-align:center}.map-dot{display:inline-block;width:4px;height:4px;background:#b5cda8;margin-right:3px}#floor-banner{position:absolute;z-index:4;left:50%;top:29%;transform:translateX(-50%);text-align:center;pointer-events:none;white-space:nowrap;animation:banner 4s forwards}#floor-banner small{font-size:8px;color:var(--gold);letter-spacing:4px}#floor-banner h2{font-family:Cinzel,Georgia,serif;font-size:29px;font-weight:400;letter-spacing:3px;margin:14px 0}#floor-banner span{color:#93aa9c;font-size:10px;letter-spacing:2px}@keyframes banner{0%{opacity:0;transform:translate(-50%,10px)}18%,70%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}#toast{position:absolute;z-index:22;top:21%;left:50%;transform:translateX(-50%);background:#0b1413ee;border:1px solid #a6955d77;border-radius:3px;padding:11px 20px;font-size:12px;text-align:center;box-shadow:0 4px 30px #0008;pointer-events:none;opacity:0;transition:opacity .22s;max-width:85%;color:#d1ccac}#toast.visible{opacity:1}#interact-wrap{position:absolute;z-index:8;left:50%;bottom:203px;transform:translateX(-50%)}#interact{background:#101b18ed;border:1px solid #b5a77888;border-radius:3px;padding:11px 17px;display:flex;gap:12px;align-items:center;font-size:11px;color:#c8d0ba;white-space:nowrap}#interact:hover{background:#283328}#hud{position:absolute;z-index:7;bottom:0;left:50%;transform:translateX(-50%);width:min(700px,100%);padding:10px 30px 19px;background:linear-gradient(transparent,#060c11e6 50%);pointer-events:none}.hud-topline{display:flex;justify-content:space-between;align-items:center;max-width:330px;margin:0 auto 7px;font-size:9px;letter-spacing:1.5px;color:#8f9d90}.level{display:flex;align-items:center;gap:7px}.level-badge{background:#1a2520;border:1px solid #b1a06b88;color:var(--gold);display:grid;place-items:center;min-width:22px;height:22px;font-size:11px;font-family:Georgia,serif}.gold{font-size:11px;color:var(--gold);letter-spacing:.8px}.gold span{font-size:10px}.hud-main{display:flex;align-items:center;justify-content:center;gap:20px}.orb-wrap{position:relative;text-align:center;flex:0 0 92px}.orb{width:88px;height:88px;position:relative;isolation:isolate;border-radius:50%;overflow:hidden;border:4px solid #313b3b;outline:1px solid #877d5b;box-shadow:0 0 0 6px #080e10,0 0 0 7px #65706466,0 0 24px #000,inset 0 0 14px #000;background:#111219}.orb:after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse at 34% 18%,#ffffff28,transparent 34%),radial-gradient(ellipse at 50% 35%,transparent 28%,#020409 90%);box-shadow:inset 0 0 11px #000c}.liquid{position:absolute;bottom:0;left:0;width:100%;height:100%;transition:height .2s;background:radial-gradient(ellipse at 30% 25%,#ff848555,transparent),linear-gradient(#c44851,#70202f 70%,#430e19)}.liquid:before{content:'';position:absolute;left:-50%;width:200%;height:10px;top:-3px;border-radius:50%;background:#ec747488;animation:liquid 3s infinite alternate ease-in-out}.mana .liquid{background:radial-gradient(ellipse at 30% 25%,#72cdf755,transparent),linear-gradient(#497aa8,#223e72 70%,#14233e)}.mana .liquid:before{background:#8ac5ec88;animation-delay:-1s}@keyframes liquid{to{transform:translateX(13%) rotate(4deg)}}.orb span{position:absolute;z-index:3;left:0;right:0;bottom:17px;font-size:10px;text-shadow:0 1px 4px #000;color:#ece8dc}.orb-label{font-size:8px;letter-spacing:2px;color:#b4b6a5;margin-top:11px;height:14px}.orb-label kbd{font-size:7px;padding:1px 3px;margin-left:2px}#potion,#inventory{position:absolute;bottom:24px;width:26px;height:31px;background:#131b1b;border:1px solid #7c806466;pointer-events:auto;color:#c6b894;display:grid;place-items:center;border-radius:3px}#potion{left:-18px;display:flex;justify-content:center;gap:2px;font-size:10px}#potion span{color:#d98082;font-size:13px}#inventory{right:-14px}#inventory svg{width:18px}.skill-zone{width:330px;flex-shrink:1;min-width:0}.skills{display:flex;gap:8px;justify-content:center}.skill{width:70px;min-width:0;height:67px;position:relative;pointer-events:auto;padding:5px;border:1px solid #80907477;background:linear-gradient(145deg,#202b26e8,#0b1418f5);box-shadow:inset 0 0 0 3px #0d1719,0 3px 14px #0007;color:#c5ceb3;isolation:isolate}.skill:before{content:'';position:absolute;inset:5px;border:1px solid #8b966e33;z-index:-1}.skill:hover{border-color:#c1b984;transform:translateY(-2px);background:#2a3931}.skill:nth-child(2){color:#d2c9a3}.skill:nth-child(3){color:#a8c3af}.skill:nth-child(4){color:#c4a3e5}.skill svg{width:34px;height:34px;filter:drop-shadow(0 0 5px currentColor)}.skill kbd{position:absolute;top:-8px;left:4px;background:#0c1416;border-color:#777c6255;font-size:8px;padding:1px 4px;color:#cbbd9a}.skill .mana-cost{font-size:8px;color:#8aa6b6;position:absolute;right:5px;bottom:3px}.skill .skill-name{display:block;position:absolute;font-size:7px;letter-spacing:.1px;color:#b4bbad;bottom:7px;left:1px;right:1px;text-align:center}.cooldown-shade{position:absolute;inset:0;background:#030811cc;transform-origin:bottom;z-index:2;pointer-events:none}.cooldown-number{position:absolute;z-index:3;left:0;right:0;top:18px;font-size:20px;color:white;font-family:Georgia,serif;pointer-events:none}.skill.no-mana{filter:saturate(.2);opacity:.6}.skill-tooltip{display:none;position:absolute;bottom:80px;left:50%;transform:translateX(-50%);background:#0b1315f7;border:1px solid #8b966e77;padding:12px;width:205px;text-align:left;pointer-events:none;font-size:10px;line-height:1.6;color:#aab6a9;box-shadow:0 6px 25px #000}.skill-tooltip b{display:block;color:var(--gold);font-family:Cinzel,Georgia,serif;font-size:12px;margin-bottom:5px}.skill:hover .skill-tooltip{display:block}.xp-row{display:flex;align-items:center;gap:7px;margin-top:12px;font-size:6px;color:#8a978c;letter-spacing:.7px;white-space:nowrap}.xp-track{height:3px;background:#29312e;flex:1;overflow:hidden}#xp-fill{height:100%;width:0;background:#b19b64;box-shadow:0 0 6px #d7b562;transition:width .2s}.desktop-hints{display:flex;justify-content:center;gap:14px;font-size:6px;color:#667970;letter-spacing:.8px;margin-top:12px;white-space:nowrap}.desktop-hints kbd{font-size:6px;padding:2px 3px;border-color:#61776c33;margin-right:2px}.screen{position:absolute;inset:0;z-index:10;background:linear-gradient(90deg,#060c11b0,transparent 45%,#060c1155),linear-gradient(#060c1180,transparent 30%,#050b10d9);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:34px 40px}.menu-top,.menu-bottom{width:100%;display:flex;justify-content:space-between;font-size:8px;color:#819087;letter-spacing:2px}.menu-top span:first-child{color:#bdb899}.menu-bottom{font-size:7px;letter-spacing:1.4px}.menu-bottom i{font-style:normal;color:var(--gold);margin-left:10px}.start-content{text-align:center;width:min(640px,100%);margin-top:-12px}.crest{color:#b3ba95;margin:auto auto 22px;width:65px;height:77px;filter:drop-shadow(0 0 16px #85b8a755)}.crest svg{width:100%;height:100%;stroke-width:1.8}.start-eyebrow{color:#a1afa1;font-size:8px;letter-spacing:4px;margin:0 0 14px}h1{font-family:Cinzel,Georgia,serif;font-size:clamp(35px,6vw,73px);font-weight:500;letter-spacing:9px;line-height:1.1;margin:0;text-shadow:0 2px 20px #000;color:#e1ddc4}.subtitle{display:flex;align-items:center;justify-content:center;gap:19px;margin-top:20px;font-size:9px;letter-spacing:4px;color:#bbb391}.subtitle i{height:1px;width:40px;background:#a3966466}.tagline{font-family:Cinzel,Georgia,serif;font-size:15px;letter-spacing:1px;color:#bac6b7;line-height:1.8;margin:33px 0 28px;text-shadow:0 2px 10px #000}.primary,.secondary{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:51px;border:1px solid #9fa88788;padding:16px 21px;background:linear-gradient(100deg,#30443be8,#1a2b27ee);font-size:10px;letter-spacing:2px;font-weight:600;color:#dce0c9;transition:background .2s,transform .2s}.primary:hover{background:#445749;transform:translateY(-1px)}.primary span,.secondary span{font-size:18px;font-weight:400}.start-content .primary,.start-content .secondary{width:320px;max-width:100%;margin:0 auto 10px}.secondary{background:#101a19da;border-color:#78897555;color:#9baa99}.text-button{background:transparent;font-size:10px;color:#879c8d;padding:15px;letter-spacing:.4px}.text-button span{margin-left:8px}.text-button:hover{color:#d0d9c4}.menu-note{font-size:7px;letter-spacing:1.5px;color:#718c7b;margin-top:25px}.green-dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:#9dbb91;box-shadow:0 0 8px #95c594;margin-right:7px}#modal-root{position:absolute;inset:0;z-index:15;background:#040a0cc4;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px}.modal{position:relative;width:min(620px,100%);max-height:90dvh;overflow-y:auto;background:linear-gradient(145deg,#172220,#0b1316 55%);border:1px solid #76836877;box-shadow:0 25px 100px #000b;padding:30px;scrollbar-width:thin;scrollbar-color:#566758 #0c1516}.modal.wide{width:min(820px,100%)}.modal .close{position:absolute;right:17px;top:15px;width:31px;height:31px;border:1px solid #6f826255;background:#141f1c;font-size:21px;color:#afb9a4}.modal h2{font-family:Cinzel,Georgia,serif;font-size:27px;font-weight:400;letter-spacing:2px;margin:12px 0;color:#d9d6bb}.modal p{font-size:12px;color:#9aac9e;line-height:1.8}.modal .eyebrow{font-size:8px}.modal h3{color:#c5ba93;font-family:Cinzel,Georgia,serif;font-size:13px;font-weight:500;letter-spacing:1px;margin:23px 0 12px}.modal .primary{width:100%;margin-top:20px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help-cell{border:1px solid #637b6033;background:#0c171766;padding:13px;font-size:10px;line-height:1.7;color:#9cafa0}.help-cell b{display:flex;align-items:center;gap:9px;color:#c5caae;font-size:11px;margin-bottom:5px}.help-cell svg{width:22px;height:22px}.control-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:11px;color:#b3bea9;margin:20px 0}.control-list kbd{margin-right:7px}.upgrade-list{display:grid;grid-template-columns:1fr;gap:10px;margin-top:20px}.upgrade{display:flex;align-items:center;text-align:left;gap:17px;padding:20px;border:1px solid #788c5e66;background:#1a2925;transition:background .15s}.upgrade:hover{background:#354337;border-color:#b9b183}.upgrade>span{font-size:25px;color:#b6b383}.upgrade b{font-family:Cinzel,Georgia,serif;font-size:15px;font-weight:500;color:#d2cfb5}.upgrade small{display:block;margin-top:7px;font-size:11px;line-height:1.6;color:#9cb29d}.stats-row{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.stat{flex:1;min-width:75px;border:1px solid #7a8b6333;padding:12px;font-size:9px;color:#8f9f90;text-transform:uppercase;letter-spacing:.8px}.stat b{display:block;margin-top:6px;font-size:18px;font-family:Georgia,serif;font-weight:400;color:#c6c5a5}.inventory-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:24px}.item-row{width:100%;display:flex;align-items:center;gap:12px;text-align:left;margin-bottom:7px;padding:12px;background:#111e1d;border:1px solid #60735955;min-height:57px}.item-row svg{color:#c1b589;flex-shrink:0}.item-row b{display:block;font-size:11px;color:#c5c8b1;font-weight:500}.item-row small{display:block;font-size:9px;color:#839b89;margin-top:5px}.item-row .item-value{margin-left:auto;font-size:9px;color:#b4a87b;white-space:nowrap}.item-row.rare{border-color:#6c96ae66}.item-row.rare b{color:#90bdd1}.item-row.epic{border-color:#a67acd66}.item-row.epic b{color:#cda7e6}.item-row:hover{background:#27352a}.empty-inventory{padding:30px 16px;text-align:center;border:1px dashed #66795855;color:#7b9382;font-size:11px;line-height:1.8}.item-actions{display:flex;gap:8px}.item-actions button{flex:1}.small-button{background:#223029;border:1px solid #7f926266;padding:10px 14px;font-size:10px}.save-note{font-size:9px!important;color:#657b6d!important;text-align:center;margin-top:20px!important}.pause-buttons{display:grid;gap:8px;margin-top:20px}.pause-buttons button{margin:0!important}.death-icon{font-size:50px;color:#b0b690;text-align:center;padding:5px}.danger{color:#cf9595!important}#touch-controls{position:absolute;z-index:6;inset:0;pointer-events:none}#joystick{position:absolute;width:106px;height:106px;bottom:182px;left:25px;border:1px solid #9daf8744;border-radius:50%;background:radial-gradient(#607d4622,#101b1733);pointer-events:auto;touch-action:none;display:grid;place-items:center}#joystick:before,#joystick:after{content:'';position:absolute;background:#bacdad18}#joystick:before{height:1px;width:80px}#joystick:after{width:1px;height:80px}#stick{width:42px;height:42px;border:1px solid #a6b58966;border-radius:50%;background:radial-gradient(#98ab7733,#304f3622);box-shadow:0 0 0 7px #8fa66e0a;pointer-events:none;will-change:transform}#touch-attack{position:absolute;bottom:202px;right:30px;width:65px;height:65px;border-radius:50%;display:grid;place-items:center;border:1px solid #bcc29b88;background:radial-gradient(#30453ddd,#17231bd0);pointer-events:auto;touch-action:none;color:#c0d7b4}#touch-attack svg{width:32px;height:32px}#touch-attack:active{background:#587455}#loading-error{position:absolute;inset:25%;z-index:99;padding:25px;background:#111a1d;border:1px solid #bc7777;font-size:13px;line-height:1.8}
@media(min-width:1500px){#hud{bottom:12px}#top-hud{padding:30px 40px}#army-panel{left:42px;top:130px}#map-panel{right:40px;top:116px}}
@media(max-width:900px){.brand b{font-size:14px}.brand small{font-size:5px}.brand-sigil{font-size:23px}.brand{gap:7px}.floor-heading .eyebrow{font-size:8px;letter-spacing:1px}#top-hud{padding:20px}#army-panel{left:20px;top:98px}#map-panel{right:20px;width:112px;top:92px}#minimap{width:110px;height:87px}#map-panel>div{font-size:5px;letter-spacing:.5px}.sep{margin:0 5px}}
@media(max-width:650px){.screen{padding:25px 23px 25px}.menu-top{font-size:6px;letter-spacing:1.2px}.menu-top span:last-child{max-width:105px;text-align:right;line-height:1.8}.start-content{margin-top:-15px}.crest{width:57px;height:68px;margin-bottom:23px}h1{font-size:clamp(29px,8.9vw,49px);letter-spacing:4px}.subtitle{font-size:7px;letter-spacing:2.5px;gap:11px;margin-top:18px}.subtitle i{width:20px}.tagline{font-size:13px;margin:34px 0 26px}.menu-bottom{font-size:5px;letter-spacing:.8px;gap:10px}.menu-bottom span:last-child{text-align:right}.start-content .primary,.start-content .secondary{width:278px;font-size:9px;letter-spacing:1.7px}.menu-note{font-size:6px;letter-spacing:1px;margin-top:17px}.brand{display:none}#top-hud{padding:17px 15px 40px}.floor-heading{left:16px;transform:none;text-align:left;padding-top:2px}.floor-heading .eyebrow{font-size:7px;letter-spacing:.9px}.floor-heading .sep{margin:0 5px}#objective{font-size:9px;margin-top:8px;max-width:270px}.top-actions{margin-left:auto;gap:5px}.icon-button{width:28px;height:28px}.icon-button svg{width:15px;height:15px}#army-panel{top:78px;left:16px}#army-panel .eyebrow{font-size:7px;letter-spacing:1.2px}#army-count{margin-left:12px;font-size:8px}#army-icons{margin-top:8px;gap:3px;max-width:140px}.bound-icon{width:21px;height:28px}.bound-icon svg{width:14px;height:14px}#army-hint{display:none}#map-panel{top:66px;right:15px;width:89px}#minimap{width:87px;height:68px}#map-panel>div{font-size:4px;padding:5px 2px;letter-spacing:.5px}#hud{padding:8px 13px max(15px,env(safe-area-inset-bottom));width:100%}.hud-main{gap:11px}.orb-wrap{flex-basis:56px}.orb{width:54px;height:54px;border-width:2px;box-shadow:0 0 0 3px #080e10,0 0 0 4px #65706466,0 0 24px #000}.orb span{font-size:7px;bottom:12px}.orb-label{font-size:6px;letter-spacing:1.2px;margin-top:8px;height:10px}.orb-label kbd{display:none}.skill-zone{width:232px}.skills{gap:5px}.skill{height:54px;width:54px;padding:2px}.skill svg{width:26px;height:26px;margin-top:-5px}.skill .skill-name{font-size:5.5px;bottom:7px;letter-spacing:-.1px}.skill .mana-cost{font-size:6px;right:3px;bottom:1px}.skill kbd{font-size:6px;padding:1px 3px;left:3px;top:-7px}.skill-tooltip{display:none!important}.cooldown-number{top:14px;font-size:17px}.xp-row{font-size:5px;gap:4px;margin-top:10px}.xp-row #xp-label{display:none}.hud-topline{max-width:200px;font-size:7px;margin-bottom:8px;letter-spacing:1px}.level-badge{height:18px;min-width:18px;font-size:10px}.gold{font-size:9px}#potion,#inventory{bottom:14px;width:20px;height:25px}#potion{left:-7px;font-size:7px;transform:translateY(15px)}#potion span{font-size:10px}#inventory{right:-7px;transform:translateY(15px)}#inventory svg{width:15px}.desktop-hints{display:none}#interact-wrap{bottom:160px}#interact{font-size:9px;padding:10px 14px}#interact kbd{font-size:8px}#joystick{bottom:174px;left:20px;width:95px;height:95px}#touch-attack{bottom:188px;right:23px;width:62px;height:62px}#floor-banner{top:28%}#floor-banner h2{font-size:19px;letter-spacing:1.5px}#floor-banner small{font-size:6px;letter-spacing:2px}#floor-banner span{font-size:8px}.modal{padding:25px 19px;max-height:90dvh}.modal h2{font-size:23px}.modal .close{right:12px;top:12px;width:28px;height:28px}.modal h3{font-size:12px}.modal p{font-size:11px}.help-grid{gap:8px}.help-cell{font-size:9px;padding:10px}.help-cell b{font-size:9px;gap:5px}.control-list{font-size:9px;gap:13px 7px}.control-list kbd{font-size:7px;padding:3px}.inventory-layout{grid-template-columns:1fr;gap:3px}.stats-row{gap:5px}.stat{padding:10px 7px;font-size:7px;min-width:55px}.stat b{font-size:15px}.upgrade{padding:16px;gap:12px}.upgrade b{font-size:13px}.upgrade small{font-size:10px}#toast{font-size:10px;padding:10px 14px;top:23%}}
@media(max-height:550px){.screen{padding:17px 28px}.crest{display:none}.start-eyebrow{margin-top:14px}h1{font-size:36px}.subtitle{margin-top:9px}.tagline{margin:15px 0;font-size:11px}.start-content .primary,.start-content .secondary{min-height:36px;padding:8px 15px;font-size:8px}.text-button{padding:8px}.menu-note{display:none}.menu-bottom{margin-top:8px}#hud{padding-bottom:9px;transform:translateX(-50%) scale(.85);transform-origin:bottom center}#top-hud{padding:12px 18px}.brand{display:none}.floor-heading{left:20px;transform:none;text-align:left}#map-panel{top:58px;width:89px}#minimap{width:87px;height:65px}#army-panel{top:67px;left:20px}#army-hint{display:none}#joystick{bottom:36px;left:28px;width:86px;height:86px}#touch-attack{bottom:44px;right:30px;width:60px;height:60px}#interact-wrap{bottom:145px}#floor-banner{top:20%}#floor-banner h2{font-size:20px}}
/* Keep the bottom HUD compact on phones held sideways. */
@media(orientation:landscape) and (max-height:600px){#hud{transform:translateX(-50%) scale(.6);transform-origin:bottom center;bottom:0;padding-bottom:0}#hud .desktop-hints{display:none}#interact-wrap{bottom:110px}}
@media(orientation:landscape) and (max-height:550px){#hud{transform:translateX(-50%) scale(.51)}}
.top-actions{margin-left:auto}
#start-screen{background:radial-gradient(ellipse at 50% 43%,rgba(3,8,11,.78),rgba(2,6,9,.94) 78%);backdrop-filter:blur(2px)}
#modal-root[data-modal="Paused"]{background:rgba(2,5,8,.92);backdrop-filter:blur(7px)}
#modal-root[data-modal="Paused"] .modal{background:linear-gradient(145deg,#0e1918,#070c10 65%)}
.modal #army-panel{position:static;pointer-events:auto;margin:18px 0;padding:14px 16px;border:1px solid #71856044;background:#101d1a}
.modal #army-panel .eyebrow{font-size:9px;letter-spacing:1.7px}
.modal #army-icons{max-width:none;margin-top:10px;gap:5px}
.modal #army-hint{display:block;font-size:10px;margin-top:9px}
/* Compact, icon-led rewards: stacked on portrait phones, a row in landscape. */
#modal-root[data-modal="levelup"]{background:rgba(2,5,8,.9)}
#modal-root[data-modal="levelup"] .modal{width:min(540px,100%);padding:26px;background:linear-gradient(145deg,#15201d,#080f12 75%)}
.reward-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.reward-heading h2{font-size:23px;letter-spacing:.5px;margin:8px 0 0}
.reward-capacity{display:flex;align-items:center;gap:7px;color:#abb8a2;font-size:10px;white-space:nowrap}
.reward-capacity svg{width:18px;height:18px;color:var(--gold)}
.reward-list{display:grid;gap:10px}
.reward-choice{display:flex;align-items:center;gap:15px;width:100%;min-height:83px;padding:15px;text-align:left;border:1px solid #66785677;background:linear-gradient(110deg,#1d2c25,#121d1d);transition:background .15s,border-color .15s}
.reward-choice:hover{background:#293b2c;border-color:#b9b183}
.reward-choice:active{background:#354b35}
.reward-icon{display:grid;place-items:center;flex:0 0 46px;height:46px;background:#09141299;border:1px solid currentColor;color:#b8c998;border-radius:7px}
.reward-icon svg{width:29px;height:29px;filter:drop-shadow(0 0 5px #94ae5744)}
.reward-insight{color:#d5b778}.reward-soul{color:#8fbde3}.reward-blood{color:#e08c90}.reward-harvest,.reward-haste{color:#c2a2e4}.reward-spear{color:#d2c69e}
.reward-copy{min-width:0}.reward-copy b{display:block;font-family:Cinzel,Georgia,serif;font-size:14px;font-weight:500;color:#e0dec8}
.reward-copy small{display:block;margin-top:7px;color:#bac9b6;font-size:12px;line-height:1.4}
@media(max-width:650px){#modal-root[data-modal="levelup"]{padding:16px}#modal-root[data-modal="levelup"] .modal{padding:23px 17px}.reward-heading{gap:10px;margin-bottom:18px}.reward-heading h2{font-size:21px}.reward-choice{gap:12px;padding:13px}.reward-copy b{font-size:13px}.reward-copy small{font-size:11px}.reward-icon{flex-basis:42px;height:42px}}
@media(orientation:landscape) and (max-height:600px){#modal-root[data-modal="levelup"] .modal{width:min(740px,100%);padding:21px}.reward-list{grid-template-columns:repeat(3,minmax(0,1fr))}.reward-heading{margin-bottom:17px}.reward-choice{flex-direction:column;justify-content:center;text-align:center;gap:11px;min-height:154px;padding:14px 8px}.reward-icon{flex-basis:42px;width:42px;height:42px}.reward-copy b{font-size:13px}.reward-copy small{font-size:11px}}
@media(max-width:360px){.orb-wrap{flex-basis:44px}.orb{width:43px;height:43px}.orb span{font-size:6px;bottom:9px}.hud-main{gap:6px}.skill{min-width:44px}.orb-label{font-size:5px}#hud{padding-left:12px;padding-right:12px}.floor-heading .eyebrow{font-size:6px}#objective{font-size:8px}.skill .skill-name{font-size:5px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Resource orbs also drink from their own potion stocks. */
.orb{display:block;padding:0;pointer-events:auto;cursor:pointer;touch-action:manipulation}
.orb:active{filter:brightness(1.2)}
.orb:focus-visible{outline:2px solid var(--mint);outline-offset:7px}
.orb .potion-stock{bottom:4px;font-size:9px;color:#f5dcc9;font-weight:500;letter-spacing:1px}
.mana .potion-stock{color:#c6e3ff}
.orb .potion-stock b{font-weight:600}
#touch-attack svg{transform:translateY(-4px)}
#bolt-cost{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-size:8px;color:#b6d6eb;letter-spacing:.8px;pointer-events:none}
#touch-attack.no-mana{filter:saturate(.2);opacity:.65}
.reward-frugal{color:#8fbde3}.reward-supplies{color:#e08c90}
@media(max-width:650px){.orb .potion-stock{bottom:2px;font-size:7px;letter-spacing:.4px}}
@media(max-width:360px){.orb .potion-stock{bottom:1px;font-size:6px}}

/* Keep the scrolling minimap inside its existing responsive HUD frame. */
#map-panel{overflow:hidden}

/* Touch gestures belong to the game; menus retain one-finger scrolling. */
html,body{touch-action:none;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
#game-shell{touch-action:none;-webkit-touch-callout:none}
.modal{touch-action:pan-y;overscroll-behavior:contain}

/* The basic attack stays available when Mana runs out. */
#touch-attack .staff-icon{display:none}
#touch-attack.staff-mode{color:#ddc79b;border-color:#bda878;background:radial-gradient(#514632dd,#221e17e8)}
#touch-attack.staff-mode .bolt-icon{display:none}
#touch-attack.staff-mode .staff-icon{display:block}
#touch-attack.staff-mode #bolt-cost{color:#e2d2ab;letter-spacing:.3px}