/* Compact, tactile controls share the world's existing pixel sprites. */
.daily-agenda[hidden] { display: none; }
.first-day-route { margin: 0 0 16px; padding: 14px; border: 1px solid #56796f; background: #10211f; color: #e7f3e5; }
.first-day-route-head { display: flex; gap: 10px; align-items: flex-start; }
.first-day-route-head strong { display: block; font-size: 15px; }
.first-day-route-head p { margin: 3px 0 0; color: #b9d1c5; font-size: 12px; line-height: 1.45; }
.first-day-route ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.first-day-route li { display: flex; align-items: center; gap: 6px; min-width: 0; color: #dbe9df; font-size: 11px; line-height: 1.35; }
.first-day-route li svg { flex: 0 0 16px; color: #f0ce79; }
@media (max-width: 600px) { .first-day-route ol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.daily-agenda .agenda-copy { flex: 1; min-width: 0; }
.daily-agenda .agenda-copy strong { display: block; white-space: normal; overflow-wrap: anywhere; line-height: 1.35; }
.daily-agenda .agenda-copy small { display: block; font: 11px/1.4 system-ui,sans-serif; color: #b9d1c5; overflow-wrap: anywhere; }
.daily-agenda .agenda-emblem { display: grid; place-items: center; flex: 0 0 28px; height: 28px; color: #f0ce79; }
.daily-agenda.agenda-intro { flex-basis: auto; min-height: 58px; padding-top: 7px; padding-bottom: 7px; }
.daily-agenda.agenda-changed { animation: chapter-reveal .4s ease-out; }
.event-option { min-width: 0; border-top: 1px solid #496058; padding-top: 12px; }
.event-option button { width: 100%; min-height: 44px; white-space: normal; }
.event-option small { display: block; margin: 8px 0; font: 12px/1.5 system-ui,sans-serif; color: #c7d8ca; overflow-wrap: anywhere; }
.event-option .event-blocked { color: #f1c38c; }
.event-location { display: flex; align-items: center; gap: 8px; }
.story-result { border-left: 3px solid #a2d5a5; padding: 4px 14px; margin: 12px 0 20px; animation: chapter-reveal .4s ease-out; }
.story-result h3 { display: flex; align-items: center; gap: 8px; color: #b3ebad; }
@keyframes chapter-reveal { from { box-shadow: inset 4px 0 #f0ce79; } to { box-shadow: inset 0 0 transparent; } }
.growth-strip { flex: 0 0 48px; display: flex; align-items: center; gap: 14px; padding: 4px 18px; background: #172a29; border-bottom: 1px solid #507268; color: #edf5e8; min-width: 0; }
.growth-strip button { color: inherit; background: transparent; border: 0; font: inherit; cursor: pointer; }
.growth-path { display: flex; align-items: center; gap: 8px; min-height: 38px; }
.growth-path small { color: #a9c6b8; font-variant-numeric: tabular-nums; }
.growth-next { flex: 1; min-width: 0; font-size: 12px; }
.growth-next > span { display: block; overflow-wrap: anywhere; line-height: 1.3; }
.growth-pips { display: flex; gap: 4px; margin-top: 5px; max-width: 180px; }
.growth-pips i { height: 3px; flex: 1; background: #395149; }
.growth-pips .done { background: #a2d5a5; }
.growth-pips .current { background: #f0ce79; }
.growth-go { width: 40px; height: 38px; border-left: 1px solid #507268 !important; flex-shrink: 0; }
.growth-paths { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.growth-paths section { padding: 12px 0; border-top: 2px solid #547b6b; min-width: 0; }
.growth-paths h3 { font-size: 16px; display: flex; gap: 8px; align-items: center; }
.growth-paths ol { list-style: none; padding: 0; margin: 18px 0; }
.growth-paths li { display: flex; gap: 8px; align-items: center; margin: 12px 0; font-size: 13px; color: #c1cbd0; }
.growth-paths li.complete { color: #a2d5a5; }
.growth-paths .ico { flex-shrink: 0; }
#gameScreen button, .life-journal button, .growth-paths button { transition: background-color .14s, border-color .14s, box-shadow .14s, transform .14s; }
#gameScreen button:active:not(:disabled), .life-journal button:active:not(:disabled) { transform: translateY(2px); }
#gameScreen button:focus-visible, .life-journal button:focus-visible, .growth-paths button:focus-visible { outline: 2px solid #f0ce79; outline-offset: 3px; }
.scene-nav .scene-tab { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; border-radius: 4px; box-shadow: 0 3px 0 #10252b; }
.scene-tab .ico { width: 18px; height: 18px; }
.scene-nav .scene-tab:hover { border-color: #c6dbb9; }
.scene-nav .scene-tab[aria-pressed="true"] { box-shadow: 0 3px 0 #668773; }
.scene-tools { max-width: 820px; z-index: 5; padding: 4px 0; scrollbar-width: thin; }
.scene-tools .scene-action { display: grid; grid-template-columns: 22px minmax(0,1fr); align-items: center; gap: 4px 8px; min-height: 56px; padding: 9px 12px; background: #193a36; border: 1px solid #719d88; border-radius: 4px; box-shadow: 0 4px 0 #152a29; text-align: left; color: #f0f5e9; }
.scene-action > .ico { grid-row: 1 / span 2; width: 22px; height: 22px; }
.scene-action > span { font-size: 12px; line-height: 1.3; }
.scene-action small { grid-column: 2; font: 10px/1.2 system-ui,sans-serif; color: #c9d9c8; display: flex; gap: 3px; align-items: center; }
.scene-action small .ico { width: 11px; height: 11px; }
.scene-tools .scene-action:hover:not(:disabled) { background: #2e5547; border-color: #e3d7a3; box-shadow: 0 4px 0 #152a29, 0 0 0 1px #e3d7a3; }
.scene-tools .scene-action:disabled { opacity: .55; filter: saturate(.5); }
.scene-caption { pointer-events: none; }
.scene-hotspots { position: absolute; inset: 0; pointer-events: none; z-index: 4; }
.scene-object { position: absolute; transform: translate(-50%,-50%); pointer-events: auto; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #f0d78c; border-radius: 4px; background: #223f38ee; color: #fff5cf; cursor: pointer; box-shadow: 0 3px 0 #162b28; }
#gameScreen .scene-object:active { transform: translate(-50%,calc(-50% + 2px)); }
.scene-object .ico { width: 20px; height: 20px; }
.scene-object span { display: none; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); max-width: 170px; min-width: 72px; padding: 6px 8px; background: #162b28; font: 12px/1.4 system-ui,sans-serif; text-align: center; border: 1px solid #8fb49a; border-radius: 3px; }
.scene-object:hover, .scene-object:focus-visible { background: #496849; }
.scene-object:hover span, .scene-object:focus-visible span { display: block; }
#actionFeedback { position: fixed; z-index: 1300; bottom: 22px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; width: max-content; max-width: calc(100% - 24px); pointer-events: none; }
#actionFeedback[hidden] { display: none; }
#actionFeedback > span { display: flex; align-items: center; gap: 5px; padding: 8px 10px; border: 1px solid #7d9f82; background: #172e29f5; border-radius: 4px; font: 13px/1.3 system-ui,sans-serif; box-shadow: 0 3px 0 #091b16; }
#actionFeedback .gain { color: #b3ebad; }
#actionFeedback .loss { color: #ffc0b1; border-color: #a37970; }
.life-tabs { position: sticky; top: 0; z-index: 2; background: var(--bg-panel,#12142a); padding-top: 4px; }
.life-tabs .pixel-btn { display: flex; gap: 6px; align-items: center; justify-content: center; }
.life-tabs .ico { width: 16px; height: 16px; flex-shrink: 0; }
.life-content details { margin: 12px 0; border-top: 1px solid #53685d; padding-top: 8px; font-size: 12px; color: #c0cdc5; }
.life-content summary { cursor: pointer; color: #e5d89c; min-height: 30px; display: list-item; }
.project-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); list-style: none; padding: 0 !important; margin: 18px 0; gap: 12px; }
.project-steps li { font-size: 12px; line-height: 1.5; border-top: 3px solid #51605b; padding-top: 10px; }
.project-steps .done { border-color: #92caa0; color: #a2d5a5; }
.project-steps .current { border-color: #e9c878; color: #f1dca6; }
.project-steps b { display: block; font: 20px/1.4 system-ui,sans-serif; margin-bottom: 5px; }
.life-meters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 16px 0; }
.life-meter { font-size: 12px; display: flex; flex-direction: column; gap: 7px; }
.life-meter meter { width: 100%; height: 12px; accent-color: #98cc9a; }
.life-meter progress { width: 100%; height: 12px; accent-color: #e9c878; }
.opportunity-board { display: grid; gap: 0; margin: 16px 0; }
.opportunity-row { display: grid; grid-template-columns: 24px minmax(0,1fr) 18px; gap: 12px; align-items: center; width: 100%; min-height: 72px; padding: 14px 0; border: 0; border-bottom: 1px solid #53685d; background: transparent; color: #e4e6ee; text-align: left; cursor: pointer; font: inherit; }
.opportunity-row:hover, .opportunity-row:focus-visible { background: #263c36; }
.opportunity-row:focus-visible { outline: 2px solid #e9c878; outline-offset: 2px; }
.opportunity-copy { display: grid; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
.opportunity-copy strong { font-size: 13px; line-height: 1.5; }
.opportunity-copy small { font: 12px/1.5 system-ui,sans-serif; color: #bfc8d1; }
.opportunity-copy .opportunity-status { color: #c8baa1; }
.opportunity-row.is-ready .opportunity-status { color: #a5d7b2; }
.opportunity-copy progress { width: 100%; height: 6px; margin-top: 3px; accent-color: #e9c878; }
.life-action button { display: flex; gap: 8px; justify-content: center; align-items: center; }
.life-action button .ico { flex-shrink: 0; }
.life-row h4 .ico { width: 22px; height: 22px; margin-right: 8px; vertical-align: middle; }
.development-project { border-block: 1px solid #68877b; padding: 14px 0; margin: 16px 0; min-width: 0; }
.career-decisions { display: grid; gap: 8px; }
.career-decisions .iv-opt { overflow-wrap: anywhere; min-height: 44px; }
.career-decisions .iv-opt:disabled { opacity: .55; cursor: default; }
.life-content .career-debrief { margin: 12px 0; padding: 10px 0 10px 12px; border-top: 0; border-left: 3px solid #c5a46e; color: #cbd3d9; animation: chapter-reveal .3s ease-out; }
.life-content .career-debrief.is-good { border-left-color: #98cc9a; }
.career-debrief summary { color: #e8d59e; }
.career-debrief summary > span { display: inline; line-height: 1.5; }
.career-debrief summary .ico { vertical-align: middle; margin-right: 7px; }
.career-debrief summary small { display: block; color: #bfcbc7; font: 12px/1.5 system-ui,sans-serif; padding-top: 5px; }
.career-debrief p, .career-debrief dd { overflow-wrap: anywhere; }
.career-debrief dt { color: #e8d59e; margin-top: 12px; }
.career-debrief dd { margin: 5px 0; line-height: 1.6; }
.debrief-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 14px 0; }
.debrief-metrics > span { display: grid; gap: 4px; }
.debrief-metrics strong { font: bold 16px/1.4 system-ui,sans-serif; color: #e9d593; }
.companion-visit { padding: 10px 0; }
.companion-visit > strong { display: flex; gap: 8px; align-items: center; color: #e6d09b; font-size: 13px; }
.companion-visit > small { display: block; font: 12px/1.6 system-ui,sans-serif; color: #bfc8d1; overflow-wrap: anywhere; }
.friendship-keepsake { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid #53685d; }
.friendship-keepsake h4 { margin: 0 0 5px; font-size: 13px; }
.friendship-keepsake p { margin: 0 0 5px; font-size: 12px; overflow-wrap: anywhere; }
.friendship-keepsake small { color: #bfc8d1; font: 12px/1.5 system-ui,sans-serif; }
.keepsake-symbol { display: grid; place-items: center; width: 38px; height: 44px; background: #29473e; border: 2px solid #93b8a5; color: #f1d69e; }
.keepsake-symbol.motif-1,.keepsake-symbol.motif-3,.keepsake-symbol.motif-5 { border-style: dashed; }
.keepsake-symbol.motif-2,.keepsake-symbol.motif-3 { background: #3c3447; border-color: #b993a7; }
.keepsake-symbol.motif-4,.keepsake-symbol.motif-5 { background: #2c3e53; border-color: #91a7c5; }
.growth-paths li:nth-child(3n + 4) { border-top: 1px solid #53685d; padding-top: 12px; }
@keyframes milestone-hit { 0%,100% { background: #172a29; } 40% { background: #3e5f3d; } }
.milestone-hit { animation: milestone-hit .8s ease-out; }
@media (max-width:600px) {
  .growth-strip { flex-basis: 44px; padding: 3px 10px; gap: 10px; }
  .growth-path { gap: 5px; font-size: 11px !important; }
  .growth-next { font-size: 11px; }
  .growth-paths { grid-template-columns: minmax(0,1fr); gap: 6px; }
  .scene-nav { max-width: calc(100% - 16px); }
  .scene-nav .scene-tab { padding: 6px 8px; gap: 5px; }
  .scene-tools .scene-action { min-height: 52px; padding: 7px 9px; gap: 3px 6px; }
  .scene-tools { flex-wrap: nowrap; overflow-x: auto; max-width: none; bottom: calc(var(--bar-h) + 16px); }
  .scene-tools .scene-action { flex: 0 0 auto; }
  .scene-object { width: 34px; height: 34px; }
  .life-tabs .pixel-btn { flex: 1 0 20%; font-size: 11px; padding: 7px 5px; }
  .project-steps { gap: 8px; }
  .project-steps li { font-size: 11px; }
  .feedback-label { display: none; }
}
@media (max-height:600px) {
  .growth-strip { flex-basis: 34px; padding-top: 0; padding-bottom: 0; }
  .growth-path { min-height: 30px; }
  .growth-go { height: 28px; }
  .scene-caption { top: 86px; }
  .scene-caption strong { font-size: 14px; }
  .scene-caption span { display: none; }
  .scene-tools .scene-action { min-height: 40px; padding: 5px 8px; }
  .scene-object { width: 30px; height: 30px; }
}
@media (prefers-reduced-motion:reduce) {
  .daily-agenda.agenda-changed, .story-result, .life-content .career-debrief { animation: none; }
  #gameScreen button, .life-journal button, .growth-paths button { transition: none; }
  .milestone-hit { animation: none; }
}
@media (max-height:480px) and (orientation:landscape) {
  #gameScreen .hud { flex-wrap: nowrap; height: 76px; min-height: 76px; max-height: 76px; overflow-x: auto; padding-top: 4px; padding-bottom: 4px; }
  #gameScreen .hud-group { flex-shrink: 0; }
  #gameScreen .hud-group.market { display: none; }
  #gameScreen .hud-group.wealth { flex: 1 0 120px; }
  .scene-caption { top: 88px; }
  .scene-tools { bottom: calc(var(--bar-h) + 26px); }
  .scene-tools .scene-action { min-height: 42px; }
}