* { box-sizing: border-box; }
:root {
  --gb-dark: #0f380f;
  --gb-mid: #306230;
  --gb-light: #8bac0f;
  --gb-pale: #c4d68a;
  --gb-blue: #add8e6;
  --gb-red: #e14a2a;
  --pixel-shadow: 6px 6px 0 #0f380f;
}
body { margin: 0; min-height: 100vh; font-family: "Courier New", Courier, monospace; color: var(--gb-dark); background: repeating-linear-gradient(0deg, rgba(15,56,15,.08) 0 2px, transparent 2px 4px), radial-gradient(circle at top left, #d8f3a2, #8bac0f 46%, #306230); image-rendering: pixelated; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; background: linear-gradient(rgba(255,255,255,.08) 50%, rgba(15,56,15,.08) 50%); background-size: 100% 4px; mix-blend-mode: multiply; z-index: 2000; }
.shell { min-height: 100vh; padding: 24px; display: flex; flex-direction: column; gap: 22px; }
.hero, .panel, .map-card { border: 4px solid var(--gb-dark); border-radius: 0; background: var(--gb-pale); box-shadow: var(--pixel-shadow); }
.hero { display: flex; justify-content: space-between; gap: 24px; padding: 24px; }
.eyebrow { display: inline-block; margin: 0 0 12px; padding: 5px 8px; color: var(--gb-pale); background: var(--gb-dark); text-transform: uppercase; letter-spacing: .14em; font-size: .75rem; font-weight: 900; }
h1 { margin: 0; font-size: clamp(2.1rem, 6vw, 4.7rem); line-height: .92; max-width: 820px; text-transform: uppercase; text-shadow: 3px 3px 0 var(--gb-light); }
.lede { max-width: 900px; color: var(--gb-dark); font-size: 1rem; line-height: 1.55; font-weight: 700; }
.tagline { max-width: 820px; margin: 14px 0 8px; padding: 8px 10px; border-left: 6px solid var(--gb-dark); color: var(--gb-dark); background: var(--gb-blue); font-size: .92rem; font-weight: 900; line-height: 1.45; }
.city-card, .date-card { min-width: 290px; align-self: stretch; display: grid; gap: 12px; align-content: center; padding: 18px; border: 4px double var(--gb-dark); background: #e6f2a8; color: var(--gb-dark); font-weight: 900; text-transform: uppercase; }
.city-card select, .date-card input { width: 100%; color: var(--gb-dark); background: var(--gb-blue); border: 3px solid var(--gb-dark); border-radius: 0; padding: 12px; font: inherit; font-weight: 900; }
.date-card strong { color: var(--gb-dark); }
.dashboard { flex: 1; min-height: calc(100vh - 250px); display: grid; grid-template-columns: minmax(300px, 380px) minmax(720px, 1fr); gap: 22px; }
.panel { padding: 20px; overflow: hidden; }
.stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.stats div { padding: 14px; border: 3px solid var(--gb-dark); background: var(--gb-blue); }
.stats span { display: block; color: var(--gb-dark); font-weight: 900; text-transform: uppercase; font-size: .72rem; }
.stats strong { font-size: 2.1rem; line-height: 1; }
h2 { margin: 22px 0 12px; padding: 5px 8px; font-size: .95rem; color: var(--gb-pale); background: var(--gb-dark); text-transform: uppercase; letter-spacing: .08em; }
ol { list-style: none; display: grid; gap: 8px; padding: 0; margin: 0; }
li { display: flex; justify-content: space-between; gap: 14px; padding: 10px; border: 3px solid var(--gb-dark); background: #e6f2a8; color: var(--gb-dark); font-weight: 900; }
li b { color: var(--gb-red); }
.legend { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; color: var(--gb-dark); font-size: .8rem; font-weight: 900; text-transform: uppercase; }
.legend i { height: 18px; border: 3px solid var(--gb-dark); background: linear-gradient(90deg, #add8e6, #57c7ff, #43ff65, #ffd02f, #ff251f); }
.note { margin-top: 18px; color: var(--gb-dark); line-height: 1.5; font-weight: 700; }
.map-card { position: relative; overflow: hidden; min-height: 760px; padding: 12px; background: #d5e894; }
.map-card::before { content: "UBEREDGE MAP SCREEN"; position: absolute; z-index: 950; left: 22px; bottom: 18px; padding: 5px 8px; color: var(--gb-pale); background: var(--gb-dark); font-size: .72rem; font-weight: 900; letter-spacing: .1em; pointer-events: none; }
.map-toolbar { position: absolute; z-index: 900; top: 24px; left: 24px; right: 24px; display: flex; justify-content: space-between; gap: 12px; opacity: 1; transform: translateY(0); transition: opacity .2s ease, transform .2s ease; pointer-events: none; }
.map-toolbar.map-toolbar-hidden { opacity: 0; transform: translateY(-18px); }
.map-toolbar span { padding: 9px 12px; border: 3px solid var(--gb-dark); border-radius: 0; background: var(--gb-pale); color: var(--gb-dark); font-weight: 900; text-transform: uppercase; }
#map { width: 100%; height: 100%; min-height: 730px; display: block; border: 4px solid var(--gb-dark); background: var(--gb-blue); filter: saturate(.72) contrast(1.15); }
.leaflet-container { background: var(--gb-blue); font: inherit; }
.leaflet-tile-pane { transition: filter .25s ease; }
body[data-map-theme="light"] .leaflet-tile-pane { filter: none; }
body[data-map-theme="dark"] .leaflet-tile-pane { filter: invert(.92) hue-rotate(180deg) brightness(.68) contrast(1.12) saturate(.65); }
body[data-map-theme="vivid"] .leaflet-tile-pane { filter: saturate(1.65) contrast(1.08) brightness(1.03); }
.leaflet-popup-content-wrapper, .leaflet-popup-tip { border-radius: 0; background: var(--gb-pale); color: var(--gb-dark); border: 3px solid var(--gb-dark); box-shadow: 4px 4px 0 var(--gb-dark); }
.leaflet-control-attribution { font-size: 10px; background: rgba(196,214,138,.85); color: var(--gb-dark); }
.leaflet-bar a { border-radius: 0 !important; background: var(--gb-pale) !important; color: var(--gb-dark) !important; border-color: var(--gb-dark) !important; font-weight: 900; }
.map-fallback { position: relative; background: var(--gb-blue); }
#fallbackLayer { position: absolute; inset: 0; overflow: hidden; }
.fallback-heat { position: absolute; width: 170px; height: 170px; transform: translate(-50%, -50%); border-radius: 999px; filter: blur(18px); opacity: .78; }
.heat-1 { background: radial-gradient(circle, #add8e6, transparent 68%); }
.heat-2 { background: radial-gradient(circle, #00d4ff, transparent 68%); }
.heat-3 { background: radial-gradient(circle, #43ff65, transparent 68%); }
.heat-4 { background: radial-gradient(circle, #ffd02f, transparent 68%); }
.heat-5 { background: radial-gradient(circle, #ff251f, transparent 68%); }
.leaflet-heatmap-layer { pointer-events: none; }
.google-event-heatmap { position: absolute; z-index: 0 !important; pointer-events: none; }
.timeline { display: grid; grid-template-columns: 48px 1fr; gap: 10px; min-height: 500px; margin-bottom: 22px; }
.timeline-hours { display: flex; flex-direction: column; justify-content: space-between; padding: 4px 0; color: var(--gb-dark); font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.timeline-events { position: relative; min-height: 500px; border: 3px solid var(--gb-dark); background: repeating-linear-gradient(0deg, #d8efa0 0 23px, #c4d68a 23px 46px); overflow: hidden; }
.timeline-events::before { content: ""; position: absolute; inset: 25% 0 25% 0; border-top: 2px dashed rgba(15,56,15,.45); border-bottom: 2px dashed rgba(15,56,15,.45); pointer-events: none; }
.timeline-event { position: absolute; min-height: 34px; overflow: hidden; display: grid; align-content: start; gap: 1px; padding: 7px 8px; border: 3px solid var(--gb-dark); border-radius: 0; color: var(--gb-dark); background: var(--gb-blue); box-shadow: 3px 3px 0 var(--gb-dark); cursor: pointer; text-align: left; font: inherit; }
.timeline-event:hover, .timeline-event:focus-visible { outline: 3px solid #ffffff; z-index: 5; transform: translate(-1px, -1px); }
.timeline-event b { font-size: .68rem; }
.timeline-event span { font-size: .78rem; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; }
.timeline-event small { font-size: .64rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .9; }
.timeline-empty { padding: 12px; color: var(--gb-dark); font-weight: 900; }
@media (max-width: 1100px) { .dashboard { grid-template-columns: 1fr; min-height: auto; } .map-card, #map { min-height: 700px; } }
@media (max-width: 900px) { .shell { padding: 16px; } .hero { display: grid; } .city-card, .date-card { min-width: 0; } .map-card, #map { min-height: 580px; } }
.dashboard { position: relative; transition: grid-template-columns .35s steps(6, end); }
.slide-tab { border: 4px solid var(--gb-dark); border-radius: 0; color: var(--gb-pale); background: var(--gb-dark); box-shadow: 4px 4px 0 var(--gb-mid); font: inherit; font-size: .78rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; z-index: 1100; }
.slide-tab:hover, .slide-tab:focus-visible { color: var(--gb-dark); background: var(--gb-blue); outline: 3px solid #fff; }
.timetable-tab { position: absolute; top: 18px; left: 18px; writing-mode: vertical-rl; min-height: 160px; padding: 12px 8px; }
.map-tab { position: absolute; top: 18px; right: -78px; writing-mode: vertical-rl; min-height: 110px; padding: 12px 8px; }
.dashboard.timetable-closed { grid-template-columns: 0 minmax(720px, 1fr); }
.dashboard.timetable-closed .panel { transform: translateX(calc(-100% - 28px)); opacity: 0; pointer-events: none; }
.dashboard.timetable-closed .map-card { grid-column: 1 / 3; }
.dashboard.timetable-closed .timetable-tab { opacity: 1; pointer-events: auto; }
.dashboard.timetable-closed .map-tab { opacity: 0; pointer-events: none; }
.dashboard.timetable-open { grid-template-columns: minmax(340px, 430px) minmax(720px, 1fr); overflow: hidden; }
.dashboard.timetable-open .panel { transform: translateX(0); opacity: 1; pointer-events: auto; }
.dashboard.timetable-open .map-card { transform: translateX(calc(100% + 28px)); opacity: .35; pointer-events: none; }
.dashboard.timetable-open .timetable-tab { opacity: 0; pointer-events: none; }
.dashboard.timetable-open .map-tab { opacity: 1; pointer-events: auto; }
.panel, .map-card { transition: transform .35s steps(6, end), opacity .35s steps(6, end); }
@media (max-width: 1100px) {
  .dashboard.timetable-closed, .dashboard.timetable-open { grid-template-columns: 1fr; }
  .dashboard.timetable-closed .panel { position: absolute; inset: 0 auto 0 0; width: min(88vw, 430px); }
  .dashboard.timetable-open .map-card { transform: translateX(105%); }
  .map-tab { right: 12px; }
}
/* Sliding panel refinement: tabs sit directly beside the active panel and no empty gutter is reserved. */
.dashboard { gap: 0; }
.dashboard { scroll-margin-top: 8px; }
.dashboard.timetable-closed { grid-template-columns: 1fr; }
.dashboard.timetable-closed .panel { position: absolute; inset: 0 auto 0 0; width: min(92vw, 430px); transform: translateX(calc(-100% - 8px)); opacity: 0; pointer-events: none; }
.dashboard.timetable-closed .map-card { grid-column: 1; transform: translateX(0); opacity: 1; pointer-events: auto; }
.dashboard.timetable-closed .timetable-tab { left: 12px; top: 24px; opacity: 1; pointer-events: auto; }
.dashboard.timetable-open { grid-template-columns: 1fr; }
.dashboard.timetable-open .panel { grid-column: 1; grid-row: 1; align-self: start; width: 100%; min-height: 760px; transform: translateX(0); opacity: 1; pointer-events: auto; }
.dashboard.timetable-open .map-card { grid-column: 1; grid-row: 1; transform: translateX(104%); opacity: 0; pointer-events: none; }
.dashboard.timetable-open .map-tab { position: fixed; top: 50%; right: 18px; transform: translateY(-50%); opacity: 1; pointer-events: auto; min-height: 120px; }
.dashboard.timetable-open .timetable-tab { opacity: 0; pointer-events: none; }
.dashboard.timetable-open .timeline { min-height: 560px; }
.dashboard.timetable-open .timeline-events { min-height: 560px; }
body.city-boston { --city-bg-1: #f1f3f4; --city-bg-2: #9aa0a6; --city-bg-3: #101418; }
body.city-la { --city-bg-1: #ffd29a; --city-bg-2: #ff6b35; --city-bg-3: #8f1d12; }
body.city-atlanta { --city-bg-1: #ffcad4; --city-bg-2: #3157a4; --city-bg-3: #8b0000; }
body.city-nyc { --city-bg-1: #ead7ff; --city-bg-2: #7b2cbf; --city-bg-3: #260044; }
body.city-seattle { --city-bg-1: #d8f3dc; --city-bg-2: #40916c; --city-bg-3: #0b3d2e; }
body.city-chicago { --city-bg-1: #ffffff; --city-bg-2: #dfe7ef; --city-bg-3: #9fb3c8; }
body.city-miami { --city-bg-1: #ffd6e8; --city-bg-2: #45d6d3; --city-bg-3: #2d1b72; }
body[class*="city-"] { background: repeating-linear-gradient(0deg, rgba(15,56,15,.08) 0 2px, transparent 2px 4px), radial-gradient(circle at top left, var(--city-bg-1, #d8f3a2), var(--city-bg-2, #8bac0f) 46%, var(--city-bg-3, #306230)); }
.pixel-drive { position: relative; width: min(520px, 70vw); height: 42px; margin-bottom: 12px; overflow: hidden; border: 4px solid var(--gb-dark); background: linear-gradient(#a7d8ff 0 45%, #78b84a 45% 100%); box-shadow: 4px 4px 0 var(--gb-dark); }
.pixel-road { position: absolute; left: 0; right: 0; bottom: 0; height: 15px; background: repeating-linear-gradient(90deg, #1d1d1d 0 34px, #f8f8d8 34px 50px, #1d1d1d 50px 84px); }
.pixel-car { position: absolute; z-index: 2; left: 10px; bottom: 12px; width: 54px; height: 18px; background: #e14a2a; box-shadow: 12px -10px 0 #e14a2a, 22px -10px 0 #e14a2a, 34px -4px 0 #ffd166, 8px 18px 0 -4px #0f380f, 38px 18px 0 -4px #0f380f; animation: pixel-drive 4.5s steps(12, end) infinite; }
.pixel-car::before, .pixel-car::after { content: ""; position: absolute; bottom: -7px; width: 10px; height: 10px; background: #0f380f; border: 2px solid #c4d68a; }
.pixel-car::before { left: 7px; } .pixel-car::after { right: 7px; }
@keyframes pixel-drive { from { transform: translateX(-80px); } to { transform: translateX(620px); } }
.dashboard.timetable-open .panel { padding-top: 18px; }
.dashboard.timetable-open .stats, .dashboard.timetable-open .panel h2:nth-of-type(n+2), .dashboard.timetable-open #hotList, .dashboard.timetable-open .legend, .dashboard.timetable-open .note { display: none; }
.dashboard.timetable-open .panel h2:first-of-type { margin-top: 0; }
.about-project { padding: 24px; border: 4px solid var(--gb-dark); background: var(--gb-pale); box-shadow: var(--pixel-shadow); }
.about-project > h2 { display: inline-block; margin: 0 0 12px; }
.about-intro { max-width: 1000px; margin: 4px 0 20px; font-weight: 700; line-height: 1.65; }
.about-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.about-grid article { padding: 16px; border: 3px solid var(--gb-dark); background: #e6f2a8; box-shadow: 3px 3px 0 var(--gb-mid); }
.about-grid article:last-child { grid-column: 1 / -1; background: var(--gb-blue); }
.about-grid h3 { margin: 0 0 8px; color: var(--gb-dark); font-size: .9rem; text-transform: uppercase; }
.about-grid p { margin: 0; font-size: .88rem; font-weight: 700; line-height: 1.55; }
.recommendation-control { position: absolute; z-index: 1000; right: 24px; bottom: 24px; width: min(360px, calc(100% - 48px)); padding: 10px; border: 3px solid var(--gb-dark); background: var(--gb-pale); box-shadow: 4px 4px 0 var(--gb-dark); }
.recommendation-control button { width: 100%; padding: 9px; border: 3px solid var(--gb-dark); color: var(--gb-pale); background: var(--gb-dark); font: inherit; font-weight: 900; cursor: pointer; }
.recommendation-control button:hover, .recommendation-control button:focus-visible { color: var(--gb-dark); background: var(--gb-blue); outline: 2px solid #fff; }
.recommendation-control output { display: block; margin-top: 8px; max-height: 110px; overflow: auto; color: var(--gb-dark); font-size: .72rem; font-weight: 700; line-height: 1.45; }
.site-nav { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px; border: 4px solid var(--gb-dark); background: var(--gb-pale); box-shadow: var(--pixel-shadow); }
.site-nav a, .pixel-link { display: inline-block; padding: 8px 12px; border: 3px solid var(--gb-dark); color: var(--gb-dark); background: var(--gb-blue); font-weight: 900; text-decoration: none; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"], .pixel-link:hover { color: var(--gb-pale); background: var(--gb-dark); }
.park-status { position: absolute; z-index: 1000; top: 70px; left: 24px; right: 24px; display: grid; grid-template-columns: repeat(5, minmax(110px, 1fr)); border: 4px solid var(--gb-dark); background: var(--gb-pale); box-shadow: 4px 4px 0 var(--gb-dark); }
.park-status { opacity: 1; transform: translateY(0); transition: opacity .2s ease, transform .2s ease; }
.park-status.map-toolbar-hidden { opacity: 0; transform: translateY(-18px); pointer-events: none; }
.park-status div { min-width: 0; padding: 7px 10px; border-right: 3px solid var(--gb-dark); }
.park-status div:last-child { border-right: 0; }
.park-status span { display: block; font-size: .62rem; font-weight: 900; }
.park-status strong { display: block; overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.content-page { max-width: 1180px; margin: 0 auto; }
.page-header { padding: 24px; border: 4px solid var(--gb-dark); background: var(--gb-pale); box-shadow: var(--pixel-shadow); }
.page-header > h1 { margin-bottom: 20px; }
.page-header > p { max-width: 900px; font-weight: 700; line-height: 1.7; }
.about-card { display: block; padding: 18px; border: 3px solid var(--gb-dark); color: var(--gb-dark); background: #e6f2a8; box-shadow: 3px 3px 0 var(--gb-mid); text-decoration: none; }
.about-card:hover, .about-card:focus-visible { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--gb-dark); }
.about-card h2 { display: inline-block; margin-top: 0; }
.about-card span { display: block; margin-top: 12px; font-weight: 900; }
.detail-page { min-height: 460px; }
.auth-page { max-width: 760px; }
.auth-card form { display: grid; gap: 14px; margin: 20px 0; }
.auth-card label { display: grid; gap: 6px; font-weight: 900; }
.auth-card input { width: 100%; padding: 12px; border: 3px solid var(--gb-dark); color: var(--gb-dark); background: var(--gb-blue); font: inherit; }
.auth-card button { padding: 12px; border: 3px solid var(--gb-dark); color: var(--gb-pale); background: var(--gb-dark); font: inherit; font-weight: 900; cursor: pointer; }
.auth-card button.secondary { color: var(--gb-dark); background: var(--gb-pale); }
.flash { padding: 10px; border: 3px solid var(--gb-dark); background: var(--gb-blue); }
.flash.error { background: #ffb4a2; }
.flash.success { background: #b7efc5; }
.account-status { display: flex; justify-content: space-between; gap: 20px; padding: 14px; border: 3px solid var(--gb-dark); background: var(--gb-blue); font-weight: 900; }
.payment-note { font-size: .78rem; }
@media (max-width: 800px) { .park-status { grid-template-columns: repeat(2, 1fr); top: 76px; } .park-status div { border-bottom: 2px solid var(--gb-dark); } }

/* RollerCoaster Tycoon-inspired operating console and light/dark palettes. */
body { font-family: "Trebuchet MS", "Arial Rounded MT Bold", Arial, sans-serif; }
body::before { display: none; }
body[data-theme="light"] { --ui-ink: #172033; --ui-panel: #f8fbff; --ui-panel-2: #dbeeff; --ui-accent: #b3263e; --ui-gold: #d39b24; --ui-metal: #9eafc3; color: var(--ui-ink); background: linear-gradient(145deg, #ffffff, #dcecff 48%, #f3d88b); }
body[data-theme="dark"] { --ui-ink: #edf5ff; --ui-panel: #121b2b; --ui-panel-2: #1d304b; --ui-accent: #5aa9e6; --ui-gold: #aab7c7; --ui-metal: #63758b; color: var(--ui-ink); background: radial-gradient(circle at top, #243754, #0a101b 52%, #02050a); }
body[data-theme] .hero, body[data-theme] .panel, body[data-theme] .map-card, body[data-theme] .site-nav, body[data-theme] .page-header, body[data-theme] .powered-footer { border: 3px ridge var(--ui-metal); border-radius: 8px; color: var(--ui-ink); background: var(--ui-panel); box-shadow: inset 0 2px 0 rgba(255,255,255,.22), 0 5px 14px rgba(0,0,0,.32); }
body[data-theme] h1 { color: var(--ui-ink); text-shadow: 2px 2px 0 var(--ui-metal); }
body[data-theme] .eyebrow, body[data-theme] h2 { color: #fff; background: linear-gradient(#3b6690, #234768); border: 2px outset var(--ui-metal); border-radius: 4px; }
body[data-theme] .tagline { color: var(--ui-ink); background: var(--ui-panel-2); border: 2px inset var(--ui-metal); }
body[data-theme] .city-card, body[data-theme] .date-card, body[data-theme] .stats div, body[data-theme] li, body[data-theme] .about-card, body[data-theme] .account-status { color: var(--ui-ink); background: var(--ui-panel-2); border: 3px outset var(--ui-metal); border-radius: 5px; }
body[data-theme] .city-card select, body[data-theme] .date-card input, body[data-theme] .auth-card input { color: var(--ui-ink); background: var(--ui-panel); border: 2px inset var(--ui-metal); border-radius: 3px; }
body[data-theme] .site-nav a, body[data-theme] .pixel-link, body[data-theme] .theme-toggle, body[data-theme] .auth-card button, body[data-theme] .recommendation-control button { color: #fff; background: linear-gradient(#4779a9, #274f76); border: 3px outset var(--ui-metal); border-radius: 5px; }
body[data-theme] .site-nav a:hover, body[data-theme] .site-nav a[aria-current="page"], body[data-theme] .theme-toggle:hover { background: linear-gradient(var(--ui-accent), #6f1b2c); }
.theme-toggle { margin-left: auto; padding: 8px 12px; font: inherit; font-weight: 900; cursor: pointer; }
.map-style-control { display: flex; align-items: center; gap: 7px; margin-left: auto; padding: 4px 7px; color: var(--ui-ink, #172033); font-size: .68rem; font-weight: 900; }
.map-style-control select { padding: 5px 7px; border: 2px inset var(--ui-metal, #9eafc3); border-radius: 3px; color: var(--ui-ink, #172033); background: var(--ui-panel, #f8fbff); font: inherit; font-weight: 900; }
.map-style-control + .theme-toggle { margin-left: 0; }
.hero { display: grid; grid-template-columns: 180px minmax(300px, 1fr) 225px; align-items: stretch; padding: 12px; gap: 14px; }
.hero h1 { font-size: clamp(1.65rem, 3vw, 2.7rem); }
.hero .tagline { display: inline-block; margin: 7px 0 0; padding: 5px 9px; }
.hero .city-card, .hero .date-card { min-width: 0; padding: 10px; }
.pixel-drive { width: min(330px, 40vw); height: 30px; margin-bottom: 5px; border: 2px inset var(--ui-metal, #63758b); border-radius: 3px; box-shadow: none; }
.pixel-road { height: 10px; }
.pixel-car { transform: scale(.7); transform-origin: left bottom; animation-name: coaster-drive; }
@keyframes coaster-drive { from { left: -80px; } to { left: calc(100% + 30px); } }
.park-status { border: 3px outset var(--ui-metal, #9eafc3); border-radius: 6px; color: var(--ui-ink, #172033); background: var(--ui-panel, #f8fbff); box-shadow: 0 3px 8px rgba(0,0,0,.35); }
.park-status div { border-color: var(--ui-metal, #9eafc3); background: linear-gradient(180deg, rgba(255,255,255,.18), transparent); }
.park-status small { display: block; margin-top: 2px; overflow: hidden; font-size: .58rem; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.weather-mascot { display: inline-grid; width: 28px; height: 28px; margin-right: 4px; place-items: center; border: 2px outset var(--ui-metal, #9eafc3); border-radius: 50%; background: #bde7ff; font-size: 1rem; vertical-align: middle; }
.powered-footer { max-width: calc(100% - 48px); margin: 22px auto; padding: 14px; }
.powered-label { display: block; margin-bottom: 10px; color: var(--ui-ink, #172033); font-size: .72rem; letter-spacing: .14em; }
.brand-rail { display: flex; gap: 10px; overflow-x: auto; padding: 4px 3px 10px; scrollbar-color: var(--ui-metal, #9eafc3) transparent; }
.brand-rail .brand-lockup { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; min-width: max-content; padding: 4px 8px; color: var(--ui-ink, #172033); font-size: .78rem; font-weight: 900; }
.brand-rail svg { width: 28px; height: 28px; }
body[data-theme="dark"] .about-card p, body[data-theme="dark"] .page-header p, body[data-theme="dark"] .auth-card label, body[data-theme="dark"] .payment-note, body[data-theme="dark"] .powered-label, body[data-theme="dark"] .brand-rail .brand-lockup { color: var(--ui-ink); }
@media (max-width: 900px) { .hero { grid-template-columns: 1fr; } .pixel-drive { width: 100%; } .powered-footer { max-width: calc(100% - 32px); } }
.dashboard.timetable-closed .timetable-tab { top: 170px; }
.free-food-tab { position: absolute; z-index: 1100; top: 345px; left: 12px; min-height: 150px; padding: 10px 7px; writing-mode: vertical-rl; }
.dashboard.timetable-open .free-food-tab { opacity: 0; pointer-events: none; }
.timeline-event.intensity-low { color: #172033; background: #cfeaff; }
.timeline-event.intensity-medium { color: #2d2200; background: #f6cf63; }
.timeline-event.intensity-high { color: #fff; background: linear-gradient(#e84b4b, #a8142f); }
.timeline-event.food-event { color: #17331d; background: linear-gradient(#fff3a6, #8bd17c); text-decoration: none; }
.food-agent-note { padding: 9px; border: 2px inset var(--ui-metal, #9eafc3); background: var(--ui-panel-2, #dbeeff); font-size: .8rem; font-weight: 700; }
.pizza-marker-shell { background: transparent; border: 0; }
.pizza-marker { display: grid; width: 48px; height: 48px; place-items: center; border: 4px outset #22a447; border-radius: 50% 50% 50% 8px; background: #d9ffe2; box-shadow: 0 3px 8px rgba(0,0,0,.4); font-size: 24px; transform: rotate(-45deg); }
.pizza-marker > * { transform: rotate(45deg); }
.pizza-marker small { margin-top: -12px; padding: 0 3px; border-radius: 5px; color: #fff; background: #d32f2f; font-size: 9px; font-weight: 900; }
.free-food-tab { display: grid; width: 48px; min-height: 62px; padding: 4px; place-items: center; writing-mode: horizontal-tb; box-shadow: 2px 2px 0 var(--gb-mid); }
.free-food-tab span { z-index: 2; margin-bottom: -11px; padding: 1px 3px; border: 1px solid #fff; border-radius: 6px; color: #fff; background: #d32f2f; font-size: .55rem; font-weight: 900; transform: rotate(-7deg); }
.free-food-tab b { font-size: 25px; line-height: 1; }
.dashboard.timetable-open .timeline, .dashboard.timetable-open .timeline-events { min-height: 1100px; }
.timeline-events { overflow: auto; }
.timeline-event { overflow: visible; align-content: start; white-space: normal; }
.timeline-event span, .timeline-event small { overflow: visible; white-space: normal; text-overflow: clip; }
.timeline-event.intensity-medium { color: #3e1212; background: linear-gradient(#ffb59f, #e47b68); }
.timeline-event.intensity-high { color: #fff; background: linear-gradient(#a70f2d, #580515); }
.premium-list { margin-top: 20px; padding: 14px; border: 3px outset var(--ui-metal, #9eafc3); border-radius: 5px; background: var(--ui-panel-2, #dbeeff); }
.premium-list ul { display: grid; gap: 7px; padding-left: 22px; }
.premium-list li { display: list-item; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none; }
.park-status { grid-template-columns: repeat(6, minmax(105px, 1fr)); }

/* Gold-and-crimson ichiban-inspired masthead, kept as live text for accessibility. */
.hero-brand { display: grid; justify-items: center; align-content: center; }
.uberedge-logo { position: relative; display: inline-block; max-width: none; color: #f7c956 !important; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(3rem, 7vw, 6.6rem) !important; font-style: italic; letter-spacing: -.055em; line-height: .78; text-transform: uppercase; -webkit-text-stroke: 3px #7f0909; text-shadow: 0 3px 0 #ffef9c, 0 7px 0 #b51e16, 0 11px 0 #480404, 5px 13px 9px rgba(0,0,0,.48) !important; transform: skewX(-5deg) rotate(-1deg); }
.uberedge-logo::after { content: "需要予測No.1"; position: absolute; right: 4px; bottom: -25px; padding: 2px 8px; color: #fff; background: #c21f24; border: 2px solid #5a0606; font: 900 .65rem/1.2 "Trebuchet MS", sans-serif; letter-spacing: .12em; -webkit-text-stroke: 0; text-shadow: none; transform: skewX(5deg) rotate(-2deg); }
.hero-brand .tagline { margin-top: 30px; }

/* First-visit, creature-guide tutorial. */
.tour-layer { position: fixed; z-index: 5000; inset: 0; background: rgba(3, 9, 19, .64); }
.tour-layer[hidden] { display: none; }
.tour-focus { position: fixed; border: 5px solid #ffe36e; border-radius: 10px; box-shadow: 0 0 0 3px #6a150d, 0 0 24px 8px #fff19a; animation: tour-pulse 1s steps(2, end) infinite; pointer-events: none; }
.tour-dialog { position: fixed; width: min(370px, calc(100vw - 24px)); padding: 18px 18px 14px 98px; border: 5px double #172033; border-radius: 8px; color: #172033; background: linear-gradient(#fffef0, #d9efff); box-shadow: inset 0 0 0 3px #fff, 7px 8px 0 rgba(10,20,38,.75); }
.tour-dialog::before { content: ""; position: absolute; inset: 7px; border: 2px dashed #6c91b8; border-radius: 3px; pointer-events: none; }
.tour-dialog h2 { position: relative; margin: 2px 0 8px; padding: 0; border: 0; color: #8d121c !important; background: none !important; font-size: 1.08rem; letter-spacing: .03em; }
.tour-dialog p { position: relative; margin: 0 0 12px; font-size: .86rem; font-weight: 800; line-height: 1.45; }
.tour-kicker { color: #376b9b; font-size: .62rem !important; letter-spacing: .12em; }
.tour-mascot { position: absolute; z-index: 2; left: 13px; top: 31px; display: grid; grid-template-columns: 55px 20px; align-items: center; filter: drop-shadow(3px 4px 0 rgba(23,32,51,.28)); }
.tour-mascot span { font-size: 52px; animation: mascot-bob .8s steps(2, end) infinite; }
.tour-mascot i { color: #bd1f2d; font-size: 30px; font-style: normal; }
.tour-actions { position: relative; display: flex; align-items: center; gap: 7px; }
.tour-actions span { margin-right: auto; color: #376b9b; font-size: .72rem; font-weight: 900; }
.tour-actions button { padding: 7px 9px; border: 3px outset #9eafc3; border-radius: 4px; color: #fff; background: linear-gradient(#4779a9, #274f76); font: 900 .68rem "Trebuchet MS", sans-serif; cursor: pointer; }
.tour-actions button:last-child { background: linear-gradient(#d94349, #8d121c); }
.tour-actions button:focus-visible { outline: 3px solid #ffdf52; }
@keyframes mascot-bob { 50% { transform: translateY(-5px) rotate(-3deg); } }
@keyframes tour-pulse { 50% { filter: brightness(1.35); } }
@media (max-width: 900px) { .uberedge-logo { font-size: clamp(2.8rem, 15vw, 5rem) !important; } }

.shift-agent { position: fixed; z-index: 2400; left: 22px; bottom: 22px; width: min(430px, calc(100vw - 30px)); max-height: min(620px, calc(100vh - 44px)); overflow: auto; padding: 18px; border: 5px ridge var(--ui-metal, #9eafc3); border-radius: 8px; color: var(--ui-ink, #172033); background: var(--ui-panel, #f8fbff); box-shadow: inset 0 0 0 2px rgba(255,255,255,.5), 8px 9px 0 rgba(6,15,28,.65); }
.shift-agent[hidden] { display: none; }
.shift-agent h2 { margin: 4px 34px 10px 0; }
.shift-agent-kicker { margin: 0 34px 5px 0; color: var(--ui-accent, #b3263e); font-size: .68rem; font-weight: 900; letter-spacing: .1em; }
.shift-agent-copy { font-size: .78rem; font-weight: 700; line-height: 1.4; }
.shift-agent-close { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 3px outset var(--ui-metal, #9eafc3); color: #fff; background: #8d1828; font: 900 1.1rem/1 inherit; cursor: pointer; }
.shift-agent form { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.shift-agent form label { display: grid; gap: 4px; font-size: .68rem; font-weight: 900; }
.shift-agent select { width: 100%; padding: 8px; border: 3px inset var(--ui-metal, #9eafc3); color: var(--ui-ink, #172033); background: var(--ui-panel-2, #dbeeff); font: inherit; font-weight: 900; }
.shift-agent form button { grid-column: 1 / -1; padding: 10px; border: 3px outset var(--ui-metal, #9eafc3); color: #fff; background: linear-gradient(#4779a9, #274f76); font: 900 .75rem inherit; cursor: pointer; }
.shift-agent-result { display: block; min-height: 72px; margin-top: 12px; padding: 11px; border: 3px inset var(--ui-metal, #9eafc3); color: var(--ui-ink, #172033); background: var(--ui-panel-2, #dbeeff); font-size: .8rem; font-weight: 800; line-height: 1.48; white-space: pre-wrap; }
.shift-agent-sources { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.shift-agent-sources a { padding: 4px 6px; border: 2px solid var(--ui-metal, #9eafc3); color: var(--ui-ink, #172033); background: var(--ui-panel-2, #dbeeff); font-size: .65rem; font-weight: 900; }
@media (max-width: 600px) { .shift-agent { left: 15px; bottom: 15px; } }

.button-link { display: inline-block; padding: 10px 14px; border: 3px outset var(--ui-metal, #9eafc3); color: inherit; background: var(--ui-panel-2, #e7f0fb); font-weight: 900; text-decoration: none; }
.agent-console { max-width: 1500px; }
.agent-filter { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 16px 0; padding: 14px; border: 4px ridge var(--ui-metal, #9eafc3); background: var(--ui-panel, #f8fbff); }
.agent-filter label { display: grid; gap: 5px; font-weight: 900; }
.agent-summary { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: 10px; margin: 14px 0; }
.agent-summary div { display: grid; gap: 4px; padding: 13px; border: 3px outset var(--ui-metal, #9eafc3); background: var(--ui-panel-2, #e7f0fb); }
.agent-summary strong { font-size: 1.8rem; }
.agent-records, .agent-snapshots { margin-top: 18px; padding: 18px; border: 4px ridge var(--ui-metal, #9eafc3); background: var(--ui-panel, #f8fbff); }
.agent-record { margin: 14px 0; padding: 14px; border: 4px solid #3a6ea5; background: var(--ui-panel-2, #e7f0fb); overflow-wrap: anywhere; }
.agent-record.kind-crowd_signal { border-color: #d07a00; }
.agent-record.kind-free_food { border-color: #c33b68; }
.agent-record-heading { display: grid; grid-template-columns: max-content 1fr max-content; align-items: center; gap: 12px; }
.agent-record-heading span { padding: 5px 8px; color: #fff; background: #273d65; font-weight: 900; }
.agent-record dl { display: grid; grid-template-columns: 130px 1fr; gap: 6px 12px; }
.agent-record dt { font-weight: 900; }
.agent-record dd { margin: 0; }
.agent-record pre { max-height: 420px; overflow: auto; padding: 12px; color: #eaf3ff; background: #09101d; white-space: pre-wrap; }
.snapshot-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.snapshot-grid a { display: grid; gap: 5px; padding: 12px; border: 3px outset var(--ui-metal, #9eafc3); color: inherit; background: var(--ui-panel-2, #e7f0fb); text-decoration: none; }
.empty-state { padding: 18px; border: 3px dashed var(--ui-metal, #9eafc3); }
@media (max-width: 700px) { .agent-summary { grid-template-columns: repeat(2, 1fr); } .agent-record-heading { grid-template-columns: 1fr; } .agent-record dl { grid-template-columns: 1fr; } }