@font-face{font-family:Meses;src:url('betuk/DejaVuSerif.ttf')}@font-face{font-family:Olvas;src:url('betuk/DejaVuSans.ttf')}*{box-sizing:border-box}body{margin:0;background:#10272f;color:#f9eed7;font:15px Olvas,Arial}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #b29c65;border-radius:12px;padding:12px 18px;background:#f8efd9;color:#203c41;min-height:44px}button:hover{filter:brightness(1.08)}button:disabled{opacity:.5;cursor:wait}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #40c9cd;outline-offset:3px}header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:10px 3vw;background:#10272f;border-bottom:1px solid #56706b}header b{display:flex;align-items:center;gap:10px;font:27px Meses}header small{display:block;font:9px Olvas;letter-spacing:3px;margin-top:3px}#tools{display:flex;gap:7px}#tools button{background:#193a42;color:#ffe7a4;border-color:#516660;width:44px;padding:8px;font-size:21px}h1,h2,h3{font-family:Meses;font-weight:normal}h1{font-size:clamp(32px,4.5vw,65px);line-height:1.15}p{line-height:1.7}.gold{background:#e9c477;border-color:#fbe1a6}.muted{color:#718080;font-size:12px}.cover{min-height:calc(100dvh - 72px);padding:5vh 7vw;background:linear-gradient(90deg,#0c2534ed,#10293366),url('assets/hero.webp') center/cover;display:flex;align-items:center}.cover>div{max-width:680px}.eyebrow{letter-spacing:3px;font-size:10px;color:#d6b978}.cover p{font-size:18px}.setup{display:flex;gap:18px;align-items:end;flex-wrap:wrap;margin:25px 0}.setup label{display:grid;gap:8px;font-size:12px}select,input{padding:10px;border:1px solid #a5b3ad;border-radius:8px;background:#fffdf5;color:#18383c;max-width:100%}.avatars{display:flex;gap:12px}.avatar-choice{padding:10px;width:105px;background:#153c49;color:white;border-color:#617b78}.avatar-choice img{width:70px;height:90px;object-fit:contain;display:block;margin:auto}.avatar-choice.selected{border:2px solid #f4d694;background:#315358}.scene-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(330px,1fr);min-height:calc(100dvh - 72px)}.scene{position:sticky;top:0;height:calc(100dvh - 72px);min-height:350px;overflow:hidden;background:#10272f}.backdrop{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.shade{position:absolute;inset:0;background:linear-gradient(#07151b88,transparent 35%,#05151bb0)}.scene-title{position:absolute;top:4%;left:5%;text-shadow:0 2px 9px #000}.scene-title h1{font-size:clamp(25px,3.3vw,47px);margin:10px 0}.actor{position:absolute;bottom:5%;height:48%;width:35%;object-fit:contain;filter:drop-shadow(0 8px 6px #0005)}.actor.avatar{left:0}.actor.npc{right:3%;height:51%;width:39%}.actor.item{left:44%;width:20%;height:23%;bottom:11%}.health{position:absolute;bottom:20px;left:5%;font-size:14px;background:#102b35db;padding:10px 17px;border-radius:20px}.location{position:absolute;bottom:20px;right:5%;color:#ecdba8;font-size:12px}.reading{padding:25px clamp(20px,3vw,48px);background:#f7efdc;color:#213d3f;overflow-wrap:break-word}.reading h2{font-size:27px;margin:10px 0 18px}.speech{border-left:3px solid #bc9654;padding:12px 18px;background:#e9e1cdb0;border-radius:0 10px 10px 0;line-height:1.7;white-space:pre-line}.task{background:#fffaf0;border:1px solid #d7c8a6;border-radius:15px;padding:18px;margin-top:18px}.equation{font:clamp(24px,2.7vw,34px) Meses;margin:18px 0}.answer{display:flex;gap:8px}.answer input{width:120px;min-width:60px;font-size:23px}.answer button{flex:1}.feedback{line-height:1.6;padding-top:12px}.choices{display:flex;flex-direction:column;gap:8px;margin:15px 0}.choices button{text-align:left;background:#fefbf3}.exits{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.exits button{font-size:13px;text-align:left}.busy{position:absolute;top:20px;right:20px;padding:10px;background:#13383bdf;border-radius:10px;color:#ffe5a6}.intro{max-width:850px;margin:5vh auto;padding:35px;background:#f5edd9;color:#203c41;border-radius:20px}.intro h1{font-size:35px}.intro p{font-size:18px}.intro .speaker{color:#79602e}dialog{border:1px solid #c4ae79;border-radius:18px;padding:30px;background:#fbf3df;color:#183b40;max-width:min(850px,94vw);max-height:90dvh;width:850px}dialog::backdrop{background:#041823c9}#close{float:right;padding:5px 12px;margin:-15px -15px 10px 10px}dialog h2{font-size:30px}#notice{position:fixed;bottom:15px;left:50%;transform:translateX(-50%);background:#163c42;color:#ffe3a1;padding:13px 22px;border-radius:12px;z-index:100;display:none}.map{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;aspect-ratio:1;max-width:530px;margin:auto}.cell{min-width:0;min-height:0;display:grid;place-items:center;font-size:10px;text-align:center;border-radius:8px;background:#213f49;color:#e1e9e2;padding:4px}.cell.unknown{background:#c9d1c9;color:#6d7f7d}.cell.path{background:#b5b59b}.cell.current{outline:3px solid #d89c35;background:#eac981;color:#183438}.cell small{font-size:9px}.inventory{display:flex;flex-wrap:wrap;gap:10px}.inventory>div{background:#e8e0ca;padding:12px;border-radius:10px}.stat{padding:10px 0;border-bottom:1px solid #d5cab0}.inline{display:flex;gap:10px;flex-wrap:wrap}#rotate{display:none}.ending{max-width:800px;margin:30px auto;padding:30px;background:#f9efda;color:#173f44;border-radius:20px}.ending h1{font-size:40px}@media(max-width:900px) and (orientation:landscape){header{height:52px;padding:5px 15px}header b{font-size:21px}header small{font-size:7px}#tools{gap:3px}#tools button{min-height:38px;height:38px;width:38px;padding:4px}.scene-layout{grid-template-columns:1.1fr 1fr}.scene{height:calc(100dvh - 52px);min-height:260px}.reading{padding:15px;font-size:13px}.reading h2{font-size:21px}.scene-title h1{font-size:26px}.task{padding:12px}.equation{font-size:25px}.intro{margin:15px;padding:20px}.intro h1{font-size:26px}.intro p{font-size:15px}.health,.location{bottom:8px;font-size:10px}.cover{min-height:calc(100dvh - 52px);padding:20px 5vw}.cover h1{font-size:34px}.cover p{font-size:14px}.setup{margin:12px 0}.avatar-choice img{height:55px}}@media(max-width:650px) and (orientation:portrait){#rotate:not(.dismissed){display:flex;position:fixed;inset:0;z-index:1000;background:#102e39;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px}#rotate span{font-size:85px}.scene-layout{display:block}.scene{height:50dvh;position:relative}.reading{padding:22px}header b{font-size:19px}header small{font-size:7px}#tools{gap:2px}#tools button{width:34px;padding:3px;font-size:17px}header{padding:6px 10px}.avatars{gap:5px}.avatar-choice{width:90px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
#tools svg{width:24px;height:24px;vertical-align:middle}
.ending-art{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:15px}.ending-art>img{width:100%;height:100%;object-fit:cover}.ending-art .item{left:33%;bottom:4%;height:80%;width:34%}
/* Revision: proportions, parchment materials and illustrated belongings. */
.actor.avatar{height:72%;width:52.5%;left:-5%;bottom:5%}.actor.npc.large{height:76.5%;width:58.5%;right:-7%;bottom:5%}.actor.npc.portrait{height:38%;width:32%;right:13%;top:19%;bottom:auto;filter:drop-shadow(0 8px 12px #0008)}
dialog{background:#eed9aa url('assets/ui/pergamen.webp') center/100% 100%;border:1px solid #8f693a;box-shadow:0 22px 80px #0009,inset 0 0 0 7px #b18b4a33;padding:38px;color:#45331e}dialog h2,dialog h3{color:#523b21}dialog button,dialog input,dialog select{background-color:#fff6df;border-color:#a38250}dialog::backdrop{background:#051c29c9;backdrop-filter:blur(3px)}#close{background:#d3b27a;border-radius:50%}dialog p{line-height:1.6}
.volume-control{display:block;margin:25px 0;font-size:18px}.volume-control input{display:block;width:100%;margin-top:20px;accent-color:#9c6f32;padding:0}
.castle-map{display:block;width:min(100%,620px);height:auto;margin:18px auto;border:double 5px #957042;border-radius:10px;background:radial-gradient(ellipse at center,#e6ca8b22,#84572822);filter:drop-shadow(0 5px 6px #65462344)}.map-corridor-outer{fill:none;stroke:#634b2d;stroke-width:24;stroke-linejoin:round}.map-corridor{fill:none;stroke:#d8b878;stroke-width:17;stroke-dasharray:5 1}.map-room>path{fill:#e4c889;stroke:#634a29;stroke-width:3;filter:drop-shadow(1px 3px 2px #65422e55)}.map-room.unknown>path{fill:#6b5940}.map-room .inner-wall{fill:url(#stone-hatch);stroke:#987243;stroke-width:1}.map-room.unknown .inner-wall{stroke:#3c3124}.map-room.current>path{fill:#f5d27c;stroke:#88602a;stroke-width:5}.castle-map text{text-anchor:middle;fill:#654b29;font-family:Meses}.castle-map .room-number{font-size:11px;letter-spacing:3px}.castle-map .room-name{font:10px Olvas;fill:#513e28}.castle-map .room-symbol{font-size:27px;fill:#7a673b}.castle-map .unknown-mark{fill:#b9a17b;font-size:26px}
.inventory,.quest-inventory{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:14px}.inventory figure,.quest-inventory figure{margin:0;min-width:0;background:radial-gradient(#fff7dd88,#b2965e22);border:1px solid #9b7a4544;border-radius:13px;padding:12px;text-align:center}.inventory figcaption,.quest-inventory figcaption{font-size:12px;line-height:1.5;margin-top:6px;color:#574225}.prop-picture{width:100%;height:100px;object-fit:contain;filter:drop-shadow(0 4px 3px #684b2933)}.missing-item{height:100px;display:grid;place-items:center;font:60px Meses;color:#8f7a54}.quest-inventory{grid-template-columns:repeat(3,1fr)}.missing{opacity:.6}.notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:20px}.paper-note{padding:28px 25px;min-height:170px;background:#f7e7bd url('assets/ui/pergamen.webp') center/100% 100%;filter:drop-shadow(0 4px 4px #5c421c44);transform:rotate(-.8deg);font-family:Meses}.paper-note:nth-child(even){transform:rotate(.8deg)}.paper-note small{font:9px Olvas;letter-spacing:1.7px;color:#82633e}.paper-note p{line-height:1.8;color:#553d22}
.scene-props{position:absolute;bottom:8%;left:38%;right:2%;display:flex;align-items:end;justify-content:center;gap:8px;z-index:4}.scene-prop{position:relative;flex:1;min-width:0;max-width:140px;background:none;border:0;padding:0 3px;filter:drop-shadow(0 7px 4px #0005);color:#f4dfaf;overflow:visible}.scene-prop:hover{background:#f8d99115;filter:drop-shadow(0 0 12px #ffc64c88)}.scene-prop:disabled{opacity:.75;cursor:default;filter:drop-shadow(0 7px 4px #0005)}.scene-prop img{height:115px;filter:none;pointer-events:none}.scene-prop span:not(.magic-burst){display:block;background:#1a3033dd;border:1px solid #9b8050;border-radius:7px;padding:5px 2px;font-size:10px;line-height:1.4}.scene:has(.scene-props) .npc:not(.portrait){bottom:32%;height:42%;right:0;width:35%}.choices button[data-reward]{display:flex;gap:13px;align-items:center}.prop-picture.reward-icon{width:65px;height:65px;flex-shrink:0}.scene-prop.collected>img{animation:prop-vanish .85s ease-in forwards}.scene-prop.collected>span:not(.magic-burst){animation:prop-label .7s forwards}.magic-burst{position:absolute;inset:0;display:block;pointer-events:none}.magic-burst i{position:absolute;left:50%;top:40%;font-size:23px;font-style:normal;color:#ffe5a0;filter:drop-shadow(0 0 7px #fff0a1);animation:magic-star .85s ease-out both;animation-delay:var(--delay)}@keyframes prop-vanish{0%{opacity:1;transform:scale(1)}30%{filter:brightness(2) drop-shadow(0 0 15px #ffd75a);transform:scale(1.12)}100%{opacity:0;transform:translateY(-35px) scale(.05)}}@keyframes prop-label{100%{opacity:0}}@keyframes magic-star{0%{opacity:0;transform:rotate(var(--angle)) translateX(0) scale(.1)}25%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateX(85px) scale(.15)}}
@media(max-width:900px) and (orientation:landscape){dialog{padding:26px;max-height:94dvh}.scene-prop img{height:72px}.scene-props{gap:4px;bottom:9%}.scene-prop span:not(.magic-burst){font-size:8px;padding:3px 0}.actor.npc.portrait{top:16%;right:11%;height:39%}.prop-picture.reward-icon{height:45px;width:45px}.inventory figure,.quest-inventory figure{padding:8px}.prop-picture{height:80px}}
@media(prefers-reduced-motion:reduce){.scene-prop.collected>img,.scene-prop.collected>span{animation-duration:.15s}.magic-burst{display:none}}
#notice{background:#e7cd9c url('assets/ui/pergamen.webp') center/100% 100%;color:#533b21;box-shadow:0 6px 22px #0006;border:1px solid #93703e}.intro{background:#f2dfb5 url('assets/ui/pergamen.webp') center/100% 100%;padding:40px}.intro .speech{background:#e5c98a55}@media(max-width:650px) and (orientation:portrait){#rotate:not(.dismissed){background:#e8d0a0 url('assets/ui/pergamen.webp') center/100% 100%;color:#513c25}}
/* Anchor the portrait to the actual black painting in the gallery artwork. */
.scene[data-room="2"] .backdrop{object-position:75% center}.actor.npc.portrait{opacity:0;filter:drop-shadow(0 2px 3px #0005)}