:root{color-scheme:dark;--silver:#e7e3dc;--muted:#a5a29c;--gold:#d6b879;--bg:#080b0d;--jp:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;--brightness:1;--pointer-x:0px;--pointer-y:0px;font-family:var(--jp);color:var(--silver);background:var(--bg)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{min-height:360px}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:default}button:focus-visible,input:focus-visible{outline:1px solid var(--gold);outline-offset:5px}button{touch-action:manipulation}::selection{background:#8a7148;color:#fff}
#world{position:fixed;inset:0;filter:brightness(var(--brightness));transition:filter .3s;pointer-events:none;background:#080b0d}
#backdrop{position:absolute;inset:-1.1%;background-image:url('./assets/ruined-hall.png');background-size:cover;background-position:center;transform:translate3d(var(--pointer-x),var(--pointer-y),0);will-change:transform}
#atmosphere{position:absolute;inset:0;width:100%;height:100%}.edge-shadow{position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,5,7,.48),transparent 16%);pointer-events:none}
#title-screen{position:absolute;inset:0;transition:opacity .65s,transform 1s;animation:reveal 1.8s ease both}
.wordmark{position:absolute;top:12%;left:3.6%;width:30%;text-align:center;text-shadow:0 2px 18px #0009}
h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1;margin:0;color:#e2dfd8}.title-top{display:block;font-size:clamp(25px,3.15vw,64px);letter-spacing:.18em;white-space:nowrap;padding-left:.18em}.title-main{display:block;font-size:clamp(55px,6.92vw,142px);letter-spacing:.025em;line-height:1.16;background:linear-gradient(#f3f0e9 14%,#d5d0c5 44%,#a39f93 48%,#eee8dd 60%,#a19b8e);color:transparent;background-clip:text;-webkit-background-clip:text;text-shadow:1px 2px 1px #bbb7ab13;white-space:nowrap}
.ornament{display:flex;align-items:center;justify-content:center;height:25px;gap:9px;margin:0 7%}.ornament i{height:1px;width:43%;background:linear-gradient(90deg,transparent,#aba08a)}.ornament i:last-child{transform:rotate(180deg)}.ornament svg{width:14px;height:25px;fill:none;stroke:#bcb29c;stroke-width:1.2;flex:none}.subtitle{font-size:clamp(17px,1.8vw,34px);letter-spacing:.4em;margin:12px 0 0;padding-left:.4em;font-weight:400}
.main-menu{position:absolute;left:5.8%;top:44%;width:19%;display:flex;flex-direction:column;gap:4px}.menu-item{position:relative;display:flex;align-items:center;text-align:left;width:100%;min-height:54px;height:6.3vh;border:0;background:transparent;font-size:clamp(19px,1.65vw,31px);letter-spacing:.14em;padding:0 10px 0 2.5vw;color:#c4c0b9;transition:color .24s,text-shadow .24s}.menu-item:after{position:absolute;content:"";height:1px;bottom:5px;left:2.5vw;right:0;background:linear-gradient(90deg,transparent,#b79b5c 15%,#b79b5c50 70%,transparent);transform:scaleX(.4);transform-origin:left;opacity:0;transition:transform .25s,opacity .25s}.menu-item.selected{color:#f1e7cf;text-shadow:0 0 24px #e0ba6145}.menu-item.selected:after{opacity:1;transform:scaleX(1)}.menu-item:disabled{color:#888785;opacity:.62}.selection-mark{position:absolute;left:7px;width:12px;height:12px;border:1px solid var(--gold);transform:rotate(45deg) scale(.7);opacity:0;box-shadow:0 0 10px #e6b65720;transition:opacity .25s,transform .25s}.selection-mark:after{content:"";position:absolute;inset:3px;border:1px solid var(--gold)}.selected .selection-mark{opacity:1;transform:rotate(45deg) scale(1)}
.screen-footer{position:fixed;bottom:max(3.4vh,env(safe-area-inset-bottom));left:max(2.8vw,env(safe-area-inset-left));right:max(2.8vw,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:center;color:#aca9a3}.keyboard-hint{display:flex;align-items:center;gap:7px;font-size:13px;letter-spacing:.06em;margin:0;text-shadow:0 1px 5px #000}.desktop-hint{display:flex;align-items:center;gap:8px}kbd{font:inherit;font-family:Georgia,serif}.hint-separator{height:10px;width:1px;background:#bab4a23d;margin:0 9px}.touch-hint{display:none}.utilities{display:flex;align-items:center;gap:15px}.icon-button{display:grid;place-items:center;width:40px;height:40px;background:transparent;border:1px solid transparent;color:#aaa69c;transition:color .2s,border-color .2s}.icon-button:hover{border-color:#bfa87666;color:#ebd7ac}.icon-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.sound-waves{display:none}#sound-toggle[aria-pressed=true] .sound-waves{display:block}#sound-toggle[aria-pressed=true] .sound-off{display:none}
dialog{width:min(500px,calc(100% - 40px));border:1px solid #a9905959;border-radius:0;background:linear-gradient(135deg,#121718fa,#080b0dfc);color:var(--silver);padding:38px 42px;box-shadow:0 30px 150px #000c;max-height:calc(100dvh - 40px);overflow:auto}dialog::backdrop{background:#020406ae;backdrop-filter:blur(7px)}dialog[open]{animation:dialog-reveal .4s ease both}dialog h2{font-size:26px;letter-spacing:.16em;font-weight:400;margin:0}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}.close-button{border:0;background:none;color:#9b978e;font:300 28px Georgia;padding:0 5px}.close-button:hover{color:var(--gold)}.setting{display:grid;grid-template-columns:1fr auto;gap:16px;margin-bottom:27px;font-size:15px}.setting output{font-family:Georgia,serif;font-size:15px;color:var(--gold);font-variant-numeric:tabular-nums}.setting input{grid-column:1/-1;width:100%;height:24px;margin:0;accent-color:var(--gold);cursor:pointer}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:15px;cursor:pointer;position:relative}.toggle-row small{display:block;margin-top:7px;font-size:11px;color:var(--muted)}.toggle-row input{position:absolute;right:0;width:40px;height:24px;opacity:0;margin:0;z-index:1;cursor:pointer}.switch{width:38px;height:20px;border:1px solid #817964;position:relative;flex:none}.switch:before{content:"";position:absolute;width:10px;height:10px;left:4px;top:4px;background:#7f7c73;transition:transform .2s,background .2s}input:checked+.switch:before{transform:translateX(18px);background:var(--gold)}input:focus-visible+.switch{outline:1px solid var(--gold);outline-offset:4px}.settings-note{font-size:11px;line-height:1.7;color:#aaa59a;margin-top:25px}.dialog-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #af9a7326;padding-top:24px;margin-top:25px}.gold-button{background:linear-gradient(100deg,#ac8a481a,#ac8a4809);border:1px solid #b49a616e;padding:12px 22px;min-height:46px;font-size:14px;letter-spacing:.1em;transition:background .25s,border-color .25s}.gold-button:hover{background:#b6924a26;border-color:var(--gold)}.text-button{background:transparent;border:0;font-size:12px;padding:10px 0;color:#b0aa9d}.text-button:hover{color:var(--gold)}.dialog-description{font-size:14px;line-height:1.9;color:#b7b0a2;margin-top:24px}.prologue{text-align:center;width:min(640px,calc(100% - 40px));padding:54px 42px}.chapter-label{font-size:13px;letter-spacing:.6em;color:var(--gold);margin:0 0 18px}.prologue h2{font-size:38px;letter-spacing:.35em;padding-left:.35em}.short-rule{width:70px;height:1px;background:linear-gradient(90deg,transparent,#c6aa74,transparent);margin:30px auto}.story{font-size:15px;line-height:2.5;letter-spacing:.12em;color:#d3cec3;margin:20px 0}.prologue-note{font-size:10px;color:#928c7e;letter-spacing:.15em;margin:28px 0 18px}
#rest-screen{position:fixed;inset:0;background:#040608d9;z-index:10;place-items:center;text-align:center;backdrop-filter:blur(6px)}#rest-screen:not([hidden]){display:grid}.rest-inner p{font-size:clamp(18px,3vw,28px);letter-spacing:.25em;margin:0 0 40px}.resting #title-screen,.resting .screen-footer{visibility:hidden;opacity:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{position:fixed;bottom:80px;left:30px;color:#fff;background:#111;padding:12px}.reduced-motion #backdrop{transform:none;will-change:auto}.reduced-motion *{animation:none!important;transition:none!important}
@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes dialog-reveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.title-main{font-size:clamp(55px,6.4vw,142px);line-height:1.03}.ornament{height:21px}.subtitle{margin-top:9px}.main-menu{gap:0}.menu-item{min-height:48px}
@media(min-aspect-ratio:21/9){.wordmark{width:27%;top:9%}.title-top{font-size:5.3vh}.title-main{font-size:11.6vh}.subtitle{font-size:3vh}.main-menu{top:43%}}
@media(max-width:900px) and (min-aspect-ratio:1/1){.wordmark{width:36%;left:4%;top:10%}.title-top{font-size:3.6vw}.title-main{font-size:8vw}.subtitle{font-size:2.1vw}.main-menu{top:44%;width:28%;left:7%}.menu-item{height:9vh;min-height:42px;font-size:19px;padding-left:30px}.menu-item:after{left:30px}.screen-footer{bottom:14px}.keyboard-hint{font-size:11px}.ornament{height:16px}.ornament svg{height:18px}.subtitle{margin-top:7px}}
@media(max-aspect-ratio:1/1){#backdrop{background-position:72% center}.edge-shadow{background:linear-gradient(90deg,#020508e3 0%,#0205088a 48%,#02050815 100%),linear-gradient(0deg,#020508a8,transparent 40%)}.wordmark{left:7%;top:max(11vh,40px);width:78%;max-width:440px}.title-top{font-size:clamp(27px,6.8vw,43px)}.title-main{font-size:clamp(60px,16vw,99px)}.subtitle{font-size:clamp(18px,4vw,24px);margin-top:10px}.main-menu{left:10%;top:47%;width:65%;max-width:300px;gap:6px}.menu-item{height:58px;padding-left:34px;font-size:21px}.menu-item:after{left:34px}.selection-mark{left:4px}.screen-footer{left:7%;right:6%;bottom:max(22px,env(safe-area-inset-bottom))}.desktop-hint{display:none}.touch-hint{display:inline;font-size:11px}.utilities{gap:8px}dialog{padding:28px 26px}.prologue{padding:38px 23px}.story{font-size:13px;letter-spacing:.03em}.dialog-actions{gap:12px}.text-button{font-size:11px}}
@media(max-height:640px) and (max-aspect-ratio:1/1){.wordmark{top:6%;width:66%}.title-top{font-size:5.5vw}.title-main{font-size:13vw}.subtitle{font-size:17px}.main-menu{top:40%}.menu-item{height:48px;min-height:44px}.screen-footer{bottom:10px}}
@media(max-width:900px) and (min-aspect-ratio:1/1){.title-main{font-size:7.6vw}}
@media(max-aspect-ratio:1/1){.title-main{font-size:clamp(45px,15.4vw,94px)}}
@media(max-height:500px) and (min-aspect-ratio:1/1){.wordmark{top:8%}.title-top{font-size:7vh}.title-main{font-size:13vh}.subtitle{font-size:4vh}.ornament{height:14px}.ornament svg{height:17px}.main-menu{top:44%}.menu-item{height:10vh;min-height:40px;font-size:18px}.screen-footer{bottom:10px}.keyboard-hint{font-size:10px}}
@media(max-height:640px) and (max-aspect-ratio:1/1){.title-main{font-size:13vw}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}#backdrop{transform:none!important}}