/* Cedar Point section, card 876.
   Lake Erie and sand. Each page is built around one real object that carries the park's own data:
   the skyline board (18 coasters at true height, live waits on top), the high striker (thrill level),
   the lake chart (every ride at its real coordinates), and the haunt ticket strip (night hours).
   Dark mode turns the sand to night water. Motion stays off the type and honors reduced motion. */

.cp {
    --paper: #fbf6ec;
    --sand: #f1e6d1;
    --card: #ffffff;
    --ink: #10212e;
    --ink2: #4a5964;
    --lake: #0e3b5a;
    --lake2: #1d6491;
    --water: #d9e8f1;
    --red: #b8321b;
    --red-ink: #a32a15;
    --gold: #e9a91c;
    --open: #23764f;
    --warm: #b86b00;
    --hot: #b8321b;
    --rule: rgba(16, 33, 46, .14);
    --rail: #c9b896;
    --shadow: 0 1px 0 rgba(16,33,46,.06), 0 10px 30px -18px rgba(14,59,90,.45);
    --display: var(--font-display, "Bricolage Grotesque", system-ui, sans-serif);
    --body: var(--font-text, "Hanken Grotesk", system-ui, sans-serif);
    background: var(--paper);
    color: var(--ink);
    font-family: var(--body);
    font-size: 17px;
    line-height: 1.55;
    padding-bottom: 56px;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .cp {
        --paper: #0b1821; --sand: #10222e; --card: #132836; --ink: #edf3f6; --ink2: #a8b8c3;
        --lake: #9fd0ee; --lake2: #7fc0e6; --water: #0f2d40; --red: #ff7d61; --red-ink: #ff977f;
        --gold: #f5c04a; --open: #5fd39b; --warm: #f2b14a; --hot: #ff7d61; --rule: rgba(237,243,246,.14); --rail: #4b5d68;
        --shadow: 0 0 0 1px rgba(237,243,246,.08);
    }
}
:root[data-theme="dark"] .cp {
    --paper: #0b1821; --sand: #10222e; --card: #132836; --ink: #edf3f6; --ink2: #a8b8c3;
    --lake: #9fd0ee; --lake2: #7fc0e6; --water: #0f2d40; --red: #ff7d61; --red-ink: #ff977f;
    --gold: #f5c04a; --open: #5fd39b; --warm: #f2b14a; --hot: #ff7d61; --rule: rgba(237,243,246,.14); --rail: #4b5d68;
    --shadow: 0 0 0 1px rgba(237,243,246,.08);
}

.cp *, .cp *::before, .cp *::after { box-sizing: border-box; }
.cp .cp-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cp .cp-season :where(a) { color: #fff; }
.cp-wrap { max-width: 1120px; margin-inline: auto; padding-inline: 16px; }
.cp h1, .cp h2, .cp h3 { font-family: var(--display); letter-spacing: -.02em; color: var(--ink); }
.cp :where(a) { color: var(--lake2); text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.cp :where(a):hover { color: var(--red-ink); }
.cp :where(a, button, summary, input):focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; border-radius: 6px; }

/* Head */
.cp-head { padding: 28px 0 8px; }
.cp-crumb { margin: 0 0 14px; font-size: 14px; color: var(--ink2); }
.cp-crumb :where(a) { color: var(--ink2); }
.cp-h1 { margin: 0 0 14px; font-size: clamp(36px, 6vw, 68px); line-height: .98; font-weight: 800; }
.cp-h1 span { display: block; color: var(--lake2); font-size: .5em; line-height: 1.1; margin-top: 8px; font-weight: 700; letter-spacing: -.01em; }
.cp-answer { margin: 0; max-width: 720px; font-size: 18.5px; line-height: 1.5; }
.cp-answer b { color: var(--ink); }
.cp-updated { margin: 10px 0 0; font-size: 14px; color: var(--ink2); }

/* Section tabs, the park's own pages */
.cp-tabs { margin: 22px 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.cp-tabs ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 18px; }
.cp-tabs li { margin: 0; }
.cp-tabs a { display: inline-block; padding: 11px 0; font-weight: 600; font-size: 15px; color: var(--ink2); text-decoration: none; border-bottom: 3px solid transparent; min-height: 44px; }
.cp-tabs a:hover { color: var(--ink); }
.cp-tabs a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--red); }

.cp-jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.cp-jump :where(a) { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 13px; border-radius: 999px; background: var(--sand); color: var(--ink); text-decoration: none; font-weight: 700; font-size: 14px; }
.cp-jump :where(a):hover { background: var(--ink); color: var(--paper); }
.cp :where(h2[id]) { scroll-margin-top: 80px; }

/* Sections */
.cp-sec { margin-top: 44px; }
.cp-sec > h2 { font-size: clamp(25px, 3.4vw, 34px); line-height: 1.1; margin: 0 0 10px; }
.cp-sec > p { max-width: 720px; margin: 0 0 14px; }
.cp-note { font-size: 14.5px; color: var(--ink2); }

/* Status chips */
.cp-chip { display: inline-flex; align-items: center; justify-content: center; min-width: 64px; padding: 3px 9px; border-radius: 999px; font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; border: 1.5px solid currentColor; }
.cp-chip.is-open { color: var(--open); }
.cp-chip.is-warm { color: var(--warm); }
.cp-chip.is-hot { color: var(--hot); background: color-mix(in srgb, var(--hot) 10%, transparent); }
.cp-chip.is-down { color: var(--red-ink); border-style: dashed; }
.cp-chip.is-closed { color: var(--ink2); border-color: var(--rule); }

/* ---------- The skyline board (wait times) ---------- */
.cp-skyline { margin-top: 26px; background: linear-gradient(to bottom, var(--water) 0, var(--paper) 100%); border-radius: 14px; padding: 16px 12px 0; box-shadow: var(--shadow); }
.cp-sky-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 16px; padding: 0 4px 10px; }
.cp-sky-top h2 { margin: 0; font-size: 19px; }
.cp-sky-top p { margin: 0; font-size: 14px; color: var(--ink2); }
.cp-sky { position: relative; height: 300px; display: grid; grid-template-columns: repeat(18, minmax(0, 1fr)); gap: 3px; align-items: end; list-style: none; margin: 0; padding: 0; }
.cp-sky li { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; margin: 0; }
.cp-tower { position: relative; width: 100%; height: var(--h); min-height: 10px; border-radius: 3px 3px 0 0; background: var(--lake); }
:root[data-theme="dark"] .cp-tower { background: #2d6f99; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cp-tower { background: #2d6f99; } }
.cp-sky li.is-open .cp-tower { background: var(--open); }
.cp-sky li.is-warm .cp-tower { background: var(--warm); }
.cp-sky li.is-hot .cp-tower { background: var(--hot); }
.cp-sky li.is-down .cp-tower { background: var(--card); box-shadow: inset 0 0 0 2px var(--red); }
.cp-sky li.is-down .cp-tname { color: var(--red-ink); }
.cp-more > summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 1.5px solid var(--ink); font-weight: 700; font-size: 15px; margin: 4px 0 14px; }
.cp-more[open] > summary { background: var(--ink); color: var(--paper); }
.cp-cap { font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; margin-bottom: 4px; color: var(--ink); white-space: nowrap; }
.cp-cap small { display: block; font-size: 9.5px; font-weight: 600; color: var(--ink2); text-align: center; margin-top: 1px; }
.cp-tname { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl; font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; letter-spacing: .01em; }
.cp-tname-out { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 11.5px; font-weight: 700; color: var(--ink2); white-space: nowrap; margin-bottom: 6px; }
.cp-num { display: block; width: 100%; text-align: center; padding: 5px 0 6px; font-size: 11.5px; font-weight: 700; color: var(--ink2); background: var(--sand); border-top: 2px solid var(--rail); }
.cp-sky-key { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 10px 4px 12px; font-size: 13.5px; color: var(--ink2); list-style: none; }
.cp-sky-key li { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.cp-sky-key i { width: 12px; height: 12px; border-radius: 3px; background: var(--lake); display: inline-block; }
.cp-sky-key .k-open { background: var(--open); } .cp-sky-key .k-warm { background: var(--warm); } .cp-sky-key .k-hot { background: var(--hot); }

/* The roll call under the skyline: number, name, height, wait */
.cp-roll { list-style: none; margin: 14px 0 0; padding: 0; columns: 2 320px; column-gap: 28px; }
.cp-roll li { break-inside: avoid; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--rule); margin: 0; }
.cp-roll .n { font-weight: 800; color: var(--ink2); font-variant-numeric: tabular-nums; text-align: right; font-size: 14px; }
.cp-roll b { display: block; font-size: 16px; line-height: 1.2; }
.cp-roll small { display: block; font-size: 13px; color: var(--ink2); }

.cp-count { display: inline-flex; align-items: baseline; gap: 8px; margin: 14px 0 0; padding: 8px 14px; border-radius: 12px; background: var(--lake); color: #fff; font-weight: 600; font-size: 15px; }
.cp-count b { font-family: var(--display); font-size: 22px; font-weight: 800; color: #ffd979; font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .cp-count { background: #0f3550; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cp-count { background: #0f3550; } }
.cp-sort { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 0 4px 10px; font-size: 13.5px; font-weight: 700; color: var(--ink2); }
.cp-sort button { font: inherit; font-size: 13.5px; padding: 6px 12px; min-height: 36px; border-radius: 999px; border: 1.5px solid var(--rule); background: var(--card); color: var(--ink); cursor: pointer; }
.cp-sort button[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.cp-sky-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cp-swipe-sky { font-weight: 700; color: var(--lake2); }
@media (min-width: 641px) { .cp-swipe-sky { display: none; } }
/* Season banner (winter) */
.cp-season { margin-top: 22px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px 20px; align-items: center; background: var(--lake); color: #fff; border-radius: 14px; padding: 18px 20px; }
:root[data-theme="dark"] .cp-season { background: #0f3550; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cp-season { background: #0f3550; } }
.cp-season-days { font-family: var(--display); font-weight: 800; font-size: 54px; line-height: .9; font-variant-numeric: tabular-nums; }
.cp-season-days small { display: block; font-size: 14px; font-weight: 600; margin-top: 6px; letter-spacing: 0; opacity: .85; }
.cp-season p { margin: 0; font-size: 16px; }
.cp-season p.cp-season-days { font-size: 64px; }
/* Winter: every ride is closed, so the chips step back and the lists pack tighter */
.cp--winter .cp-roll .cp-chip, .cp--winter .cp-group .cp-chip { display: none; }
.cp--winter .cp-roll li { grid-template-columns: 26px minmax(0, 1fr); padding: 7px 0; }
.cp--winter .cp-group ul { columns: 2 150px; column-gap: 18px; }
.cp--winter .cp-group li { break-inside: avoid; display: block; padding: 6px 0; font-size: 15px; line-height: 1.25; }
.cp-season p b { color: #ffd979; }

/* Board grouped by ride type */
.cp-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px 28px; }
.cp-group h3 { margin: 0 0 4px; font-size: 20px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.cp-group h3 small { font-family: var(--body); font-size: 13.5px; font-weight: 600; color: var(--ink2); letter-spacing: 0; }
.cp-group ul { list-style: none; margin: 0; padding: 0; }
.cp-group li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--rule); margin: 0; }
.cp-group li span { min-width: 0; }
.cp-group li small { display: block; font-size: 13px; color: var(--ink2); }

/* Almanac */
.cp-alm { width: 100%; border-collapse: collapse; font-size: 15.5px; }
.cp-alm th, .cp-alm td { text-align: left; padding: 9px 8px; border-bottom: 1px solid var(--rule); }
.cp-alm th { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink2); }
.cp-alm td.num { font-variant-numeric: tabular-nums; font-weight: 700; }

/* Plan links and FAQ */
.cp-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 0 26px; border-top: 2px solid var(--ink); }
.cp-plan :where(a) { display: block; padding: 14px 0; border-bottom: 1px solid var(--rule); text-decoration: none; color: var(--ink); }
.cp-plan :where(a) b { display: block; font-size: 17px; color: var(--lake2); }
.cp-plan :where(a) span { display: block; font-size: 14.5px; color: var(--ink2); }
.cp-plan :where(a):hover b { color: var(--red-ink); text-decoration: underline; }
.cp-faq details { border-bottom: 1px solid var(--rule); }
.cp-faq summary { cursor: pointer; padding: 14px 0; font-weight: 700; font-size: 17px; list-style-position: inside; min-height: 44px; }
.cp-faq details p { margin: 0 0 16px; max-width: 720px; }
.cp-foot { margin-top: 40px; font-size: 13.5px; color: var(--ink2); }

/* ---------- The thrill dial (rides) ---------- */
/* A half gauge with one wedge per thrill level, each wedge carrying its ride count; the needle swings to the
   highest level a rider of the chosen height can reach. The list below is grouped by the same five wedges. */
.cp-hs { margin-top: 26px; }
.cp-rung--5 { --heat: var(--red); } .cp-rung--4 { --heat: #d9671c; } .cp-rung--3 { --heat: var(--gold); }
.cp-rung--2 { --heat: #6fb0d8; } .cp-rung--1 { --heat: #b7d3e6; }
.cp-rung { padding: 18px 0 22px; border-top: 4px solid var(--heat); }
.cp-pips { display: inline-flex; gap: 3px; margin-right: 9px; vertical-align: 1px; }
.cp-pips i { width: 14px; height: 6px; border-radius: 2px; background: var(--rule); }
.cp-pips i.on { background: var(--heat); }
.cp-rung-h { margin: 0 0 10px; }
.cp-rung-h h2 { margin: 2px 0 4px; font-size: clamp(22px, 3vw, 30px); line-height: 1.05; }
.cp-rung-h .lvl { font-weight: 800; color: var(--red-ink); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.cp-rung-h p { margin: 0; font-size: 14.5px; color: var(--ink2); }
.cp-rides { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 0 24px; }
.cp-rides li { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 10px; padding: 9px 0; border-bottom: 1px solid var(--rule); margin: 0; }
.cp-rides b { flex-basis: 100%; font-size: 16.5px; line-height: 1.25; }
.cp-rides small { flex: 1 1 140px; }
.cp-rides .tag { display: inline; white-space: nowrap; }
.cp-rides .ht { order: 3; margin-left: auto; white-space: nowrap; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); background: var(--sand); border-radius: 6px; padding: 2px 8px; }
.cp-rides small { font-size: 13px; color: var(--ink2); }
.cp-dial { --seg: 40px; display: grid; grid-template-columns: 220px minmax(0, 1fr); grid-template-areas: "h h" "fig side" "tall tall"; gap: 0 22px; align-items: center; margin: 24px 0 0; max-width: 600px; padding: 16px 18px; background: var(--card); border-radius: 14px; box-shadow: var(--shadow); }
.cp-dial-h { grid-area: h; margin: 0 0 10px; min-height: 2.3em; display: flex; align-items: center; font-family: var(--display); font-weight: 800; font-size: 17px; line-height: 1.15; }
.cp-dial-fig { grid-area: fig; display: block; width: 100%; height: auto; overflow: visible; }
.cp-dial-seg { fill: var(--heat); stroke: var(--card); stroke-width: 1; }
.cp-dial-seg.is-off { fill: var(--rule); }
.cp-dial-n { font-family: var(--display); font-weight: 800; font-size: 15px; fill: #10212e; text-anchor: middle; dominant-baseline: central; font-variant-numeric: tabular-nums; }
.cp-dial-n.cp-rung--5, .cp-dial-n.cp-rung--4 { fill: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cp-dial-n.cp-rung--5 { fill: #10212e; } }
:root[data-theme="dark"] .cp-dial-n.cp-rung--5 { fill: #10212e; }
.cp-dial-end { font-size: 10px; font-weight: 700; fill: var(--ink2); }
.cp-dial-needle { fill: var(--ink); transform-box: view-box; transform-origin: 100px 100px; transform: rotate(calc(max(var(--lvl) - .5, 0) * 36deg)); }
.cp-dial-needle circle { stroke: var(--card); stroke-width: 3; }
.cp-dial-side { grid-area: side; min-width: 0; }
.cp-meter { list-style: none; margin: 0; padding: 0; }
.cp-meter li { margin: 0; height: var(--seg); }
.cp-meter :where(a) { display: flex; height: 100%; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--rule); color: var(--ink); text-decoration: none; font-size: 15px; padding: 0 4px; }
.cp-meter :where(a) b { display: inline-flex; align-items: center; gap: 8px; }
.cp-meter :where(a) b::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--heat); }
.cp-meter :where(a) > span { color: var(--ink2); font-weight: 600; font-variant-numeric: tabular-nums; }
.cp-meter :where(a):hover b { text-decoration: underline; }
@media (prefers-reduced-motion: no-preference) { .cp-dial-needle { transition: transform .5s cubic-bezier(.2,.9,.3,1.15); } }
.cp-reset { font: inherit; font-size: 14.5px; font-weight: 700; padding: 9px 14px; min-height: 44px; border-radius: 999px; border: 1.5px dashed var(--ink2); background: transparent; color: var(--ink); cursor: pointer; }
.cp-result { margin: 12px 0 0; font-weight: 700; font-size: 15px; }
.cp-empty { margin: 14px 0 0; padding: 14px 16px; border-radius: 10px; background: var(--sand); font-size: 15.5px; }
.cp-rides .tag { display: inline-block; margin-left: 6px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--red-ink); }

.cp-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; }
.cp-filter button { font: inherit; font-size: 14.5px; font-weight: 700; padding: 9px 14px; min-height: 44px; border-radius: 999px; border: 1.5px solid var(--rule); background: var(--card); color: var(--ink); cursor: pointer; }
.cp-filter button[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.cp-rides li[hidden], .cp-rung[hidden] { display: none; }
.cp-dial .cp-tall { grid-area: tall; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rule); color: var(--ink); }
.cp-tall[hidden] { display: none; }
.cp-tall { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 700; color: var(--ink2); }
.cp-tall select { font: inherit; color: var(--ink); background: var(--card); border: 1.5px solid var(--rule); border-radius: 999px; padding: 9px 12px; min-height: 44px; }

/* Coaster stat sheet */
.cp-stats { width: 100%; border-collapse: collapse; font-size: 15px; }
.cp-stats th, .cp-stats td { padding: 9px 8px; border-bottom: 1px solid var(--rule); text-align: left; vertical-align: top; }
.cp-stats th { font-size: 12.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink2); }
.cp-stats td.num { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.cp-stats td small { display: block; color: var(--ink2); font-size: 13px; }
.cp-stats td.rq { font-weight: 700; font-size: 14px; min-width: 84px; }
@media (max-width: 640px) { .cp-stats { font-size: 14px; } .cp-stats th, .cp-stats td { padding: 8px 5px; } }
.cp-bar { display: block; height: 6px; border-radius: 3px; background: var(--lake2); width: var(--w); margin-top: 5px; min-width: 4px; }
.cp-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---------- The lake chart (map) ---------- */
.cp-chart { margin-top: 24px; background: var(--water); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); position: relative; }
.cp-chart svg { display: block; width: 100%; height: auto; }
.cp-chart .land { fill: var(--sand); stroke: var(--rail); stroke-width: 2; }
.cp-chart .grid { stroke: color-mix(in srgb, var(--lake2) 22%, transparent); stroke-width: 1; }
.cp-chart .water-l { fill: var(--lake2); font-family: var(--display); font-weight: 700; font-size: 22px; letter-spacing: .3em; opacity: .55; }
.cp-chart .area-l { fill: var(--ink2); font-family: var(--body); font-weight: 700; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.cp-chart .pin circle { stroke: var(--card); stroke-width: 2; fill: var(--lake); }
.cp-chart .pin.is-open circle { fill: var(--open); }
.cp-chart .pin.is-warm circle { fill: var(--warm); }
.cp-chart .pin.is-hot circle { fill: var(--hot); }
.cp-chart .pin.is-down circle { fill: var(--card); stroke: var(--red); stroke-dasharray: 3 2; }
.cp-chart .pin text { fill: #fff; font: 700 10.5px var(--body); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.cp-chart .pin.is-down text { fill: var(--red-ink); }
.cp-chart .pin.is-coaster circle { stroke: var(--gold); stroke-width: 3; }
.cp-chart .rose { fill: none; stroke: var(--lake2); stroke-width: 1.5; opacity: .6; }
.cp-chart .rose-n { fill: var(--lake2); font: 800 14px var(--display); text-anchor: middle; opacity: .8; }
.cp-chart-key { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 12px 0 0; padding: 0; list-style: none; font-size: 13.5px; color: var(--ink2); }
.cp-chart-key li { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.cp-chart-key i { width: 13px; height: 13px; border-radius: 50%; background: var(--lake); display: inline-block; border: 2px solid var(--card); box-shadow: 0 0 0 1px var(--rule); }
.cp-chart-key .k-coaster { box-shadow: 0 0 0 2px var(--gold); }
.cp-chart-key .k-open { background: var(--open); }
@media (min-width: 761px) { .cp-chart-key .cp-swipe { display: none; } }
.cp-legend { columns: 3 230px; column-gap: 26px; margin-top: 8px; }
.cp-legend details { break-inside: avoid; margin-bottom: 10px; }
.cp-legend summary { cursor: pointer; list-style: none; min-height: 44px; display: flex; align-items: flex-end; }
.cp-legend summary::-webkit-details-marker { display: none; }
.cp-legend h3 { flex: 1; display: flex; justify-content: space-between; align-items: baseline; font-size: 16px; margin: 0 0 4px; padding-bottom: 6px; border-bottom: 2px solid var(--ink); }
.cp-legend h3::after { content: "+"; font-size: 20px; line-height: 1; color: var(--ink2); margin-left: 10px; }
.cp-legend details[open] h3::after { content: "\2212"; }
.cp-legend h3 span { margin-left: auto; font-family: var(--body); font-size: 13px; font-weight: 600; color: var(--ink2); }
.cp-legend ol { list-style: none; margin: 0; padding: 0; }
.cp-legend li { border-bottom: 1px solid var(--rule); margin: 0; }
.cp-find { all: unset; box-sizing: border-box; width: 100%; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 4px; min-height: 40px; font-size: 15px; color: var(--ink); cursor: pointer; border-radius: 6px; }
.cp-find:hover { background: color-mix(in srgb, var(--gold) 16%, transparent); }
.cp-find:focus-visible { outline: 3px solid var(--gold); }
.cp-find.is-hl { background: color-mix(in srgb, var(--gold) 30%, transparent); font-weight: 700; }
.cp-chart .front-box { fill: none; stroke: var(--lake2); stroke-width: 2; stroke-dasharray: 6 5; }
.cp-chart .front-l { fill: var(--lake2); font: 800 13px var(--body); letter-spacing: .08em; }
.cp-chart .pin.is-dot circle { stroke-width: 1.5; }
.cp-chart .pin--big text { font-size: 15px; }
.cp-chart .pin.is-hl circle { stroke: var(--gold); stroke-width: 6; }
.cp-chart .pin.is-dot.is-hl circle { r: 9; }
.cp-chart--inset { margin-top: 18px; }
.cp-chart .leader { stroke: var(--ink2); stroke-width: 1.5; opacity: .7; }
.cp-chart .home { fill: var(--ink2); }
.cp-chart .gate path { fill: var(--red); }
.cp-chart .gate text { fill: var(--red-ink); font: 800 12px var(--body); letter-spacing: .1em; }
.cp-chart .gate--big text { font-size: 15px; }
.cp-areas { margin: 4px 0 16px; }
.cp-areas button { font-size: 13.5px; padding: 7px 12px; min-height: 40px; }
.cp-areas button span { color: var(--ink2); font-weight: 600; margin-left: 2px; }
.cp-areas button[aria-pressed="true"] span { color: inherit; opacity: .8; }
.cp-inset-wrap { max-width: 640px; margin: 0 auto; padding: 4px 6px 8px; }
.cp-chart .pin--big text { font-size: 16px; }
.cp-inset-cap { padding: 14px 16px 0; font-size: 14.5px; font-weight: 700; color: var(--ink); }
@media (max-width: 760px) {
    .cp-chart:not(.cp-chart--inset)::before { content: "\2039  Swipe for Frontier Town"; position: absolute; left: 10px; top: 10px; z-index: 1; padding: 6px 11px; border-radius: 999px; font: 800 12.5px var(--body); color: #fff; background: var(--lake); pointer-events: none; }
    .cp-legend { columns: 2; column-gap: 14px; }
    .cp-find { grid-template-columns: 22px minmax(0, 1fr); font-size: 13.5px; padding: 6px 2px; min-height: 36px; gap: 5px; }
    .cp-legend .n { font-size: 11.5px; }
    .cp-legend h3 { font-size: 14.5px; }
    .cp-legend h3::after { display: none; }
}
.cp-legend .n { font-weight: 800; font-size: 13px; color: var(--ink2); text-align: right; font-variant-numeric: tabular-nums; }
.cp-legend .cp-chip { min-width: 0; font-size: 12.5px; padding: 1px 7px; }
.cp-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 24px; margin: 0; }
.cp-facts div { padding: 12px 0; border-bottom: 1px solid var(--rule); }
.cp-facts dt { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ink2); }
.cp-facts dd { margin: 2px 0 0; font-size: 16px; }

/* ---------- The haunt ticket strip (HalloWeekends) ---------- */
.cp--hw { --tick: #1b1420; --tick2: #2a1f30; --pump: #e8742a; --bone: #f4ead7; }
.cp-tix { margin-top: 24px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; filter: drop-shadow(0 12px 22px rgba(27,20,32,.25)); }
.cp-tix article { position: relative; background: var(--tick); color: var(--bone); padding: 18px 16px 16px; border-right: 2px dashed rgba(244,234,215,.35); }
.cp-tix article:first-child { border-radius: 12px 0 0 12px; }
.cp-tix article:last-child { border-radius: 0 12px 12px 0; border-right: 0; }
.cp-tix article::before, .cp-tix article::after { content: ""; position: absolute; right: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--paper); z-index: 1; }
.cp-tix article::before { top: -8px; } .cp-tix article::after { bottom: -8px; }
.cp-tix article:last-child::before, .cp-tix article:last-child::after { display: none; }
.cp-tix h3 { margin: 0; color: var(--pump); font-size: 22px; text-transform: uppercase; letter-spacing: .04em; }
.cp-tix .admit { margin: 0 0 12px; font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; opacity: .75; }
.cp-tix dl { margin: 0; }
.cp-tix dt { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; opacity: .75; margin-top: 10px; }
.cp-tix dd { margin: 2px 0 0; font-family: var(--display); font-weight: 700; font-size: 18px; line-height: 1.15; font-variant-numeric: tabular-nums; }
.cp-tix dd.off { opacity: .55; font-weight: 600; font-size: 15px; }
.cp-tix .clock { display: block; position: relative; height: 10px; margin-top: 8px; background: rgba(244,234,215,.14); border-radius: 5px; }
.cp-tix .clock span { position: absolute; top: 0; bottom: 0; left: var(--a); width: var(--w); border-radius: 5px; background: var(--pump); }
.cp-tix .clock-l { display: flex; justify-content: space-between; font-size: 10.5px; opacity: .6; margin-top: 3px; }

.cp-tix + .cp-note { margin-top: 18px; }
.cp-haunts .new { white-space: nowrap; }
.cp-tix .clock-l { font-size: 11.5px; }
.cp-cal { width: 100%; max-width: 560px; border-collapse: separate; border-spacing: 4px; margin: 10px 0 6px; table-layout: fixed; }
.cp-cal th { font-size: 12px; font-weight: 700; color: var(--ink2); text-transform: uppercase; letter-spacing: .06em; padding-bottom: 2px; }
.cp-cal td { height: 46px; text-align: center; vertical-align: middle; border-radius: 8px; font-weight: 700; font-variant-numeric: tabular-nums; font-size: 15px; line-height: 1.05; }
.cp-cal td small { display: block; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.cp-cal td.out { color: var(--ink2); opacity: .45; }
.cp-cal td.in { background: color-mix(in srgb, var(--pump) 22%, var(--card)); color: var(--ink); }
.cp-cal td.wk { outline: 2px dashed var(--tick); outline-offset: -4px; background: color-mix(in srgb, var(--pump) 48%, var(--card)); }
.cp-cal td small { font-size: 9px; margin-bottom: 1px; }
:root[data-theme="dark"] .cp-cal td.wk { outline-color: var(--pump); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cp-cal td.wk { outline-color: var(--pump); } }
.cp-cal-key { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13.5px; color: var(--ink2); }
.cp-cal-key li { display: inline-flex; align-items: center; gap: 7px; margin: 0; }
.cp-cal-key i { width: 22px; height: 22px; border-radius: 4px; display: inline-block; }
.cp-cal-key i.wk { background: color-mix(in srgb, var(--pump) 48%, var(--card)); outline: 2px dashed var(--tick); outline-offset: -3px; }
.cp-cal-key i.in { background: color-mix(in srgb, var(--pump) 22%, var(--card)); }
.cp-lineup { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--tick); color: var(--bone); border-radius: 14px; overflow: hidden; }
.cp-lineup-col { padding: 18px 18px 14px; border-right: 2px dashed rgba(244,234,215,.28); }
.cp-lineup-col:last-child { border-right: 0; }
.cp-lineup-col--day { background: var(--tick2); }
.cp-lineup h3 { margin: 0 0 10px; color: var(--pump); font-size: 20px; text-transform: uppercase; letter-spacing: .04em; }
.cp-lineup h3 small { display: block; font-family: var(--body); font-size: 12px; letter-spacing: .14em; color: var(--bone); opacity: .7; margin-top: 2px; }
.cp-lineup ol { list-style: none; margin: 0; padding: 0; counter-reset: lu; }
.cp-lineup li { counter-increment: lu; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 6px; padding: 7px 0; border-top: 1px solid rgba(244,234,215,.14); font-size: 15px; line-height: 1.3; margin: 0; }
.cp-lineup li::before { content: counter(lu, decimal-leading-zero); font-size: 11.5px; font-weight: 800; color: var(--pump); padding-top: 2px; }
@media (max-width: 760px) { .cp-lineup { grid-template-columns: 1fr; } .cp-lineup-col { border-right: 0; border-bottom: 2px dashed rgba(244,234,215,.28); } .cp-cal td { height: 40px; font-size: 14px; } }
.cp-window { margin-top: 18px; }
.cp-window-bar { display: grid; grid-template-columns: repeat(var(--days), minmax(0, 1fr)); gap: 2px; margin: 8px 0 6px; }
.cp-window-bar i { height: 30px; border-radius: 2px; background: color-mix(in srgb, var(--pump, #e8742a) 30%, var(--card)); }
.cp-window-bar i.wk { background: var(--pump, #e8742a); }
.cp-window-bar i.oct { box-shadow: inset 0 -3px 0 rgba(0,0,0,.18); }
.cp-window-l { display: flex; justify-content: space-between; font-size: 13.5px; color: var(--ink2); font-weight: 600; }

.cp-haunts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 0 26px; }
.cp-haunts li { padding: 12px 0; border-bottom: 1px solid var(--rule); margin: 0; }
.cp-haunts b { font-size: 16.5px; }
.cp-haunts .k { display: inline-block; margin-right: 8px; font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--red-ink); }
.cp-haunts .new { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 800; padding: 1px 7px; border-radius: 999px; background: var(--gold); color: #1b1420; letter-spacing: .05em; }
.cp-haunts p { margin: 3px 0 0; font-size: 15px; color: var(--ink2); }
.cp-cols { columns: 2 260px; column-gap: 26px; padding-left: 18px; margin: 0; }
.cp-cols li { margin: 0 0 6px; break-inside: avoid; }

/* ---------- Height page: the shared measuring post, one park ---------- */
.cp-hwpage { background: oklch(23.5% 0.048 280); }
.cp-hw { --rule: oklch(93% 0.03 84 / .16); --ink2: var(--hw-mute); --red: var(--hw-gold); --gold: var(--hw-gold); }
.cp-hw .hw-head { max-width: 820px; }
.cp-hw .hw-answer { min-height: 0; }
.cp-hw .cp-tabs { margin-top: 22px; }
.cp-hw .cp-tabs a { color: var(--hw-mute); }
.cp-hw .cp-tabs a:hover, .cp-hw .cp-tabs a[aria-current="page"] { color: var(--hw-ink); }
.cp-hw .hw-tag em { display: none; }
.cp-hw-more > summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px; border-radius: 999px; border: 1.5px solid var(--hw-gold); color: var(--hw-gold); font-weight: 700; margin: 4px 0 14px; }
.cp-hw-more[open] > summary { background: var(--hw-gold); color: oklch(24% 0.045 280); }
.cp-hw .hw-mark--top, .cp-hw .hw-row--cap .hw-post { white-space: nowrap; }
.cp-hw .hw-mark--top { font-size: .85rem; }
.cp-hw .hw-row--cap .hw-mark, .cp-hw .hw-row--cap .hw-mark * { white-space: nowrap; display: inline; }

/* Phones */
@media (max-width: 640px) {
    .cp { font-size: 16.5px; }
    .cp-answer { font-size: 17.5px; }
    .cp-sky { height: 290px; gap: 3px; min-width: 600px; }
    .cp-cap { font-size: 11.5px; }
    .cp-tname { font-size: 11px; bottom: 6px; }
    .cp-num { font-size: 11px; }
    .cp-skyline { position: relative; }
    .cp-sky-scroll { margin-inline: -4px; padding-inline: 4px; -webkit-mask-image: linear-gradient(to right, #000 70%, rgba(0,0,0,.25)); mask-image: linear-gradient(to right, #000 70%, rgba(0,0,0,.25)); }
    .cp-roll { columns: 2; column-gap: 14px; }
    .cp-roll li { grid-template-columns: 20px minmax(0, 1fr); gap: 6px; padding: 7px 0; }
    .cp-roll .cp-chip, .cp-roll .cp-roll-rq { display: none; }
    .cp-roll b { font-size: 14.5px; }
    .cp-roll small { font-size: 12px; }
    .cp-roll .n { font-size: 12px; }
    .cp-sky-scroll.is-end { -webkit-mask-image: none; mask-image: none; }
    .cp-tabs ul { gap: 0 9px; flex-wrap: wrap; justify-content: space-between; }
    .cp-tabs a { font-size: 12.5px; white-space: nowrap; padding: 10px 0; }
    .cp-season { grid-template-columns: 1fr; }
    .cp-season p.cp-season-days { font-size: 52px; }
    .cp-dial { grid-template-columns: minmax(0, 1fr); grid-template-areas: "h" "fig" "side" "tall"; padding: 14px; }
    .cp-dial-fig { max-width: 250px; margin: 0 auto 10px; }
    .cp-stats .yr { display: none; }
    .cp-tix { grid-template-columns: 1fr; row-gap: 0; }
    .cp-tix article { display: grid; grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; align-items: start; border-right: 0; border-bottom: 2px dashed rgba(244,234,215,.35); border-radius: 0 !important; padding: 14px 16px; }
    .cp-tix article:first-child { border-radius: 12px 12px 0 0 !important; }
    .cp-tix article:last-child { border-radius: 0 0 12px 12px !important; border-bottom: 0; }
    .cp-tix article::before, .cp-tix article::after { right: auto; top: auto; bottom: -9px; }
    .cp-tix article::before { left: -8px; } .cp-tix article::after { left: auto; right: -8px; }
    .cp-tix .admit { grid-column: 1; grid-row: 2; margin: 4px 0 0; font-size: 10.5px; letter-spacing: .14em; }
    .cp-tix h3 { grid-column: 1; grid-row: 1; font-size: 17px; }
    .cp-tix dl { grid-column: 2; grid-row: 1 / span 2; }
    .cp-tix dt:first-child { margin-top: 0; }
    .cp-tix .clock { height: 14px; border-radius: 7px; }
    .cp-tix .clock span { border-radius: 7px; }
    .cp-window-bar i { height: 22px; }
}
@media (prefers-reduced-motion: no-preference) {
    .cp-tower { transition: height .5s ease; }
}