/* Extra: endless after-story. Six tall scene cards sit side by side; hovering
   or focusing a card cross-fades the page backdrop to that memory's scene. */
.extra-layer{position:fixed;inset:0;z-index:2600;display:flex;align-items:center;align-items:safe center;justify-content:center;padding:clamp(10px,2.6vw,34px);overflow:auto;background:#071b20;color:#f7f2df;font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;letter-spacing:0}
.extra-layer[hidden]{display:none}
.extra-layer *{box-sizing:border-box}
.extra-scene{position:fixed;inset:0;z-index:0;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:0;filter:blur(1.5px) saturate(.92) brightness(.62);transform:scale(1.035);transition:opacity .45s ease;pointer-events:none}
.extra-backdrop{position:fixed;inset:0;z-index:1;background:
  radial-gradient(circle at 50% -10%,#2f686488 0%,transparent 48%),
  radial-gradient(circle at 12% 78%,#7a5b2e24,transparent 38%),
  radial-gradient(circle at 88% 22%,#3d6f7a28,transparent 35%),
  linear-gradient(160deg,#0a262c70,#06181da8 62%,#0a1d21b8);backdrop-filter:blur(2px);overflow:hidden}
.extra-backdrop:before,.extra-backdrop:after{content:'';position:absolute;left:50%;top:50%;width:min(120vw,1500px);aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid #d8c18a1f;border-radius:50%;pointer-events:none}
.extra-backdrop:before{box-shadow:0 0 0 90px #d8c18a08,0 0 0 180px #d8c18a06,0 0 0 320px #d8c18a04;animation:extra-orbit 80s linear infinite}
.extra-backdrop:after{width:min(70vw,840px);border-style:dashed;border-color:#d8c18a24;animation:extra-orbit 55s linear infinite reverse}
.extra-aura{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.extra-aura i{position:absolute;left:var(--x,50%);top:var(--y,50%);font-style:normal;color:#fff3c2;font-size:clamp(12px,2vw,25px);opacity:.55;text-shadow:0 0 18px #e9c47d;animation:extra-mote 7s ease-in-out infinite;animation-delay:var(--d,0s)}
.extra-aura i:nth-child(1){--x:12%;--y:22%;--d:.3s}
.extra-aura i:nth-child(2){--x:83%;--y:17%;--d:1.4s;font-size:14px}
.extra-aura i:nth-child(3){--x:91%;--y:72%;--d:.8s}
.extra-aura i:nth-child(4){--x:19%;--y:79%;--d:2s;color:#f3b7c2}
.extra-content{position:relative;z-index:3;width:min(1440px,100%);animation:extra-sheet-in .5s cubic-bezier(.2,.8,.2,1) both}
.extra-sheet{position:relative;padding:clamp(18px,2.2vw,28px);border:1px solid #d8c18a3d;border-radius:24px;background:linear-gradient(155deg,#0d3037e8,#082027d6 55%,#0a2228e8);box-shadow:0 34px 100px #0007,inset 0 1px #fff3cf24,inset 0 0 0 5px #d8c18a0a;backdrop-filter:blur(22px);overflow:hidden}
.extra-sheet:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#fff3d20b,transparent 28%,transparent 72%,#fff3d207);border-radius:inherit}
.extra-head{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding-bottom:14px;border-bottom:1px solid #d8c18a2e}
.extra-heading small{display:block;font:12px Georgia,serif;letter-spacing:4px;color:#d9bd7d}
.extra-heading h2{margin:5px 0 6px;font:500 clamp(27px,3.6vw,42px)/1.06 'Noto Serif SC','Songti SC','SimSun',serif;letter-spacing:.14em;color:#f8efd2;text-shadow:0 2px #0005}
.extra-heading p{margin:0;color:#b7c9bc;font-size:14px;line-height:1.75;letter-spacing:.05em}
.extra-head-side{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.extra-exit{display:flex;align-items:center;gap:5px;padding:6px 10px;border:1px solid #d8c18a4a;border-radius:20px;background:#071b207a;color:#d8c99f;font-size:12px;letter-spacing:1.4px;cursor:pointer;transition:background .2s,transform .2s}
.extra-exit span{color:#d8c18a;font-size:14px;line-height:1}
.extra-exit b{font-weight:400}
.extra-exit:hover{background:#d8c18a18;transform:translateY(-1px)}
.extra-floor{flex:0 0 auto;display:grid;justify-items:center;align-content:center;min-width:104px;min-height:96px;padding:9px 15px;border:1px solid #d8c18a52;border-radius:50% 50% 15px 15px;background:radial-gradient(circle at 50% 35%,#e6ca8b20,transparent 65%),#091f25;box-shadow:inset 0 0 0 4px #d8c18a10}
.extra-floor span{font:12px Georgia,serif;letter-spacing:4px;color:#c7a86a}
.extra-floor strong{font:400 clamp(34px,4.6vw,50px)/1 Georgia,serif;color:#f8eac2;letter-spacing:.03em}
.extra-floor small{font-size:12px;letter-spacing:2px;color:#9bb0a5;margin-top:2px}
.extra-cleared{display:flex;align-items:center;gap:12px;margin-top:12px;padding:9px 13px;border:1px solid #d8c18a4a;border-radius:10px;background:linear-gradient(100deg,#d8c18a1a,#d8c18a05);animation:extra-clear-in .5s .2s both}
.extra-cleared small{font:11px Georgia,serif;letter-spacing:3px;color:#d9bd7d;white-space:nowrap}
.extra-cleared strong{font-size:14px;font-weight:500;letter-spacing:.08em;color:#f8efd2;white-space:nowrap}
.extra-cleared span{font-size:12px;color:#b9c8ba;margin-left:auto;text-align:right}
.extra-choice-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:14px}
.extra-choice{position:relative;display:flex;flex-direction:column;min-width:0;height:clamp(380px,50vh,520px);padding:0;border:1px solid #b7cdbc3d;border-radius:14px;background:linear-gradient(180deg,#0d3037,#081d23);color:#eef1df;text-align:left;cursor:pointer;overflow:hidden;box-shadow:0 10px 24px #0002;transition:transform .22s,border-color .22s,box-shadow .22s;animation:extra-card-in .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.12s + var(--i) * .07s)}
.extra-choice:before{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--accent,#d8c18a);opacity:0;transition:opacity .22s;pointer-events:none}
.extra-choice:hover,.extra-choice:focus-visible{transform:translateY(-7px);border-color:var(--accent,#d8c18a);box-shadow:0 20px 40px #0005,0 0 0 1px #d8c18a1f;outline:none}
.extra-choice:hover:before,.extra-choice:focus-visible:before{opacity:.5}
.extra-choice.is-picked{transform:translateY(-9px) scale(1.01);border-color:var(--accent)}
.extra-choice-thumb{position:relative;display:block;flex:0 0 58%;height:58%;overflow:hidden;background:#102f35}
.extra-choice-thumb img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.86) brightness(.78);transform:scale(1.01);transition:transform .55s,filter .3s}
.extra-choice-shade{position:absolute;inset:0;background:linear-gradient(180deg,#071b2066 0%,#071b2000 32%,#071b20f2 100%),linear-gradient(90deg,#071b2055,transparent 62%)}
.extra-choice-index{position:absolute;left:10px;top:9px;z-index:2;padding:3px 7px;border:1px solid #e7d5a64f;border-radius:20px;background:#071b20a8;font:12px Georgia,serif;letter-spacing:2px;color:#e8dab8}
.extra-choice-icon{position:absolute;right:11px;top:9px;z-index:2;display:grid;place-items:center;width:36px;height:36px;border:1px solid color-mix(in srgb,var(--accent,#d8c18a) 60%,transparent);border-radius:50%;background:radial-gradient(circle at 45% 35%,color-mix(in srgb,var(--accent,#d8c18a) 28%,transparent),transparent 70%);color:var(--accent,#d8c18a);font:16px Georgia,serif;text-shadow:0 0 12px color-mix(in srgb,var(--accent,#d8c18a) 55%,transparent)}
.extra-choice-copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:3px;flex:1;min-height:0;padding:11px 12px 10px}
.extra-choice-copy small{font:11px Georgia,serif;letter-spacing:1.5px;color:#a9b4a2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.extra-choice-copy strong{font-size:18px;font-weight:500;letter-spacing:.08em;color:#f7f0d9;line-height:1.25}
.extra-choice-copy em{font-style:normal;font-size:12px;line-height:1.55;color:#aebfb0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.extra-choice-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;padding-top:8px;border-top:1px solid #b7cdbc26}
.extra-choice-meta b{font-size:12px;font-weight:500;letter-spacing:.05em;color:#e9ddbd;white-space:nowrap}
.extra-choice-meta i{font-style:normal;font-size:17px;color:var(--accent,#d8c18a);transition:transform .2s}
.extra-choice:hover .extra-choice-meta i{transform:translate(3px,-3px)}
.extra-choice.is-random{border-style:dashed;background:linear-gradient(180deg,#16363c,#0a2026)}
.extra-choice.is-random .extra-choice-icon{font-size:18px}
.extra-choice.is-random .extra-choice-copy strong{color:#dfece4}
body.extra-open{overflow:hidden}
body.extra-open #game-flow{filter:blur(2px) saturate(.7);transition:filter .3s}
body.extra-open .gm-button{opacity:0;pointer-events:none}

/* In-game Extra header: keep the five memories and the endless floor visible
   in the chapter strip without changing the main-line layout. */
body.extra-mode .chapter-name .eyebrow{color:#b59a62}
body.extra-mode .chapter-name h1{letter-spacing:.02em}
body.extra-mode #chapter-title{font-size:clamp(20px,2.2vw,34px);letter-spacing:.05em}
body.extra-mode #chapter-route li.extra-route-floor{border-top:1px dashed #bfc9ae;margin-top:5px;padding-top:7px}
body.extra-mode #chapter-route li.extra-route-floor>span{color:#a98745;background:#fff8df;border-color:#d9c48f}
body.extra-mode #chapter-route li.extra-route-floor>b{color:#7b6b48}
body.extra-mode #chapter-route li.extra-route-floor>small{color:#b39a63}
body.extra-mode .chapter-hud .toll-stat strong{color:#8f6f37}
body.extra-mode .game-shell{--extra-gold:#c9ab6c}

/* Eight title entries: keep the rail readable on short desktops and phones. */
#title-menu.is-eight{top:41%;gap:6px}
#title-menu.is-eight>button{min-height:50px;padding-block:5px}
#title-menu.is-eight>button>span{font-size:18px}
#title-menu.is-eight em{margin-top:3px}
#title-menu.is-eight #title-extra{border-color:#c7b27699;background:linear-gradient(105deg,#fff8e4ec,#f5edcd80)}
#title-menu.is-eight #title-extra:before{background:linear-gradient(#d9bd7d,#a78c50)}
#title-menu.is-eight #title-extra>i{color:#b08c48}
#title-menu.is-eight #title-extra.is-locked{color:#697a6c;background:linear-gradient(105deg,#f5f6e9c0,#f1f4e4a0);border-color:#b8c4a780}
#title-menu.is-eight #title-extra.is-locked:before{background:#aab5a1}
#title-menu.is-eight #title-extra.is-locked em{color:#8d9b89}
@media(min-width:1700px){#title-menu.is-eight{top:39%}}
@media(max-width:1000px){#title-menu.is-eight{top:39%;gap:5px}#title-menu.is-eight>button{min-height:48px}}
@media(max-width:700px){#title-menu.is-eight{top:34%;gap:5px;width:69%}#title-menu.is-eight>button{min-height:48px;padding-block:5px}#title-menu.is-eight>button>span{font-size:17px}#title-menu.is-eight em{font-size:11px;letter-spacing:1.5px}#title-menu.is-eight>button>small{font-size:12px}}
@media(max-width:400px){#title-menu.is-eight{width:73%}#title-menu.is-eight>button{min-height:45px}}
@media(max-height:850px) and (min-width:701px){#title-menu.is-eight{top:40%;gap:4px}#title-menu.is-eight>button{min-height:45px;padding-block:4px}#title-menu.is-eight>button>span{font-size:17px}#title-menu.is-eight em{margin-top:2px}}
/* Keep every caption and all eight choices in the viewport, without scrolling. */
.is-revealed #title-home{height:100dvh;min-height:100dvh}
@media(max-height:760px) and (min-width:701px){#title-menu.is-eight{top:auto;bottom:56px;gap:3px}#title-menu.is-eight>button{min-height:38px;padding-block:2px}#title-menu.is-eight>button>span{font-size:16px;line-height:18px}#title-menu.is-eight em{font-size:11px;line-height:13px;margin-top:1px}}
@media(max-height:600px) and (min-width:701px){.is-revealed .title-logo{top:1%}.is-revealed .title-logo h1{font-size:40px;margin-top:4px;margin-bottom:6px}.is-revealed .title-emblem{font-size:16px;margin-top:0}.is-revealed .title-logo>i{font-size:11px;margin-top:6px}}
@media(max-width:700px) and (max-height:700px){#title-menu.is-eight{top:auto;bottom:52px;gap:3px}#title-menu.is-eight>button{min-height:38px;padding-block:2px}#title-menu.is-eight>button>span{font-size:16px;line-height:18px}#title-menu.is-eight em{font-size:11px;line-height:13px;margin-top:1px}.is-revealed .title-logo{top:3%}.is-revealed .title-logo h1{font-size:42px;margin-top:4px;margin-bottom:6px}.is-revealed .title-emblem{font-size:16px;margin-top:0}.is-revealed .title-logo>p{font-size:14px}.is-revealed .title-logo>i{font-size:11px;margin-top:6px}}

/* Extra progress shown in save cards and the Extra save detail sheet. */
.save-cover-extra{position:absolute;right:7px;top:7px;z-index:2;padding:3px 6px;border:1px solid #f1dfa8a8;border-radius:20px;background:#132f2dcc;color:#f6e7b8;font:11px Georgia,serif;letter-spacing:1px;box-shadow:0 2px 8px #0003}
.save-extra-row{display:flex;align-items:center;gap:6px;margin-top:6px;padding-top:5px;border-top:1px dashed #c8d0ba;font-size:12px;color:#7d8d78;letter-spacing:.04em;white-space:nowrap;overflow:hidden}
.save-extra-row i{font:11px Georgia,serif;font-style:normal;letter-spacing:1px;color:#a58d59}
.save-extra-row b{font-weight:500;color:#6f7f67;overflow:hidden;text-overflow:ellipsis}
.save-extra-row small{color:#9aa78f;font-size:11px;margin-left:auto}
.save-cards.is-three .save-card{min-height:196px}
.save-cards .save-card.is-empty{min-height:120px}
.save-cards.is-extra .save-card{min-height:200px}
.save-cards.is-extra .save-card.is-empty{min-height:120px}
.save-card.is-locked .save-extra-row b{color:#a2ab9a}
.extra-detail-copy .extra-rules{margin:12px 0 8px;padding:10px 12px;border:1px solid #d9cfad;border-radius:9px;background:#fffbeea8}
.extra-rules p{margin:0;font-size:13px;line-height:1.8;color:#6c735f}
.extra-rules p+p{margin-top:3px}
.extra-rules b{font-weight:500;color:#9a7a42;margin-right:4px}
.extra-mode-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0}
.extra-mode-preview span{display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid #d3dcc6;border-radius:7px;background:#fbfcf0b8;font-size:12px;color:#607263;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.extra-mode-preview i{font:11px Georgia,serif;font-style:normal;color:var(--mode,#a49a78)}
.extra-mode-preview .is-random{border-style:dashed;color:#8a9583}
.extra-detail-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.extra-detail-stats b{font-size:13px}

/* Responsive card gallery. Six across on wide screens, three across on
   tablets, two on phones; below 360 the cards stack one per row. */
@media(max-width:1200px){.extra-choice-list{grid-template-columns:repeat(3,minmax(0,1fr))}.extra-choice{height:clamp(330px,42vh,460px)}}
@media(max-height:820px){.extra-choice{height:clamp(300px,40vh,400px)}.extra-heading h2{font-size:clamp(25px,3vw,34px)}.extra-floor{min-width:92px;min-height:84px}.extra-floor strong{font-size:clamp(30px,4vw,40px)}}
@media(max-width:1200px) and (max-height:850px){.extra-choice{height:clamp(240px,32vh,320px)}.extra-choice-copy strong{font-size:17px}}
@media(max-width:760px){.extra-layer{align-items:flex-start;padding:8px}.extra-content{margin:4px auto}.extra-sheet{padding:15px 13px;border-radius:19px}.extra-head{gap:12px;padding-bottom:11px}.extra-heading h2{font-size:25px}.extra-heading p{font-size:12px}.extra-head-side{gap:6px}.extra-exit{padding:5px 8px;font-size:11px}.extra-floor{min-width:72px;min-height:72px;padding:7px 9px;border-radius:50% 50% 11px 11px}.extra-floor span{font-size:10px;letter-spacing:2px}.extra-floor strong{font-size:29px}.extra-floor small{font-size:10px;letter-spacing:1px}.extra-choice-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.extra-choice{height:340px;border-radius:12px}.extra-choice-copy{padding:9px 10px 8px}.extra-choice-copy strong{font-size:16px}.extra-choice-copy small{font-size:10px;letter-spacing:1px}.extra-choice-copy em{font-size:12px;-webkit-line-clamp:2}.extra-choice-index{left:8px;top:7px;font-size:11px;padding:2px 6px}.extra-choice-icon{right:8px;top:7px;width:30px;height:30px;font-size:14px}.extra-choice-meta b{font-size:11px}.extra-choice-meta i{font-size:15px}.extra-cleared{flex-wrap:wrap;gap:4px 10px}.extra-cleared span{width:100%;margin-left:0;text-align:left}}
@media(max-width:360px){.extra-choice-list{grid-template-columns:1fr}.extra-choice{height:310px}}
@media(max-width:700px){.save-cards.is-extra .save-card{min-height:196px}.save-extra-row{font-size:11px}.extra-mode-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.extra-detail-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.extra-rules p{font-size:12px}}
@keyframes extra-sheet-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes extra-card-in{from{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}
@keyframes extra-clear-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes extra-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes extra-mote{0%,100%{opacity:.18;transform:translateY(4px)}50%{opacity:.8;transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.extra-content,.extra-choice,.extra-cleared,.extra-aura i,.extra-backdrop:before,.extra-backdrop:after{animation:none!important;transition:none!important}.extra-scene{transition:none!important}}