/* Story surfaces: existing records, messages, and book entries keep their data and interaction rules. */
#talkDialog { width: min(1500px, calc(100vw - 24px)); height: min(900px, calc(100dvh - 24px)); border: 8px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 12px stretch; background: #1a120d url('/assets/gamer/haru-room-v2.png') center / cover; box-shadow: 0 20px 70px #000d; }
#talkDialog > .dialog-header { position: relative; z-index: 2; margin: 0; padding: 14px 22px; border-bottom: 0; background: linear-gradient(90deg, #3d2618e8, #20130ddd); color: #ffe2a0; }
#talkDialog > .dialog-header h2 { font-family:BoardHand,sans-serif;font-size:32px; }
#talkDialog::before { content: ''; position: absolute; z-index: 1; bottom: 0; left: 0; width: 270px; height: min(690px, 82%); background: url('/assets/gamer/haru-v1.png') center bottom / auto 100% no-repeat; pointer-events: none; }
#talkDialog .talk-layout { grid-template-columns: 270px minmax(0, 1fr) 300px; gap: 0; padding: 18px 20px 0; background: linear-gradient(90deg, #09070666, transparent 23% 76%, #09070666); }
#talkDialog .strategy-workbench { grid-column: 2; grid-row: 1; display: flex; flex-direction:column; gap: 8px; min-height: 0; padding: 14px; border: 2px solid #a67d49; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f5e9cc; color: #3f2b1c; }
#talkDialog .talk-context-line, #talkDialog .talk-guide-topic { margin: 0; padding: 8px 10px; border-bottom: 1px solid #c5a57a; background:#ead6b0; color: #614831; font: 15px/1.35 BoardLabel, sans-serif; }
#talkDialog .talk-transcript { min-height: 0; padding: 10px; overflow: auto; scrollbar-color: #a57c48 transparent; }
#talkDialog .chat-message { max-width: min(78%, 640px); border: 1px solid #b79669; border-radius: 4px 13px 13px; background: #fff9ea; box-shadow: 0 2px 6px #53381722; color: #412d1e; font: 15px/1.55 system-ui, sans-serif; }
#talkDialog .chat-message--user { margin-left: auto; border-color: #b78234; border-radius: 13px 4px 13px 13px; background: #ffe6a1; }
#talkDialog .chat-message > b { color: #19737a; font-family: BoardLabel, sans-serif; }
#talkDialog .chat-message--user > b { color: #6a481b; }
#talkDialog #talkStatus { margin: 0; color: #745d43; font: 13px/1.35 system-ui, sans-serif; }
#talkDialog .talk-compose { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; padding: 10px; border-top: 1px solid #c5a57a; background: #f4e4bd; }
#talkDialog .talk-compose label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#talkDialog .talk-compose textarea { min-height: 52px; color: #402b1d; border: 2px solid #ab8250; background: #fff9e9; font: 16px/1.45 system-ui, sans-serif; }
#talkDialog .talk-compose-actions { display: flex; align-items: stretch; }
#talkDialog .talk-compose-actions button { min-width: 98px; min-height: 52px; border: 7px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch; background: url('/assets/preparation/button-primary-v3.png') center / 112% 260%; color: #40260e; font: 20px/1.3 BoardLabel, sans-serif; }
#talkDialog .talk-character { grid-column: 3; grid-row: 1; display: flex; flex-direction:column; align-items:stretch; gap: 9px; padding: 14px; overflow: auto; border: 0; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f3e5c5; }
#talkDialog :is(.chat-message button,#talkLoadMore,#talkResume,#talkRecordsOpen) { color:#65472b;min-height:44px; }
#talkDialog :is(.memory-empty,.memory-empty b,#talkTemperament,#memoryCount) { color:#65472b; }
#talkDialog .talk-character .gamer-avatar { display: none; }
#talkDialog :is(.memory-book, .talk-reference) { margin: 0; border: 1px solid #b48b56; background: #fff9e9cc; color: #442e1e; }
#talkDialog :is(.memory-book, .talk-reference) > summary { min-height: 48px; padding: 9px 11px; color: #4c301e; font: 18px/1.3 BoardLabel, sans-serif; }
#talkDialog :is(.memory-list, .talk-preparation, .talk-attachments) { padding: 0 11px 11px; font: 14px/1.5 system-ui, sans-serif; }
#talkDialog .talk-actions { margin: 0; padding: 12px 22px; border: 0; background: #21130de8; }
#talkDialog .talk-actions button { min-height: 44px; border: 7px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch; background: url('/assets/preparation/button-secondary-v3.png') center / 112% 260%; color: #f5d99f; font-family: BoardLabel, sans-serif; }

#talkSceneDialog, #reviewDialog { border: 8px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 12px stretch; background: #f2e2bb; color: #412a1b; }
#talkSceneDialog .scene-picker-layout { padding: 10px; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f8edd2; }
#talkSceneDialog #talkRunList { padding: 8px; border-right-color: #b49262; background: #ecdbb8; }
#talkSceneDialog #talkRunList button, #talkSceneDialog .scene-choice { border-color: #b28a57; background: #fff8e7; color: #482d1c; }
#talkSceneDialog #talkRunList button[aria-current="true"], #talkSceneDialog .scene-choice[data-selected="true"] { border-color: #d49a39; box-shadow: inset 0 0 0 2px #ffe49b; background: #fff1c7; }
#talkSceneDialog .record-scene { border: 2px solid #9b7141; }
#talkSceneDialog .scene-picker-footer { padding: 10px; border-top-color: #b49262; background: #f1e1be; }
#talkSceneDialog #talkRunList button :is(small,span) { color:#70583b; }
#talkSceneDialog :is(.scene-choice > button.text-button,#talkSceneConfirm), #talkDialog #talkClose { min-height:44px;border:7px solid transparent;border-image:url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch;background:url('/assets/preparation/button-secondary-v3.png') center / 112% 260%;color:#f4e1b5; }
#talkSceneDialog button#talkSceneConfirm { background-image:url('/assets/preparation/button-primary-v3.png');color:#43250d; }
#talkSceneDialog :is(#talkRunTitle, #talkRunList b, .scene-choice-select b, .scene-choice-select :is(small, span), #talkSceneSelection, #talkScenePickerStatus) { color: #4a2e1d; }
#talkSceneDialog .scene-choice > button.text-button { color: #654023; }
#reviewDialog { padding: 18px; }
#reviewDialog > .dialog-header { margin: -18px -18px 14px; }
#reviewDialog:has(#reviewChoices > .record-scene, .record-preview) > .dialog-header { background:linear-gradient(90deg,#432b1b,#21150f);color:#f8e2a7; }
#reviewDialog:has(#reviewChoices > .record-scene, .record-preview) > .dialog-header h2 { color:#f8e2a7; }
#reviewDialog:has(#reviewChoices > .record-scene) button { border:7px solid transparent;border-image:url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch;background:url('/assets/preparation/button-secondary-v3.png') center / 112% 260%;color:#f4e1b5; }
#reviewDialog #reviewScene, #reviewDialog #reviewHint, #reviewDialog #reviewChoices { padding: 11px; border: 1px solid #c19d70; background: #fff9e9bb; font: 15px/1.55 system-ui, sans-serif; }

#journalDialog .journal-layout { grid-template-columns: 170px minmax(0, 1fr); }
#journalDialog #runList { padding-inline: 8px; }
#journalDialog .record-photo { width: min(185px, 100%); }
#journalDialog .record-photo canvas { width: 100%; height: auto; }
#journalDialog .record-scene { max-height: min(280px, 32dvh); object-fit: contain; }
#journalDialog #runDetail { min-width: 0; }
#journalDialog .record-actions { position:static;padding-top:0;background:transparent; }
#journalDialog .dialog-header h2, #journalDialog :is(.record-overview,.record-scene-page) > h3 { font-family:BoardHand,sans-serif;font-size:30px; }
#journalDialog :is(.icon-button,.record-actions button) { min-height:44px;border:7px solid transparent;border-image:url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch;background:url('/assets/preparation/button-secondary-v3.png') center / 112% 260%;color:#f4e1b5;font-family:BoardLabel,sans-serif; }
#journalDialog .record-actions button.primary { background-image:url('/assets/preparation/button-primary-v3.png');color:#43250d; }
#journalDialog .record-actions button.text-button { background:url('/assets/preparation/button-secondary-v3.png') center / 112% 260%;color:#f4e1b5; }

#recapDialog { width: min(1040px, calc(100vw - 24px)); padding: 18px; }
#recapDialog > .dialog-header { margin: -18px -18px 14px; }
#expeditionRecap { padding: 18px; border: 1px solid #b99261; background: #f4e6c6; color: #472d1d; }
#expeditionRecap > header { margin: -18px -18px 14px; padding: 14px 18px; border-bottom: 2px solid #a77a44; background: linear-gradient(90deg, #3f2818, #21150e); color: #f8e1a4; }
#expeditionRecap > header > small { color: #e7c77f; font: 13px/1.3 BoardLabel, sans-serif; letter-spacing: .08em; }
#expeditionRecap > header h2, #expeditionRecap[data-outcome="game_failure"] h2 { margin: 4px 0; color: #ffe0a1; font: 700 35px/1.3 BoardHand, sans-serif; }
#expeditionRecap > header p { margin: 0; color: #f0d5a3; font: 15px/1.3 BoardLabel, sans-serif; }
#expeditionRecap .recap-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#expeditionRecap .recap-cards > [data-kind] { min-width: 0; padding: 13px; border: 1px solid #bd9666; background: #fff8e8; }
#expeditionRecap .recap-cards > [data-kind="discovery"] { border-top: 5px solid #35625a; } #expeditionRecap .recap-cards > [data-kind="secured"] { border-top: 5px solid #9b7934; } #expeditionRecap .recap-cards > [data-kind="loss"] { border-top: 5px solid #9b4940; }
#expeditionRecap :is(h2, h3, strong) { color: #482719; font-family: BoardHand, sans-serif; }
#expeditionRecap :is(.recap-number, .xp-gain, .growth-number, .character-level-result strong) { color: #236d74; font: 28px/1.3 BoardLabel, sans-serif; }
#expeditionRecap .recap-cards h3 { margin: 0 0 10px; color: #44281a; font: 23px/1.3 BoardHand, sans-serif; }
#expeditionRecap .recap-item { color: #503628; font: 15px/1.5 system-ui, sans-serif; }
#expeditionRecap .recap-item span, #expeditionRecap .recap-cards > [data-kind] > p { color: #5b4030; }
#expeditionRecap .character-level-result { border-left-color: #b98537; background: #f2dfb4; color: #503528; }
#expeditionRecap .character-level-result > b { color: #493022; }
#expeditionRecap .character-level-result small { color: #5f4836; }
#expeditionRecap p, #expeditionRecap li { font: 14px/1.5 system-ui, sans-serif; }
#expeditionRecap > button { min-height: 44px; margin-top: 13px; border: 7px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch; background: url('/assets/preparation/button-secondary-v3.png') center / 112% 260%; color: #f5d99f; font-family: BoardLabel, sans-serif; }
#expeditionRecap > button.primary { background-image: url('/assets/preparation/button-primary-v3.png'); color: #44270e; }

#guidebookDialog .guidebook-cards { grid-auto-rows: max-content; align-content: start; }
#guidebookDialog :is(.guidebook-header h2,.guidebook-detail h3,.guidebook-list > h3) { font-family:BoardHand,sans-serif; }
#guidebookDialog .guidebook-header .icon-button { min-height:44px;border:7px solid transparent;border-image:url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch;background:url('/assets/preparation/button-secondary-v3.png') center / 112% 260%;color:#f4e1b5; }
@media(min-width:961px) and (min-height:501px) { #guidebookDialog .guidebook-gallery { grid-template-rows:minmax(0,1fr) 215px; } #guidebookDialog .guidebook-cards { grid-template-rows:repeat(2,94px); } }
#guidebookDialog .guidebook-card { min-height: 94px; grid-template-rows: minmax(0, 1fr) auto; }
#guidebookDialog .guidebook-thumb { min-height: 58px; }
#guidebookDialog .guidebook-detail { min-height: 0; padding-bottom: 12px; }
#guidebookDialog .guidebook-detail > p, #guidebookDialog .guidebook-notes p { font: 15px/1.55 system-ui, sans-serif; }
#guidebookDialog .guidebook-actions { min-height: 44px; align-items: center; }
#guidebookDialog .guidebook-actions button { min-height: 44px; border: 7px solid transparent; border-image: url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch; background: url('/assets/preparation/button-secondary-v3.png') center / 112% 260%; color: #f5d99f; font-family: BoardLabel, sans-serif; }
#guidebookDialog .guidebook-seal { color: #856c50; border-color: #a58a65; background: #e9ddc5; }

@media (max-width: 900px) { #talkDialog::before { display: none; } #talkDialog .talk-layout { grid-template-columns: minmax(0, 1fr) 245px; padding-left: 14px; } #talkDialog .strategy-workbench { grid-column: 1; } #talkDialog .talk-character { grid-column: 2; } #journalDialog .journal-layout { grid-template-columns: 145px minmax(0, 1fr); } }
@media (max-width: 640px), (max-height: 500px) and (orientation: landscape) { #talkDialog { width: calc(100vw - 10px); height: calc(100dvh - 10px); } #talkDialog::before { display: none; } #talkDialog .talk-layout { display: grid; grid-template-columns: 1fr; padding: 8px; } #talkDialog .talk-character { grid-column: 1; grid-row: 2; max-height: 180px; } #talkDialog .strategy-workbench { min-height: 0; } #talkDialog .talk-compose { grid-template-columns: 1fr; } #talkDialog .talk-compose-actions button { min-height: 44px; } #talkSceneDialog .scene-picker-layout { grid-template-columns: 112px minmax(0, 1fr); } #journalDialog .journal-layout { grid-template-columns: 1fr; } #journalDialog #runList { flex-direction: row; max-height: 82px; } #journalDialog .record-photo { width: 130px; } #expeditionRecap .recap-cards { grid-template-columns: 1fr; max-height: 58dvh; overflow: auto; } #guidebookDialog .guidebook-cards { grid-auto-rows: max-content; } }
@media (max-width:640px), (max-height:500px) and (orientation:landscape) {
  #talkDialog .talk-layout { grid-template-rows:54px minmax(0,1fr);gap:6px; }
  #talkDialog .talk-character { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-row:1;height:54px;max-height:54px;padding:4px;gap:4px;overflow:visible; }
  #talkDialog .strategy-workbench { grid-row:2; }
  #talkDialog .talk-character > details[open] { background:#f6e8ca;color:#493420; }
}

#talkDialog > .dialog-header h2 { font-size:clamp(23px,2.4vw,32px);line-height:1.3;overflow-wrap:anywhere; }
#talkDialog :is(.chat-message,.talk-context-line,.talk-guide-topic,.talk-preparation,.memory-empty,.memory-card,.memory-proposal) { font-family:var(--font-copy);line-height:1.6;overflow-wrap:anywhere; }
#talkDialog .talk-identity, #talkDialog .talk-identity > div { min-width:0; }
#guidebookDialog :is(.guidebook-header h2,.guidebook-detail h3,.guidebook-list > h3) { line-height:1.3;overflow-wrap:anywhere; }
#guidebookDialog .guidebook-card b { padding:2px;white-space:normal;overflow:visible;text-overflow:clip;font:600 13px/1.4 var(--font-copy);word-break:keep-all;overflow-wrap:anywhere; }
#guidebookDialog .guidebook-card { grid-template-rows:minmax(58px,1fr) auto; }
#guidebookDialog .guidebook-actions button { font:15px/1.4 BoardLabel,sans-serif; }
#recapDialog[open] { display:flex;flex-direction:column;max-height:calc(100dvh - 24px);overflow:hidden; }
#recapDialog > .dialog-header { flex-shrink:0; }
#recapDialog #expeditionRecap { display:flex;flex:1;flex-direction:column;min-height:0;gap:10px; }
#recapDialog #expeditionRecap > :is(header,button) { flex-shrink:0; }
#recapDialog #expeditionRecap .recap-cards { flex:1;min-height:0;max-height:none;overflow:auto; }
@media(min-width:961px) and (min-height:501px) {
  #guidebookDialog .guidebook-gallery { grid-template-rows:minmax(0,1fr) 246px; }
  #guidebookDialog .guidebook-cards { grid-auto-columns:112px;grid-template-rows:repeat(2,minmax(110px,max-content));overflow-y:auto; }
}
