/* Shared presentation and player-facing system screens. */
.boot-screen { min-height:100dvh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:30px; text-align:center; background:#19251f; }
.boot-screen h1 { font:500 clamp(24px,5vw,38px)/1.7 var(--serif); color:var(--gold); }
.boot-screen p { color:var(--muted); font-size:14px; line-height:1.9; }
.result-screen { padding:48px 0; }
.result-village-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; image-rendering:pixelated; z-index:-2; opacity:.25; }
.result-screen::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#101d19d9,#101d1922,#101d19d9),linear-gradient(0deg,#101d19,transparent 70%); z-index:-1; }
.result-screen.defeat .result-village-art { filter:grayscale(.65); opacity:.15; }
.result-card { width:min(720px,92vw); padding:36px; background:#202a25f5; }
.result-destination { margin:12px 0 22px; color:#dacda9; font:500 18px/1.7 var(--serif); }
.result-card .result-stats small { font-size:12px; }.result-card .result-stats b { font-size:24px; }
.result-lost-gear { text-align:left; border:1px solid var(--line); padding:16px; margin:0 0 20px; }
.result-lost-gear small { color:var(--muted); font-size:12px; }
.result-lost-gear p { font-size:13px; line-height:1.8; margin:8px 0; overflow-wrap:anywhere; }
.result-lost-gear p > span { display:inline-block; color:var(--muted); min-width:48px; }
.result-lost-gear .result-loss-note { color:#bed1bd; margin-top:15px; }
.result-journey { margin:24px 0; padding-top:20px; border-top:1px solid var(--line); text-align:left; }
.result-journey > div:first-child { display:flex; justify-content:space-between; font-size:12px; color:#c2cdbb; }
.result-journey > div b { color:var(--gold); font-weight:500; }
.journey-marks { display:flex; gap:5px; margin:12px 0; }
.journey-marks i { flex:1; height:5px; background:#71816f44; }.journey-marks i.complete { background:#ccb780; }
.result-journey p { color:#bfcab8; font-size:13px; line-height:1.9; margin:10px 0 0; }
.result-screen.game-clear .result-card { border-color:#d8bc82; }
.result-screen.game-clear h1 { font-size:clamp(27px,5vw,42px); }
.title-content { padding-block:60px 90px; }
.title-copy { margin:24px 0; }
.title-actions .primary small { font:12px/1.6 var(--sans); letter-spacing:.04em; opacity:.8; }
.title-save-summary { width:min(410px,100%); margin:22px 0; }
.save-location { display:grid; gap:5px; }
.save-location > span,.save-time { color:var(--muted); font-size:11px; }
.save-location strong { font:500 19px/1.6 var(--serif); color:#efdfbe; }
.save-progress { display:flex; flex-wrap:wrap; gap:14px 24px; margin:14px 0; }
.save-progress div { display:grid; gap:5px; }
.save-progress dt { color:var(--muted); font-size:11px; }
.save-progress dd { margin:0; font-size:13px; color:var(--text); }
.save-run-detail { color:#b7d4c3; font-size:12px; }
.save-time { margin:10px 0 0; }
.first-journey { margin:0; color:#b9c5b8; font-size:13px; line-height:1.9; }
.title-utilities { display:flex; flex-wrap:wrap; gap:8px; }
.title-utilities .ghost { min-height:42px; padding:9px 15px; font-size:12px; background:#19251fda; }
.title-music-toggle { display:inline-flex; align-items:center; gap:7px; border-color:#a9915caa; }
.title-music-toggle .title-music-icon { width:1.15em; color:#e4c879; font-size:15px; line-height:1; text-align:center; }
.title-music-toggle[data-awaiting-start] { border-color:#d7b85dcc; box-shadow:0 0 18px #c79c3422; }
.title-music-toggle[aria-pressed="false"] { border-color:#66706799; color:#aeb6ad; background:#151c18da; }
.title-music-toggle[aria-pressed="false"] .title-music-icon { color:#879087; }
.title-footnote { margin-top:25px; color:#a3b09f; font-size:10px; letter-spacing:.06em; }
.title-footnote span { display:inline-block; margin-left:12px; }
button.asset-note { padding:0; border:0; background:none; font:11px var(--sans); cursor:pointer; }
.title-screen::after { content:""; position:absolute; top:7%; bottom:7%; left:4%; width:1px; background:linear-gradient(transparent,#cfb47f55,transparent); pointer-events:none; }
.product-modal { width:min(680px,94vw); background:#202c25; }
.product-modal .modal-header h2 { font:500 24px var(--serif); margin:0; }
.product-modal .modal-body { padding:24px; }
.product-modal p { font-size:14px; line-height:1.9; color:#c1cbbc; overflow-wrap:anywhere; }
.product-modal .product-intro { margin-top:0; }
.settings-section { margin:24px 0 0; }
.settings-section h3 { padding-bottom:10px; border-bottom:1px solid var(--line); font:500 17px var(--serif); color:var(--gold); }
.product-modal .setting-row { gap:16px; padding:13px 0; margin:0; }
.product-modal .setting-row > span { display:grid; gap:5px; min-width:0; }
.product-modal .setting-row b { font-size:14px; font-weight:500; }
.product-modal .setting-row small { color:#aebdab; font-size:12px; line-height:1.6; }
.product-modal .setting-row output { color:var(--gold); font-size:12px; }
.product-modal .setting-row input[type="range"] { width:42%; max-width:220px; min-height:36px; flex-shrink:0; }
.product-modal .setting-row input[type="checkbox"] { width:23px; height:23px; flex-shrink:0; cursor:pointer; }
.product-modal .setting-row select { font-size:13px; min-height:42px; max-width:45%; min-width:105px; }
.product-modal .setting-row button { padding:10px 13px; flex-shrink:0; }
.product-modal .modal-footer { flex-wrap:wrap; gap:10px; }
.product-modal .modal-footer button,.product-actions button { min-height:44px; padding:11px 18px; font-size:13px; }
.sample-button { margin-top:12px; font-size:12px; }
.save-summary-card { padding:18px; border:1px solid var(--line); background:#17231d; }
.product-actions { display:flex; flex-wrap:wrap; gap:10px; }
.adventure-menu .modal-body { display:grid; gap:16px; }
.adventure-menu-status { padding:13px 15px; display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid #d0b87a55; background:#17231d; }
.adventure-menu-status div { min-width:0; display:grid; gap:4px; }
.adventure-menu-status small { color:var(--muted); font-size:10px; }
.adventure-menu-status b { color:#efdfbe; font:500 16px/1.5 var(--serif); overflow-wrap:anywhere; }
.adventure-menu-status p { margin:0; color:#aebdab; font-size:10px; line-height:1.5; text-align:right; }
.menu-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.menu-action { min-width:0; min-height:64px; padding:9px 12px; display:grid; grid-template-columns:36px minmax(0,1fr); grid-template-rows:auto auto; align-items:center; column-gap:10px; border:1px solid var(--line); background:#26362f; color:var(--text); text-align:left; cursor:pointer; }
.menu-action > span { grid-row:1 / 3; width:36px; height:36px; display:grid; place-items:center; border:1px solid #cdb77d55; border-radius:50%; color:var(--gold); background:#17231d; font:700 18px var(--serif); }
.menu-action b { align-self:end; font-size:13px; font-weight:600; }
.menu-action small { align-self:start; color:#aebdab; font-size:10px; line-height:1.35; }
.menu-action.primary { border-color:#d4bb7d99; background:#3b452f; }
.menu-action:hover { border-color:#d4bb7d99; background:#304238; }
.product-modal .product-note { font-size:12px; color:#aab9a8; }
.reset-details { margin-top:28px; padding-top:20px; border-top:1px solid var(--line); }
.reset-details summary { cursor:pointer; color:#c7b49e; font-size:13px; padding:8px 0; }
.reset-details .danger-button { min-height:44px; }
.credits-heading { text-align:center; padding:8px 0 22px; border-bottom:1px solid var(--line); }
.credits-heading p { margin:12px 0 4px; color:var(--gold); font-family:var(--serif); }
.credits-heading small { font-size:11px; color:var(--muted); }
.credits-link { display:inline-block; font-size:13px; text-decoration:none; }
.save-notice { position:fixed; inset:auto 12px 12px; z-index:150; display:flex; align-items:center; justify-content:center; gap:14px; padding:12px 18px; border:1px solid #ddb482; background:#352a20; box-shadow:0 4px 20px #0008; color:#ffe9c5; font-size:13px; line-height:1.6; }
.save-notice[hidden] { display:none; }
.save-notice .ghost { flex-shrink:0; font-size:12px; padding:8px 12px; }
.dialog-open { overflow:hidden; }
.toast { max-width:calc(100vw - 28px); white-space:normal; text-align:center; line-height:1.7; z-index:200; }
.guide-start { margin-bottom:24px; padding:20px; border:1px solid #bda77b66; background:#28362b; }
.guide-start h3 { margin:0 0 12px; color:var(--gold); font:500 19px var(--serif); }
.guide-start ol { padding-left:24px; margin:0; }
.guide-start li { padding:6px 0; color:#d0d6c6; font-size:14px; line-height:1.8; }
.guide-controls { display:grid; grid-template-columns:1fr 1fr; gap:0 24px; margin:20px 0; }
.guide-controls > div { display:flex; gap:16px; justify-content:space-between; border-bottom:1px solid var(--line); padding:12px 0; font-size:13px; }
.guide-controls dt { color:var(--muted); }.guide-controls dd { margin:0; text-align:right; }
kbd { font:inherit; color:var(--gold); }
.guide-page p { font-size:13px; }
.guide-page { min-width:0; }
.modal .close-modal,.village-modal header .icon-button { min-width:40px; min-height:40px; }
input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
button:disabled { cursor:not-allowed; opacity:.48; }
html[data-reduced-motion="true"] *,html[data-reduced-motion="true"] *::before,html[data-reduced-motion="true"] *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
html[data-high-contrast="true"] { --muted:#d0dbc9; --text:#fff9e8; --line:#b3bda594; --gold:#ffe0a0; }
html[data-high-contrast="true"] :is(.modal,.village-modal,.village-sidebar) :is(p,small,dt,label) { color:#dce6d4; }
html[data-high-contrast="true"] :is(.modal,.village-modal,.village-mission,.village-preparation) { border-color:#b2c49b; }
html[data-text-scale="1.15"] :is(.modal,.village-modal) :is(p,li,dt,dd,small,label,button,summary),html[data-text-scale="1.15"] .village-mission-copy { font-size:max(1em,14px); }
html[data-text-scale="1.3"] :is(.modal,.village-modal) :is(p,li,dt,dd,small,label,button,summary),html[data-text-scale="1.3"] .village-mission-copy { font-size:max(1em,16px); }
html[data-text-scale="1.15"] .village-dialogue-copy > p:not(.village-speaker) { font-size:19px; }
html[data-text-scale="1.3"] .village-dialogue-copy > p:not(.village-speaker) { font-size:22px; }
@media(max-width:760px) {
  .result-screen { padding:24px 0; }
  .result-card { padding:24px 18px; }
  .result-card .primary.huge { min-width:0; width:100%; }
  .result-destination { font-size:16px; }
  .title-content { padding:170px 24px 80px; }
  .title-content h1 span { font-size:clamp(36px,10vw,64px); }
  .title-copy { font-size:12px; margin:20px 0; }
  .title-save-summary { margin:18px 0; }
  .title-footnote { line-height:1.8; margin-top:18px; }
  .title-footnote span { margin-left:0; display:block; }
  .title-screen::after { display:none; }
  .title-utilities .ghost { padding:9px 11px; }
  .product-modal .modal-body { padding:18px; }
  .product-modal .modal-header { padding:18px; }
  .product-modal .modal-header h2 { font-size:21px; }
  .product-modal .setting-row { gap:10px; }
  .product-modal .setting-row small { font-size:11px; }
  .product-modal .setting-row b { font-size:13px; }
  .adventure-menu .modal-body { padding:12px; gap:10px; }
  .adventure-menu-status { padding:9px 10px; align-items:flex-start; flex-direction:column; gap:3px; }
  .adventure-menu-status b { font-size:14px; }
  .adventure-menu-status p { font-size:9px; text-align:left; }
  .menu-action-grid { gap:6px; }
  .menu-action { min-height:56px; padding:7px; grid-template-columns:30px minmax(0,1fr); column-gap:7px; }
  .menu-action > span { width:30px; height:30px; font-size:15px; }
  .menu-action b { font-size:11px; }
  .menu-action small { font-size:8px; }
  .adventure-menu .reset-details { margin-top:4px; padding-top:8px; }
  .guide-controls { grid-template-columns:1fr; }
  .save-notice { inset:auto 6px 6px; padding:10px; gap:8px; font-size:11px; }
}
@media(max-height:730px) and (min-width:761px) {
  .title-content { padding-block:32px 65px; }
  .title-content h1 span { font-size:56px; }
  .title-copy { margin:16px 0; }
  .title-save-summary { margin:14px 0; }
}
.scene-caption{position:absolute;z-index:6;pointer-events:none;top:22px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 28px);padding:12px 32px 15px;text-align:center;color:#f4ecdc;background:linear-gradient(90deg,#0b152200,#0b1522ed 18%,#0b1522ed 82%,#0b152200);text-shadow:0 2px 4px #000;animation:scene-caption 3.4s ease both;border-block:1px solid #bfad7833}
.scene-caption>span{display:block;font-size:10px;letter-spacing:.3em;color:#d2bd87}.scene-caption>strong{display:block;font-family:var(--serif);font-weight:500;letter-spacing:.12em;font-size:22px;margin:7px 0;line-height:1.5}.scene-caption>small{display:block;font-size:11px;color:#b6c6d0;letter-spacing:.06em}
.scene-caption.boss{border-color:#d27c6944}.scene-caption.boss>span{color:#f2b6a1}
@keyframes scene-caption{0%{opacity:0;transform:translate(-50%,7px)}12%,77%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-4px)}}
@media(max-width:600px){.scene-caption{top:12px;padding:10px 20px}.scene-caption>strong{font-size:17px}.scene-caption>small{font-size:10px;max-width:250px}}
@media(prefers-reduced-motion:reduce){.scene-caption{animation:none}}
:root[data-reduced-motion="true"] .scene-caption{animation:none}
