:root{color-scheme:dark;--ink:#ebe9d7;--muted:#9bada7;--line:#41504a;--gold:#e6c774;--panel:#101716;--health:#dc6369;--mana:#73c6d3}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080c0b;color:var(--ink);font-family:ui-monospace,"Cascadia Code","Noto Sans Mono",monospace;letter-spacing:0}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default}.hide{display:none!important}
#app{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden;background:#080c0b}#game{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none;outline:none;cursor:crosshair}
#hud{position:absolute;inset:0;pointer-events:none;text-shadow:1px 2px 1px #000;font-size:12px;background:linear-gradient(#05080788,transparent 110px,transparent calc(100% - 100px),#05080788)}.brand{position:absolute;left:24px;top:19px;font-size:14px;color:#e6d7aa}.brand span{font-size:10px;color:#94a89e;margin-left:10px}#location{position:absolute;top:21px;left:50%;transform:translateX(-50%);text-align:center;display:flex;gap:14px;align-items:center;white-space:nowrap}#location b{font-weight:400;font-size:14px}#depth{font-size:12px;color:var(--gold)}#tools{position:absolute;top:14px;right:20px;display:flex;gap:8px}.icon-button{width:34px;height:34px;display:grid;place-items:center;background:#111a16cc;border:1px solid #586352;color:#d8dacc;font-size:20px;border-radius:2px}.icon-button:hover{background:#28392e}.icon-button[aria-pressed=true]{color:var(--gold)}
#vitals{position:absolute;left:24px;top:52px;display:grid;gap:6px}.vital{display:grid;grid-template-columns:12px 120px 70px;gap:7px;align-items:center;font-size:11px;height:12px}.vital>span{font-size:13px}.vital output{font-size:10px;color:#d1d9cb}.track{height:7px;border:1px solid #7c8b7d;background:#070c0b;box-shadow:0 1px #000}.track i{display:block;height:100%;transition:width 80ms linear}.health{color:var(--health)}.health i{background:var(--health)}.mana{color:var(--mana)}.mana i{background:var(--mana)}.flight{color:#dfc967}.flight i{background:#dfc967}#statuses{display:flex;gap:9px;min-height:16px;font-size:10px;color:#f5ad66}#runInfo{position:absolute;right:24px;top:60px;display:grid;gap:6px;text-align:right;font-size:11px}#gold{color:var(--gold)}#kills{color:var(--muted)}
#loadout{position:absolute;left:24px;bottom:22px;display:flex;align-items:end;gap:16px;max-width:calc(100% - 48px);pointer-events:auto}#wandHud{display:flex;gap:5px}.wand-slot{position:relative;width:60px;height:44px;border:1px solid #4e5d4d;background:#0c1311d9;border-radius:2px;padding:0}.wand-slot.active{border-color:#e0c16f;box-shadow:inset 0 -2px #e0c16f}.wand-slot .number{position:absolute;left:4px;top:2px;font-size:9px;color:#a8b6a5}.wand-slot canvas{width:48px;height:24px;image-rendering:pixelated;pointer-events:none}.wand-slot.empty{opacity:.4}.wand-slot:hover{background:#233027}#castHud{display:flex;flex-direction:column;gap:5px}.cast-name{font-size:10px;color:#c6cfbd}.cast-spells{display:flex;gap:3px}.mini-spell{width:24px;height:24px;background:#10221ed9;border:1px solid #455f52;display:grid;place-items:center;font-size:16px;color:var(--spell-color)}.mini-spell.current{border-color:var(--gold)}#materialLabel{position:absolute;right:24px;bottom:22px;font-size:10px;color:#b3beb1}#interactBtn{position:absolute;bottom:88px;left:50%;transform:translateX(-50%);max-width:85%;white-space:normal;z-index:2;font-size:12px}#toast{position:absolute;left:50%;top:24%;transform:translate(-50%,-6px);color:#eee6bf;background:#101a15ed;border-top:1px solid #647955;border-bottom:1px solid #647955;padding:9px 18px;opacity:0;transition:opacity .2s,transform .2s;max-width:85%;font-size:12px;text-align:center;pointer-events:none;z-index:8}#toast.visible{opacity:1;transform:translate(-50%,0)}
.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#020807ad;z-index:10;padding:20px;backdrop-filter:blur(2px)}.dialog{width:min(900px,100%);max-height:100%;overflow:auto;background:#101816f7;border:1px solid #596550;border-top:2px solid #c0a968;padding:24px;box-shadow:0 18px 70px #0009;border-radius:3px}.narrow{width:410px;padding:30px}.eyebrow{font-size:10px;color:#b2a675;line-height:1.6}h1{font-size:27px;font-weight:500;margin:12px 0 20px}h2{font-size:19px;font-weight:500;margin:0}h3{font-size:12px;margin:0;font-weight:500}.muted{color:var(--muted);font-size:12px;line-height:1.8}.command{border:1px solid #6d765d;background:#1d2b22;color:#e2e3c7;padding:11px 17px;font-size:12px;border-radius:2px}.command:hover{background:#354533;border-color:#b6bd88}.primary{background:#9b8140;color:#fff6d8;border-color:#d2b366}.primary:hover{background:#b59c6a}.narrow>.command{width:100%;margin-top:12px}.setting{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #334239;font-size:12px}.setting input{accent-color:var(--gold);width:17px;height:17px}.result #deadReason{color:#ed927c;font-size:18px}.result #runStats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:20px 0;border-block:1px solid var(--line);margin:20px 0}.result #runStats b{display:block;font-size:21px;color:var(--gold);margin-bottom:6px}.result #runStats span{font-size:10px;color:var(--muted)}
.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.panel-header .eyebrow{display:block;margin-bottom:5px}.panel-header .icon-button{flex-shrink:0}.editor-row{display:grid;grid-template-columns:180px 1fr;gap:16px;border-top:1px solid #35483b;padding:15px 0;align-items:center}.wand-info h3{color:#e1cf90;margin-bottom:7px}.wand-info .stats{font-size:10px;line-height:1.9;color:#a9b8a9}.wand-info canvas{width:72px;height:28px;image-rendering:pixelated;float:right}.spell-row{display:flex;gap:5px;flex-wrap:wrap}.spell-cell{flex:0 0 44px;width:44px;height:44px;background:#17251e;border:1px solid #4f6552;border-radius:2px;position:relative;padding:0;touch-action:none;display:grid;place-items:center;color:var(--spell-color);font-size:25px;user-select:none}.spell-cell:hover,.spell-cell.selected{border-color:var(--gold);background:#2c3b28}.spell-cell.empty{background:#0b1310;border-style:dashed;border-color:#35493a}.spell-cell .slot-index{position:absolute;top:2px;left:4px;font-size:8px;color:#748273}.spell-cell .cost{position:absolute;bottom:2px;right:3px;font-size:8px;color:#b7ccc1}.editor-section{border-top:1px solid #46583f;padding-top:14px;margin-top:4px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-heading span{font-size:11px;color:#bcc8aa}.storage-grid{display:grid;grid-template-columns:repeat(12,44px);gap:5px}.shop-grid{display:flex;gap:10px;flex-wrap:wrap}.shop-item{display:flex;align-items:center;gap:8px;border:0;background:#19261b;padding:6px 10px;min-width:120px;border-radius:2px;text-align:left}.shop-item .glyph{font-size:23px;color:var(--spell-color)}.shop-item strong{font-size:11px;font-weight:400}.shop-item small{display:block;font-size:10px;color:var(--gold);margin-top:3px}.editor-footer{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:10px;color:var(--muted)}#spellTooltip{position:fixed;z-index:30;pointer-events:none;background:#09130f;border:1px solid #88916a;padding:12px;width:220px;color:#d9e2cd;font-size:11px;line-height:1.7;box-shadow:0 4px 20px #0008}#spellTooltip b{color:var(--gold);display:block;font-size:12px;margin-bottom:5px}#dragGhost{position:fixed;z-index:40;pointer-events:none;width:42px;height:42px;display:grid;place-items:center;background:#233b2de8;border:1px solid var(--gold);color:var(--spell-color);font-size:27px;transform:translate(-50%,-50%)}
.perk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.perk-option{background:#18271f;border:1px solid #5b6d4d;border-radius:3px;padding:24px 18px;min-height:170px;text-align:left}.perk-option:hover{background:#293b27;border-color:var(--gold)}.perk-option .glyph{font-size:30px;color:var(--gold);display:block;margin-bottom:16px}.perk-option b{font-size:14px;font-weight:500;display:block;margin-bottom:10px}.perk-option small{font-size:11px;color:#bdcbb5;line-height:1.8;display:block}.pickup-options{display:grid;gap:10px;margin:20px 0}.pickup-option{display:flex;justify-content:space-between;padding:12px;border:1px solid #506047;background:#1a281e;font-size:12px}
.touch-controls{display:none;position:absolute;inset:0;pointer-events:none}.touch-button{pointer-events:auto;touch-action:none;position:absolute;display:grid;place-items:center;width:56px;height:56px;border:1px solid #a1ab8699;border-radius:50%;background:#132017a6;color:#e9e9cf;font-size:22px;user-select:none}.touch-button:active,.touch-button.held{background:#536446aa;border-color:#e7d893}#leftBtn{left:18px;bottom:23px}#rightBtn{left:86px;bottom:23px}#jumpBtn{left:53px;bottom:90px}#fireBtn{right:24px;bottom:28px;width:86px;height:86px;border-color:#e5cf82aa;font-size:32px}#fireBtn i{position:absolute;width:25px;height:25px;border:1px solid #e5cf8299;border-radius:50%;background:#a48c3844;pointer-events:none}.touch-button span{pointer-events:none}
@media(pointer:coarse){.touch-controls{display:block}#loadout{bottom:164px}#materialLabel{display:none}#interactBtn{bottom:148px}#game{cursor:default}}
@media(max-width:700px){.brand{left:14px;top:14px;font-size:12px}.brand span{display:none}#location{top:16px;font-size:10px;gap:8px}#location b{font-size:11px}#depth{font-size:10px}#tools{right:12px;top:10px;gap:5px}.icon-button{width:30px;height:30px;font-size:18px}#vitals{left:14px;top:45px;gap:5px}.vital{grid-template-columns:10px 80px 60px;gap:5px}.vital output{font-size:9px}#runInfo{right:14px;top:49px;font-size:10px}#loadout{left:14px;gap:9px}#wandHud{gap:4px}.wand-slot{width:44px;height:36px}.wand-slot canvas{width:40px;height:20px}.cast-name{font-size:9px}.mini-spell{width:20px;height:20px;font-size:14px}#castHud{max-width:160px}.cast-spells{flex-wrap:wrap}#toast{font-size:11px;top:22%}.overlay{padding:12px}.dialog{padding:18px}.narrow{padding:24px}.editor-row{grid-template-columns:1fr;gap:8px;padding:12px 0}.wand-info .stats{display:flex;flex-wrap:wrap;gap:0 12px;font-size:9px}.wand-info h3{margin-bottom:3px}.spell-cell{width:38px;height:38px;flex-basis:38px;font-size:23px}.spell-row{gap:4px}.storage-grid{grid-template-columns:repeat(6,38px);gap:5px}.panel-header{margin-bottom:12px}.panel-header h2{font-size:17px}.perk-grid{grid-template-columns:1fr;gap:8px;margin-top:16px}.perk-option{min-height:0;padding:14px 16px}.perk-option .glyph{float:left;margin:4px 16px 4px 0;font-size:26px}.perk-option b{font-size:12px;margin-bottom:5px}.perk-option small{font-size:10px}.editor-footer{gap:8px}.editor-footer .command{padding:9px 12px}.shop-grid{gap:6px}.shop-item{min-width:105px;padding:6px 8px}}
@media(max-height:500px) and (pointer:coarse){#loadout{left:165px;bottom:16px}#castHud{display:none}#interactBtn{bottom:70px}.touch-button{width:44px;height:44px}#leftBtn{left:16px;bottom:16px}#rightBtn{left:72px;bottom:16px}#jumpBtn{left:44px;bottom:70px}#fireBtn{width:68px;height:68px;bottom:18px;right:20px}#vitals{gap:3px}.overlay{padding:8px}.dialog{padding:16px}.perk-grid{grid-template-columns:repeat(3,1fr)}.perk-option{padding:13px}.perk-option .glyph{float:none}.storage-grid{grid-template-columns:repeat(12,38px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.wand-info .stats{display:grid;gap:2px}.wand-info canvas{float:none;display:block;margin:0 0 5px auto}.wand-info h3{line-height:1.5}.cast-spells{max-width:240px}
@media(max-width:700px){.wand-info .stats{display:flex;gap:2px 12px}.wand-info canvas{float:right;margin:0}.cast-spells{max-width:160px}}
@media(pointer:coarse) and (min-height:501px){#interactBtn{bottom:230px}}