/* CAB morning edition. Green and orange match CAB's official website palette. */
:root {
  --brand: #007934;
  --orange: #f7921e;
  --lime: var(--brand);
  --ink: #f6faf6;
  --paper: #153825;
  --muted: #51685a;
  --line: rgba(0, 90, 38, .16);
  color-scheme: light;
}
.vignette {
  background:
    linear-gradient(90deg,rgba(250,253,243,.68),rgba(250,253,243,.22) 30%,transparent 52%),
    linear-gradient(0deg,rgba(238,246,234,.75),transparent 23%,transparent 82%,rgba(252,254,249,.55));
}
.topbar { background:linear-gradient(#fff9,transparent); }
.brand-logo { display:block; width:210px; height:auto; object-fit:contain; }
.brand-title { color:var(--brand); }
.brand-divider { background:#00793438; }
.nav-button { color:#3a5545; }
.nav-button.active { color:#073d21; }
.nav-button.active:after { background:var(--orange); width:28px; }
.live-status { color:#42634b; }
.live-status i,.status-dot { background:var(--orange); box-shadow:0 0 0 3px #f7921e1c; }
.icon-button { background:#ffffffb8; color:var(--brand); border-color:#00793430; }
.icon-button:hover { background:#e7f3e8; }
h1 { color:#123e24; text-shadow:0 1px 10px #ffffff68; }
h1 em { color:var(--brand); }
.eyebrow { color:#006b2e; }
.tiny-line { background:var(--orange); }
.intro-copy { color:#365740; }
.primary-button { background:var(--brand); color:white; border-bottom:3px solid var(--orange); box-shadow:0 6px 24px #155a2b22; }
.primary-button:hover { background:#00612a; }
.intro-meta { color:#536b54; }
.intro-meta span:first-child { color:#9c5000; }
.world-label { color:#20553a; opacity:.85; }
.world-label b { color:#59745c; }
#loading { background:#f7faf3; color:var(--brand); }
#loading>img { width:240px; height:auto; margin-bottom:20px; }
.loader-ring { border-color:#00793430; border-top-color:var(--orange); }
.journey-status { background:#ffffffd9; border-color:#00793429; box-shadow:0 4px 20px #254a2a0c; }
.micro-label { color:#526c58; }
.journey-status button { color:var(--brand); }
.interaction { background:#ffffffed; border-color:#00793460; box-shadow:0 8px 35px #345c2b25; }
.interaction kbd { color:white; border:0; background:var(--brand); }
.interaction small { color:#5a725f; }
.interaction>b { color:var(--orange); }
.controls-hint { color:#345a3c; }
kbd { background:#ffffffc9; color:#254c31; border-color:#00793430; }
.district-dock { background:#ffffffeb; border-color:#00793429; box-shadow:0 8px 38px #2e512c17; }
.dock-title { color:#3b6245; }
.dock-title i { color:#9c590b; }
.district-button { background:#f3f8f0; border-color:#d5e3d4; color:#244c30; }
.district-button:hover,.district-button.current { background:#e3f2df; border-color:var(--brand); }
.district-button.current:after { content:''; position:absolute; width:20px; height:3px; background:var(--orange); bottom:-1px; border-radius:2px; }
.district-button .visited-dot { color:var(--brand); }
.minimap { background:#fffffff0; border-color:#00793430; box-shadow:0 5px 25px #23512c15; }
.minimap-top,.minimap-bottom { color:#49654d; }
.map-ring { stroke:#27734060; }
.map-axis { stroke:#27734035; }
.minimap-bottom i { background:var(--orange); }
.scene-footer { color:#48694f; }
.scene-footer b { color:#9b4b00; }
.toast { background:#fff7e9; color:#21512d; border:1px solid #efb364; box-shadow:0 8px 25px #2e4b2e20; }
.fallback { background:white; box-shadow:0 20px 60px #22442630; }
.joystick { background:#ffffff91; border-color:#00793465; }
.joystick>div { background:#007934b3; border-color:white; }
.touch-actions button { background:#ffffffe6; color:var(--brand); border-color:#00793465; box-shadow:0 5px 16px #2b5a2730; }
.touch-actions button[aria-pressed=true] { color:white; background:var(--brand); border-color:var(--orange); }
dialog { background:#fbfdf8; border-color:#d8e6d4; color:#1f412b; box-shadow:0 30px 100px #163d3159; }
dialog::backdrop { background:#183d3659; backdrop-filter:blur(9px); }
.dialog-top { background:white; }
.dialog-brand { display:flex; align-items:center; }
.dialog-brand img { display:block; width:190px; height:auto; }
.catalog-heading p:not(.eyebrow) { color:#55705b; }
.filter-button { color:#49664f; }
.filter-button.selected { color:white; background:var(--brand); }
.filter-button:hover { border-color:#00793455; }
.search-field { background:white; }
.search-field svg { color:var(--brand); }
.search-field input { color:#23472d; }
.search-field input::placeholder { color:#627a66; }
.results-top { color:#536e58; }
.results-top i { color:#b96600; }
.product-card { background:linear-gradient(145deg,#ffffff,#eff6e9); border-color:#d5e4ce; }
.product-card:hover { border-color:var(--brand); box-shadow:0 6px 18px #204b2710; }
.product-card h3 { color:#163b24; }
.product-card p { color:#526b58; }
.product-card .product-link { color:var(--brand); font-weight:600; }
.product-link>span { color:#b75e00; }
.catalog-footer { color:#4f6953; background:#f0f6eb; }
.catalog-footer small { color:#667b66; }
.empty-state { color:#526e58; }
.small-dialog>p:not(.eyebrow),.help-controls span { color:#4f6a57; }
.quality-label select { color:var(--brand); background:white; }
.map-destinations button { color:#264b30; background:#edf5e7; }
.secondary-button { background:white; }
#largeMap { background:#f0f6eb; border-radius:50%; }
@media(max-width:1150px) {
  .brand-logo { width:185px; }
  .brand-title,.brand-divider { display:none; }
}
@media(max-width:600px) {
  .brand-logo { width:160px; }
  .topbar { gap:10px; }
  .nav-button { font-size:9px; }
  .vignette {
    background:linear-gradient(90deg,#f8fcf263,transparent 82%),
      linear-gradient(0deg,#edf5e9d9,transparent 24%,transparent 80%,#fcfff694);
  }
  .intro-panel { top:23%; }
  .dialog-brand img { width:158px; }
  .dialog-top>.micro-label { display:none; }
}
@media(max-width:370px) {
  .brand-logo { width:135px; }
  .topbar { padding:16px 12px; gap:7px; }
  .nav-button { font-size:8px; }
}

/* The CAB family now spans eight destinations. */
.district-dock { width:min(840px,calc(100% - 440px)); }
.dock-buttons { grid-template-columns:repeat(8,minmax(0,1fr)); }
.district-button[data-id="signature"] { background:#eef3f7; border-color:#00487436; }
.district-button[data-id="linc"] { background:#fff0f2; border-color:#c0002030; }
.district-button[data-id="signature"]:hover,.district-button[data-id="signature"].current { border-color:#004874; }
.district-button[data-id="linc"]:hover,.district-button[data-id="linc"].current { border-color:#c00020; }
.brand-discovery { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0 32px 25px; }
.brand-feature { background:white; padding:21px; border:1px solid #d7e2da; border-radius:7px; text-align:left; }
.brand-feature:hover { box-shadow:0 5px 20px #123b2012; }
.brand-feature img { display:block; width:190px; max-width:100%; height:auto; margin-bottom:16px; }
.brand-feature span { display:flex; justify-content:space-between; gap:10px; font-size:11px; color:#344b3b; }
.brand-feature b { font-size:16px; font-weight:500; }
.signature-feature { border-bottom:3px solid #004874; }
.signature-feature b { color:#004874; }
.linc-feature { border-bottom:3px solid #c00020; }
.linc-feature b { color:#c00020; }
.brand-overview { display:flex; gap:30px; align-items:center; margin:0 32px 25px; padding:24px; border:1px solid var(--line); background:white; border-radius:6px; }
.brand-overview>img { width:210px; max-width:40%; height:auto; }
.brand-overview p { margin:0 0 10px; font-size:12px; line-height:1.8; color:#4f6758; }
.brand-overview a { font-size:11px; color:#007934; }
.results-top { align-items:center; gap:12px; }
.product-type-label { display:flex; gap:10px; align-items:center; white-space:nowrap; letter-spacing:0; font-size:10px; }
.product-type-label select { font-size:11px; max-width:190px; background:white; padding:8px 10px; border:1px solid var(--line); border-radius:4px; color:#244831; }
@media(max-width:1150px) {
  .district-dock { width:calc(100% - 190px); left:25px; transform:none; }
}
@media(max-width:600px) {
  .district-dock { width:auto; left:16px; right:16px; }
  .dock-buttons { grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
  .district-button { min-height:51px; padding:7px 2px; font-size:9px; gap:4px; }
  .minimap { bottom:230px; }
  .interaction { bottom:220px; }
  .mobile-controls { bottom:340px; }
  .brand-discovery { margin:0 18px 22px; gap:10px; }
  .brand-feature { padding:14px 12px; }
  .brand-feature img { width:145px; margin-bottom:12px; }
  .brand-feature span { font-size:9px; line-height:1.5; }
  .brand-overview { margin:0 18px 22px; padding:18px; display:block; }
  .brand-overview>img { width:190px; max-width:100%; margin-bottom:15px; }
  .brand-overview p { font-size:11px; }
  .product-type-label { font-size:0; }
  .product-type-label select { max-width:160px; font-size:10px; padding:7px; }
}