.lake-toast { position: absolute; left: 50%; top: 23%; transform: translateX(-50%); max-width: min(420px,calc(100% - 36px)); padding: 12px 20px; border: 1px solid #fff7e1aa; border-radius: 30px; color: #244e45; background: #fff6dfe8; font: 500 16px/1.45 'DM Sans',sans-serif; text-align: center; box-shadow: 0 8px 35px #1d4d4820; pointer-events: none; z-index: 3; }
.lake-toast[hidden] { display: none; }
.tour-return { display: none; position: absolute; left: 50%; bottom: 12%; transform: translateX(-50%); background: #fff5df; color: #254d43; border: 1px solid #e5dbc5; padding: 14px 22px; border-radius: 30px; font-size: 15px; z-index: 4; }
.is-touring .tour-return { display: block; }
.is-touring .intro, .is-touring .scene-note, .is-touring .fishing-controls, .is-touring .lake-label { opacity: 0; pointer-events: none; }
.is-sunset .intro h1, .is-sunset .intro p, .is-sunset .intro .eyebrow, .is-sunset .handnote, .is-sunset .nav-link, .is-sunset .brand, .is-sunset .round-button, .is-sunset .how-button, .is-sunset .navigation-controls > span, .is-sunset .scene-note, .is-sunset .game-status, .is-sunset .control-hint, .is-sunset .lake-label > #region-name { color: #fff1d7; }
.is-sunset .vignette { opacity: .5; }
.chapter-experience { margin: 0 0 20px; }
#dialog-content > .dialog-eyebrow { padding-right: 32px; }
.game-status { width: fit-content; max-width: 100%; margin: 0 auto 14px; padding: 8px 14px; border-radius: 12px; background: #fff7e0e8; }
.is-sunset .game-status { color: #244b43; }
.is-sunset .round-button { color: #284d41; }
.is-touring .fishing-controls, .is-touring .lake-label { visibility: hidden; }
.guide-experiences { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 36px; }
.guide-experiences > div { grid-column: 1 / -1; }
.guide-experiences h3 { font: 500 29px/1.2 'Playfair Display',serif; margin: 9px 0 16px; }
.experience-card { display: grid; grid-template-columns: 34px 1fr; gap: 7px 12px; padding: 22px 18px; background: #e8ecdc; border: 1px solid #c4ceb7; border-radius: 12px; color: #284b3f; text-align: left; }
.experience-card > span { grid-row: 1 / 4; font-size: 33px; line-height: 1; color: #a3482d; }
.experience-card strong { font: 500 21px/1.25 'Playfair Display',serif; }
.experience-card small { font-size: 13px; line-height: 1.5; color: #496253; }
.experience-card b { font-size: 13px; font-weight: 600; margin-top: 6px; }
.experience-card:hover { border-color: #6e8e72; background: #e0e8d1; }
.gentle-setting { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-top: 25px; font-size: 14px; }
.gentle-setting input { width: 20px; height: 20px; accent-color: #486d54; }
.gentle-setting span { color: #526653; font-size: 12px; }
.demo-banner { height: 175px; border-radius: 15px; overflow: hidden; position: relative; margin: 26px 0; background: #446849; }
.demo-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 50%; filter: brightness(.75); }
.demo-banner > span { position: absolute; left: 27px; top: 27px; font: 500 48px/1.1 'Playfair Display',serif; color: #fffbe7; text-shadow: 0 1px 12px #29402f; }
.demo-banner > span > span { display: block; margin-top: 8px; font: 400 15px/1.5 'DM Sans',sans-serif; }
.demo-toolbar { display: grid; grid-template-columns: 1fr 1.35fr; gap: 22px; padding: 22px; background: #ececda; border: 1px solid #d3d8bf; border-radius: 12px; }
.demo-toolbar label { min-width: 0; display: grid; gap: 9px; font-size: 13px; font-weight: 600; align-content: start; position: relative; }
.demo-toolbar select, .demo-results-bar select { background: #fffaf0; border: 1px solid #a8b69c; border-radius: 7px; color: #2e4c3c; font: 400 14px/1.4 'DM Sans',sans-serif; padding: 11px; min-height: 44px; width: 100%; }
.demo-toolbar input[type=range] { accent-color: #4c7655; width: 100%; height: 37px; cursor: pointer; margin: 0; }
.demo-toolbar output { position: absolute; top: 0; right: 0; font-weight: 700; }
.demo-results-bar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 24px 0 16px; }
.demo-results-bar p { font-size: 14px; margin: 0; color: #375640; }
.demo-results-bar label { display: flex; align-items: center; gap: 10px; font-size: 12px; white-space: nowrap; }
.demo-results-bar select { width: auto; }
.demo-results { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.demo-home { min-width: 0; border-radius: 13px; border: 1px solid #d1d5c0; background: #fffaf0; overflow: hidden; }
.demo-photo { aspect-ratio: 1.85; position: relative; background: #dce4d0; }
.demo-photo img { width: 100%; height: 100%; object-fit: cover; }
.demo-photo > span { position: absolute; bottom: 10px; left: 12px; background: #fff9e8ed; border-radius: 5px; font-size: 10px; letter-spacing: .3px; padding: 6px 8px; color: #355641; }
.demo-home-body { padding: 18px; }
.demo-city-name { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: #627559; }
.demo-home h3 { font: 500 23px/1.25 'Playfair Display',serif; margin: 8px 0 16px; min-height: 57px; }
.demo-home-facts { display: flex; justify-content: space-between; gap: 10px; padding: 14px 0; border-top: 1px solid #dde0cf; font-size: 11px; line-height: 1.6; }
.demo-home-facts strong { font-size: 18px; color: #365b41; }
.demo-home-facts small { color: #52634c; font-size: 10px; }
.demo-home .text-link { font-size: 13px; }
.preview-note { font-size: 12px; line-height: 1.7; color: #5c6954; margin: 22px 0; }
.demo-empty { grid-column: 1 / -1; padding: 28px; background: #ededdc; border-radius: 12px; text-align: center; }
.demo-empty > span { font-size: 48px; color: #6c8460; }
.demo-empty h3 { font: 500 27px/1.3 'Playfair Display',serif; margin: 10px 0; }
.demo-empty p { font-size: 15px; line-height: 1.6; }
.thinking-question { padding: 24px; background: #e6ebdf; border-left: 3px solid #618176; border-radius: 0 13px 13px 0; margin: 24px 0; }
.thinking-question > span { font-size: 11px; letter-spacing: 1.2px; color: #507161; }
.thinking-question h3 { font: 500 29px/1.3 'Playfair Display',serif; margin: 12px 0; }
.thinking-question p { font-size: 15px; line-height: 1.7; margin-bottom: 0; color: #435d50; }
.thinking-toggle { display: flex; gap: 8px; padding: 6px; background: #e8e5d7; border-radius: 10px; }
.thinking-toggle button { flex: 1; padding: 12px; border: 1px solid transparent; border-radius: 7px; background: transparent; font-size: 14px; color: #3d5c4b; min-height: 48px; }
.thinking-toggle [aria-pressed=true] { background: #456454; color: #fffae9; box-shadow: 0 2px 8px #2d453320; }
.thinking-sketch { display: grid; grid-template-columns: 105px 1fr; gap: 20px; padding: 30px 20px 24px; margin-top: 18px; background-color: #f2efdf; background-image: radial-gradient(#bdc7b3 .7px,transparent .7px); background-size: 14px 14px; border: 1px solid #d2d5bf; border-radius: 12px; }
.sketch-campus { display: flex; flex-direction: column; justify-content: center; gap: 8px; text-align: center; }
.sketch-campus > span { font-size: 42px; color: #5b7a65; }
.sketch-campus strong { font-size: 15px; }
.sketch-campus small { font-size: 11px; }
.sketch-routes { display: grid; gap: 16px; }
.sketch-route { display: grid; grid-template-columns: 1fr 40px 90px; align-items: center; column-gap: 9px; }
.route-line { font-size: 11px; border-bottom: 2px dashed #93a586; padding: 10px 0; text-align: center; }
.sketch-house { font-size: 42px; color: #8a7152; }
.sketch-route strong { font: 500 19px/1.2 'Playfair Display',serif; }
.sketch-route small { display: block; font-size: 11px; margin-top: 5px; }
.sketch-route b { grid-column: 2 / -1; font-size: 9px; letter-spacing: 1px; color: #46643b; padding-top: 5px; }
.first-choice .sketch-house { color: #bd5535; }
.thinking-insight { font-size: 16px; line-height: 1.65; padding: 18px 0; margin: 0; color: #345143; }
.thinking-notes { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin: 16px 0 24px; }
.thinking-notes article { border-top: 1px solid #b2bfa4; padding-top: 16px; }
.thinking-notes span { font-size: 10px; color: #7c5134; letter-spacing: .7px; }
.thinking-notes h3 { font: 500 22px/1.25 'Playfair Display',serif; margin: 10px 0; }
.thinking-notes p { font-size: 13px; line-height: 1.7; color: #455d4d; }
.gentle-motion *, .gentle-motion *::before, .gentle-motion *::after { transition-duration: 0s!important; animation-duration: 0s!important; }
@media(max-width:700px){
  .lake-toast { top: 40%; font-size: 14px; padding: 10px 16px; width: max-content; }
  .tour-return { bottom: 184px; padding: 12px 17px; font-size: 14px; white-space: nowrap; }
  .game-status { width: calc(100vw - 32px); max-width: none; margin: 0; padding: 8px 12px; font-size: 13px; }
  .guide-experiences { grid-template-columns: 1fr; }
  .experience-card { padding: 18px; }
  .demo-banner { height: 145px; }
  .demo-banner > span { left: 20px; top: 24px; font-size: 40px; }
  .demo-toolbar { grid-template-columns: 1fr; padding: 18px; gap: 18px; }
  .demo-results { grid-template-columns: 1fr; }
  .demo-results-bar { gap: 10px; align-items: start; }
  .demo-results-bar p { padding-top: 10px; font-size: 12px; }
  .demo-results-bar label { flex-direction: column; align-items: start; gap: 4px; }
  .demo-results-bar select { font-size: 12px; padding: 8px; }
  .demo-home h3 { min-height: 0; }
  .demo-home-facts { font-size: 12px; }
  .demo-home-facts small { font-size: 11px; }
  .thinking-question { padding: 20px; }
  .thinking-question h3 { font-size: 26px; }
  .thinking-toggle button { font-size: 12px; padding: 10px; }
  .thinking-sketch { grid-template-columns: 60px 1fr; gap: 8px; padding: 20px 10px; }
  .sketch-campus strong { font-size: 12px; }
  .sketch-campus small { font-size: 10px; }
  .sketch-route { grid-template-columns: 1fr 30px 66px; gap: 5px; }
  .sketch-route strong { font-size: 16px; }
  .sketch-route small, .route-line { font-size: 10px; }
  .sketch-house { font-size: 32px; }
  .thinking-notes { grid-template-columns: 1fr; gap: 12px; }
}
@media(max-height:520px) and (min-width:600px){
  .lake-toast { top: 22%; }
  .tour-return { bottom: 22%; }
  .game-status { width: auto; max-width: 100%; margin: 0 0 12px; }
}
@media(prefers-reduced-motion:reduce){ .lake-toast,.tour-return { transition: none; } }