/* Field investigation: shared visual language of brass, ink and archival paper. */
.city-skyline-label { top:30px; }
.city-controls { top:30px; }
.city-controls .mode-button { display:flex; align-items:center; justify-content:center; gap:7px; padding:0 12px; height:40px; color:#f0e4ca; background:#29443ee6; border:1px solid #a4b4a55e; border-radius:3px; font-size:12px; }
.scene-tabs { position:absolute; top:142px; left:4%; z-index:4; display:flex; padding:4px; gap:4px; border:1px solid #afbaaa4d; border-radius:4px; background:#233c36ed; }
.scene-tabs button { padding:9px 15px; font-size:12px; color:#cfceb8; border-radius:2px; }
.scene-tabs button[aria-pressed="true"] { background:#d7c19a; color:#233c36; }
.scene-tabs span { opacity:.65; font-size:10px; }
.field-objective { position:absolute; z-index:4; top:96px; right:4%; width:265px; padding:17px 18px 12px; background:#203a33ed; border:1px solid #a5ac8b55; box-shadow:0 12px 30px #0f262421; backdrop-filter:blur(8px); }
.field-objective>.micro { color:#acbaa7; font-size:9px; }
#activeObjective { display:block; width:100%; text-align:left; color:#efdfbb; font-size:14px; line-height:1.7; padding:9px 0; }
.field-counts { border-top:1px solid #b8af8e33; padding-top:9px; font-size:10px; color:#a8b8a6; }
#toggleLocations { display:flex; align-items:center; gap:7px; color:#d0b783; padding:12px 0 0; font-size:11px; }
#toggleLocations svg { width:13px; height:13px; }
#locationList { display:grid; gap:3px; margin-top:10px; max-height:260px; overflow:auto; border-top:1px solid #b8af8e33; padding-top:8px; }
#locationList button { text-align:left; color:#eee0c4; padding:8px 4px; font-size:12px; }
#locationList button:hover { background:#aeb59822; }
.scene-instructions { position:absolute; left:4%; bottom:221px; z-index:3; color:#d2decd; font:10px/1.6 Georgia,serif; pointer-events:none; background:#243d377a; padding:5px 9px; border-radius:2px; }
.scene-markers { position:absolute; inset:0; z-index:2; pointer-events:none; overflow:clip; }
.scene-marker { position:absolute; left:0; top:0; pointer-events:auto; display:grid; grid-template-columns:23px auto; gap:2px 5px; min-width:96px; padding:7px 10px 7px 7px; text-align:left; color:#f6e4bd; border:1px solid #cab17c9c; background:#203b35ed; border-radius:3px; box-shadow:0 4px 16px #0b201f55; transition:background .2s; }
.scene-marker::after { content:""; position:absolute; width:1px; height:15px; left:50%; bottom:-16px; background:#d5b97c; }
.scene-marker>span { grid-row:1/3; align-self:center; text-align:center; font-size:19px; color:#edbe69; }
.scene-marker b { font-size:11px; font-weight:400; white-space:nowrap; }
.scene-marker small { color:#b5bd9f; font-size:9px; }
.scene-marker:hover, .scene-marker:focus-visible { background:#4c6554; z-index:5; }
.scene-marker.is-found { border-color:#829986; background:#29483ded; }
.scene-marker.is-found>span { color:#94c6a5; }
.marker-person { border-radius:18px 3px 3px 18px; }
.detective-dialogue { grid-template-columns:112px minmax(0,1fr) 125px; gap:24px; padding:20px 24px; min-height:194px; background:#20342ff5; border-color:#b3a28a; box-shadow:0 15px 45px #0b1d2250; }
.dialogue-portrait { width:112px; height:144px; border-radius:4px; transform:none; border:1px solid #c2a37888; align-self:center; background:#ada9a1; }
.dialogue-portrait img { width:100%; height:100%; display:block; object-fit:cover; object-position:50% 35%; transform:none; }
[data-speaker="orson"] .dialogue-portrait img { object-position:50% 28%; }
[data-speaker="vera"] .dialogue-portrait img { object-position:55% 32%; }
[data-speaker="milo"] .dialogue-portrait img { object-position:49% 28%; }
.dialogue-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.dialogue-kicker { font-family:Georgia,'Songti SC',serif; color:#ebd9b8; }
.dialogue-kicker strong { font-size:19px; font-weight:500; }
.dialogue-kicker span { font-size:11px; color:#b1b8aa; margin-left:12px; }
#dialogueStatus { font-size:10px; color:#acb9ab; }
.dialogue-copy p { font-size:16px; min-height:56px; line-height:1.85; margin:9px 0 12px; color:#f1e7d8; }
#dialogueText:focus { outline:none; }
.dialogue-next { padding:5px 0; font-size:12px; }
.dialogue-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; }
.dialogue-actions:empty { display:none; }
.dialogue-actions button { display:inline-flex; align-items:center; gap:7px; padding:7px 0; color:#d9bc86; font-size:12px; line-height:1.6; text-align:left; border-bottom:1px solid #d9bc8640; max-width:100%; }
.dialogue-actions button:hover { color:#fff2d9; border-color:#eadcbba8; }
.dialogue-actions button svg { width:14px; height:14px; }
.dialogue-actions button span { overflow-wrap:anywhere; }
.dialogue-tools { height:100%; display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; gap:20px; }
.dialogue-tools .icon-button { width:28px; height:28px; color:#bbc3b6; }
.dialogue-tools .enter-case { margin-top:auto; font-size:12px; padding:10px 0; border:0; gap:8px; color:#cbbfa9; }
.dialogue-tools .enter-case:hover { color:#f3dfb9; }
.city-stage[data-mode="day"] .city-skyline-label h1 { color:#233e37; text-shadow:none; }
.city-stage[data-mode="day"] .city-skyline-label span,.city-stage[data-mode="day"] .city-skyline-label small { color:#39514b; text-shadow:none; }
.archive-guidance { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:12px; line-height:1.7; margin:0 0 22px; color:#6c6b56; }
.archive-guidance button { display:flex; align-items:center; gap:7px; color:#36594c; border-bottom:1px solid #81947c; padding:6px 0; }
.evidence.is-uncollected { background:#c8cbb366; box-shadow:none; border:1px dashed #354f4866; clip-path:none; }
.evidence.is-uncollected> :not(.locked-cover) { display:none; }
.locked-cover { display:flex; min-height:190px; height:100%; flex-direction:column; justify-content:center; align-items:center; gap:17px; color:#304a3f; text-align:center; }
.locked-cover strong { font-weight:400; font-size:24px; }
.locked-cover>span:not(.micro) { font-size:12px; }
.locked-cover em { font-size:12px; font-style:normal; opacity:.8; }
.record-doubt { display:block; padding:12px 16px; width:100%; text-align:left; background:#395c4d; color:#f1e2c4; border:1px solid #395c4d; margin:20px 0; font-size:13px; }
.record-doubt:disabled { cursor:default; background:#d5dcc8; color:#466050; border-color:#a5b49b; }
.detail-bottom { gap:10px; }
.detail-bottom>span { font-size:11px; }
.investigation-tasks { margin-bottom:35px; }
.task-row { display:flex; gap:18px; align-items:flex-start; padding:15px 0; border-bottom:1px solid #77785836; }
.task-row>span { border:1px solid #9e9276; color:#827151; display:grid; place-items:center; width:32px; height:32px; flex-shrink:0; border-radius:50%; font-size:12px; }
.task-row b { font-size:17px; font-weight:400; }
.task-row p { font-size:12px; line-height:1.8; color:#7c7666; margin:7px 0 0; }
.task-row.complete>span { background:#36594a; color:#e5dfc1; border-color:#36594a; }
.field-log { margin-bottom:45px; }
.field-log article { padding:15px 19px; border-left:2px solid #8fa080; background:#dce0ce55; margin-bottom:12px; }
.field-log article b { font-size:15px; font-weight:400; }
.field-log p { font-size:13px; line-height:1.9; color:#626755; margin:8px 0 0; }
.field-log .witness-record { display:flex; align-items:flex-start; gap:16px; }
.witness-record>img { width:54px; height:65px; object-fit:cover; object-position:center 30%; border-radius:3px; flex-shrink:0; }
.discovered-list li { line-height:1.8; margin-bottom:16px; }
.field-dialog { width:min(540px,calc(100vw - 28px)); max-height:calc(100svh - 40px); border:1px solid #b3996b; background:#e8ddc6; color:#304239; padding:36px; border-radius:5px; box-shadow:0 30px 120px #081a19aa; overflow:auto; }
.field-dialog::backdrop { background:#10252299; backdrop-filter:blur(4px); }
.field-close { position:absolute; top:12px; right:12px; color:#4b5b49; }
.field-dialog-heading { display:flex; align-items:center; gap:18px; margin-bottom:20px; padding-right:18px; }
#fieldSymbol { display:grid; place-items:center; width:60px; height:68px; border-radius:30px 30px 2px 2px; color:#ead5a9; font-size:26px; flex-shrink:0; }
.field-dialog .eyebrow { font-size:9px; margin:0 0 8px; }
.field-dialog h2 { font-size:29px; font-weight:400; margin:0; line-height:1.2; }
#fieldDescription { font-size:16px; line-height:1.9; }
.field-actions { display:grid; gap:8px; margin:22px 0 10px; }
.field-actions button { padding:13px 16px; color:#eadbbd; background:#365849; text-align:left; font-size:14px; line-height:1.55; border:1px solid #274b3b; }
.field-actions button:hover { background:#4e715d; }
#fieldHint { font-size:12px; color:#7e725e; line-height:1.8; margin-bottom:0; }
.interview-answers article { border-left:2px solid #a79169; padding-left:14px; margin:20px 0; }
.interview-answers b { font-size:12px; font-weight:400; color:#8c7048; }
.interview-answers p { font-size:14px; line-height:1.85; margin:7px 0; }
.game-toast { position:fixed; z-index:100; left:50%; top:18px; transform:translateX(-50%); width:max-content; max-width:calc(100vw - 28px); background:#18372fee; border:1px solid #bda375; color:#ecdfbf; padding:13px 22px; font-size:13px; text-align:center; box-shadow:0 8px 24px #0d201e33; pointer-events:none; }
@media(max-width:1000px) {
  .field-objective { right:22px; width:225px; }
  .detective-dialogue { grid-template-columns:90px minmax(0,1fr) 106px; gap:16px; }
  .dialogue-portrait { width:90px; height:128px; }
}
@media(max-width:700px) {
  .city-stage { min-height:780px; }
  .city-skyline-label { top:18px; left:16px; max-width:calc(100% - 156px); gap:5px; }
  .city-skyline-label h1 { font-size:23px; }
  .city-skyline-label span { font-size:8px; }
  .city-skyline-label small { font-size:9px; line-height:1.5; }
  .city-controls { top:20px; right:12px; gap:4px; }
  .city-controls .mode-button { height:32px; width:34px; padding:0; }
  .city-controls .mode-button span { display:none; }
  .city-controls .icon-button { width:29px; height:32px; }
  .scene-tabs { left:16px; top:123px; padding:3px; }
  .scene-tabs button { padding:8px 10px; font-size:11px; }
  .field-objective { top:174px; left:16px; right:16px; width:auto; padding:9px 12px; }
  .field-objective>.micro { display:none; }
  #activeObjective { font-size:12px; padding:0 0 6px; }
  .field-counts { font-size:9px; padding-top:6px; padding-right:65px; }
  #toggleLocations { position:absolute; bottom:6px; right:10px; font-size:10px; padding:5px 0; }
  #locationList { background:#203a33; max-height:200px; margin-bottom:23px; }
  .scene-marker { min-width:66px; grid-template-columns:17px auto; padding:5px; gap:2px 3px; }
  .scene-marker>span { font-size:14px; }
  .scene-marker b { font-size:10px; }
  .scene-marker small { font-size:8px; }
  .scene-marker::after { height:9px; bottom:-10px; }
  .scene-instructions { left:16px; bottom:235px; font-size:9px; }
  .detective-dialogue { grid-template-columns:64px minmax(0,1fr); gap:12px 14px; padding:16px; bottom:12px; left:12px; right:12px; min-height:204px; max-height:49svh; overflow:auto; }
  .dialogue-portrait { width:64px; height:90px; border-radius:3px; align-self:start; margin-top:2px; }
  .dialogue-copy p { font-size:13px; line-height:1.8; min-height:60px; margin:7px 0 10px; }
  .dialogue-kicker strong { font-size:16px; }
  .dialogue-kicker span { font-size:10px; margin-left:7px; }
  .dialogue-heading { display:block; padding-right:21px; }
  #dialogueStatus { display:block; font-size:9px; margin-top:4px; }
  .dialogue-actions { gap:5px; }
  .dialogue-actions button { font-size:11px; padding:5px 0; margin-right:10px; }
  .dialogue-tools { grid-column:1/-1; flex-direction:row; height:28px; justify-content:flex-end; border-top:1px solid #bca66c40; padding-top:10px; }
  .dialogue-tools #endConversation { position:absolute; right:9px; top:10px; }
  .dialogue-tools .enter-case { padding:0; font-size:11px; border:0; margin:0; }
  .field-dialog { padding:28px 22px 22px; }
  .field-dialog h2 { font-size:24px; }
  .field-dialog-heading { gap:14px; }
  .field-dialog .eyebrow { line-height:1.6; }
  #fieldDescription { font-size:14px; }
  .game-toast { top:8px; padding:10px 14px; font-size:12px; }
  .archive-guidance { font-size:11px; }
}