:root{color-scheme:dark;--ink:#090b13;--gold:#d7b16c;--paper:#eee6d8;--quiet:#aaa1ae;--red:#d9566c}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 5%,#281421 0%,#0e101a 48%,#090b13 80%);color:var(--paper);font-family:'Yu Gothic','Hiragino Kaku Gothic ProN',sans-serif;min-height:100dvh;display:flex;align-items:center;justify-content:center}button{font:inherit;cursor:pointer;color:inherit;touch-action:manipulation}button:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:disabled{opacity:.65;cursor:wait}#app{width:min(1392px,100%);padding:0 44px 16px}.masthead{height:91px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:13px;align-items:center}.sigil{font:42px Georgia;color:var(--gold)}.brand>span:last-child{font:23px Georgia;letter-spacing:7px}.brand small{display:block;font:10px 'Yu Gothic',sans-serif;letter-spacing:3px;margin-top:6px;color:#bca6a6}.chapter{font-size:13px;letter-spacing:2px;color:#b6a8b0}.chapter>span{font-size:11px;color:var(--gold);margin-right:18px;letter-spacing:2px}.utilities{display:flex;align-items:center;gap:9px}.utilities button{border:1px solid #3c3038;background:#17131d;width:36px;height:36px;font-size:23px}.utilities #sound{font-size:19px;width:auto;padding:0 12px}.utilities #sound span{font-size:11px;letter-spacing:1px;margin-left:6px}.utilities button:hover{border-color:var(--gold)}#stage{position:relative;isolation:isolate;aspect-ratio:16/9;width:100%;overflow:hidden;border:1px solid #755744;box-shadow:0 0 0 5px #12111a,0 20px 80px #0009;background:#101121}#stage::after{content:'';position:absolute;inset:5px;border:1px solid #c69b5730;pointer-events:none;z-index:7}canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none;outline:none}.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 40%,#04050c44);pointer-events:none;z-index:1}#hud{position:absolute;inset:4.8% 4.2% auto;display:flex;justify-content:space-between;z-index:4;pointer-events:none;text-shadow:0 2px 3px #000}.hero-status{width:23.6%}.status-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.status-label b{font:16px Georgia;letter-spacing:3px;color:var(--gold)}.status-label span{font:11px monospace;color:#ddd5d6}#hearts{display:flex;gap:4px;height:10px}#hearts i{display:block;flex:1;box-shadow:0 1px 0 #f7a2a5 inset;background:#da5a70;border:1px solid #833547;transform:skewX(-15deg)}#hearts i.empty{box-shadow:none;background:#3b2633;border-color:#604153}.substatus{display:flex;justify-content:space-between;gap:15px;font-size:11px;letter-spacing:1px;margin-top:10px;color:#d1c4c9}.substatus b{color:var(--gold);font-size:13px;margin-left:5px}.summon-status b{color:#c5a3ff;letter-spacing:4px}.stage-status{text-align:right}.stage-status>span{color:var(--gold);font-size:13px;letter-spacing:3px}.stage-status b{display:block;font:16px monospace;letter-spacing:3px;margin-top:5px}.stage-status small{display:block;font-size:10px;color:#bbaab6;margin-top:7px}#boss-hud{position:absolute;width:38%;left:31%;top:5%;z-index:4}#boss-hud>div:first-child{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;margin-bottom:8px}.boss-track{height:10px;background:#181021;border:1px solid #86519d;padding:2px}.boss-track i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#733aac,#df7ede);transition:width .18s}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,#090814dd,#090b1375 50%,#09081490);z-index:6;text-align:center}.overlay[hidden],#hud[hidden],[hidden]{display:none!important}#title-card{position:relative;margin-top:1%;}.eyebrow{font:10px Georgia;letter-spacing:5px;color:#cfb697}h1{font:clamp(44px,8.2vw,112px)/1 Georgia,'Times New Roman',serif;letter-spacing:20px;padding-left:20px;margin:12px 0 10px;color:#f4ddab;text-shadow:0 4px #4c2839,0 0 55px #c25a4540}.title-jp{font-size:clamp(13px,1.5vw,20px);letter-spacing:6px;color:#e5bc91;display:flex;align-items:center;justify-content:center;gap:18px}.title-jp i{display:block;width:40px;height:1px;background:linear-gradient(90deg,transparent,#aa7758)}.title-jp i:last-child{transform:rotate(180deg)}#title-card p{font-size:clamp(11px,1.2vw,15px);color:#cabac1;line-height:2.1;margin:24px 0;letter-spacing:2px}.primary{min-width:238px;padding:14px 30px;background:linear-gradient(135deg,#b78646,#e1bd79);color:#211424;border:1px solid #edca8b;box-shadow:0 0 0 4px #b6864530;font-size:14px;font-weight:bold;letter-spacing:3px;transition:filter .15s,transform .15s}.primary:hover{filter:brightness(1.15);transform:translateY(-2px)}#load-status{font-size:11px;margin:13px 0;color:#afa0ab;letter-spacing:1px}.title-hint{font-size:11px;color:#bfb2be;margin-top:24px}kbd{font:10px monospace;display:inline-block;min-width:20px;text-align:center;padding:4px 5px;border:1px solid #544654;border-bottom:2px solid #786170;color:#e2d4d8;background:#201b28;border-radius:3px;margin-right:3px}.controls{display:flex;justify-content:center;gap:22px;padding:22px 0 19px;font-size:11px;color:#bcaebb;flex-wrap:wrap}.controls em{font-style:normal;font-size:10px;color:#b99aca;margin-left:5px}.footer-note{display:flex;justify-content:space-between;border-top:1px solid #282330;padding-top:12px;color:#827582;font-size:10px;letter-spacing:1px}#announcement{position:absolute;left:50%;top:26%;transform:translateX(-50%);width:90%;text-align:center;font-size:18px;letter-spacing:5px;color:#f1dba4;text-shadow:0 2px 6px #000;pointer-events:none;z-index:5;transition:opacity .3s}#state-card{max-width:80%}#state-card h2{font:clamp(24px,3.5vw,48px) Georgia,'Yu Mincho',serif;color:#edcb88;letter-spacing:5px;margin:20px 0}#state-card p{font-size:14px;line-height:1.9;margin:18px 0 27px;white-space:pre-line}.text-button{display:block;margin:22px auto 0;border:0;background:transparent;color:#baaeb9;font-size:12px;letter-spacing:1px}#touch-controls{position:absolute;inset:auto 3% 5%;display:none;justify-content:space-between;z-index:5;pointer-events:none}#touch-controls>div{display:flex;gap:8px}#touch-controls button{pointer-events:auto;width:52px;height:52px;border:1px solid #ddbc9470;border-radius:50%;background:#100d21aa;color:#f8dcad;user-select:none;touch-action:none}#touch-controls button.magic{color:#dcc4ff;border-color:#a680c9}.playing .overlay{display:none}.paused .overlay{display:flex}#stage:fullscreen{width:100%;height:100%;aspect-ratio:auto;background:#070911}#stage:fullscreen canvas{object-fit:contain}#stage:fullscreen #hud{top:5%}@media(pointer:coarse){#touch-controls{display:flex}.title-hint{display:none}}@media(max-width:900px){#app{padding:0 14px 14px}.masthead{height:70px}.chapter{display:none}.controls{gap:10px;padding:16px 0;font-size:10px}.eyebrow{font-size:8px;letter-spacing:3px}.primary{padding:10px 20px;min-width:190px}.title-hint{margin-top:15px;font-size:9px}#title-card p{margin:15px 0}#load-status{font-size:9px}#hearts{height:7px;gap:2px}.status-label{margin-bottom:5px}.status-label b{font-size:12px}.substatus{font-size:8px;margin-top:5px}.substatus b{font-size:10px}.stage-status>span{font-size:10px}.stage-status small{display:none}#boss-hud{top:6%}#boss-hud>div:first-child{font-size:10px}.footer-note{font-size:9px}}@media(max-width:600px){.masthead{height:62px}.brand>span:last-child{font-size:19px}.brand small{font-size:8px}.sigil{font-size:30px}.utilities button{width:30px;height:30px}.utilities #sound span{display:none}#app{padding:0 6px}#title-card p{display:none}h1{margin:8px 0;font-size:48px}.title-jp{font-size:11px;letter-spacing:3px}.primary{margin-top:17px;padding:9px 19px;font-size:11px;min-width:175px}.title-hint{display:none}.eyebrow{font-size:7px}.footer-note>span:first-child{display:none}.footer-note{justify-content:center}#hud{inset:5% 4% auto}.status-label b{font-size:10px}.status-label span{font-size:8px}.hero-status{width:29%}.summon-status{white-space:nowrap}.substatus{gap:5px;font-size:7px}.stage-status b{font-size:10px}.stage-status>span{font-size:8px}.substatus b{font-size:8px}.summon-status b{letter-spacing:1px}#touch-controls button{width:37px;height:37px;font-size:10px}#touch-controls>div{gap:5px}#state-card h2{font-size:23px;margin:8px 0}#state-card p{font-size:10px;margin:8px 0}.text-button{margin-top:12px;font-size:10px}#announcement{font-size:12px;letter-spacing:2px}#boss-hud{top:18%;left:32%;width:36%}.boss-track{height:7px}#boss-hud>div:first-child{font-size:8px;margin-bottom:4px}}
