/* Mouseierge public site — "Starry Sky" (D-038)
   A bright evening sky, white rounded cards, small four-point stars, rounded friendly type.
   Our own art only: no Disney marks, fonts, ears or castles. Green is reserved for "open now". */

/* Hidden means hidden, even on elements whose class sets a display (e.g. .field is a grid). */
[hidden] { display: none !important; }
:root {
    --sky-1: #2F6BE0;
    --sky-2: #5C9CF2;
    --sky-deep: #1F4FB8;
    --blue: #2B63D9;
    --blue-hover: #1F4FB8;
    --ground: #EEF4FF;
    --tint: #F2F6FE;
    --tint-2: #E4EDFF;
    --line: #D5E0F5;
    --ink: #12264D;
    --ink-soft: #4A5E86;
    --ink-faint: #5A6E96;
    --on-sky: #FFFFFF;
    --on-sky-soft: #E3EEFF;
    --open: #22A06B;
    --open-ink: #157A50;
    --open-bg: #E3F6EC;
    --warn: #A23B2A;
    --night: #12264D;
    --white: #FFFFFF;

    --font: "Nunito", "Segoe UI", system-ui, sans-serif;

    --radius: 28px;
    --radius-sm: 18px;
    --shadow: 0 18px 40px rgba(31, 79, 184, 0.14);
    --shadow-sm: 0 8px 20px rgba(31, 79, 184, 0.10);
    --measure: 66ch;
    --gutter: clamp(16px, 4vw, 40px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: var(--ground);
    color: var(--ink);
    font-family: var(--font);
    font-weight: 600;
    font-size: 1.0625rem;
    line-height: 1.55;
}

img, svg { max-width: 100%; }
a { color: var(--sky-deep); text-underline-offset: 0.18em; }
a:hover { color: var(--ink); }

:focus-visible { outline: 3px solid #FFB347; outline-offset: 2px; border-radius: 6px; }

h1, h2, h3 { line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 0.5em; }
h1 { font-size: clamp(2.1rem, 5vw, 3.4rem); font-weight: 500; }
h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 500; }
h3 { font-size: 1.25rem; font-weight: 900; }
h1 b, h2 b, h1 em, h2 em { font-weight: 900; }
h1 em, h2 em { font-style: italic; }
p { margin: 0 0 1em; }
strong, b { font-weight: 900; }

.wrap { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: var(--gutter); }

.skip { position: absolute; left: -9999px; top: 8px; background: var(--white); padding: 8px 12px; z-index: 10; border-radius: 10px; }
.skip:focus { left: 8px; }

/* ---------- The sky: header band behind every page ---------- */
.sky {
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, var(--sky-1) 0%, var(--sky-2) 100%);
    color: var(--on-sky);
    border-radius: 0 0 44px 44px;
    padding-bottom: 88px;          /* the first card overlaps this */
}
.sky--home { padding-bottom: clamp(64px, 8vw, 104px); }
.sky--titled { padding-bottom: 120px; }
.sky__stars { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.sky > *:not(.sky__stars) { position: relative; }

.masthead__row { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; min-height: 76px; flex-wrap: wrap; }
.wordmark { font-size: 1.55rem; font-weight: 900; letter-spacing: -0.02em; text-decoration: none; color: var(--on-sky); display: inline-flex; align-items: center; gap: 8px; }
.wordmark__star { width: 22px; height: 22px; }
.wordmark__rest { color: #DCE9FF; font-weight: 600; }
.wordmark:hover { color: var(--on-sky); }

.nav { display: flex; align-items: center; gap: 8px 24px; flex-wrap: wrap; }
.nav a, .nav__link { color: var(--on-sky); text-decoration: none; font-weight: 800; }
.nav a:hover, .nav__link:hover { color: #DCE9FF; }
.nav [aria-current="page"] { box-shadow: inset 0 -3px 0 var(--on-sky); }
.nav .nav__cta { color: var(--sky-deep); background: var(--white); padding: 10px 20px; border-radius: 999px; font-weight: 900; min-height: 44px; display: inline-flex; align-items: center; }
.nav .nav__cta:hover { color: var(--ink); background: var(--tint-2); }
.nav__form { margin: 0; }
.nav__link { font: inherit; font-weight: 800; background: none; border: 0; padding: 0; cursor: pointer; }

.sky__title { padding-top: clamp(12px, 3vw, 28px); }
.sky__title h1 { color: var(--on-sky); margin-bottom: 0.2em; font-size: clamp(2rem, 4.2vw, 3rem); }
.sky__title p { color: var(--on-sky-soft); font-weight: 700; font-size: 1.12rem; margin: 0; }

/* ---------- Home hero ---------- */
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(32px, 6vw, 72px); align-items: center; padding-top: clamp(24px, 5vw, 56px); }
.hero__badge { display: inline-block; background: rgba(255, 255, 255, 0.18); color: var(--on-sky); font-size: 0.9rem; font-weight: 800; padding: 7px 14px; border-radius: 999px; margin-bottom: 18px; }
.hero h1 { font-size: clamp(2.6rem, 5.6vw, 4.6rem); line-height: 1.02; color: var(--on-sky); letter-spacing: -0.03em; }
.lede { font-size: 1.2rem; max-width: 54ch; }
.hero .lede { color: var(--on-sky-soft); }
.hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }
.hero__art { display: flex; flex-direction: column; gap: 14px; width: min(360px, 100%); justify-self: center; transform: rotate(2deg); }

/* ---------- Buttons ---------- */
.button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    font: 900 1.02rem/1 var(--font);
    min-height: 50px; padding: 14px 26px;
    border-radius: 999px; border: 2px solid transparent;
    text-decoration: none; cursor: pointer;
}
.button--primary { background: linear-gradient(180deg, #3A76F0, var(--blue)); color: var(--white); box-shadow: 0 10px 22px rgba(43, 99, 217, 0.30); }
.button--primary:hover { background: var(--blue-hover); color: var(--white); }
.button--white { background: var(--white); color: var(--sky-deep); box-shadow: 0 14px 30px rgba(10, 30, 80, 0.22); }
.button--white:hover { background: var(--tint-2); color: var(--ink); }
.button--quiet { border-color: rgba(255, 255, 255, 0.65); color: var(--on-sky); }
.button--quiet:hover { border-color: var(--white); color: var(--on-sky); }
.button--soft { background: var(--tint-2); color: var(--sky-deep); }
.button--soft:hover { background: var(--line); color: var(--ink); }
.button--outline { border-color: var(--line); color: var(--ink-soft); background: var(--white); min-height: 44px; padding: 10px 18px; font-size: 0.95rem; }
.button--outline:hover { border-color: var(--ink-faint); color: var(--ink); }
.button--danger { background: var(--warn); color: #FFFFFF; border-color: var(--warn); }
.button--danger:hover { filter: brightness(0.95); }
.button[disabled] { background: var(--line); color: var(--ink-soft); box-shadow: none; cursor: not-allowed; }
.button--big { display: flex; width: 100%; font-size: 1.12rem; min-height: 58px; }
.button--link { background: none; border: 0; padding: 0; min-height: 0; color: var(--sky-deep); text-decoration: underline; text-underline-offset: 0.18em; font: inherit; font-weight: 800; cursor: pointer; box-shadow: none; }
.button--link:hover { color: var(--ink); }

/* ---------- Cards and pills ---------- */
.card { background: var(--white); color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow); }
.pill { display: inline-flex; align-items: center; gap: 6px; font-size: 0.82rem; font-weight: 900; padding: 4px 12px; border-radius: 999px; background: var(--tint-2); color: var(--sky-deep); }
.pill--open { background: var(--white); color: var(--ink); }
.pill--open::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--open); }
.pill--open-soft { background: var(--open-bg); color: var(--open-ink); }
.scene { display: block; width: 100%; height: auto; }
.scene-tile { width: 56px; height: 56px; border-radius: 14px; overflow: hidden; flex-shrink: 0; }
.scene-tile .scene { width: 56px; height: 56px; }

/* A notification, as it appears on a lock screen */
.toast { display: flex; align-items: center; gap: 12px; background: rgba(255, 255, 255, 0.97); color: var(--ink); border-radius: 20px; padding: 12px 14px; box-shadow: 0 16px 34px rgba(10, 30, 80, 0.25); }
.toast__icon { width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(170deg, var(--sky-1), var(--sky-2)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.toast__title { display: block; font-weight: 900; font-size: 0.98rem; }
.toast__text { display: block; font-size: 0.85rem; color: var(--ink-faint); }

.opening-card { overflow: hidden; display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.opening-card__art { position: relative; }
.opening-card__art .pill { position: absolute; left: 14px; top: 14px; }
.opening-card__body { padding: 14px 18px 18px; display: flex; flex-direction: column; gap: 6px; }
.opening-card__name { font-size: 1.2rem; font-weight: 900; }
.opening-card__rooms { color: var(--blue); font-weight: 800; font-size: 0.95rem; }
.opening-card__meta { color: var(--ink-soft); font-weight: 700; font-size: 0.95rem; }

/* ---------- Home sections ---------- */
.section { padding-block: clamp(48px, 7vw, 84px) 0; }
.section__head { text-align: center; max-width: 720px; margin: 0 auto 28px; }
.section__head p { color: var(--ink-soft); font-size: 1.1rem; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }

.steps { list-style: none; counter-reset: step; padding: 0; margin: 0; }
.steps li { counter-increment: step; background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 28px; }
.steps li::before { content: counter(step); display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 16px; background: var(--tint-2); color: var(--blue); font-size: 1.5rem; font-weight: 900; margin-bottom: 14px; }
.steps p { color: var(--ink-soft); margin: 0; }

.place { overflow: hidden; }
.place__body { padding: 14px 18px 18px; }
.place__name { font-weight: 900; font-size: 1.08rem; }
.place__sub { color: var(--ink-faint); font-size: 0.92rem; font-weight: 700; }

.feature { background: var(--white); border-radius: 24px; padding: 24px; }
.feature svg { width: 28px; height: 28px; color: var(--blue); }
.feature h3 { margin: 10px 0 6px; font-size: 1.12rem; }
.feature p { color: var(--ink-soft); margin: 0; font-size: 0.98rem; }

/* The example text message (also the 10DLC sample on record) */
.phone { margin: 0; justify-self: center; width: min(340px, 100%); background: var(--night); border-radius: 40px; padding: 12px; box-shadow: 0 30px 60px -20px rgba(10, 30, 80, 0.45); }
.phone__screen { background: var(--white); color: var(--ink); border-radius: 30px; padding: 22px 18px 24px; display: flex; flex-direction: column; min-height: 300px; }
.phone__sender { text-align: center; font-weight: 900; margin: 0; }
.phone__time { text-align: center; font-size: 0.8rem; color: var(--ink-faint); margin: 2px 0 16px; }
.bubble { background: #E9EEF7; border-radius: 18px 18px 18px 6px; padding: 12px 14px; font-size: 0.96rem; line-height: 1.45; max-width: 94%; font-weight: 600; animation: arrive 600ms cubic-bezier(.2, .8, .2, 1) 400ms both; }
.bubble p { margin: 0 0 0.45em; }
.bubble p:last-child { margin: 0; }
.bubble mark { background: var(--open-bg); color: var(--open-ink); padding: 0 4px; border-radius: 4px; font-weight: 900; }
.phone__note { margin-top: auto; padding-top: 14px; font-size: 0.85rem; color: var(--ink-faint); text-align: center; }
@keyframes arrive { from { opacity: 0; transform: translateY(14px) scale(0.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .bubble { animation: none; } .hero__art { transform: none; } }

.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; }

.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.plan { background: var(--white); border-radius: 26px; padding: 26px; box-shadow: var(--shadow-sm); }
.plan h3 { margin-bottom: 4px; }
.plan__what { font-weight: 900; color: var(--blue); margin-bottom: 0.6em; }
.plan p:last-child { margin: 0; color: var(--ink-soft); }
.plan--featured { background: linear-gradient(170deg, var(--sky-1), var(--sky-2)); color: var(--on-sky); box-shadow: 0 18px 36px rgba(43, 99, 217, 0.30); }
.plan--featured .plan__what { color: var(--white); }
.plan--featured p:last-child { color: var(--on-sky-soft); }
.plans__note { margin-top: 18px; color: var(--ink-faint); font-size: 0.95rem; }

/* ---------- Pages: the first card rides up over the sky ---------- */
.page, .wrap.page {
    position: relative;
    width: min(1200px, calc(100% - 2 * var(--gutter)));
    max-width: none;
    margin: -64px auto 0;
    padding: clamp(22px, 4vw, 44px);
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.page--narrow, .wrap.page--narrow { width: min(680px, calc(100% - 2 * var(--gutter))); }
.legal, .wrap.legal { width: min(860px, calc(100% - 2 * var(--gutter))); }
.page--bare, .wrap.page--bare { background: none; box-shadow: none; padding: 0; border-radius: 0; margin-top: -88px; }
.page .lede { color: var(--ink-soft); }
.legal h2 { font-size: 1.35rem; font-weight: 900; margin-top: 1.8em; }
.legal ul { padding-left: 1.2em; }
.legal li { margin-bottom: 0.4em; }
.legal__updated { color: var(--ink-faint); }

.notice { background: var(--white); border-radius: var(--radius-sm); padding: 14px 18px; box-shadow: var(--shadow-sm); border-left: 0; position: relative; padding-left: 44px; }
.notice::before { content: ""; position: absolute; left: 18px; top: 20px; width: 12px; height: 12px; border-radius: 50%; background: var(--blue); }
.notice--warn::before { background: var(--warn); }
.notice--open::before { background: var(--open); }

/* ---------- Forms ---------- */
.form { display: grid; gap: 18px; margin-top: 20px; }
.field { display: grid; gap: 6px; font-weight: 800; }
.field > span:first-child, .field legend { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); font-weight: 900; }
.field em { font-weight: 600; font-style: normal; color: var(--ink-faint); text-transform: none; letter-spacing: 0; }
.field input, .field select {
    font: 700 1.05rem var(--font);
    min-height: 50px; padding: 12px 14px;
    border: 2px solid var(--line); border-radius: 16px;
    background: var(--white); color: var(--ink);
}
.field input:focus, .field select:focus { border-color: var(--blue); outline: none; box-shadow: 0 0 0 4px rgba(43, 99, 217, 0.18); }
.field__error, .form__errors { color: var(--warn); font-weight: 700; text-transform: none; letter-spacing: 0; font-size: 0.95rem; }
.form__errors ul { margin: 0; padding-left: 1.2em; }
.field__code { font-size: 1.7rem !important; letter-spacing: 0.3em; max-width: 12ch; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.check { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; font-size: 0.95rem; font-weight: 600; }
.check input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--blue); }
.form__fine { font-size: 0.9rem; color: var(--ink-faint); margin: 0; }
.form--inline { margin: 0; }
.form__aside { margin-top: 24px; color: var(--ink-soft); }
.muted { color: var(--ink-faint); }
.eyebrow { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.82rem; color: var(--blue); font-weight: 900; margin-bottom: 0.4em; }

.choice { border: 0; padding: 0; margin: 0; }
.choice legend { margin-bottom: 8px; padding: 0; }
.choice__group { margin: 12px 0 6px; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--blue); font-weight: 900; }
.choice__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 6px; }
.check--compact { font-size: 0.95rem; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 14px; background: var(--tint); font-weight: 800; }
.check--compact:has(input:checked) { background: var(--tint-2); box-shadow: inset 0 0 0 2px var(--blue); }
.check--compact input { margin-top: 0; }
.is-full { opacity: 0.45; }

.segmented { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; background: var(--ground); padding: 5px; border-radius: 999px; }
.segmented__item { position: relative; }
.segmented__item input { position: absolute; opacity: 0; inset: 0; }
.segmented__item span { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 8px 14px; border-radius: 999px; font-weight: 900; color: var(--ink-soft); cursor: pointer; text-align: center; }
.segmented__item input:checked + span { background: var(--blue); color: var(--white); }
.segmented__item input:focus-visible + span { outline: 3px solid #FFB347; }

/* ---------- My alerts ---------- */
.alerts-layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.alerts-layout__list { flex: 999 1 540px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.alerts-layout__form { flex: 1 1 380px; min-width: 0; }
.list-label { font-size: 0.85rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-faint); margin: 8px 6px 0; }
.list-label--on-sky { color: var(--on-sky); margin-top: 0; }
.panel { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(20px, 3vw, 28px); }
.panel h2 { font-size: 1.5rem; }
.alert-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.alert-card { background: var(--white); border-radius: 22px; padding: 14px 16px; display: flex; gap: 14px; align-items: flex-start; box-shadow: var(--shadow-sm); }
.alert-card__main { flex: 1 1 auto; min-width: 0; }
.alert-card p { margin: 0 0 0.3em; }
.alert-card--ended { opacity: 0.7; box-shadow: none; }
.alert-card__head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.alert-card__name { font-weight: 900; font-size: 1.08rem; }
.alert-card__meta { color: var(--ink-soft); font-weight: 700; font-size: 0.95rem; }
.alert-card__foot { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-top: 8px; }
.openings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }

.opening-list { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 10px; }
.opening-list li { display: flex; justify-content: space-between; gap: 12px; background: var(--tint); border-radius: 16px; padding: 12px 16px; }
.opening-list__option { font-weight: 900; }
.opening-list__price { color: var(--ink-soft); white-space: nowrap; }

/* One-tap booking */
.book-card { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; margin: 0 0 20px; }
.book-card__body { padding: 18px 20px 20px; }
.book-card__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 14px 0 16px; }
.book-card__facts > div { background: var(--tint); border-radius: 14px; padding: 10px 12px; }
.book-card__facts dt { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); font-weight: 900; }
.book-card__facts dd { margin: 2px 0 0; font-size: 1.05rem; font-weight: 900; }
.book-card__hint { margin: 12px 0 0; font-size: 0.9rem; color: var(--ink-faint); }

/* Notification and email cards */
.notify-card { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: var(--white); color: var(--ink); border-radius: 22px; padding: 18px 20px; box-shadow: var(--shadow-sm); }
.notify-card__title { font-weight: 900; margin: 0 0 4px; }
.notify-card__text { margin: 0; color: var(--ink-soft); max-width: 62ch; }
.notify-card__actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.notify-card--light { background: var(--white); }
.stack { display: grid; gap: 14px; margin-bottom: 20px; }

/* ---------- Footer ---------- */
.footer { background: var(--night); color: #C9D6F0; padding-block: 44px 28px; font-size: 0.92rem; margin-top: clamp(48px, 7vw, 84px); }
.footer__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 32px; }
.footer__grid p { max-width: 64ch; }
.footer__brand { font-weight: 900; font-size: 1.25rem; color: var(--white); }
.footer nav { display: grid; gap: 8px; align-content: start; }
.footer a { color: #DCE9FF; font-weight: 800; }
.footer__legal { margin-top: 24px; padding-top: 16px; border-top: 1px solid rgba(201, 214, 240, 0.22); }

/* ---------- Small screens ---------- */
@media (max-width: 820px) {
    .hero__grid, .split, .footer__grid { grid-template-columns: 1fr; }
    .nav a:not(.nav__cta):not(.nav__keep) { display: none; }
    .field-row { grid-template-columns: 1fr; }
    .sky { border-radius: 0 0 32px 32px; }
    .book-card__facts { grid-template-columns: 1fr 1fr; }
}
.page h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); font-weight: 900; }

/* ---------- The Star system (D-039): shining, shooting, faded, captured ---------- */
.footer__tagline { color: #DCE9FF; font-weight: 800; font-style: italic; margin-top: -0.6em; }
.button--stacked { flex-direction: column; gap: 2px; line-height: 1.1; }
.button--stacked small { font-size: 0.78rem; font-weight: 700; opacity: 0.8; }
.button--small { min-height: 40px; padding: 8px 14px; font-size: 0.9rem; }
.pill--shining { background: #FFF6DA; color: #8A5A00; animation: shine 2.6s ease-in-out infinite; }
.pill--captured { background: linear-gradient(90deg, #FFE08A, #FFC24B); color: #6B4300; }
.pill--faded { background: #EEF1F6; color: #6B7A93; }
.alert-card--shining .scene-tile { box-shadow: 0 0 0 3px #FFE08A, 0 0 18px rgba(255, 196, 75, 0.55); animation: glow 2.6s ease-in-out infinite; }
.alert-card--captured { box-shadow: 0 0 0 2px #FFC24B, var(--shadow-sm); }
.alert-card--ended .scene-tile { filter: grayscale(0.7) brightness(0.95); }
.notice--star::before { background: #FFC24B; box-shadow: 0 0 10px #FFC24B; }
.notice--captured::before { background: #FFC24B; }
.captured-form { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.captured-form span { font-weight: 900; }
@keyframes shine { 0%, 100% { box-shadow: 0 0 0 rgba(255, 196, 75, 0); } 50% { box-shadow: 0 0 14px rgba(255, 196, 75, 0.7); } }
@keyframes glow { 0%, 100% { box-shadow: 0 0 0 3px #FFE08A, 0 0 8px rgba(255, 196, 75, 0.35); } 50% { box-shadow: 0 0 0 3px #FFE08A, 0 0 22px rgba(255, 196, 75, 0.75); } }

/* A Shooting Star streaks across the art once when an opening page loads */
.shooting-star { overflow: hidden; }
.shooting-star::after {
    content: ""; position: absolute; top: 18%; left: -30%;
    width: 140px; height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, rgba(255,255,255,0), #FFFFFF 70%, #FFF3C4);
    box-shadow: 0 0 12px #FFF3C4;
    transform: rotate(-14deg);
    animation: streak 1.4s cubic-bezier(.2, .6, .2, 1) 350ms 1 both;
}
@keyframes streak { 0% { left: -30%; opacity: 0; } 15% { opacity: 1; } 100% { left: 110%; top: 46%; opacity: 0; } }
.toast--shooting .toast__icon { animation: glow 2.6s ease-in-out infinite; }

/* Captured: a small burst of stars */
.celebrate { position: relative; overflow: visible; }
.celebrate__burst { position: absolute; left: 24px; top: 24px; width: 0; height: 0; }
.celebrate__burst i { position: absolute; width: 10px; height: 10px; background: #FFC24B; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); animation: burst 1.1s ease-out 200ms 1 both; }
.celebrate__burst i:nth-child(1) { --x: 60px; --y: -40px; }
.celebrate__burst i:nth-child(2) { --x: -50px; --y: -50px; background: #2F6BE0; }
.celebrate__burst i:nth-child(3) { --x: 80px; --y: 10px; background: #5C9CF2; }
.celebrate__burst i:nth-child(4) { --x: -70px; --y: 20px; }
.celebrate__burst i:nth-child(5) { --x: 20px; --y: -70px; background: #22A06B; }
.celebrate__burst i:nth-child(6) { --x: -20px; --y: 60px; background: #2F6BE0; }
.celebrate__burst i:nth-child(7) { --x: 50px; --y: 55px; }
.celebrate__burst i:nth-child(8) { --x: -60px; --y: -10px; background: #5C9CF2; }
@keyframes burst { 0% { transform: translate(0, 0) scale(0.4); opacity: 0; } 20% { opacity: 1; } 100% { transform: translate(var(--x), var(--y)) scale(1.1) rotate(90deg); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    .pill--shining, .alert-card--shining .scene-tile, .toast--shooting .toast__icon { animation: none; }
    .shooting-star::after, .celebrate__burst { display: none; }
}

/* FAQ */
.faq { display: grid; gap: 10px; max-width: 860px; }
.faq details { background: var(--white); border-radius: 20px; padding: 16px 20px; box-shadow: var(--shadow-sm); }
.faq summary { font-weight: 900; cursor: pointer; min-height: 28px; }
.faq details p { margin: 10px 0 0; color: var(--ink-soft); }

/* My account */
.settings { margin: 8px 0 0; display: grid; gap: 10px; }
.settings > div { display: grid; grid-template-columns: minmax(120px, 160px) 1fr; gap: 12px; }
.settings dt { color: var(--ink-faint); font-weight: 900; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.06em; }
.settings dd { margin: 0; font-weight: 800; overflow-wrap: anywhere; }
.setting { padding: 16px 0; border-top: 1px solid var(--line); }
.setting:first-of-type { border-top: 0; padding-top: 4px; }
.setting__head { display: flex; align-items: center; gap: 10px; }
.setting__head h3 { margin: 0; }
.setting p { margin: 8px 0 12px; }
@media (max-width: 520px) { .settings > div { grid-template-columns: 1fr; gap: 2px; } }

/* Operations (admin) */
.ops-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.ops-tile { padding: 18px 20px; display: grid; gap: 4px; }
.ops-tile span { font-size: 0.8rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.ops-tile strong { font-size: 1.8rem; font-weight: 900; }
.ops-tile small { color: var(--ink-soft); font-weight: 700; }
.ops-tile--warn { box-shadow: inset 0 0 0 3px #FFC24B, var(--shadow); }
.ops-tile--bad { box-shadow: inset 0 0 0 3px var(--warn), var(--shadow); }
.ops-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-top: 16px; }
.ops-list { padding: 18px 20px; }
.ops-list h2 { font-size: 1.15rem; font-weight: 900; margin: 0 0 10px; }
.ops-list dl { margin: 0; display: grid; gap: 6px; }
.ops-list dl div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 4px; }
.ops-list dt { color: var(--ink-soft); }
.ops-list dd { margin: 0; font-weight: 900; }
.ops-bad dt, .ops-bad dd { color: var(--warn); }
.ops-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.ops-table th, .ops-table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ops-table code { font-size: 0.8rem; overflow-wrap: anywhere; }

/* Live board at /now (D-066). Levels: green short, amber medium, red long, grey closed or no data. */
.board__preview { background: #FFF6DA; color: #6B4300; border-radius: var(--radius-sm); padding: 10px 16px; margin: 0 0 12px; font-weight: 800; }
.board__parks { display: flex; flex-wrap: wrap; gap: 10px 28px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.board__parkgroup { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.board__resort { color: var(--ink-faint); font-size: 0.78rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; width: 100%; }
.board .chip { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 16px; border-radius: 999px; background: var(--tint); color: var(--sky-deep); font-weight: 900; text-decoration: none; border: 2px solid var(--line); }
.board .chip:hover { border-color: var(--sky-deep); color: var(--ink); }
.board .chip[aria-current="page"] { background: var(--blue); color: var(--white); border-color: var(--blue); }
.board__panel { display: grid; gap: 12px; }
.board__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.board .seg { display: inline-grid; grid-template-columns: 1fr 1fr; gap: 4px; background: var(--ground); padding: 4px; border-radius: 999px; }
.board .seg__btn { min-height: 40px; min-width: 84px; padding: 6px 16px; border: 0; border-radius: 999px; background: none; font: inherit; font-weight: 900; color: var(--ink-soft); cursor: pointer; }
.board .seg__btn[aria-pressed="true"] { background: var(--blue); color: var(--white); }
.board__locate { min-height: 44px; padding: 8px 18px; border: 2px solid var(--line); background: var(--white); color: var(--sky-deep); border-radius: 999px; font: inherit; font-weight: 900; cursor: pointer; }
.board__locate:hover { border-color: var(--sky-deep); }
.board__locate[disabled] { opacity: 0.6; cursor: wait; }
.board__status { margin: 0; color: var(--ink-faint); font-size: 0.92rem; }
.board__where { margin: 0; background: var(--tint); border-radius: var(--radius-sm); padding: 10px 14px; color: var(--ink); }
.board__h { font-size: 1.25rem; font-weight: 900; margin: 10px 0 6px; }
.board__note { margin: -2px 0 8px; }
.board__rows { list-style: none; margin: 0; padding: 0; }
.board .row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 6px 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.board .row:first-child { border-top: 0; }
.row__name { font-weight: 800; min-width: 0; overflow-wrap: anywhere; }
.row__walk { color: var(--ink-faint); font-weight: 700; white-space: nowrap; }
.row__vals { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.row__star { font-size: 0.88rem; font-weight: 900; white-space: nowrap; }
.pill--good { background: var(--open-bg); color: var(--open-ink); }
.pill--mid { background: #FFF1D6; color: #8A5300; }
.pill--high { background: #FDE6E1; color: #A23B2A; }
.pill--off { background: #EEF1F6; color: #5A6E96; }
.pill--ll { background: var(--tint-2); color: var(--sky-deep); }
.board__map { height: min(68vh, 620px); min-height: 360px; border-radius: var(--radius-sm); overflow: hidden; background: var(--tint); }
.board__mapmsg { padding: 24px; margin: 0; color: var(--ink-soft); }
.board__credit { border-top: 1px solid var(--line); padding-top: 12px; }
.pop { display: grid; gap: 6px; font-family: var(--font); font-weight: 700; }
.pop .row__vals { justify-content: flex-start; }
.pop__walk { color: var(--ink-faint); font-size: 0.88rem; }
@media (max-width: 560px) {
    .board .row { grid-template-columns: minmax(0, 1fr) auto; }
    .board .row .row__vals { grid-column: 1 / -1; justify-content: flex-start; grid-row: 2; }
    .board .row .row__star { grid-column: 2; grid-row: 1; }
    .board__bar { flex-direction: column; align-items: stretch; }
    .board .seg { width: 100%; }
}

/* Live board filters, show times and map key (D-068). */
.board__filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.board__filterlabel { color: var(--ink-faint); font-size: 0.88rem; font-weight: 900; }
.board .filter { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 4px 14px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--ink-soft); font: inherit; font-size: 0.92rem; font-weight: 900; cursor: pointer; }
.board .filter::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--dot, #8A9AB8); opacity: 0.35; }
.board .filter[aria-pressed="true"] { border-color: var(--sky-deep); color: var(--ink); background: var(--tint); }
.board .filter[aria-pressed="true"]::before { opacity: 1; }
.board .filter--ride { --dot: #22A06B; }
.board .filter--show { --dot: #7A4FD0; }
.board .filter--attraction { --dot: #1C8C8C; }
.board .filter--dining { --dot: #1F4FB8; }
.filter__n { color: var(--ink-faint); font-size: 0.8rem; font-weight: 800; }
.pill--show { background: #EFE8FB; color: #5B34A8; }
.board__legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.85rem; color: var(--ink-soft); }
.board__legend li { display: inline-flex; align-items: center; gap: 6px; }
.dot { width: 11px; height: 11px; border-radius: 50%; display: inline-block; border: 2px solid #FFFFFF; box-shadow: 0 0 0 1px var(--line); }
.dot--good { background: #22A06B; } .dot--mid { background: #D98A1C; } .dot--high { background: #C2412D; } .dot--off { background: #8A9AB8; }
.dot--show { background: #7A4FD0; } .dot--attraction { background: #1C8C8C; } .dot--dining { background: #1F4FB8; }
.board__section[hidden] { display: none; }

/* Food search (D-069). */
.board__food { display: grid; gap: 6px; }
.board__foodlabel { font-weight: 900; font-size: 0.95rem; }
.board__food input { width: 100%; min-height: 48px; padding: 10px 16px; border: 2px solid var(--line); border-radius: 999px; font: inherit; font-weight: 700; color: var(--ink); background: var(--white); }
.board__food input:focus { border-color: var(--sky-deep); outline: none; }
.board__foodresults { background: var(--tint); border-radius: var(--radius-sm); padding: 6px 14px; }
.board__foodresults .row { border-top-color: var(--line); }
.food__where { display: block; color: var(--ink-soft); font-weight: 700; font-size: 0.9rem; }
.food__more { margin: 6px 0; color: var(--ink-faint); font-size: 0.88rem; }
.pill--vg { background: var(--open-bg); color: var(--open-ink); }

/* Star picker (D-070): resort area, then Resorts or Parks, then the form. */
.picker { display: grid; gap: 14px; }
.picker__step { margin: 0; }
.picker__step legend, .picker__step-label { display: flex; align-items: center; gap: 10px; font-weight: 900; margin: 0 0 8px; }
.picker__step-label { margin: 6px 0 -4px; }
.picker__n { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--blue); color: var(--white); font-size: 0.85rem; font-weight: 900; flex: none; }
.picker__lede { margin: 0 0 6px; }
.picker .segmented__item span { flex-direction: column; gap: 0; line-height: 1.2; }
.picker .segmented__item small { font-size: 0.78rem; font-weight: 700; opacity: 0.8; }
.segmented--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Phone width (2026-10-18): a long option (ride names across six parks) set the width of its select, and fieldsets and
   grid columns grow to their content by default, so the whole form ran off the right edge. Everything may shrink now. */
fieldset { min-width: 0; }
.form { grid-template-columns: minmax(0, 1fr); }
.field > * { min-width: 0; }
.field > select, .field > input { width: 100%; }
.field select { max-width: 100%; text-overflow: ellipsis; }
.field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.check > span { min-width: 0; overflow-wrap: anywhere; }
.picker, .picker > * { min-width: 0; }
@media (max-width: 420px) {
    .field-row { grid-template-columns: minmax(0, 1fr); }
    .picker .segmented__item span { padding: 8px 8px; font-size: 0.95rem; }
}

/* My Stars header row with the Add a Star button (D-071). */
.stars-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.stars-head .list-label { margin: 0; }

/* iPhone Safari (2026-10-18): date and time boxes keep a built-in minimum width and ignore their column, so two side
   by side overlapped. Drop the native box sizing and let them fill their column; keep the text start-aligned. */
input[type="date"], input[type="time"] { -webkit-appearance: none; appearance: none; display: block; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
input[type="date"]::-webkit-date-and-time-value, input[type="time"]::-webkit-date-and-time-value { text-align: left; min-width: 0; }
input[type="date"]::-webkit-calendar-picker-indicator { margin-left: auto; }

/* Dining at this resort, on hotel Star cards (D-073) */
.resort-dining { margin-top: 8px; border-top: 1px dashed var(--line, rgba(0,0,0,.12)); padding-top: 8px; }
.resort-dining > summary { cursor: pointer; font-weight: 700; color: var(--ink-soft); list-style-position: inside; }
.resort-dining__n { display: inline-block; min-width: 1.6em; padding: 0 6px; margin-left: 4px; border-radius: 999px; background: rgba(0,0,0,.06); font-size: .85em; text-align: center; }
.resort-dining__list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.resort-dining__list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; min-width: 0; }
/* Hotel pages: Reserve and Menu in two fixed columns so both line up (D-093). */
.rs .resort-dining__list li { display: grid; grid-template-columns: minmax(0, 1fr) 6.5em 3.5em; }
.resort-dining__what { min-width: 0; }
.resort-dining__book, .resort-dining__menu { text-align: right; }
.resort-dining__name { font-weight: 700; overflow-wrap: anywhere; }
.resort-dining__style { color: var(--ink-soft); font-size: .9em; }
.resort-dining__list a { margin-left: auto; white-space: nowrap; font-weight: 700; }
.rs .resort-dining__list a { margin-left: 0; }

/* /admin/controls (D-075) */
.controls__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.controls__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.controls__text { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; flex: 1 1 320px; }
.controls__text small { flex-basis: 100%; }
.controls__actions { display: flex; flex-wrap: wrap; gap: 6px; }
.controls__audience { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }

/* Signed-in dashboard (D-076) */
.dash__tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 14px; margin-bottom: 18px; }
.dash__tile { padding: 18px 20px; display: grid; gap: 4px; color: var(--ink); text-decoration: none; }
a.dash__tile:hover { box-shadow: inset 0 0 0 2px var(--line), var(--shadow); }
.dash__tile span { font-size: 0.8rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.dash__tile strong { font-size: 1.7rem; font-weight: 900; }
.dash__tile small { color: var(--ink-soft); font-weight: 700; }
.dash__tile--quiet strong { color: var(--ink-soft); }
.dash__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; align-items: start; }
.dash__card { padding: 20px 22px; min-width: 0; }
.dash__h { font-size: 1.15rem; font-weight: 900; margin: 0 0 10px; }
.dash__list { list-style: none; margin: 12px 0; padding: 0; display: grid; gap: 10px; }
.dash__list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; border-bottom: 1px solid var(--line); padding-bottom: 8px; min-width: 0; }
.dash__list strong { overflow-wrap: anywhere; }
.dash__kind { font-size: 0.75rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.05em; color: var(--sky-deep); flex-basis: 100%; }
.dash__parks { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.dash__examples { margin: 8px 0 0; padding-left: 18px; color: var(--ink-soft); font-weight: 700; }

/* Ask Mouseierge chat (D-076) */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.chat { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 1000; font-family: var(--font); }
.chat__fab { width: 60px; height: 60px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center;
    background: linear-gradient(145deg, var(--sky-2), var(--sky-deep)); color: var(--white); box-shadow: 0 10px 26px rgba(31, 79, 184, 0.35);
    transition: transform .15s ease; }
.chat__fab:hover { transform: translateY(-2px); }
.chat__fab:focus-visible { outline: 3px solid #FFC24B; outline-offset: 3px; }
.chat__icon { width: 34px; height: 34px; }
.chat__bubble { fill: var(--white); }
.chat__spark { fill: var(--sky-deep); }
.chat--open .chat__fab { transform: scale(0.92); }
.chat__panel { position: absolute; right: 0; bottom: 74px; width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100vh - 120px));
    background: var(--white); color: var(--ink); border-radius: 22px; box-shadow: 0 24px 60px rgba(18, 38, 77, 0.28);
    display: flex; flex-direction: column; overflow: hidden; }
.chat__head { display: flex; align-items: center; gap: 8px; padding: 14px 16px; background: linear-gradient(145deg, var(--sky-1), var(--sky-deep)); color: var(--white); }
.chat__title { flex: 1; font-size: 1.05rem; }
.chat__link { background: none; border: 0; color: var(--on-sky-soft); font: inherit; font-weight: 800; cursor: pointer; padding: 4px 6px; }
.chat__close { background: none; border: 0; color: var(--white); font-size: 1.6rem; line-height: 1; cursor: pointer; padding: 0 4px; }
.chat__log { list-style: none; margin: 0; padding: 14px; flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; background: var(--tint); }
.chat__msg { max-width: 86%; padding: 10px 12px; border-radius: 16px; line-height: 1.4; overflow-wrap: anywhere; }
.chat__body { white-space: pre-wrap; }
.chat__msg--user { align-self: flex-end; background: var(--blue); color: var(--white); border-bottom-right-radius: 4px; }
.chat__msg--user a { color: var(--white); }
.chat__msg--assistant { align-self: flex-start; background: var(--white); border: 1px solid var(--line); border-bottom-left-radius: 4px; }
.chat__msg--failed { border-color: #F2C5BC; color: var(--warn); }
.chat__at { display: block; margin-top: 4px; font-size: 0.72rem; opacity: 0.7; }
.chat__msg--typing { display: flex; gap: 4px; padding: 12px 14px; }
.chat__msg--typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-faint); animation: chat-dot 1s infinite ease-in-out; }
.chat__msg--typing span:nth-child(2) { animation-delay: .15s; }
.chat__msg--typing span:nth-child(3) { animation-delay: .3s; }
@keyframes chat-dot { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .chat__msg--typing span { animation: none; } .chat__fab { transition: none; } }
.chat__upgrade { padding: 16px; display: grid; gap: 10px; border-top: 1px solid var(--line); }
.chat__upgrade p { margin: 0; }
.chat--kb .chat__fine, .chat--kb .chat__fab { display: none; }   /* keyboard up: every pixel for the answer and the box */
.chat__form { display: flex; gap: 8px; align-items: flex-end; padding: 10px 12px; border-top: 1px solid var(--line); }
.chat__form textarea { flex: 1; min-width: 0; resize: none; border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; font: inherit; font-size: 16px; max-height: 120px; }
.chat__send { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 0; background: var(--blue); color: var(--white); cursor: pointer; display: grid; place-items: center; }
.chat__send svg { width: 20px; height: 20px; }
.chat__send:disabled { opacity: .5; cursor: progress; }
.chat__fine { margin: 0; padding: 0 14px 12px; font-size: 0.75rem; color: var(--ink-faint); }
@media (max-width: 600px) {
    .chat__panel { position: fixed; left: 8px; right: 8px; width: auto; bottom: calc(84px + env(safe-area-inset-bottom)); height: min(72vh, 560px); }
}

/* Devices with notifications on, My Stars (D-077) */
.devices { padding: 16px 20px; margin-bottom: 20px; }
.devices__title { margin: 0 0 8px; font-weight: 900; }
.devices__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.devices__list li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.devices__name { font-weight: 800; }
.devices__list form { margin-left: auto; }
.devices__hint { margin: 10px 0 0; font-size: 0.85rem; }

/* Signed-in home as a phone app (D-079) */
.dash { display: grid; gap: 16px; }
.dash > * { margin: 0; }
.dash__askbar { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 16px; border-radius: 999px; color: var(--ink); text-decoration: none; }
.dash__askbar:focus-within { box-shadow: 0 0 0 3px var(--sky-2), var(--shadow); }
.dash__askicon { width: 22px; height: 22px; flex: none; color: var(--sky-1); }
.dash__askbar input { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: 16px; font-weight: 700; color: var(--ink); padding: 10px 0; outline: none; }
.dash__askbar input::placeholder { color: var(--ink-faint); font-weight: 600; }
.dash__askgo { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 0; background: var(--blue); color: var(--white); cursor: pointer; display: grid; place-items: center; }
.dash__askgo svg { width: 20px; height: 20px; }
.dash__askbar--locked { padding: 14px 16px; }
.dash__asktext { flex: 1; min-width: 0; font-weight: 700; color: var(--ink-soft); }
.dash__stars .stars-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dash__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 6px 0 4px; }
.dash__stats > * { display: grid; gap: 2px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--tint); color: var(--ink); text-decoration: none; min-width: 0; }
.dash__stats strong { font-size: 1.4rem; font-weight: 900; line-height: 1.1; }
.dash__stats span { font-size: 0.78rem; font-weight: 800; color: var(--ink-faint); }
.dash__more { margin: 0; }
.dash__alerts { margin: 10px 0 0; font-size: 0.9rem; color: var(--ink-soft); }
.dash__section { font-size: 1rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); margin: 8px 4px -6px; }
.dash__features { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.dash__feature { position: relative; display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 12px; row-gap: 2px; align-items: center;
    padding: 14px 16px; color: var(--ink); text-decoration: none; border-radius: var(--radius-sm); min-height: 76px; }
.dash__feature:hover { box-shadow: inset 0 0 0 2px var(--line), var(--shadow); color: var(--ink); }
.dash__ficon { grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 14px; background: var(--tint-2); display: grid; place-items: center; font-size: 1.35rem; }
.dash__feature strong { font-weight: 900; }
.dash__feature small { color: var(--ink-soft); font-weight: 700; line-height: 1.3; }
.dash__new { position: absolute; top: 10px; right: 12px; font-size: 0.7rem; padding: 2px 8px; }
.dash__upgrade { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; color: var(--on-sky); text-decoration: none;
    background: linear-gradient(150deg, var(--sky-1), var(--sky-deep)); }
.dash__upgrade:hover { color: var(--on-sky); }
.dash__upgrade span:first-child { display: grid; gap: 2px; }
.dash__upgrade small { color: var(--on-sky-soft); font-weight: 700; }
.dash__upgrade .button { background: var(--white); color: var(--sky-deep); flex: none; }
.dash__plan { text-align: center; font-size: 0.9rem; }

/* Phone tab bar for signed-in pages (D-079) */
.tabbar { display: none; }
@media (max-width: 820px) {
    body:has(.tabbar) { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
    .tabbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; background: rgba(255, 255, 255, 0.97);
        border-top: 1px solid var(--line); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 24px rgba(18, 38, 77, 0.08);
        -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
    .tabbar a { flex: 1 1 0; min-width: 0; display: grid; justify-items: center; gap: 2px; padding: 4px 1px; min-height: 48px; color: var(--ink-faint); text-decoration: none; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
    .tabbar svg { width: 24px; height: 24px; }
    .tabbar a[aria-current="page"] { color: var(--sky-deep); }
    body:has(.tabbar) .chat { bottom: calc(80px + env(safe-area-inset-bottom)); }
    body:has(.tabbar) .chat__panel { bottom: calc(148px + env(safe-area-inset-bottom)); height: min(64vh, 540px); }
    .dash__stats strong { font-size: 1.2rem; }
}

/* Landing page: what's inside (D-079) */
.features { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.features__card { padding: 20px 22px; display: grid; gap: 6px; align-content: start; }
.features__card h3 { margin: 0; font-size: 1.15rem; font-weight: 900; }
.features__card p { margin: 0; color: var(--ink-soft); }
.features__card--new { box-shadow: inset 0 0 0 2px var(--sky-2), var(--shadow); }
.features__tag { justify-self: start; font-size: 0.72rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; padding: 3px 10px; border-radius: 999px; background: var(--tint-2); color: var(--sky-deep); }
.features__tag--new { background: var(--open-bg); color: var(--open-ink); }
.features__tag--plus { background: var(--ink); color: var(--white); }
.features__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; align-items: center; }

/* Live waits for visitors without an account (D-079) */
.join__card { padding: clamp(20px, 4vw, 32px); max-width: 640px; }
.join__list { margin: 0 0 18px; padding-left: 20px; display: grid; gap: 8px; color: var(--ink-soft); }
.join__list strong { color: var(--ink); }
.join__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.join__fine { margin: 14px 0 0; font-size: 0.85rem; }

/* Walking directions on the live board (D-080) */
.row__acts { display: inline-flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
button.row__walkto { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.walk { margin: 12px 0; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--white); border: 2px solid var(--sky-2); box-shadow: var(--shadow-sm); display: grid; gap: 10px; }
.walk__head { display: flex; align-items: center; gap: 8px; }
.walk__title { flex: 1; font-size: 1.05rem; font-weight: 900; }
.walk__close { background: none; border: 0; font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--ink-soft); padding: 0 4px; }
.walk__from { display: grid; gap: 4px; font-size: 0.82rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.walk__select { font: inherit; font-size: 16px; font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--ink); border: 2px solid var(--line); border-radius: 14px; padding: 10px 12px; background: var(--white); min-width: 0; width: 100%; }
.walk__check { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink-soft); font-size: 0.92rem; }
.walk__check input { width: 20px; height: 20px; }
.walk__summary { margin: 0; font-size: 1.1rem; font-weight: 900; color: var(--ink); }
.walk__live { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--tint-2); font-weight: 800; color: var(--sky-deep); }
.walk__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.walk__fine { margin: 0; font-size: 0.78rem; color: var(--ink-faint); }
.walk--walking .walk__from, .walk--walking .walk__check, .walk--walking .walk__fine, .walk--walking .walk__summary { display: none; }
@media (max-width: 560px) {
    .walk { padding: 12px; gap: 8px; }
    .walk__fine { font-size: 0.72rem; }
}
button.row__walkto { color: var(--sky-deep); }
button.row__walkto:hover { color: var(--ink); text-decoration: underline; }
@media (max-width: 560px) {
    .board .row .row__acts { grid-column: 2; grid-row: 1; flex-direction: column; align-items: flex-end; gap: 4px; }
}

/* ---------- Parks Live, map first (D-081) ---------- */
.sky--app { padding-bottom: 0; border-radius: 0; }
.main--app + .footer { margin-top: 0; }
.pl { --pl-top: 76px; position: relative; height: calc(100dvh - var(--pl-top)); min-height: 560px; display: grid;
    grid-template-columns: minmax(360px, 440px) minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); background: var(--tint); }
.pl__map { grid-column: 2; grid-row: 1 / span 2; min-height: 0; background: #E9EFE4; z-index: 1; }
.pl__mapmsg { padding: 24px; margin: 0; color: var(--ink-soft); }
.pl__top { grid-column: 1; grid-row: 1; background: var(--white); padding: 16px 18px 10px; display: grid; gap: 10px; z-index: 3; }
.pl__sheet { grid-column: 1; grid-row: 2; background: var(--white); overflow-y: auto; overscroll-behavior: contain; padding: 0 18px 18px; z-index: 3;
    box-shadow: 8px 0 24px rgba(18, 38, 77, 0.08); }
.pl__top { box-shadow: 8px 0 24px rgba(18, 38, 77, 0.08); }
/* Nothing in the panel may be wider than the panel (Jorge, 2026-10-22: the park picker's longest option and the
   update time pushed the search box and chips over the map). */
.pl__top { grid-template-columns: minmax(0, 1fr); min-width: 0; }
.pl__sheet { min-width: 0; }
.pl__bar > * { min-width: 0; }
.pl__park { flex: 1 1 auto; min-width: 0; }
.pl__park select { width: 100%; max-width: 100%; min-width: 0; text-overflow: ellipsis; }
.pl__bar { display: flex; align-items: center; gap: 10px; }
.pl__park select { appearance: none; -webkit-appearance: none; font: inherit; font-size: 1.15rem; font-weight: 900; color: var(--ink); background: var(--white)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2312264D' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;
    border: 2px solid var(--line); border-radius: 12px; min-height: 44px; padding: 6px 38px 6px 14px; cursor: pointer; max-width: 100%; }
.pl__updated { margin-left: auto; font-size: 0.8rem; font-weight: 800; color: var(--ink-soft); white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 701px) { .pl__updated { white-space: normal; line-height: 1.15; text-align: right; } }   /* the desktop panel is narrow: wrap rather than spill onto the map */
.pl__preview { margin: 0; font-size: 0.85rem; font-weight: 800; color: #8A5300; background: #FFF1D6; padding: 6px 10px; border-radius: 10px; }
.pl__search { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 14px; border-radius: 14px; background: var(--tint); border: 2px solid var(--line); color: var(--ink-soft); }
.pl__search:focus-within { border-color: var(--sky-deep); }
.pl__search svg { width: 20px; height: 20px; flex: none; }
.pl__search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font: inherit; font-size: 16px; font-weight: 700; color: var(--ink); padding: 10px 0; }
.pl__chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.pl__chips::-webkit-scrollbar { display: none; }
a.pl__chip { display: inline-flex; align-items: center; text-decoration: none; box-sizing: border-box; }
.pl__chip { flex: none; min-height: 36px; padding: 4px 14px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--ink); font: inherit; font-size: 0.88rem; font-weight: 800; cursor: pointer; }
.pl__chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--white); }
.pl__note { margin: 0; font-size: 0.88rem; font-weight: 800; color: var(--ink); background: var(--tint-2); padding: 8px 12px; border-radius: 12px; }
.pl__handle { display: none; }
.pl__tabs { position: sticky; top: 0; z-index: 2; display: flex; gap: 4px; padding: 4px; margin: 12px 0 0; border-radius: 14px; background: var(--tint-2); }
.pl__tab { flex: 1; min-height: 38px; border: 0; border-radius: 10px; background: transparent; color: var(--ink-soft); font: inherit; font-size: 0.92rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.pl__tab[aria-selected="true"] { background: var(--white); color: var(--ink); font-weight: 900; box-shadow: 0 2px 6px rgba(18, 38, 77, 0.12); }
.pl__n { font-weight: 700; color: var(--ink-faint); font-size: 0.82rem; }
.pl__sortline { display: flex; justify-content: flex-end; padding: 8px 2px 2px; }
.pl__sort { display: inline-flex; align-items: center; gap: 6px; font-size: 0.82rem; font-weight: 800; color: var(--ink-soft); }
.pl__sort select { font: inherit; font-weight: 900; color: var(--sky-deep); border: 0; background: none; padding: 4px; cursor: pointer; }
.pl__rows { list-style: none; margin: 0; padding: 0; }
.pl-row { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--line); min-width: 0; }
.pl-row:last-child { border-bottom: 0; }
.pl-row--map { cursor: pointer; }
.pl-row--map:hover .pl-row__name { color: var(--sky-deep); }
.pl-pop .pl-row--map { cursor: default; }
.pl-wait { width: 54px; height: 54px; flex: none; border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; line-height: 1.05; }
.pl-wait b { font-size: 1.25rem; font-weight: 900; }
.pl-wait small { font-size: 0.65rem; font-weight: 800; }
.pl-wait--off b, .pl-wait--dining b, .pl-wait--attraction b, .pl-wait--show b { font-size: 0.78rem; }
.pl-wait--good { background: var(--open-bg); color: var(--open-ink); }
.pl-wait--mid { background: #FFF1D6; color: #8A5300; }
.pl-wait--high { background: #FDE6E1; color: #A23B2A; }
.pl-wait--off { background: #EEF1F6; color: #4A5E86; }
.pl-wait--show { background: #EFE8FB; color: #5A33A8; }
.pl-wait--dining { background: var(--tint-2); color: var(--sky-deep); }
.pl-wait--attraction { background: #E2F3F3; color: #145F5F; }
.pl-row__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pl-row__name { font-size: 1rem; font-weight: 900; overflow-wrap: anywhere; }
.pl-row__sub { font-size: 0.82rem; font-weight: 700; color: var(--ink-soft); }
.pl-row__acts { display: flex; gap: 6px; flex: none; align-items: center; }
.pl-btn { min-width: 44px; min-height: 44px; border-radius: 12px; border: 0; display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: 0.88rem; font-weight: 900; text-decoration: none; cursor: pointer; }
.pl-btn--icon { background: var(--tint-2); color: var(--sky-deep); }
.pl-btn--icon svg { width: 22px; height: 22px; }
.pl-btn--icon:hover { background: var(--line); color: var(--ink); }
.pl-btn--solid { background: var(--sky-deep); color: var(--white); padding: 0 14px; }
.pl-btn--solid:hover { background: var(--ink); color: var(--white); }
.pl-btn--text { background: none; color: var(--sky-deep); padding: 0 8px; }
.pl__h { font-size: 0.8rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); margin: 14px 2px 2px; }
.pl__empty { margin: 14px 2px; color: var(--ink-soft); font-weight: 700; }
.pl__fine { margin: 18px 2px 0; font-size: 0.75rem; color: var(--ink-faint); }
.pl__locate { position: absolute; right: 16px; bottom: 28px; z-index: 5; width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--white); color: var(--sky-deep);
    box-shadow: 0 8px 20px rgba(18, 38, 77, 0.22); display: grid; place-items: center; cursor: pointer; }
.pl__locate svg { width: 24px; height: 24px; }
.pl__locate--on { background: var(--blue); color: var(--white); }
@media (min-width: 900px) { body:has(.chat:not([hidden])) .pl__locate { bottom: 96px; } }
@media (max-width: 899px) { .chat--lifted:not(.chat--open) { display: none; } }
.pl--walking .pl__list { display: none; }
.pl-pin { background: none; border: 0; }
.pl-pin span { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 28px; padding: 0 8px; box-sizing: border-box; transform: translate(-50%, -50%);
    border-radius: 999px; border: 2px solid var(--white); color: var(--white); font-family: var(--font); font-size: 14px; font-weight: 900; box-shadow: 0 3px 8px rgba(18, 38, 77, 0.3); }
.pl-pin--good span { background: #157A50; }
.pl-pin--mid span { background: #8A5300; }
.pl-pin--high span { background: #A23B2A; }
.pl-pop { min-width: 240px; }
.pl-pop .pl-row { border: 0; padding: 2px 0; }
.pl-pop__go { list-style: none; padding: 6px 0 0; font-weight: 800; font-size: 0.88rem; }
.leaflet-popup-content { margin: 10px 12px; font-family: var(--font); }
/* Leaflet gives its panes and controls z-index 400-1000 (zoom, attribution). Without a stacking context of its own,
   a map scrolled under the bottom tab bar (z-index 900) paints those controls over the tab bar. isolation keeps every
   Leaflet layer inside the map; the full-screen route map still sits on top via its own z-index: 2000. */
.leaflet-container { isolation: isolate; }
.pl .walk { margin: 14px 0 0; border: 0; box-shadow: none; padding: 0; }

@media (max-width: 899px) {
    .pl { display: block; height: calc(100dvh - var(--pl-top) - 68px - env(safe-area-inset-bottom)); min-height: 480px; }
    .pl__map { position: absolute; inset: 0; }
    .pl__top { position: absolute; top: 10px; left: 12px; right: 12px; padding: 0; background: none; box-shadow: none; gap: 8px; }
    .pl__park select, .pl__search, .pl__chip { box-shadow: 0 6px 16px rgba(18, 38, 77, 0.16); border-color: transparent; }
    .pl__search { background: var(--white); }
    .pl__updated { background: rgba(255, 255, 255, 0.94); padding: 6px 10px; border-radius: 999px; color: var(--ink); }
    .pl__sheet { position: absolute; left: 0; right: 0; bottom: 0; height: 46%; border-radius: 24px 24px 0 0; padding: 0 16px 16px;
        box-shadow: 0 -10px 30px rgba(18, 38, 77, 0.16); transition: height .25s ease; }
    .pl--peek .pl__sheet { height: 80px; overflow: hidden; }
    .pl--open .pl__sheet { height: calc(100% - 172px); }
    .pl--walking .pl__sheet { height: auto; max-height: 62%; overflow-y: auto; }
    .pl--walkmode .pl__sheet { max-height: 34%; }
    .pl__handle { display: flex; justify-content: center; position: sticky; top: 0; z-index: 3; width: calc(100% + 32px); margin: 0 -16px; padding: 10px 0 6px; border: 0; background: var(--white); cursor: pointer; }
    .pl__handle span { width: 44px; height: 5px; border-radius: 3px; background: #C9D4EA; }
    .pl__tabs { top: 21px; margin-top: 0; }
    .pl__locate { bottom: calc(46% + 12px); transition: bottom .25s ease; }
    .pl--peek .pl__locate { bottom: 92px; }
    .pl--open .pl__locate, .pl--walking .pl__locate { display: none; }
}
@media (prefers-reduced-motion: reduce) { .pl__sheet, .pl__locate { transition: none; } }

/* Restrooms, first aid and water on Parks Live (D-082) */
.pl-wait--poi b { font-size: 0.78rem; }
.pl-wait--restroom { background: #E6EEF9; color: #1F4FB8; }
.pl-wait--first_aid { background: #FDE6E1; color: #A23B2A; }
.pl-wait--water { background: #E2F3F3; color: #145F5F; }
.pl-pin--poi span { min-width: 28px; height: 24px; font-size: 11px; padding: 0 5px; }
.pl-pin--restroom span { background: #1F4FB8; }
.pl-pin--first_aid span { background: #A23B2A; }
.pl-pin--water span { background: #1C7C7C; }
.pl__ar { position: absolute; right: 16px; bottom: 88px; z-index: 5; display: none; align-items: center; gap: 6px; height: 48px; padding: 0 16px 0 12px; border-radius: 999px; border: 0;
    background: var(--ink); color: var(--white); font: inherit; font-size: 0.9rem; font-weight: 900; box-shadow: 0 8px 20px rgba(18, 38, 77, 0.3); cursor: pointer; }
.pl__ar svg { width: 24px; height: 24px; }
@media (max-width: 899px) and (pointer: coarse) {
    .pl__ar:not([hidden]) { display: inline-flex; }
    .pl__ar { right: auto; left: 12px; bottom: calc(46% + 12px); transition: bottom .25s ease; }
    .pl--peek .pl__ar { bottom: 92px; }
    .pl--open .pl__ar, .pl--walking .pl__ar { display: none !important; }
}

/* Look around: the camera view (D-082) */
html.ar-open, html.ar-open body { overflow: hidden; }
.ar { position: fixed; inset: 0; z-index: 3000; background: #000; color: var(--white); font-family: var(--font); overflow: hidden; touch-action: none; }
.ar__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ar__floor { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ar__labels { position: absolute; inset: 0; }
.ar__label { position: absolute; left: 0; top: 0; width: 180px; transform-origin: 0 0; display: grid; gap: 2px; text-align: left; padding: 7px 10px; border-radius: 14px; border: 0;
    background: rgba(18, 38, 77, 0.78); color: var(--white); font: inherit; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35); cursor: pointer; transition: transform .12s linear; }
.ar__label b { font-size: 0.92rem; font-weight: 900; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ar__label small { font-size: 0.76rem; font-weight: 800; color: #DCE6F7; display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.ar__label--dest { background: rgba(194, 65, 45, 0.92); outline: 3px solid var(--white); }
.ar__pill { display: inline-block; padding: 1px 7px; border-radius: 999px; font-weight: 900; background: rgba(255, 255, 255, 0.2); color: var(--white); }
.ar__pill--good { background: #157A50; } .ar__pill--mid { background: #8A5300; } .ar__pill--high { background: #A23B2A; }
.ar__pill--show { background: #6B3FC0; } .ar__pill--dining { background: #1F4FB8; } .ar__pill--poi { background: #145F5F; }
.ar__top { position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: center; gap: 8px; padding: calc(10px + env(safe-area-inset-top)) 12px 10px;
    background: linear-gradient(rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0)); }
.ar__close { width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, 0.92); color: var(--ink); font-size: 1.6rem; line-height: 1; cursor: pointer; flex: none; }
.ar__status { flex: 1; min-width: 0; font-size: 0.8rem; font-weight: 800; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7); }
.ar__range { display: flex; gap: 4px; padding: 3px; border-radius: 999px; background: rgba(0, 0, 0, 0.45); flex: none; }
.ar__rangebtn { min-height: 34px; padding: 0 10px; border-radius: 999px; border: 0; background: none; color: var(--white); font: inherit; font-size: 0.78rem; font-weight: 900; cursor: pointer; }
.ar__rangebtn[aria-pressed="true"] { background: var(--white); color: var(--ink); }
.ar__practice { position: absolute; top: calc(112px + env(safe-area-inset-top)); left: 12px; right: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
    padding: 8px 12px; border-radius: 14px; background: rgba(255, 241, 214, 0.95); color: #5C3A00; font-size: 0.8rem; font-weight: 800; }
.ar__select { font: inherit; font-weight: 900; color: var(--ink); border: 0; border-radius: 10px; padding: 6px 8px; max-width: 100%; }
.ar__guide { position: absolute; left: 12px; right: 12px; bottom: calc(18px + env(safe-area-inset-bottom)); display: flex; align-items: center; gap: 12px; padding: 12px 14px;
    border-radius: 20px; background: rgba(18, 38, 77, 0.88); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35); }
.ar__arrow { width: 56px; height: 56px; flex: none; color: #8FB5FF; transition: transform .15s linear; }
.ar__arrow svg { width: 100%; height: 100%; }
.ar__guidetext { display: grid; gap: 2px; min-width: 0; }
.ar__guidetext b { font-size: 1.1rem; font-weight: 900; }
.ar__guidetext small { font-size: 0.82rem; font-weight: 800; color: #DCE6F7; }
.ar__card { position: absolute; left: 12px; right: 12px; bottom: calc(110px + env(safe-area-inset-bottom)); padding: 14px; border-radius: 20px; background: var(--white); color: var(--ink);
    display: grid; gap: 8px; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.4); }
.ar__cardhead { display: flex; align-items: flex-start; gap: 8px; }
.ar__cardhead b { flex: 1; font-size: 1.05rem; font-weight: 900; }
.ar__cardclose { width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--tint-2); color: var(--ink); font-size: 1.3rem; cursor: pointer; }
.ar__cardline { margin: 0; font-size: 0.88rem; font-weight: 800; color: var(--ink-soft); }
.ar__hint { position: absolute; left: 16px; right: 16px; bottom: calc(118px + env(safe-area-inset-bottom)); margin: 0; text-align: center; font-size: 0.78rem; font-weight: 800;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8); pointer-events: none; }
.ar__card:not([hidden]) ~ .ar__hint { display: none; }
/* Look around, organized (D-115): filter chips, grouped pins, edge chips, the nearby list */
.ar__chips { position: absolute; top: calc(64px + env(safe-area-inset-top)); left: 0; right: 0; display: flex; gap: 6px; padding: 0 12px; overflow-x: auto; scrollbar-width: none; }
.ar__chips::-webkit-scrollbar { display: none; }
.ar__chip { flex: none; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 0; background: rgba(0, 0, 0, 0.5); color: var(--white); font: inherit; font-size: 0.8rem; font-weight: 900; cursor: pointer; }
.ar__chip[aria-pressed="true"] { background: var(--white); color: var(--ink); }
.ar__chip--list { margin-left: auto; background: rgba(43, 99, 217, 0.92); }
.ar__chip--list[aria-expanded="true"] { background: var(--white); color: var(--ink); }
.ar__label { width: 184px; }
.ar__more { margin-left: auto; padding: 1px 7px; border-radius: 999px; background: var(--white); color: var(--ink); font-weight: 900; }
.ar__more[hidden] { display: none; }
.ar__pill--soon { background: #C2412D; } .ar__pill--off { background: rgba(255, 255, 255, 0.25); }
.ar__edge { position: absolute; max-width: 46%; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 0; background: rgba(18, 38, 77, 0.8); color: var(--white);
    font: inherit; font-size: 0.78rem; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); }
.ar__edge--left { left: 6px; } .ar__edge--right { right: 6px; }
.button--tiny { min-height: 36px; padding: 6px 14px; font-size: 0.85rem; flex: none; }
.ar__grouplist, .ar__sheetlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ar__row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--tint-2); }
.ar__row:first-child { border-top: 0; }
.ar__rowtext { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ar__rowtext b { font-size: 0.95rem; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ar__rowtext small { font-size: 0.8rem; font-weight: 800; color: var(--ink-soft); }
.ar__card .ar__pill--off, .ar__sheet .ar__pill--off { background: var(--tint-2); color: var(--ink); }
.ar__card { max-height: 55vh; overflow-y: auto; }
.ar__dir { width: 26px; height: 26px; flex: none; color: #2B63D9; transition: transform .2s linear; }
.ar__dir svg { width: 100%; height: 100%; }
.ar__sheet { position: absolute; left: 0; right: 0; bottom: 0; max-height: 46vh; display: grid; grid-template-rows: auto 1fr; padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
    border-radius: 20px 20px 0 0; background: var(--white); color: var(--ink); box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.35); z-index: 2; }
.ar__sheethead { display: flex; align-items: center; gap: 8px; padding-bottom: 6px; }
.ar__sheethead b { flex: 1; font-size: 1rem; font-weight: 900; }
.ar__sheetlist { overflow-y: auto; }
.ar__sheet:not([hidden]) ~ .ar__hint { display: none; }
@media (prefers-reduced-motion: reduce) { .ar__label, .ar__arrow, .ar__dir { transition: none; } }

/* Our own menus (D-083): a page of its own and the Parks Live list panel */
.pl--menu .pl__list, .pl--menu [data-walk-host] { display: none; }
.menu { display: grid; gap: 12px; padding: 4px 2px 16px; }
.menu__head { display: flex; align-items: flex-start; gap: 10px; }
.menu__back { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--line); background: var(--white); color: var(--ink); cursor: pointer; }
.menu__back svg { width: 20px; height: 20px; }
.menu__title { min-width: 0; }
.menu__name { margin: 0; font-size: 1.3rem; line-height: 1.2; font-weight: 900; }
.menu__where { margin: 2px 0 0; color: var(--ink-soft); font-weight: 700; font-size: 0.92rem; }
.menu__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.menu__meals { display: flex; flex-wrap: wrap; gap: 6px; }
.menu__meals .pl__chip { display: inline-flex; align-items: center; text-decoration: none; }
.menu__meal { display: grid; gap: 4px; scroll-margin-top: 12px; }
.menu__mealname { margin: 8px 0 0; font-size: 1.1rem; font-weight: 900; color: var(--sky-deep); }
.menu__section { margin: 10px 0 2px; font-size: 0.78rem; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-faint); }
.menu__items { list-style: none; margin: 0; padding: 0; }
.menu__item { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.menu__item:last-child { border-bottom: 0; }
.menu__itemname { flex: 1; min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.menu__vg { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: var(--tint-2); color: var(--sky-deep); font-size: 0.72rem; font-weight: 900; vertical-align: 1px; }
.menu__price { flex: none; font-weight: 900; font-variant-numeric: tabular-nums; }
.menu__empty { margin: 0; padding: 12px; border-radius: 12px; background: var(--tint-2); font-weight: 700; }
.menu__fine { margin: 6px 0 0; font-size: 0.78rem; color: var(--ink-faint); }
.menu-page { max-width: 720px; }
.menu-page__back { margin: 0 0 10px; font-weight: 800; }
.menu-page__back a { text-decoration: none; }
.menu-page__card { padding: clamp(16px, 4vw, 28px); }
@media (max-width: 899px) {
    .pl--menu .pl__sheet { overflow-y: auto; }
}

/* Distance units on My account (D-084) */
.units-pick { display: grid; gap: 10px; }
/* Open in Lyft (D-111): phones only, like the location buttons. */
.go-lyft { display: grid; gap: 6px; justify-items: start; }
.go-lyft small { color: var(--ink-soft); font-size: 0.85rem; }
@media not all and (hover: none) and (pointer: coarse) { .go-lyft { display: none; } }
/* Book it in 20 seconds (D-108) */
.guide { padding: clamp(18px, 4vw, 26px); margin-bottom: 16px; }
.guide__h { margin: 0 0 10px; }
.guide__steps { margin: 0; padding-left: 1.4em; display: grid; gap: 10px; }
.guide__steps li { padding-left: 4px; }
.guide__steps li strong { display: block; }
.guide__copy { margin-top: 4px; font: inherit; font-size: 0.8rem; font-weight: 800; padding: 3px 10px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--sky-deep); cursor: pointer; }
.guide__fine { margin: 12px 0 0; font-size: 0.88rem; color: var(--ink-soft); }
/* Share a Star (D-107) */
.share__card { padding: clamp(18px, 4vw, 28px); margin-bottom: 16px; display: grid; gap: 10px; }
.share__card h2 { margin: 0; }
.share__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.share__list li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.share__list li .form--inline { margin-left: auto; }
.share__fine { margin: 0; font-size: 0.88rem; color: var(--ink-soft); }
.share__url code { display: block; overflow-wrap: anywhere; padding: 10px 12px; border-radius: 10px; background: var(--tint-2); font-size: 0.9rem; }
.share__acts { display: flex; flex-wrap: wrap; gap: 10px; }
/* Fewer alerts (D-106) */
.ctl { display: grid; gap: 14px; }
.ctl__group { border: 2px solid var(--line); border-radius: 14px; padding: 12px 14px; margin: 0; display: grid; gap: 8px; min-width: 0; }
.ctl__group legend { font-weight: 900; padding: 0 6px; }
.ctl__row { display: flex; flex-wrap: wrap; gap: 10px 16px; }
.ctl__row label { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.ctl select { font: inherit; font-size: 16px; padding: 6px 10px; border: 2px solid var(--line); border-radius: 10px; background: var(--white); color: var(--ink); max-width: 100%; }
.ctl__check { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.ctl__fine { margin: 0; font-size: 0.85rem; color: var(--ink-soft); }
.units-pick__opt { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 2px solid var(--line); border-radius: 14px; cursor: pointer; }
.units-pick__opt:has(input:checked) { border-color: var(--sky-deep); background: var(--tint-2); }
.units-pick__opt input { width: 20px; height: 20px; flex: none; }
.units-pick__opt small { display: block; color: var(--ink-faint); font-weight: 700; }

/* Get there: the trip planner (D-085) */
.go { max-width: 820px; }
.go__h { margin: 0 0 4px; }
.go__lede { margin: 0 0 16px; color: var(--ink-soft); font-weight: 700; }
.go__form { padding: clamp(14px, 3vw, 22px); display: grid; gap: 10px; position: relative; }
.go__field { display: grid; gap: 4px; position: relative; }
.go__field label { font-size: 0.82rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.go__field input { font: inherit; font-size: 16px; font-weight: 700; border: 2px solid var(--line); border-radius: 14px; padding: 12px 14px; min-width: 0; width: 100%; box-sizing: border-box; background: var(--white); color: var(--ink); }
.go__inputrow { display: flex; gap: 8px; }
.go__me { flex: none; width: 48px; border-radius: 14px; border: 2px solid var(--line); background: var(--white); color: var(--sky-deep); cursor: pointer; display: grid; place-items: center; }
.go__me svg { width: 22px; height: 22px; }
.go__swap { justify-self: end; margin: -6px 4px -6px 0; width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--line); background: var(--white); font-size: 1.2rem; cursor: pointer; color: var(--ink); }
.go__suggest { position: absolute; top: 100%; left: 0; right: 0; z-index: 30; list-style: none; margin: 4px 0 0; padding: 4px; background: var(--white); border: 2px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); max-height: 320px; overflow-y: auto; }
.go__opt { display: grid; padding: 8px 10px; border-radius: 10px; cursor: pointer; }
.go__opt small { color: var(--ink-faint); font-weight: 700; }
.go__opt:hover, .go__opt--on { background: var(--tint-2); }
.go__row { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; justify-content: space-between; }
.go__when { display: grid; gap: 4px; font-size: 0.82rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.go__when input { font: inherit; font-size: 16px; font-weight: 700; border: 2px solid var(--line); border-radius: 12px; padding: 8px 10px; text-transform: none; color: var(--ink); background: var(--white); }
.go__hint { margin: 0; font-size: 0.85rem; color: var(--ink-soft); font-weight: 700; }
.go__results { margin-top: 18px; }
.go__rh { margin: 0; font-size: 1.25rem; }
.go__at { margin: 4px 0 10px; color: var(--ink-soft); font-size: 0.9rem; }
.go__notice { margin: 0 0 10px; padding: 10px 12px; border-radius: 12px; background: var(--tint-2); font-weight: 700; }
.go__options { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.go-opt { padding: 14px 16px; display: grid; gap: 10px; }
.go-opt__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.go-opt__mode { font-size: 0.75rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.08em; padding: 2px 10px; border-radius: 999px; background: var(--sky-deep); color: #fff; }
.go-opt--boat .go-opt__mode { background: #127A8A; }
.go-opt--monorail .go-opt__mode { background: #B2205E; }
.go-opt--skyliner .go-opt__mode { background: #1E5BB8; }
.go-opt--walk .go-opt__mode { background: #157A50; }
.go-opt--car .go-opt__mode, .go-opt--rideshare .go-opt__mode { background: #5B6478; }
.go-opt__title { flex: 1 1 200px; font-size: 1.02rem; }
.go-opt__min { font-weight: 900; font-size: 1.1rem; white-space: nowrap; }
.go-opt__paid { font-size: 0.75rem; font-weight: 900; padding: 2px 8px; border-radius: 999px; border: 2px solid var(--line); color: var(--ink-soft); }
.go-opt__warn { margin: 0; padding: 8px 12px; border-radius: 10px; background: #FFF3D6; color: #6A4A00; font-weight: 800; font-size: 0.9rem; }
.go-opt__note { margin: 0; font-size: 0.8rem; color: var(--ink-faint); }
.go-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.go-step { display: grid; grid-template-columns: 18px 1fr auto; gap: 10px; align-items: start; padding: 8px 0; position: relative; }
.go-step + .go-step::before { content: ""; position: absolute; left: 8px; top: -8px; height: 16px; border-left: 2px dotted var(--line); }
.go-step__dot { width: 14px; height: 14px; margin-top: 4px; border-radius: 50%; background: var(--lc, #1F4FB8); border: 2px solid var(--white); box-shadow: 0 0 0 2px var(--sky-deep); }
.go-step--walk .go-step__dot { background: var(--white); box-shadow: 0 0 0 2px #157A50; }
.go-step--bus .go-step__dot { --lc: #1F4FB8; }
.go-step--boat .go-step__dot { --lc: #127A8A; }
.go-step--car .go-step__dot, .go-step--rideshare .go-step__dot { --lc: #5B6478; }
.go-step__text { display: grid; gap: 2px; min-width: 0; }
.go-step__text small { color: var(--ink-soft); font-weight: 600; }
.go-step__link { font-weight: 800; font-size: 0.9rem; }
.go-step__min { font-weight: 800; color: var(--ink-soft); white-space: nowrap; }
.go-opt__mapbtn { justify-self: start; }
.go-opt__map { height: clamp(300px, 52vh, 480px); border-radius: 14px; overflow: hidden; border: 2px solid var(--line); background: #e8eef0; }
/* Route maps (D-089): muted tiles so the route pops, moving direction marks, badges, pins, leg chips, controls. */
.go-opt__map .leaflet-tile-pane { filter: saturate(0.55) brightness(1.04) contrast(0.96); }
.go-opt__map--full { position: fixed !important; inset: 0; z-index: 2000; height: auto; border-radius: 0; border: 0; }
html.go-noscroll, html.go-noscroll body { overflow: hidden; }
.go-flow { animation: go-flow-20 1.1s linear infinite; }
.go-flow--10 { animation-name: go-flow-10; animation-duration: 0.9s; }
.go-flow--18 { animation-name: go-flow-18; animation-duration: 1s; }
@keyframes go-flow-20 { to { stroke-dashoffset: -20; } }
@keyframes go-flow-10 { to { stroke-dashoffset: -10; } }
@keyframes go-flow-18 { to { stroke-dashoffset: -18; } }
@media (prefers-reduced-motion: reduce) { .go-flow { animation: none; } }
.go-badge { width: 30px; height: 30px; border-radius: 50%; background: var(--mc, #1F4FB8); border: 3px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.35); display: grid; place-items: center; box-sizing: border-box; }
.go-pin { position: relative; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); border: 3px solid #fff; box-shadow: 0 3px 8px rgba(0,0,0,.4); box-sizing: border-box; }
.go-pin b { transform: rotate(45deg); color: #fff; font-weight: 900; font-size: 13px; line-height: 1; }
.go-pin--a { background: #157A50; }
.go-pin--b { background: #C0392B; }
.go-me { display: block; width: 18px; height: 18px; border-radius: 50%; background: #2B7BE4; border: 3px solid #fff; box-shadow: 0 0 0 6px rgba(43,123,228,.25); box-sizing: border-box; }
.go-runner { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--mc, #157A50); border: 3px solid #fff; box-shadow: 0 0 0 5px rgba(255,255,255,.45), 0 4px 10px rgba(0,0,0,.4); box-sizing: border-box; }
.go-tip { font-weight: 700; font-size: 12px; }
.go-ctl { display: flex; flex-direction: column; }
.go-ctl__b { width: 34px; height: 34px; display: grid; place-items: center; background: #fff; color: #23314d; border: 0; border-bottom: 1px solid #ccc; cursor: pointer; padding: 0; }
.go-ctl__b:last-child { border-bottom: 0; }
.go-ctl__b:hover { background: #f2f4f8; }
.go-ctl__b--on { background: #1F4FB8; color: #fff; }
.go-ctl__b--on:hover { background: #2a5bc6; }
.go-legs { list-style: none; display: flex; gap: 8px; margin: 8px 0 0; padding: 0 0 4px; overflow-x: auto; scrollbar-width: thin; }
.go-legs__i { flex: 0 0 auto; }
.go-legs__b { display: flex; align-items: center; gap: 8px; max-width: 260px; text-align: left; padding: 6px 10px 6px 6px; border-radius: 12px; border: 2px solid var(--line); background: var(--card, #fff); color: inherit; cursor: pointer; font: inherit; }
.go-legs__b:hover, .go-legs__i--on .go-legs__b { border-color: var(--mc); box-shadow: 0 0 0 2px color-mix(in srgb, var(--mc) 25%, transparent); }
.go-legs__ic { flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--mc); display: grid; place-items: center; }
.go-legs__t { display: grid; line-height: 1.2; min-width: 0; }
.go-legs__t b { font-size: 0.85rem; }
.go-legs__t small { font-size: 0.75rem; color: var(--ink-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.go-opt__map--full .go-legs { position: absolute; left: 10px; right: 10px; bottom: 26px; z-index: 1000; margin: 0; }
.go-opt__map--full .go-legs__b { background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.go-fw { margin-top: 18px; padding: clamp(14px, 3vw, 22px); }
.go-fw h2 { margin-top: 0; }
.go-fw__line { border-left: 6px solid var(--lc, #1F4FB8); padding: 4px 0 4px 12px; margin: 10px 0; }
.go-fw__line h3 { margin: 0 0 4px; font-size: 1rem; }
.go-fw__line ol { margin: 0; padding-left: 20px; display: grid; gap: 2px; font-weight: 600; }
.go-fw__here { font-weight: 900; color: var(--sky-deep); }
.go__fine { font-size: 0.78rem; color: var(--ink-faint); margin: 16px 0 0; }
.go-opt--cart .go-opt__mode { background: #7A5C2E; }
.go-step--cart .go-step__dot { --lc: #7A5C2E; }
.go-step--shuttle .go-step__dot { --lc: #D8A01E; }
.go-fw__maph { margin: 14px 0 6px; font-size: 1rem; }
.go-fw__map { height: 380px; border-radius: 14px; overflow: hidden; border: 2px solid var(--line); }
.go-fw__pin { background: #5A3B1E; color: #fff; font-weight: 900; font-size: 11px; padding: 1px 5px; border-radius: 4px; white-space: nowrap; border: 1px solid #fff; transform: translate(-50%, -50%); display: inline-block; }
.go-fw__pin--mine { background: #D2232A; font-size: 13px; padding: 2px 7px; }
.go-fw__stop { background: #1F4FB8; color: #fff; font-weight: 800; font-size: 11px; padding: 2px 6px; border-radius: 999px; white-space: nowrap; border: 2px solid #fff; transform: translate(-50%, -50%); display: inline-block; }

/* Resorts (D-086) */
.rs { max-width: 820px; }
.rs__h { margin: 4px 0 10px; }
.rs__lede { margin: 0 0 14px; color: var(--ink-soft); font-weight: 700; }
.rs__group { margin: 18px 0 8px; font-size: 1.05rem; }
.rs__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.rs__pick { display: grid; gap: 2px; padding: 12px 14px; text-decoration: none; color: var(--ink); }
.rs__pick small { color: var(--ink-faint); font-weight: 700; }
.rs__switch { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.rs__switch select { font: inherit; font-size: 16px; font-weight: 800; border: 2px solid var(--line); border-radius: 12px; padding: 8px 10px; max-width: 100%; min-width: 0; flex: 1 1 220px; background: var(--white); color: var(--ink); }
.rs__all { font-weight: 800; font-size: 0.9rem; }
/* The hotel's name in the blue header (white on blue; the band grows with long names on phones and desktops). */
.sky:has(.rs__sky) { padding-bottom: 26px; }
.rs__sky { padding-top: 4px; }
.rs__sky .rs__h { color: var(--on-sky); font-size: clamp(1.55rem, 4.6vw, 2.5rem); line-height: 1.12; margin: 12px 0 0; overflow-wrap: anywhere; text-wrap: balance; }
.rs__sky .rs__all { color: var(--on-sky); }
.rs__sky .rs__switch select { border-color: rgba(255, 255, 255, 0.7); max-width: 520px; }
.page--bare.rs--sky { margin-top: 16px; }
.rs__sub { color: var(--on-sky-soft); font-weight: 700; margin: 6px 0 0; }
/* Near me (D-093): a pill button in the header, and a line when we found where they are. */
.rs__near, .pl__near { font: inherit; font-size: 0.85rem; font-weight: 800; border-radius: 999px; padding: 6px 12px; cursor: pointer; border: 2px solid rgba(255, 255, 255, 0.75);
    background: rgba(255, 255, 255, 0.14); color: var(--on-sky); }
.rs__near::before { content: "📍 "; }
.rs__acts { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-top: 10px; }
.rs__near[disabled], .pl__near[disabled] { opacity: 0.6; cursor: progress; }
.rs__nearby { color: var(--on-sky); font-weight: 800; margin: 8px 0 0; }
.rs__nearby a { color: var(--on-sky); }
.pl__near { flex: 0 0 auto; width: 36px; height: 36px; padding: 0; display: grid; place-items: center; font-size: 1rem;
    border-color: var(--line); background: var(--white); color: var(--ink); }   /* icon only: the park panel is narrow */
.pl__nearby { font-size: 0.85rem; font-weight: 800; flex: 1 0 100%; order: 9; }   /* its own line under the bar */
.pl__bar:has(.pl__nearby:not([hidden])) { flex-wrap: wrap; }
/* With the line showing, the picker still shares the first row with 📍 and All hotels (Jorge, 2026-10-23: a long hotel
   name took the whole row and pushed them onto the map). */
.pl__bar .pl__park { flex: 1 1 0; }
@media (max-width: 899px) {
    .pl__nearby { justify-self: start; width: fit-content; flex: 0 1 auto; margin-right: auto; background: var(--white); color: var(--ink);
        padding: 6px 12px; border-radius: 999px; box-shadow: 0 6px 16px rgba(18, 38, 77, 0.16); }
    .pl__bar:has(.pl__nearby:not([hidden]))::after { content: ""; flex: 1 0 100%; order: 8; height: 0; }   /* break the row before it */
}
/* "You" on the hotel map: a blue dot with a white ring and a slow pulse, unlike the restaurant dots. */
.rsx-me span { display: block; width: 22px; height: 22px; border-radius: 50%; background: #1F5BFF; border: 4px solid #FFFFFF;
    box-shadow: 0 0 0 2px rgba(31, 91, 255, 0.35), 0 4px 10px rgba(18, 38, 77, 0.35); animation: rsx-me 2s ease-out infinite; }
@keyframes rsx-me { 0% { box-shadow: 0 0 0 0 rgba(31, 91, 255, 0.5), 0 4px 10px rgba(18, 38, 77, 0.35); } 100% { box-shadow: 0 0 0 16px rgba(31, 91, 255, 0), 0 4px 10px rgba(18, 38, 77, 0.35); } }
@media (prefers-reduced-motion: reduce) { .rsx-me span { animation: none; } }
.rs__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; position: sticky; top: 0; z-index: 5; padding: 6px 0; background: var(--tint, #F3F6FC); }
.rs__tabs .pl__chip { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.rs__sec { padding: clamp(14px, 3vw, 22px); margin-bottom: 14px; scroll-margin-top: 60px; }
.rs__sec h2 { margin-top: 0; }
.rs__kind { margin: 12px 0 4px; font-size: 0.82rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.rs__note { margin: 6px 0 10px; font-size: 0.88rem; }
.rs__site { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.rs__site label { font-weight: 900; }
.rs__site input, .rs__site select { font: inherit; font-size: 16px; font-weight: 700; border: 2px solid var(--line); border-radius: 12px; padding: 8px 10px; min-width: 0; background: var(--white); color: var(--ink); }
.rs__site input { width: 7.5em; }
.rs-around { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rs-around__row { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 10px 12px; border-radius: 12px; border: 2px solid var(--line); text-decoration: none; color: var(--ink); }
.rs-around__row:hover { border-color: var(--sky-deep); }
.rs-around__to { font-weight: 900; }
.rs-around__best { font-weight: 800; white-space: nowrap; display: inline-flex; gap: 6px; align-items: center; }
.rs-around__more { grid-column: 1 / -1; color: var(--ink-soft); font-weight: 700; }
.rs-around__warn { grid-column: 1 / -1; color: #6A4A00; font-weight: 800; }
.rs-mode--boat { background: #127A8A !important; } .rs-mode--monorail { background: #B2205E !important; } .rs-mode--skyliner { background: #1E5BB8 !important; }
.rs-mode--walk { background: #157A50 !important; } .rs-mode--cart { background: #7A5C2E !important; }
.rs-things { list-style: none; margin: 0; padding: 0; }
.rs-thing { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.rs-thing:last-child { border-bottom: 0; }
.rs-thing__name { font-weight: 800; }
.rs-thing__tags { grid-column: 1; color: var(--ink-faint); font-weight: 700; }
.rs-thing__book { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-weight: 800; font-size: 0.88rem; white-space: nowrap; }
/* One colour per mode (D-088): labels, step dots and map lines match */
.go-opt--bus .go-opt__mode, .rs-mode--bus { background: #1F4FB8 !important; }
.go-opt--boat .go-opt__mode, .rs-mode--boat { background: #0E8A9A !important; }
.go-opt--monorail .go-opt__mode, .rs-mode--monorail { background: #B2205E !important; }
.go-opt--skyliner .go-opt__mode, .rs-mode--skyliner { background: #7B3FB8 !important; }
.go-opt--shuttle .go-opt__mode, .rs-mode--shuttle { background: #B07E0E !important; }
.go-step--bus .go-step__dot { --lc: #1F4FB8; }
.go-step--boat .go-step__dot { --lc: #0E8A9A; }
.go-step--monorail .go-step__dot { --lc: #B2205E; }
.go-step--skyliner .go-step__dot { --lc: #7B3FB8; }
.go-step--shuttle .go-step__dot { --lc: #D8A01E; }
.go-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 0; font-size: 0.82rem; font-weight: 800; color: var(--ink-soft); }
.go-legend__i { display: inline-flex; align-items: center; gap: 6px; }
.go-legend__sw { width: 18px; height: 6px; border-radius: 3px; display: inline-block; }

/* ---------- Busy veil (D-092): the star twirls in place, then shoots off and comes back, until the page arrives ---------- */
.busy { position: fixed; inset: 0; z-index: 4000; display: grid; place-items: center; background: rgba(243, 246, 252, 0.55);
    -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); opacity: 0; transition: opacity 0.18s ease; cursor: progress; }
.busy[hidden] { display: none; }
.busy--on { opacity: 1; }
.busy__stage { position: relative; width: 96px; height: 96px; display: grid; place-items: center; border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.95) 0 46%, rgba(255, 255, 255, 0) 70%); }
.busy__star { width: 46px; height: 46px; color: var(--sky-1); filter: drop-shadow(0 0 10px rgba(255, 194, 75, 0.85));
    animation: busy-twirl 1.6s cubic-bezier(0.6, 0, 0.3, 1) infinite; }
.busy__trail { position: absolute; left: 50%; top: 50%; width: 70px; height: 4px; border-radius: 4px; transform-origin: 0 50%;
    background: linear-gradient(90deg, rgba(255, 194, 75, 0.9), rgba(255, 194, 75, 0)); opacity: 0; animation: busy-trail 1.6s ease-in-out infinite; }
.busy__spark { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #FFC24B; box-shadow: 0 0 8px #FFC24B; opacity: 0; }
.busy__spark--1 { left: 14px; top: 22px; animation: busy-spark 1.6s ease-out infinite; }
.busy__spark--2 { right: 12px; top: 30px; animation: busy-spark 1.6s ease-out 0.35s infinite; }
.busy__spark--3 { left: 40px; bottom: 10px; animation: busy-spark 1.6s ease-out 0.7s infinite; }
@keyframes busy-twirl {
    0% { transform: rotate(0) scale(1); }
    45% { transform: rotate(360deg) scale(1.12); }
    62% { transform: translate(34px, -34px) rotate(420deg) scale(0.45); opacity: 0; }
    63% { transform: translate(-34px, 34px) rotate(420deg) scale(0.45); opacity: 0; }
    82% { transform: translate(0, 0) rotate(540deg) scale(1); opacity: 1; }
    100% { transform: rotate(720deg) scale(1); }
}
@keyframes busy-trail {
    0%, 44% { opacity: 0; transform: rotate(-45deg) scaleX(0.2); }
    55% { opacity: 1; transform: rotate(-45deg) scaleX(1); }
    66%, 100% { opacity: 0; transform: rotate(-45deg) scaleX(0.2); }
}
@keyframes busy-spark { 0% { opacity: 0; transform: scale(0.4); } 30% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(0.2) translateY(-10px); } }
@media (prefers-reduced-motion: reduce) {
    .busy__star { animation: busy-pulse 1.4s ease-in-out infinite; }
    .busy__trail, .busy__spark { display: none; }
}
@keyframes busy-pulse { 50% { opacity: 0.45; transform: scale(0.92); } }
/* The pressed button: a small twirling star in place of a second tap. */
.is-busy { position: relative; cursor: progress; }
.is-busy::after { content: ""; display: inline-block; width: 1em; height: 1em; margin-left: 0.5em; vertical-align: -0.15em;
    background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/%3E%3C/svg%3E") center / contain no-repeat;
    animation: busy-spin 0.9s linear infinite; }
@keyframes busy-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .is-busy::after { animation: busy-pulse 1.2s ease-in-out infinite; } }

/* ---------- Dining everywhere (D-093) ---------- */
.dn { max-width: 900px; }
.dn__form { padding: clamp(14px, 3vw, 22px); display: grid; gap: 10px; }
.dn__dest { display: flex; gap: 6px; flex-wrap: wrap; }
.dn__dest .pl__chip { text-decoration: none; }
.dn__dest [aria-current="page"] { background: var(--sky-1); color: var(--on-sky); border-color: var(--sky-1); }
.dn__q input { width: 100%; font: inherit; font-size: 16px; font-weight: 700; padding: 12px 14px; border: 2px solid var(--line); border-radius: 14px; }
.dn__filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dn__filters select { font: inherit; font-size: 16px; font-weight: 700; padding: 8px 10px; border: 2px solid var(--line); border-radius: 12px; background: var(--white); max-width: 100%; }
.dn__book { display: inline-flex; gap: 6px; align-items: center; font-weight: 800; }
.dn__count { margin: 0; font-size: 0.85rem; }
.dn__sec { padding: clamp(14px, 3vw, 22px); margin-top: 14px; }
.dn__sec h2 { margin-top: 0; }
.dn__gh { margin: 14px 0 4px; font-size: 0.82rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-faint); }
.dn__list { list-style: none; margin: 0; padding: 0; }
.dn__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 14px; padding: 9px 0; border-top: 1px solid var(--line); }
.dn__row[hidden], .dn__group[hidden] { display: none; }
.dn__main { min-width: 0; flex: 1 1 260px; }
.dn__where { color: var(--ink-faint); font-weight: 700; font-size: 0.85rem; margin-left: 6px; }
.dn__acts { display: flex; gap: 14px; align-items: center; justify-content: flex-end; font-weight: 800; font-size: 0.92rem; margin-left: auto; }
.dn__nomenu { color: var(--ink-faint); font-weight: 700; font-size: 0.82rem; }
.dn__dishes { margin: 4px 0 0; padding-left: 18px; font-size: 0.9rem; }
.dn__price { font-weight: 800; margin-left: 4px; }
.dn__meal { color: var(--ink-faint); font-size: 0.8rem; margin-left: 4px; }
.dn__none { margin: 12px 4px; }

/* Phones (D-093 follow-up): the hotel picker gets its own line; dining rows put their links under the name. */
@media (max-width: 700px) {
    .rs__sky .rs__switch select { flex: 1 1 100%; max-width: none; }
    .dn__main { flex-basis: 100%; }
    .dn__acts { margin-left: 0; justify-content: flex-start; flex-wrap: wrap; gap: 6px 16px; }
}


/* ---- Hotel pages on the park layout (D-094, Jorge 2026-10-22: "keeps the UI consistent") ---------------------------- */
.pl__all { flex: 0 0 auto; font-size: 0.85rem; font-weight: 800; color: var(--sky-deep); white-space: nowrap; }
.pl-row__link { color: var(--ink); text-decoration: none; }
.pl-row__link:hover .pl-row__name { color: var(--sky-deep); }
.rsx .pl-row__acts .pl-btn--text { padding: 0 6px; white-space: nowrap; }
.rsx .rs__site { margin: 12px 0 4px; flex-wrap: wrap; }
.rsx .rs__note { margin: 8px 0 0; font-size: 0.85rem; }
.rsx .pl__empty { margin: 14px 2px; font-weight: 800; color: var(--ink-soft); }
.rsx-pin--stop span { background: #12264D; font-size: 11px; min-width: 40px; height: 24px; }
.rsx-pin--loop span { background: #157A50; font-size: 11px; min-width: 34px; height: 22px; padding: 0 5px; }
/* Fort Wilderness places (Jorge, 2026-10-24): small, so the loops and stops stay the main thing. */
.rsx-pin--poi span { font-size: 10px; min-width: 30px; height: 20px; padding: 0 5px; background: #5B6478; }
.rsx-pin--wc span { background: #2B63D9; }
.rsx-pin--shop span { background: #8A5300; }
.rsx-pin--ranch span { background: #7A5C2E; }
.rsx-pin--boat span { background: #127A8A; }
@media (max-width: 480px) {
    .rsx .pl-row { flex-wrap: wrap; }
    .rsx .pl-row__acts { margin-left: 66px; }   /* under the name, past the 54px box */
}
/* Trip minutes sit on the mode's colour (bus blue, boat teal…): white text so they don't fade (Jorge, 2026-10-22). */
.pl-wait--trip { background: #4A5E86; color: var(--white); }
.pl-wait--trip b, .pl-wait--trip small { color: var(--white); }
.pl-wait--trip b { font-size: 1.25rem; }

/* Dining search: nothing in the form wider than its card (Jorge, 2026-10-22: the area list's longest name pushed the
   search box and the list off the right edge on a phone). */
.dn__form { grid-template-columns: minmax(0, 1fr); min-width: 0; }
.dn__form > * { min-width: 0; }
.dn__q, .dn__q input { display: block; max-width: 100%; min-width: 0; box-sizing: border-box; }
.dn__filters select { min-width: 0; text-overflow: ellipsis; }
.dn__filters select[data-dn-area] { flex: 1 1 100%; width: 100%; }
/* Map pages on a phone are exactly one screen: the page itself never scrolls (it pulled the footer up under a swipe,
   Jorge's recording 2026-10-22). The footer's links are on every other page. */
@media (max-width: 899px) {
    .main--app ~ .footer { display: none; }   /* ~ not +: for members the tab bar sits between them (Jorge, 2026-10-24) */
    body:has(.main--app) { overscroll-behavior: none; }
    .pl__sheet { overscroll-behavior: contain; touch-action: pan-y; }
}

/* Busy veil shows at once (no fade): iPhone Safari freezes transitions on a page it is leaving (D-096). */
.busy { transition: none; }
/* Arriving (D-104): just the star, over the new page, for one short twirl; then it fades out on its own. */
.busy--arrive { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; pointer-events: none; cursor: auto;
    animation: busy-arrive 0.25s ease-in 0.55s forwards; }
@keyframes busy-arrive { to { opacity: 0; visibility: hidden; } }
/* Location buttons are for phones and tablets only: a computer has no GPS (Jorge, 2026-10-22, D-096). */
@media not all and (hover: none) and (pointer: coarse) {
    .pl__locate, .pl__near, .rs__near, [data-nearby-btn] { display: none !important; }
}

/* ---------- Public guide: hotel and restaurant pages (D-097) ---------- */
/* Three footer columns on wide screens only. Unscoped, this beat the phone rule above and pushed the legal links 100px
   past the screen on every page, so the page slid sideways (Jorge, 2026-10-24). */
@media (min-width: 821px) { .footer__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); } }
.footer a { overflow-wrap: anywhere; }
/* Belt and braces: nothing may make a phone page wider than the phone. */
@media (max-width: 899px) { html, body { overflow-x: clip; } }
.place--link { display: block; color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.place--link:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg, var(--shadow)); }
.home__guides { margin-top: 10px; font-weight: 800; font-size: 0.92rem; }
.gd { display: grid; gap: 16px; }
.gd__crumbs { font-size: 0.85rem; font-weight: 800; color: var(--ink-soft); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.gd__crumbs a { color: var(--sky-deep); }
.gd__card { padding: clamp(16px, 3vw, 26px); min-width: 0; }
.gd__card h2 { margin-top: 0; }
.gd__hero { background: linear-gradient(135deg, #FFFFFF 0%, #EEF4FF 100%); }
.gd__kicker { margin: 0 0 4px; font-size: 0.8rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sky-deep); }
.gd__h { margin: 0 0 8px; font-size: clamp(1.3rem, 2.6vw, 1.7rem); }
.gd__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.gd__small { font-size: 0.88rem; color: var(--ink-soft); }
.gd__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.gd__facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 14px; margin: 0; }
.gd__facts dt { font-weight: 900; color: var(--ink-soft); }
.gd__facts dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.gd__h3 { margin: 18px 0 4px; font-size: 1.05rem; }
.gd__chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; }
.gd__chips li { background: var(--tint-2); color: var(--sky-deep); border-radius: 999px; padding: 4px 12px; font-size: 0.85rem; font-weight: 800; }
.gd__steps { margin: 0; padding-left: 1.3em; display: grid; gap: 8px; }
/* How long openings last (D-109) */
.gd__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 4px 0 12px; }
.gd__stat { margin: 0; padding: 12px 14px; border-radius: 14px; background: var(--tint-2); display: grid; gap: 2px; }
.gd__stat b { font-size: 1.35rem; color: var(--ink); }
.gd__stat span { font-size: 0.85rem; color: var(--ink-soft); font-weight: 700; }
.gd__list { list-style: none; margin: 0; padding: 0; columns: 2 280px; column-gap: 28px; }
.gd__list li { break-inside: avoid; padding: 7px 0; border-bottom: 1px solid var(--line); }
.gd__list li[hidden], [data-gd-group][hidden] { display: none; }
.gd__list a { font-weight: 900; }
.gd__meta { display: block; font-size: 0.82rem; font-weight: 700; color: var(--ink-faint); }
.gd__tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.gd__tiles a { display: flex; flex-direction: column; gap: 2px; height: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 14px; border: 2px solid var(--line);
    color: var(--ink); text-decoration: none; background: var(--white); }
.gd__tiles a:hover { border-color: var(--sky-deep); }
.gd__tiles span { font-size: 0.82rem; font-weight: 700; color: var(--ink-soft); }
.gd__none { font-weight: 800; color: var(--ink-soft); }
.gd__fine { font-size: 0.82rem; color: var(--ink-faint); max-width: 80ch; }
.gd .menu-page__card { padding: clamp(16px, 3vw, 26px); }

/* ---------- Blog (D-100) ---------- */
.bl__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.bl__item h2 a { color: var(--ink); text-decoration: none; }
.bl__item h2 a:hover { color: var(--sky-deep); }
.gd__more { font-weight: 900; }
.bl__post { max-width: 820px; }
.bl__body { font-size: 1.05rem; line-height: 1.65; }
.bl__body h2 { font-size: 1.35rem; margin: 1.4em 0 0.4em; }
.bl__body ul { padding-left: 1.2em; }
.bl__body li { margin-bottom: 0.35em; }
.bl__draft { background: #FFF1D6; color: #8A5300; }
.bl__social { white-space: pre-wrap; font: inherit; font-size: 0.92rem; background: var(--tint); border-radius: 12px; padding: 12px 14px; margin: 4px 0 12px; }
.bl__sources a { font-weight: 800; }
/* Blog review panel on /admin/content/{slug} (D-102) */
.bl__review { border: 2px solid #F0C36D; background: #FFF8EA; }
.bl__review--live { border-color: #9BD3B4; background: #EEF9F2; }
.bl__review form { display: inline; }
.bl__notice { margin-top: 0; }
.bl__problems { color: #A23B2A; }

/* Park hours calendar (D-112) */
.ph__parks { display: flex; flex-wrap: wrap; gap: 8px; }
.ph__park { padding: 6px 14px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--sky-deep); font-weight: 900; font-size: 0.9rem; text-decoration: none; }
.ph__park.is-on { background: var(--sky-deep); border-color: var(--sky-deep); color: var(--on-sky); }
.ph__today .gd__h { margin-bottom: 6px; }
.ph__ev { margin: 4px 0; }
.ph__ev small { display: block; color: var(--ink-soft); font-size: 0.85rem; }
.ph__ev--party b, .ph__ev--ticketed b { color: #7A2E8E; }
.ph__legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.82rem; font-weight: 800; color: var(--ink-soft); }
.ph__legend span { display: inline-flex; align-items: center; gap: 6px; }
.ph__key { display: inline-block; width: 14px; height: 14px; border-radius: 4px; }
.ph__key--party { background: #F3E6F7; border: 2px solid #B46BC8; }
.ph__key--extra { background: var(--open-bg); border: 2px solid var(--open); }
.ph__mh { margin: 0 0 10px; font-size: 1.15rem; }
.ph__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.ph__wd { text-align: center; font-size: 0.72rem; font-weight: 900; color: var(--ink-faint); text-transform: uppercase; }
.ph__cell { display: flex; flex-direction: column; gap: 2px; min-height: 64px; padding: 6px; border-radius: 10px; background: var(--tint); color: var(--ink); text-decoration: none; min-width: 0; overflow: hidden; }
a.ph__cell:hover { outline: 2px solid var(--sky-deep); }
.ph__cell--blank { background: transparent; }
.ph__cell--off { background: transparent; color: var(--ink-faint); opacity: 0.5; }
.ph__cell--party { background: #F3E6F7; }
.ph__cell.is-today { box-shadow: inset 0 0 0 2px var(--sky-deep); }
.ph__n { font-size: 0.9rem; }
.ph__hrs { font-size: 0.78rem; font-weight: 800; color: var(--ink-soft); white-space: nowrap; }
.ph__tag { font-size: 0.7rem; font-weight: 900; color: #7A2E8E; line-height: 1.15; }
.ph__tag--extra { color: var(--open-ink); }
.ph__short { display: none; }
.ph__days { list-style: none; margin: 0; padding: 0; display: grid; }
.ph__day { padding: 10px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.ph__day:target { background: var(--tint); border-radius: 10px; padding-left: 10px; padding-right: 10px; }
.ph__dh { margin: 0; font-size: 1rem; }
.ph__open { margin: 2px 0; font-weight: 800; }
@media (max-width: 520px) {
    .ph__grid { gap: 2px; }
    .ph__cell { min-height: 54px; padding: 4px 2px; border-radius: 8px; align-items: center; text-align: center; }
    .ph__hrs { font-size: 0.6rem; letter-spacing: -0.02em; }
    .ph__tag { font-size: 0.6rem; }
    .ph__long { display: none; }
    .ph__parks { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 6px; }
    .ph__parks::-webkit-scrollbar { display: none; }
    .ph__park { flex: none; padding: 5px 12px; font-size: 0.85rem; }
    .ph__short { display: inline; }
}
[data-park-dest][hidden] { display: none; }

/* My Trips (D-118) */
[data-trip-package][hidden] { display: none; }
.trip-list { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 14px; }
.trip-card { background: var(--white); border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); padding: 16px 18px; }
.trip-card__name { margin: 0 0 2px; font-weight: 800; color: var(--ink); }
.trip-card__reminders { margin: 10px 0 12px; padding-left: 18px; display: grid; gap: 8px; }

/* Hotel filters (D-120) */
.star-filters { border: 1px solid var(--line, #d9e2f2); border-radius: var(--radius-sm); padding: 10px 14px; }
.star-filters > summary { cursor: pointer; font-weight: 800; color: var(--ink); }
.star-filters[open] > summary { margin-bottom: 10px; }
[data-dest-only][hidden] { display: none; }

/* Admin customers, searches, alerts (D-122) */
.admin-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.admin-tabs a { padding: 6px 12px; border-radius: 999px; background: var(--white); box-shadow: var(--shadow-sm); font-weight: 800; text-decoration: none; color: var(--ink); }
.admin-tabs a[aria-current="page"] { background: var(--sky-deep, #1F4FB8); color: #fff; }
.admin-search { display: flex; gap: 8px; margin: 0 0 12px; }
.admin-search input { flex: 1; min-width: 0; }
.ops-table td, .ops-table th { vertical-align: top; }
.ops-table .num { text-align: right; white-space: nowrap; }
.ops-table .when { white-space: nowrap; }
.tag { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 0.78rem; font-weight: 800; background: #EEF2FA; color: var(--ink); }
.tag--good { background: #DDF5E6; }
.tag--warn { background: #FFF1CC; }
.tag--bad { background: #FDE0DE; }

/* Admin on phones (D-122): one scrolling row of pills for the menu; tables become one card per row. */
.admin-nav { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; margin: 0 0 14px; padding: 4px 2px 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.admin-nav::-webkit-scrollbar { display: none; }
.admin-nav a, .admin-nav button { flex: 0 0 auto; white-space: nowrap; padding: 8px 14px; border-radius: 999px; background: var(--white); color: var(--ink);
    box-shadow: var(--shadow-sm); font: inherit; font-weight: 800; font-size: 0.9rem; text-decoration: none; border: 0; cursor: pointer; }
.admin-nav a[aria-current="page"] { background: var(--sky-deep, #1F4FB8); color: #fff; }
.admin-nav form { flex: 0 0 auto; margin: 0; }
.admin-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.admin-tabs::-webkit-scrollbar { display: none; }
.admin-tabs a { flex: 0 0 auto; white-space: nowrap; }
.release-grid th:first-child, .release-grid td:first-child { position: sticky; left: 0; background: var(--white); z-index: 1; }
@media (max-width: 760px) {
    .ops-list { padding: 14px; }
    .admin-search { flex-direction: column; }
    .ops-table--stack thead { display: none; }
    .ops-table--stack, .ops-table--stack tbody { display: block; }
    .ops-table--stack tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--line); }
    .ops-table--stack td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 3px 0; border: 0; text-align: right; }
    .ops-table--stack td::before { content: attr(data-label); flex: 0 0 auto; font-size: 0.78rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-faint); text-align: left; }
    .ops-table--stack td.cell-main { display: block; text-align: left; font-size: 1rem; padding-bottom: 6px; }
    .ops-table--stack td.cell-main::before { content: none; }
    .ops-table--stack td:empty { display: none; }
    .ops-table--stack .when { white-space: normal; }
    .ops-list dl > div { flex-wrap: wrap; }
}