:root{color-scheme:dark;font-family:system-ui,"Microsoft JhengHei",sans-serif;color:#e9dfcb;background:#141918}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}main{max-width:1180px;margin:28px auto;padding:0 20px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}h1{font-family:serif;font-size:29px;letter-spacing:7px;margin:0 0 5px}header p{margin:0;color:#c0b49e;font-size:14px}nav{display:flex;gap:7px;flex-wrap:wrap}button{font:inherit;font-size:14px;border:1px solid #74654f;background:#282c29;color:#e9dfcb;border-radius:3px;padding:9px 13px;cursor:pointer}button:hover{background:#414337}button:focus-visible{outline:2px solid #efc47e;outline-offset:3px}button:disabled{opacity:.4;cursor:default}#viewport{position:relative;margin:auto;background:#111714;overflow:hidden;border:1px solid #685d48;box-shadow:0 20px 55px #0005;isolation:isolate}canvas{display:block;width:100%;height:auto;image-rendering:pixelated;outline:none}.hud{position:absolute;top:15px;left:18px;right:18px;display:flex;gap:20px;font-size:14px;text-shadow:0 2px 3px #000;pointer-events:none}.hud span{padding:6px 10px;background:#131b18d9;border:1px solid #7b705744}#place{margin-right:auto}#prompt{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);padding:10px 18px;background:#171e1bec;border:1px solid #9a8966;white-space:nowrap;font-size:15px}#toast{position:absolute;top:66px;left:50%;transform:translateX(-50%);padding:10px 20px;background:#202820ef;border:1px solid #74654f;max-width:88%;text-align:center;font-size:14px}#world-labels{position:absolute;inset:0;pointer-events:none}.world-label{position:absolute;transform:translate(-50%,-100%);font-size:14px;text-shadow:0 1px 2px #000,0 0 4px #000;white-space:nowrap}.world-label.damage{color:#ffd596;font-weight:700}#dialogue{position:absolute;bottom:18px;left:18px;right:18px;display:flex;gap:24px;align-items:end;z-index:10;padding:20px;background:#171c1cf7;border:2px solid #a38c67;box-shadow:0 0 0 3px #151b18}.portrait-frame{width:144px;flex-shrink:0;align-self:stretch;display:flex;align-items:end}.portrait-frame img{width:144px;height:144px;image-rendering:pixelated;object-fit:contain}.speech{flex:1}.speech h2{font-size:18px;color:#e5c591;margin:0}.speech p{font-size:17px;line-height:1.85;margin:12px 0;min-height:60px}.speech button{float:right}#modal{position:absolute;inset:0;background:#080e0c9c;display:grid;place-items:center;z-index:12;padding:15px}.panel{background:#1d2522;border:2px solid #9a8966;box-shadow:0 10px 50px #0009;width:min(680px,100%);max-height:100%;overflow:auto;padding:20px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel h2{font-size:20px;margin:0 0 12px}.panel-head button{padding:4px 12px}.panel p{line-height:1.8;font-size:15px}.panel small{color:#b5b7a7}.panel button{margin:5px}#panel-back{display:block;margin:18px 0 0 auto}.goods{display:flex;align-items:center;gap:12px;border-bottom:1px solid #635c48;padding:12px 0}.goods img,.item-icon{width:48px;height:48px;object-fit:contain;image-rendering:pixelated}.goods span{flex:1}.actions{display:flex;flex-wrap:wrap;gap:7px}.scale-preview{display:block;width:100%;height:auto;image-rendering:pixelated;background:#151d19;border:1px solid #5f614e}.weight-row{display:flex;gap:12px;align-items:center;margin:12px 0;padding:10px;background:#151d1980}.weight-row .details{flex:1}.inventory-row{display:flex;align-items:center;gap:10px}#boss-hud{position:absolute;left:22%;right:22%;top:66px;text-align:center;color:#f1d5b6;font-size:14px;text-shadow:0 2px #000}#boss-hud>div{height:8px;background:#1a1715;border:1px solid #ac8b70;margin-top:7px}#boss-health{display:block;height:100%;background:#b05243;width:100%;transition:width .1s}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#131c17;z-index:30}#fade{position:absolute;inset:0;background:#101713;pointer-events:none;z-index:20;animation:fade-out .65s forwards}@keyframes fade-out{from{opacity:1}to{opacity:0}}footer{display:flex;justify-content:space-between;gap:16px;color:#a7ab9d;font-size:11px;margin:13px 0 24px}#viewport:fullscreen{border:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:#101512}#viewport:fullscreen canvas{width:auto;height:auto;max-width:100vw;max-height:100vh;aspect-ratio:16/9}#viewport:fullscreen #dialogue{left:5%;right:5%;bottom:4%}#viewport:fullscreen .panel{max-height:85vh}@media(max-width:700px){main{padding:0 8px;margin:12px auto}header{flex-wrap:wrap}nav button{padding:6px 8px}.hud{font-size:11px;top:6px;left:6px;right:6px;gap:6px}.hud span{padding:3px 5px}#dialogue{padding:10px;gap:10px;bottom:8px;left:8px;right:8px}.portrait-frame{width:80px}.portrait-frame img{width:80px;height:80px}.speech p{font-size:14px;line-height:1.55;min-height:45px;margin:5px 0}footer{display:none}.panel{padding:12px}.panel h2{font-size:17px}#prompt{font-size:12px;padding:5px 10px;bottom:8px}}

#fullscreen-exit{display:none}#viewport:fullscreen #fullscreen-exit{display:block;position:absolute;z-index:5;right:18px;bottom:18px}#viewport:fullscreen canvas{max-width:none;max-height:none;flex-shrink:0}

#bag-button{display:flex;align-items:center;gap:6px}#bag-button img,#coins img{width:24px;height:24px;image-rendering:pixelated;vertical-align:middle}#coins{display:flex;align-items:center;gap:6px}#coins b{font-weight:400}.world-map{width:100%;height:auto;image-rendering:auto;border:1px solid #6c7458}

#boss-hud .boss-track{position:relative;height:auto;background:none;border:0;aspect-ratio:1846/98}#boss-hud .boss-track>img{display:block;width:100%;height:100%}#boss-health{position:absolute;left:2.33%;top:35.71%;width:95.34%;height:28.57%;background:none;overflow:hidden}#boss-health img{display:block;width:100%;height:100%}

/* The game is the page; menus and status belong to its viewport. */
body{min-height:100dvh;display:grid;place-items:center;background:#0d1210}
main{width:min(100vw,177.7778dvh);max-width:none;margin:0;padding:0}
#viewport{width:100%;border:0;box-shadow:none}
.game-controls{position:absolute;right:14px;bottom:34px;z-index:6;display:flex;gap:5px;flex-wrap:nowrap;padding:6px;background:#121a17e8;border:1px solid #71634c;border-radius:4px}
.game-controls button{padding:7px 9px;background:#262e26;font-size:12px;white-space:nowrap}
#bag-button img{width:30px;height:30px}#bag-button{padding:3px 10px}
.objective{position:absolute;top:60px;left:18px;max-width:58%;margin:0;padding:5px 9px;background:#111914d9;color:#e1d6bf;font-size:12px;line-height:1.6;pointer-events:none}
.game-help{position:absolute;bottom:0;left:0;right:0;margin:0;padding:7px 12px;background:#101713e8;font-size:10px;pointer-events:none}
#prompt{bottom:98px;z-index:5}#toast{top:104px;z-index:11}
#viewport:has(#dialogue:not([hidden])) .game-controls,#viewport:has(#dialogue:not([hidden])) .game-help{visibility:hidden}
.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.shop-grid .goods{border:1px solid #665b44;background:#151d18;padding:10px;flex-wrap:wrap;gap:8px}.shop-grid .goods span{min-width:90px;font-size:14px}.shop-grid .goods small{display:block;font-size:11px;line-height:1.6}.shop-grid .goods button{margin:0 0 0 auto;padding:6px 10px;font-size:12px}.shop-grid .goods img{width:44px;height:44px}
#viewport:fullscreen .game-controls{bottom:36px}#viewport:fullscreen #fullscreen-exit{display:none}
@media(max-width:700px){main{margin:0;padding:0}.game-controls{right:6px;bottom:7px;padding:3px;gap:3px}.game-controls button{padding:5px;font-size:10px}#bag-button img{width:22px;height:22px}#bag-button{padding:1px 6px}.objective{top:37px;left:6px;font-size:10px;max-width:70%;padding:2px 5px}#prompt{bottom:54px}#toast{top:68px}.shop-grid{gap:5px}.shop-grid .goods{padding:6px}.shop-grid .goods img{width:32px;height:32px}}

#buff-status{position:absolute;top:61px;right:18px;max-width:40%;text-align:right;font-size:12px;line-height:1.8;color:#e8ce90;text-shadow:0 1px 3px #000;pointer-events:none}#buff-status:not(:empty){padding:4px 8px;background:#152019e8;border:1px solid #71634c}@media(max-width:700px){#buff-status{top:69px;right:6px;font-size:10px;max-width:50%}}

#modal:has(.mechanism-panel){place-items:center end;background:transparent;padding:12px;pointer-events:none}.mechanism-panel{width:min(330px,44%);max-height:80%;padding:14px;background:#19231ef5;pointer-events:auto}.mechanism-panel p{font-size:13px;line-height:1.65}.mechanism-panel h2{font-size:17px}.mechanism-group h3{font-size:13px;margin:10px 0 5px;color:#d9c296}.mechanism-items{display:flex;flex-wrap:wrap;gap:5px}.mechanism-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px!important;margin:0!important;min-width:68px;font-size:12px}.mechanism-item img{width:36px;height:36px;object-fit:contain;image-rendering:pixelated}.mechanism-item small{font-size:10px}.mechanism-status{color:#e8c68c}@media(max-width:700px){.mechanism-panel{width:46%;padding:8px;max-height:90%}.mechanism-panel p{font-size:10px}.mechanism-panel h2{font-size:13px}.mechanism-item{min-width:50px;font-size:10px}.mechanism-item img{width:26px;height:26px}.mechanism-group h3{margin:5px 0;font-size:11px}.mechanism-panel #panel-back{margin-top:7px;padding:5px}}

#modal.mechanism-left{place-items:center start}

.map-shell{position:relative}.map-label{position:absolute;transform:translate(-50%,-100%);font-size:11px;color:#f5e0af;text-shadow:0 1px 3px #000,0 0 3px #000;white-space:nowrap;pointer-events:none}

@media(min-width:701px){.objective{max-width:54%}}

#bridge-back{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:13;padding:7px 14px;font-size:13px;background:#242e23f5}@media(max-width:700px){#bridge-back{top:5px;padding:4px 8px;font-size:10px}}

#challenge-back{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:13;padding:7px 14px;font-size:13px}#boss-hud{top:87px;z-index:5}#viewport.in-challenge #toast{top:145px}@media(max-width:700px){#challenge-back{top:5px;padding:4px 8px;font-size:10px}#boss-hud{top:85px}}

.volume-row{display:flex;align-items:center;gap:16px;margin:20px 0}.volume-row input{flex:1;min-width:60px;accent-color:#c9a76c}.volume-row output{width:48px;text-align:right}#panel-body>a{display:inline-block;color:#e0bd83;margin:4px 12px 8px 0}

:root{--duel-font:"DFKai-SB","標楷體","BiauKai","KaiTi",serif}
#boss-intro{position:absolute;inset:0;z-index:9;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;background:linear-gradient(0deg,#080c0b99,transparent 34%,transparent 70%,#080c0b88);color:#f2d9b0;text-shadow:0 3px 5px #000}
#boss-intro p{font-size:16px;letter-spacing:.6em;margin:0 0 14px;color:#bbaa8f}#boss-intro h2{font-family:var(--duel-font);font-weight:400;font-size:clamp(30px,5vw,62px);letter-spacing:.16em;margin:0;border-top:1px solid #c3a06a77;border-bottom:1px solid #c3a06a77;padding:14px 24px}#boss-intro span{font-size:11px;color:#b8ad9b;margin-top:20px}
#combat-flash{position:absolute;inset:0;pointer-events:none;z-index:6}
#boss-hud{left:23%;right:23%;top:65px;text-align:left}.boss-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#c6ab82;letter-spacing:.15em;margin-bottom:4px}#boss-name{font-family:var(--duel-font);font-size:29px;color:#f0d6a8;letter-spacing:.12em}#boss-hp{float:right;font-size:11px;color:#baaa92;margin-top:15px;font-variant-numeric:tabular-nums}#boss-hud .boss-track{margin-top:0}
#boss-trail{position:absolute;left:2.33%;top:35.71%;height:28.57%;width:95.34%;background:#d0ad69;opacity:.8}
#viewport.in-challenge #objective,#viewport.in-challenge #map-button,#viewport.in-challenge #journal-button,#viewport.in-challenge #place,#viewport.in-challenge #coins{display:none}#viewport.in-challenge #toast{top:150px}#viewport.in-challenge #challenge-back{left:auto;right:18px;transform:none}
.victory-panel{text-align:center;border-color:#b39460;background:linear-gradient(#20251ff5,#131c18f5)}.victory-panel #panel-title{font-family:var(--duel-font);font-weight:400;font-size:34px;letter-spacing:.13em}.victory-panel #panel-back{display:none}.duel-result{font-family:var(--duel-font);font-size:26px!important;letter-spacing:.4em;color:#cdaa73}
#boss-phase{color:#e2a778}.world-label.parry{color:#f8e4b5;font-family:var(--duel-font);font-size:24px}.world-label.damage{font-family:system-ui,"Microsoft JhengHei",sans-serif}
@media(max-width:700px){#boss-hud{left:20%;right:20%;top:40px}#boss-name{font-size:21px}#boss-hp{font-size:10px;margin-top:8px}.boss-heading{font-size:9px}#viewport.in-challenge #challenge-back{right:5px}#viewport.in-challenge #toast{top:110px}#boss-intro h2{font-size:32px}}

#boss-hud .boss-heading{height:auto;background:none;border:0;margin:0 0 4px}

#viewport.in-challenge::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 50% 65%,transparent 42%,#080d0a55 100%)}#world-labels{z-index:4}

/* The epithet and proper name form one equally weighted boss identity. */
#boss-intro p,#boss-intro h2{font-family:var(--duel-font);font-weight:400;font-size:clamp(30px,5vw,62px);letter-spacing:.16em;color:#f2d9b0}
#boss-intro p{margin:0 0 8px;text-align:center}
#boss-title,#boss-name{font-family:var(--duel-font);font-weight:400;font-size:29px;letter-spacing:.12em;color:#f0d6a8}
@media(max-width:700px){#boss-intro p,#boss-intro h2{font-size:32px}#boss-title,#boss-name{font-size:21px}}

#boss-intro{text-align:center}
#boss-hud{text-align:center}
#boss-hud .boss-heading{justify-content:center}
#boss-title,#boss-name{display:block;width:100%;text-align:center}
#boss-phase{position:absolute;right:0;top:100%;margin-top:5px}
#boss-hp{position:absolute;right:0;top:51px;float:none;margin:0}
@media(max-width:700px){#boss-hp{top:35px}}

#guard-hud{position:absolute;left:20px;top:60px;z-index:5;width:112px;font-size:11px;color:#c3b697}#guard-hud>div{height:4px;background:#272723;margin-top:5px}#guard-fill{display:block;height:100%;background:#c4a66d;transition:width .12s}#viewport.in-challenge #guard-hud{top:58px}@media(max-width:700px){#guard-hud{left:9px;width:76px;font-size:10px}#viewport.in-challenge #guard-hud{top:38px}}

/* Full legendary names read as a single centered identity. */
#boss-epithet,#boss-title{display:none}
#boss-hud .boss-heading{height:0;margin:0}
#boss-name{font-size:clamp(18px,2.5vw,28px);letter-spacing:.06em;white-space:normal;line-height:1.35}
#boss-hp{position:static;display:block;margin:2px 0 0;text-align:right}
#boss-intro h2{font-size:clamp(26px,4vw,46px);letter-spacing:.08em;white-space:normal;max-width:92%;text-wrap:balance}
@media(max-width:700px){#boss-hud{left:15%;right:15%}#boss-name{font-size:18px}#boss-intro h2{font-size:clamp(24px,5vw,32px)}}

/* Player vitals use a compact, readable panel rather than the ornate boss frame. */
#player-hud{position:absolute;left:18px;top:16px;width:210px;z-index:5;padding:10px 12px;background:#111a17e8;border:1px solid #827052;border-radius:3px;pointer-events:none;color:#eee0c9;text-shadow:0 1px 2px #000;font-size:16px;line-height:1.4}
.player-stat-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
#hp,#guard-value{font-size:14px;font-variant-numeric:tabular-nums;color:#dfd2bc;white-space:nowrap}
#player-health-track,#guard-track{height:12px;background:#292823;border:1px solid #75634d;overflow:hidden}
#player-health-fill,#guard-fill{display:block;height:100%;width:100%;transition:width .12s}
#player-health-fill{background:#b7463b}#player-hud.is-low #player-health-fill{background:#e45b48}
#player-hud #guard-hud,#viewport.in-challenge #player-hud #guard-hud{position:static;width:auto;padding-top:10px;font-size:16px;color:#e2ca9a}
#guard-hud>.player-stat-header{height:auto;background:none;margin-top:0}#guard-hud>#guard-track{height:12px;margin-top:0}
#guard-fill{background:#d0b16e}
.hud{left:248px;z-index:5}.objective{left:248px;top:65px;max-width:calc(100% - 270px)}
@media(max-width:700px){#player-hud{left:8px;top:8px;width:148px;padding:8px;font-size:14px}.player-stat-header{gap:4px;margin-bottom:4px}#hp,#guard-value{font-size:12px}#player-hud #guard-hud,#viewport.in-challenge #player-hud #guard-hud{font-size:14px;padding-top:8px}#player-health-track,#guard-track,#guard-hud>#guard-track{height:10px}.hud{left:176px;right:8px;top:8px}.objective{left:176px;top:44px;max-width:calc(100% - 184px)}#boss-hud{left:176px;right:8px;top:42px}#boss-name{font-size:16px}#boss-hp{font-size:10px}}

#boss-bars{float:left;color:#e7be7d;font-size:12px;letter-spacing:.08em;line-height:18px}#boss-hud .boss-track{clear:both}
@media(max-width:700px){#boss-bars{font-size:10px;letter-spacing:0}}



.in-memory .game-controls,.in-memory .hud,.in-memory #objective,.in-memory #buff-status{display:none}.in-memory #bridge-back{z-index:25}.in-memory canvas{filter:sepia(.22) saturate(.65)}

#memory-transition{position:absolute;inset:0;z-index:40;background:#101512;display:grid;place-items:center;pointer-events:auto}#memory-transition p{font-family:var(--duel-font);font-size:clamp(18px,3vw,28px);letter-spacing:.18em;color:#dfd1b4;text-align:center;padding:20px}

/* Readable shop cards: keep the frame controls fixed and scroll the goods. */
.shop-panel{width:min(940px,100%);max-height:100%;display:flex;flex-direction:column;overflow:hidden;padding:22px;gap:10px}.shop-panel .panel-head{flex-shrink:0}.shop-panel h2{font-size:26px;margin:0}.shop-panel #panel-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding-right:10px;scrollbar-color:#a38c67 #151d18}.shop-panel #panel-body>p:first-child{position:sticky;top:0;z-index:1;background:#1d2522;margin:0;padding:10px 0 16px;font-size:18px}.shop-panel #panel-back{flex-shrink:0;align-self:flex-end;margin:4px 0 0;font-size:17px}.shop-panel .shop-grid{gap:16px;padding-bottom:8px}.shop-panel .goods{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px 16px;padding:18px;align-items:center;min-height:184px}.shop-panel .goods img{width:88px;height:88px;grid-row:1 / span 2;object-fit:contain;image-rendering:pixelated}.shop-panel .goods span{min-width:0;font-size:22px;line-height:1.5;overflow-wrap:anywhere}.shop-panel .goods small{font-size:16px;line-height:1.65;margin-top:5px;color:#d4d2c0}.shop-panel .goods small+small{font-size:15px;color:#b8b9a6}.shop-panel .goods button{grid-column:2;justify-self:start;margin:2px 0 0;padding:10px 16px;font-size:17px;min-height:44px}
@media(max-width:800px){.shop-panel{padding:14px;gap:8px}.shop-panel .shop-grid{grid-template-columns:1fr}.shop-panel .goods{min-height:160px}.shop-panel .goods span{font-size:20px}.shop-panel h2{font-size:23px}.shop-panel #panel-body>p:first-child{font-size:16px}}@media(max-width:420px){.shop-panel .goods{grid-template-columns:72px minmax(0,1fr);padding:12px;gap:8px 12px}.shop-panel .goods img{width:72px;height:72px}.shop-panel .goods small{font-size:15px}.shop-panel .goods small+small{font-size:14px}}

.shop-balance{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.currency-amount{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.currency-amount b{font-weight:500}.shop-panel .goods button .currency-amount{font-size:17px;min-width:0;flex:none}.shop-panel .currency-icon,.shop-panel .goods button .currency-icon{width:26px;height:26px;object-fit:contain;image-rendering:pixelated;grid-row:auto;flex-shrink:0}.shop-panel .goods button{display:inline-flex;align-items:center;justify-content:center;min-width:88px}

/* The title belongs to the game viewport; no separate site navigation. */
#title-screen{position:absolute;inset:0;z-index:15;overflow:auto;background:linear-gradient(90deg,#0c1413f5 0%,#0c1413dc 38%,#0c14137a 72%,#0c1413b8),url('assets/title-scene.png') center/cover;display:flex;align-items:center;padding:clamp(24px,5vw,64px);isolation:isolate}#title-screen:before{content:'';position:absolute;inset:18px;border:1px solid #a68a543b;pointer-events:none}.title-content{position:relative;z-index:1;max-width:540px}.title-chapter{color:#c5b186;letter-spacing:.3em;font-size:14px;margin:0 0 10px}#title-screen h1{font-family:var(--duel-font);font-size:clamp(58px,7vw,96px);font-weight:400;letter-spacing:.22em;margin:0 0 16px;color:#f3e6c9;text-shadow:0 4px 24px #0009}.title-lead{font-size:18px;letter-spacing:.12em;color:#cbc7b2;line-height:1.8;margin:0 0 30px}.title-actions{display:flex;flex-direction:column;gap:10px;width:260px;max-width:100%}.title-actions button{font-size:20px;padding:13px 22px;text-align:left;border-color:#9a8054;background:#14201edb;letter-spacing:.12em}.title-actions button:not(:disabled):hover{background:#445044;border-color:#e1c18d}.title-actions button:disabled{display:none}.title-actions button:first-child:not(:disabled),.title-actions button:only-child{color:#f0d9ae}.title-save-note{font-size:13px;color:#aeb6a5;margin:12px 0 20px;line-height:1.7}.title-links{display:flex;gap:8px;flex-wrap:wrap}.title-links button{border:0;border-bottom:1px solid #89765777;background:transparent;padding:7px 0;margin-right:18px;border-radius:0;font-size:14px;color:#c4c5b5}.title-links button:hover{color:#f1d5a3}.title-device{color:#899789;font-size:12px;margin-top:22px;letter-spacing:.08em}.title-figure{position:absolute;right:8%;bottom:22%;width:28%;max-width:330px;opacity:.9;pointer-events:none}.title-figure canvas{width:100%;height:auto;filter:drop-shadow(0 18px 16px #0009)}#viewport:has(#title-screen:not([hidden])){min-height:min(640px,90svh)}#viewport:has(#title-screen:not([hidden]))>.hud,#viewport:has(#title-screen:not([hidden]))>#player-hud,#viewport:has(#title-screen:not([hidden]))>.game-controls,#viewport:has(#title-screen:not([hidden]))>#objective,#viewport:has(#title-screen:not([hidden]))>#boss-hud,#viewport:has(#title-screen:not([hidden]))>#bridge-back,#viewport:has(#title-screen:not([hidden]))>#challenge-back,#viewport:has(#title-screen:not([hidden]))>#world-labels,#viewport:has(#title-screen:not([hidden]))>#buff-status{visibility:hidden}#viewport:has(#title-screen:not([hidden]))>#modal{z-index:25}#viewport:has(#title-screen:not([hidden])) #modal a{display:block;margin:12px 0;color:#e4c68d}#viewport:fullscreen #title-screen{padding-left:10%}#title-screen button:focus-visible{outline-offset:5px}@media(max-width:650px){#title-screen{padding:30px 24px}.title-figure{right:1%;width:36%;bottom:28%;opacity:.45}.title-content{max-width:100%}.title-lead{font-size:16px;margin-bottom:22px}.title-actions{width:230px}.title-actions button{font-size:18px}.title-chapter{font-size:12px}.title-links button{font-size:13px;margin-right:10px}.title-device{font-size:11px}}@media(prefers-reduced-motion:reduce){#title-screen *{animation:none!important}}

/* Portrait cover: original transparent character art, layered with CSS only. */
#title-screen{background:linear-gradient(90deg,#080f13f5 0%,#0c1719ee 36%,#10191c9c 70%,#13191dd9),url('assets/title-scene.png') center/cover}
#title-screen:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 78% 42%,#ac764a25,transparent 52%),linear-gradient(0deg,#080f13 0%,transparent 42%)}
.title-content{max-width:46%;z-index:2}.title-wordmark{display:flex;align-items:center;gap:20px}.title-seal{border:1px solid #c2664d;background:#6e2726bb;color:#e2b299;writing-mode:horizontal-tb;font-family:var(--duel-font);font-size:14px;line-height:1.4;padding:5px 4px;letter-spacing:.12em;transform:rotate(-5deg);margin-top:8px}.title-wordmark h1{white-space:nowrap}
#title-screen .title-figure{inset:0 0 0 43%;width:auto;max-width:none;opacity:1;overflow:hidden;z-index:0;mask-image:linear-gradient(90deg,transparent,#000 10%)}
.title-figure canvas{display:none}.title-figure img{position:absolute;image-rendering:pixelated;object-fit:contain;pointer-events:none;filter:drop-shadow(0 12px 24px #0008)}
.cover-samurai{width:90%;height:auto;right:13%;top:-10%;opacity:.43;filter:brightness(.65) saturate(.7)!important;mask-image:linear-gradient(#000 50%,transparent 94%)}
.cover-hero{width:80%;height:auto;right:-4%;bottom:-11%;mask-image:linear-gradient(#000 58%,transparent 94%)}
.credits-panel{width:min(940px,100%);display:flex;flex-direction:column;max-height:100%;overflow:hidden;gap:12px}.credits-panel .panel-head,.credits-panel #panel-back{flex-shrink:0}.credits-panel #panel-body{overflow-y:auto;min-height:0;padding-right:12px;scrollbar-gutter:stable}.credits-panel #panel-back{align-self:flex-end;margin:0}.credits-intro{font-size:17px;line-height:1.8}.credit-group{margin:24px 0}.credit-group h3{font-size:19px;color:#dac296;letter-spacing:.1em;margin:0 0 12px}.credit-source,#viewport:has(#title-screen:not([hidden])) #modal a.credit-source{display:flex;flex-direction:column;gap:6px;padding:14px 16px;margin:8px 0;border:1px solid #6f624344;background:#101a1766;text-decoration:none;color:#e4d4b4}.credit-source:hover{border-color:#b39763;background:#29332a}.credit-source strong{font-size:18px;font-weight:500}.credit-source span{font-size:15px;line-height:1.7;color:#bfc2b5}.credits-note{font-size:14px;line-height:1.9;color:#b9bcad}
@media(min-width:1600px){.cover-hero{width:75%;right:0;bottom:-18%}.cover-samurai{width:85%;top:-15%}}
@media(max-width:700px){.title-content{max-width:80%}#title-screen .title-figure{left:24%;opacity:.52}.cover-hero{width:92%;right:-17%;bottom:0}.cover-samurai{width:110%;right:10%;top:0}.title-wordmark{gap:12px}.title-seal{font-size:11px}.credits-panel{padding:16px}.credit-source strong{font-size:17px}.credit-source span{font-size:14px}}
/* Keep both portraits inside the title frame at laptop and narrow window sizes. */
#title-screen{background:linear-gradient(90deg,#080f13fa 0%,#0c1719f5 36%,#10191cdb 70%,#13191dee),url('assets/title-scene.png') center/cover}
.cover-samurai{top:3%;width:85%;right:15%}.cover-hero{bottom:2%}
@media(min-width:1600px){.cover-hero{bottom:2%;width:72%}.cover-samurai{top:2%;width:80%}}
@media(max-width:700px){.cover-samurai{top:3%}.cover-hero{bottom:2%}}