:root{--ink:#2b180d;--wine:#5e1b15;--paper:#dcc18b;--gold:#a77a37}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#100906;color:var(--ink);font-family:Georgia,"Times New Roman",serif}body{min-height:100dvh;display:grid;place-items:center;overflow:hidden}
.manuscript{position:relative;width:min(100vw,calc(100dvh * 1.5));aspect-ratio:3/2;max-height:100dvh;overflow:hidden;isolation:isolate;background-image:var(--bg);background-size:100% 100%;background-repeat:no-repeat;background-position:center;box-shadow:0 0 60px #000e}
.lyric-window{position:absolute;z-index:5;left:4.8%;top:18.5%;width:42%;height:49%;overflow:hidden;background:linear-gradient(90deg,rgba(235,215,173,.18),rgba(235,215,173,.05));-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 91%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 91%,transparent 100%)}
.lyrics{height:100%;overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain;padding:5% 4% 28% 3%;scroll-behavior:smooth}.lyrics::-webkit-scrollbar{display:none}
.cue{display:block;margin:0 0 .62em;font-size:clamp(13px,1.45vw,23px);line-height:1.23;color:rgba(48,27,14,.55);opacity:.74;text-shadow:0 1px rgba(255,241,205,.55);transition:.2s;overflow-wrap:anywhere}.cue.active{color:#53160f;opacity:1;font-weight:700;text-shadow:0 0 8px #ffe5b0;transform:translateX(.12em)}.cue.past{opacity:.28}
.player{position:absolute;z-index:8;left:5.0%;bottom:13.2%;width:41.5%;height:15.5%;display:grid;grid-template-columns:auto auto auto auto auto auto;grid-template-rows:1fr auto;grid-template-areas:"back r10 play f10 next mute" "time seek seek seek dur mute";gap:.25rem .45rem;align-items:center;padding:1.25% 2%;border:1px solid rgba(91,48,21,.72);border-radius:22px;background:linear-gradient(180deg,rgba(230,201,145,.82),rgba(186,135,73,.78));box-shadow:inset 0 1px 0 rgba(255,244,205,.7),inset 0 -5px 12px rgba(61,31,14,.2),0 3px 8px #0007;backdrop-filter:blur(1px)}
.ctrl{border:1px solid #b98741;background:radial-gradient(circle at 35% 30%,#8e3c27,#46130d 72%);color:#efd298;border-radius:50%;width:clamp(32px,3.35vw,54px);aspect-ratio:1;display:grid;place-items:center;font-weight:700;box-shadow:inset 0 0 0 1px #2d0e08,0 2px 4px #0007;touch-action:manipulation}.ctrl.play{grid-area:play;width:clamp(38px,4vw,64px);font-size:1.05em}.back{grid-area:back}.r10{grid-area:r10}.f10{grid-area:f10}.next{grid-area:next}.mute{grid-area:mute}.time{grid-area:time;font-size:clamp(8px,.9vw,13px);font-weight:700;text-align:right}.dur{grid-area:dur;font-size:clamp(8px,.9vw,13px);font-weight:700}.seek{grid-area:seek;width:100%;appearance:none;background:transparent}.seek::-webkit-slider-runnable-track{height:5px;border-radius:10px;background:linear-gradient(to right,var(--wine) 0 var(--progress,0%),#6b4a2d var(--progress,0%) 100%);box-shadow:inset 0 1px 2px #0007}.seek::-webkit-slider-thumb{appearance:none;width:16px;height:16px;margin-top:-5.5px;border-radius:50%;background:#d7aa60;border:1px solid #5b3318;box-shadow:0 1px 3px #0007}
.nav{position:absolute;z-index:8;bottom:3.2%;height:4.8%;display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;color:#2b180d;font-weight:700;font-size:clamp(8px,.9vw,13px);padding:.2rem .5rem;border:1px solid rgba(116,80,43,.7);border-radius:10px;background:rgba(222,190,131,.72);box-shadow:inset 0 1px 0 #fff0be,0 2px 4px #0004}.nav.prev{left:5%;width:19.2%}.nav.next-song{left:27.2%;width:19.2%}.status{position:absolute;z-index:9;left:17%;width:18%;bottom:10.1%;text-align:center;font-size:clamp(7px,.7vw,10px);color:#3a241899;pointer-events:none}.imprint{position:absolute;z-index:7;right:3%;bottom:1.15%;width:38%;text-align:center;font-size:clamp(6px,.65vw,10px);color:#3b2418;font-variant:small-caps;letter-spacing:.04em}.home{position:absolute;z-index:10;right:2.1%;top:2.1%;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;text-decoration:none;color:#ecd092;background:#4e1b13c7;border:1px solid #aa7d38;font-size:17px;box-shadow:0 2px 5px #0008}
.rotate-gate{display:none}
.index-body{display:block;overflow:auto}.index{width:min(100%,1180px);min-height:100vh;margin:auto;padding:32px 18px 44px;color:#ead3a0;background:radial-gradient(circle at top,#3a2415,#130b07 64%)}.index h1{text-align:center;font-weight:400;font-size:clamp(34px,6vw,62px);margin:.2em 0 .1em}.subtitle,.credit{text-align:center;color:#c9aa70}.song-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:28px}.song-grid a{display:block;position:relative;overflow:hidden;border:1px solid #9d7438;background:#24130d;color:#f0d69c;text-decoration:none;box-shadow:0 7px 18px #0008}.song-grid img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;opacity:.9}.song-grid span{display:block;padding:12px;text-align:center;font-variant:small-caps;letter-spacing:.03em}.credit{margin-top:34px}
:focus-visible{outline:3px solid #fff0a6;outline-offset:2px}
@media (max-width:1000px) and (orientation:landscape){body{overflow:hidden}.manuscript{width:min(100vw,calc(100dvh * 1.5));height:min(100dvh,calc(100vw / 1.5));max-height:none}.lyric-window{left:4.7%;top:18%;width:42.3%;height:48.5%}.lyrics{padding:4% 3% 28% 2%}.cue{font-size:clamp(11px,2.0vw,16px);line-height:1.18;margin-bottom:.5em}.player{left:4.9%;bottom:13.4%;width:41.7%;height:17.5%;padding:.7% 1.4%;gap:.08rem .18rem}.ctrl{width:clamp(28px,4.7vw,40px);font-size:.7rem}.ctrl.play{width:clamp(34px,5.6vw,48px)}.nav{bottom:3%;height:5%;font-size:clamp(7px,1.25vw,10px)}.status{bottom:10.2%}.home{width:30px;height:30px;font-size:15px}.fullscreen{right:6.4%;width:30px;height:30px;font-size:15px}.imprint{font-size:6px}}
@media (max-width:1200px){body.portrait-phone{overflow:hidden;background:#120b06}body.portrait-phone .manuscript{visibility:hidden}body.portrait-phone .rotate-gate{position:fixed;z-index:9999;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;padding:8vh 2rem 5vh;text-align:center;color:#3d210f;background:radial-gradient(ellipse at center,rgba(255,239,196,.46),transparent 47%),linear-gradient(rgba(223,194,137,.9),rgba(188,139,75,.94)),repeating-linear-gradient(90deg,rgba(86,48,22,.035) 0 1px,transparent 1px 4px);overflow:hidden}.rotate-gate::before{content:"";position:absolute;inset:12px;border:1px solid rgba(71,35,14,.86);box-shadow:inset 0 0 0 4px rgba(226,190,117,.45),inset 0 0 0 7px rgba(73,39,17,.38),inset 0 0 42px rgba(66,31,12,.32),0 0 24px #0008;pointer-events:none}.rotate-gate::after{content:"❦";position:absolute;z-index:0;top:2.2vh;left:50%;transform:translateX(-50%);font-size:clamp(34px,12vw,58px);color:#663818;text-shadow:0 1px #f0d9a0,0 2px 6px #0004}.rotate-crest{position:relative;z-index:1;width:min(31vw,132px);height:auto;margin:0 0 .15rem;opacity:.62;mix-blend-mode:multiply;filter:sepia(1) saturate(.55) contrast(1.05) brightness(.8)}.rotate-phone{position:relative;z-index:1;width:54px;height:92px;border:3px solid #532a15;border-radius:11px;box-shadow:inset 0 0 0 2px rgba(255,232,177,.35),0 3px 8px #0004;animation:turn-phone 1.9s ease-in-out infinite}.rotate-phone::before{content:"";position:absolute;inset:7px 5px 13px;border:1px solid rgba(83,42,21,.55);background:linear-gradient(145deg,rgba(112,60,29,.16),rgba(255,229,166,.08))}.rotate-phone span{position:absolute;left:50%;bottom:5px;width:7px;height:7px;border:1.5px solid #532a15;border-radius:50%;transform:translateX(-50%)}.rotate-gate h2,.rotate-gate p,.rotate-kicker{position:relative;z-index:1;margin:0;text-shadow:0 1px rgba(255,238,194,.9)}.rotate-kicker{font-size:clamp(12px,3.6vw,16px);letter-spacing:.18em;text-transform:uppercase;color:#6d4725}.rotate-gate h2{font-size:clamp(30px,9vw,46px);font-variant:small-caps;letter-spacing:.045em;color:#5b1712}.rotate-gate p{font-size:clamp(15px,4.2vw,19px);max-width:22rem;line-height:1.3;color:#51321c}.rotate-gate p::after{content:"";display:block;width:min(48vw,190px);height:1px;margin:.8rem auto 0;background:linear-gradient(90deg,transparent,#6a3b1d,transparent)}@keyframes turn-phone{0%,20%{transform:rotate(0)}58%,82%{transform:rotate(90deg)}100%{transform:rotate(0)}}}
@media(prefers-reduced-motion:reduce){.lyrics{scroll-behavior:auto}.cue{transition:none}.rotate-phone{animation:none;transform:rotate(90deg)}}

.fullscreen{position:absolute;z-index:11;right:6.1%;top:2.1%;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#ecd092;background:#4e1b13d9;border:1px solid #aa7d38;font-size:17px;line-height:1;box-shadow:0 2px 5px #0008;cursor:pointer}.fullscreen.active{background:#2f100bd9}.fullscreen-note{position:absolute;z-index:12;right:2%;top:7.2%;padding:.28rem .5rem;border-radius:8px;color:#ecd092;background:#251008cf;border:1px solid #8b6733;font-size:clamp(7px,.72vw,10px);opacity:0;pointer-events:none;transition:opacity .2s}.fullscreen-note.show{opacity:1}
:fullscreen body,:fullscreen .manuscript{background:#100906}.manuscript:fullscreen{width:min(100vw,calc(100dvh * 1.5));height:min(100dvh,calc(100vw / 1.5));max-height:none;margin:auto;box-shadow:none}
@media (display-mode:fullscreen),(display-mode:standalone){body{background:#100906}.fullscreen{display:none}}

/* V10 — frontispiece, gallery, robust portrait gate, wake-lock diagnostic */
.wake-state{position:absolute;z-index:13;right:2.2%;bottom:6.4%;padding:.22rem .45rem;border:1px solid rgba(84,52,26,.5);border-radius:8px;background:rgba(236,210,156,.55);color:#4e2b18;font-size:clamp(6px,.64vw,9px);opacity:.72;pointer-events:none}
.portal-body{display:grid;place-items:center;overflow:auto;background:#0d0805}.frontispiece{position:relative;width:min(100vw,calc(100dvh * 1.5));aspect-ratio:3/2;max-height:100dvh;overflow:hidden;box-shadow:0 0 60px #000f;background:#cfae73}.frontispiece-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.title-replate{position:absolute;z-index:2;left:24%;top:4.8%;width:52%;height:17%;border-radius:42%;background:radial-gradient(ellipse at center,#dec18a 0%,#d7b77b 58%,rgba(202,161,96,.35) 80%,transparent 100%);filter:sepia(.25);box-shadow:0 0 18px rgba(202,161,96,.8)}.front-title{position:absolute;z-index:3;left:21%;top:5.2%;width:58%;text-align:center;color:#482811;text-shadow:0 1px rgba(255,236,190,.65)}.front-kicker{font-size:clamp(9px,1vw,16px);letter-spacing:.23em;text-transform:uppercase}.front-title h1{margin:.08em 0 0;font-weight:500;font-size:clamp(27px,4.3vw,68px);line-height:.84;font-variant:small-caps;letter-spacing:.025em}.front-rule{font-size:clamp(14px,1.6vw,25px);line-height:1}.front-title p{margin:.05em 0 0;font-size:clamp(8px,.9vw,15px);font-style:italic}.front-nav{position:absolute;z-index:4;left:5.2%;bottom:13%;width:39%;display:flex;gap:2.2%;justify-content:center}.front-nav a,.gallery-footer a,.gallery-home{color:#3a1e0e;text-decoration:none;border:1px solid rgba(82,46,20,.7);background:rgba(218,181,114,.8);box-shadow:inset 0 1px rgba(255,242,207,.6),0 2px 6px #0005;border-radius:10px;padding:.55rem 1rem;font-variant:small-caps;font-weight:700}.front-credit{position:absolute;z-index:4;left:4.8%;bottom:4.7%;width:42%;text-align:center;color:#3c2618;font-size:clamp(7px,.72vw,11px);font-variant:small-caps;letter-spacing:.04em}
.gallery-body{display:block;overflow:auto;background:#100906;color:#ead4a5}.gallery-page{width:min(1180px,100%);min-height:100vh;margin:auto;padding:28px 18px 50px;background:radial-gradient(circle at top,#3d2818,#140c08 58%)}.gallery-head{text-align:center;padding:10px 0 22px}.gallery-home{float:left;font-size:13px}.gallery-kicker{clear:both;margin:12px 0 0;color:#b99358;letter-spacing:.18em;text-transform:uppercase;font-size:12px}.gallery-head h1{font-size:clamp(40px,7vw,76px);font-weight:400;margin:.08em 0;color:#ecd29b}.gallery-head>p:last-child,.section-note{color:#c9aa75}.gallery-section{margin:18px 0 42px}.gallery-section h2{text-align:center;font-variant:small-caps;font-size:clamp(26px,4vw,42px);font-weight:400;color:#e8ca90}.section-note{text-align:center;margin:-12px auto 20px;max-width:680px}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}.gallery-grid figure{margin:0;border:1px solid #8c6533;background:#22140d;box-shadow:0 8px 20px #0009;overflow:hidden}.gallery-grid img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;background:#c6a56b}.character-gallery img{object-fit:contain;background:#d0b178}.gallery-grid figcaption{padding:12px 14px 14px;color:#e9d09c}.gallery-grid figcaption b{display:block;font-variant:small-caps;letter-spacing:.04em}.gallery-grid figcaption span{display:block;margin-top:4px;color:#bda273;font-size:13px}.gallery-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #6f4a27;padding-top:22px;color:#a98b5b;font-size:12px}
@media(max-width:720px){.frontispiece{width:100vw;height:100dvh;aspect-ratio:auto}.frontispiece-art{object-fit:cover;object-position:center}.title-replate{left:8%;width:84%}.front-title{left:8%;width:84%}.front-title h1{font-size:clamp(30px,9vw,54px)}.front-nav{left:7%;width:86%;bottom:14%;flex-wrap:wrap}.front-credit{left:8%;width:84%;bottom:5%}.gallery-grid{grid-template-columns:1fr}.gallery-footer{flex-direction:column}.gallery-home{float:none;display:inline-block}}
.gallery-link{position:absolute;z-index:10;right:10.1%;top:2.1%;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;text-decoration:none;color:#ecd092;background:#4e1b13c7;border:1px solid #aa7d38;font-size:17px;box-shadow:0 2px 5px #0008}@media(max-width:1000px) and (orientation:landscape){.gallery-link{right:10.5%;width:30px;height:30px;font-size:14px}}