* { box-sizing: border-box; }
body { margin: 0; background: #f1f6fa; color: #08233f; font: 400 1.075rem/1.55 'Source Sans 3', sans-serif; }
a { color: #c80d26; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #d89a32; outline-offset: 4px; }
h1,h2,h3 { font-family: 'Lora', Georgia, serif; letter-spacing: -.035em; margin: 0; line-height: 1.2; }
h1 { font-size: clamp(2rem, 4vw, 3.5rem); } h2 { font-size: 1.6rem; } h3 { font-size: 1.1rem; }
p { margin: .65rem 0 0; } img { max-width: 100%; }
.container { width: 100%; max-width: 1360px; margin: auto; padding-inline: 40px; }
.skip-link { position: absolute; top: -100px; background: white; padding: 1rem; z-index: 10; }.skip-link:focus { top: 0; }
.winter-header { background: linear-gradient(90deg, #08233fba, #08233f66), url('./winter-village.webp') center 20% / cover; color: white; }
.winter-header .container { display: flex; gap: 2rem; justify-content: space-between; align-items: center; padding-block: 1.25rem; }
.brand { display: block; width: 275px; flex-shrink: 0; }.brand img { display: block; width: 100%; height: auto; }
.winter-header span { font-size: .95rem; }
main { padding-block: 2.5rem 4rem; }
.charity-heading { display: flex; gap: 2rem; align-items: center; justify-content: space-between; margin-bottom: 2rem; }
.charity-heading > div { max-width: 52rem; }
.eyebrow { color: #a26a17; font-size: .85rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; margin-bottom: .65rem; }
.button { display: inline-flex; gap: 1rem; padding: .85rem 1.5rem; border-radius: .5rem; background: linear-gradient(135deg, #ff3047, #dd102a); color: white; font-weight: 700; text-decoration: none; flex-shrink: 0; }
.button:hover { background: #c80d26; }
.location-status { display: flex; gap: 1.25rem; align-items: center; color: white; padding: 2.5rem; border-radius: 1rem; min-height: 220px; background: linear-gradient(90deg, #08233ff2, #08233f99), url('./winter-village.webp') center 62% / cover; }
.location-status p { max-width: 40rem; color: #e5eff6; }.location-icon { color: #ffc365; font-size: 3.5rem; }
.timezone { font-size: .95rem; color: #415c76; margin-block: 1.25rem; }
.sleigh-grid { display: grid; gap: 1.5rem; }
.sleigh-directory-intro { margin-bottom: 1.5rem; }
.sleigh-directory .button { margin-top: 1rem; }
.sleigh-card { background: white; border: 1px solid #d6e3eb; border-radius: 1rem; padding: 1.75rem; box-shadow: 0 4px 16px #08233f08; }
.card-heading,.collection-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.card-heading a { font-size: .95rem; flex-shrink: 0; }
.collection { margin-top: 1.5rem; padding: 1.25rem; border: 1px solid #d6e3eb; border-radius: .65rem; background: #f7fafc; }
.collection-date { font-weight: 600; }.public-update { border-left: 3px solid #ec1732; padding-left: 1rem; white-space: pre-line; }
.status { background: #e3f2e9; color: #266241; padding: .2rem .65rem; border-radius: 1rem; font: 600 .8rem 'Source Sans 3',sans-serif; }.status-cancelled { background: #ffe6eb; color: #a90923; }.status-delayed,.status-paused { background: #fff1d3; color: #80530b; }
.stops { padding: 0; list-style: none; margin: 1rem 0 0; }.stops li { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-top: 1px solid #d6e3eb; }.stops span { display: block; color: #415c76; }.stops time { flex-shrink: 0; }.empty-state { color: #415c76; padding-top: .75rem; }
footer { background: linear-gradient(180deg, #f1f6faee, #f1f6faaa), url('./snowy-footer.webp') center bottom / cover; }footer .container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 3rem; }
@media (min-width: 1024px) { .sleigh-grid:has(> :nth-child(2)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .container { padding-inline: 20px; }.winter-header span { display: none; }.charity-heading { align-items: flex-start; flex-direction: column; gap: 1rem; }.location-status { padding: 1.5rem; }.location-icon { display: none; }.card-heading { align-items: flex-start; flex-direction: column; }.sleigh-card { padding: 1.25rem; }footer .container { flex-direction: column; align-items: flex-start; } }
[hidden] { display: none !important; }
.test-account { color: white; }
.phone-test ~ footer .container { max-width: 800px; }
.phone-test .button { justify-content: center; }
.phone-test { max-width: 800px; }
.phone-test h1 { font-size: clamp(2rem, 5vw, 2.8rem); }
.test-intro { font-size: 1.15rem; }
.test-warning { margin-block: 1.5rem; padding: 1.25rem; background: #fff3d8; border: 1px solid #edce8b; border-radius: .75rem; color: #64491d; }
.test-warning p { margin-top: .25rem; }
.test-controls h2 { margin-bottom: 1rem; }
.test-controls label { display: block; font-weight: 600; margin-block: 1rem .4rem; }
.test-controls input:not([type=checkbox]), .test-controls select { display: block; width: 100%; font: inherit; padding: .8rem; border: 1px solid #adc2d3; border-radius: .5rem; background: white; color: #08233f; }
.test-controls input:focus-visible, .test-controls select:focus-visible, button:focus-visible { outline: 3px solid #d89a32; outline-offset: 3px; }
.test-controls button { font: inherit; font-weight: 700; border: 0; cursor: pointer; min-height: 48px; margin-top: 1.25rem; }
.test-controls button:disabled { opacity: .55; cursor: default; }
.test-controls .secondary { background: #08233f; }
.checkbox-label { display: flex !important; gap: .75rem; align-items: flex-start; }
.checkbox-label input { margin-top: .4rem; }
.test-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
#test-status { padding: 1rem; border-radius: .5rem; background: #eef4f8; margin-block: 1.25rem; overflow-wrap: anywhere; }
.test-consent { margin-top: 1rem; color: #415c76; }
#public-page { display: inline-block; margin-top: 1.25rem; }
.test-readings { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; font-size: 1rem; margin: 0; }
.test-readings dt { color: #415c76; }.test-readings dd { margin: .25rem 0 0; font-weight: 600; }
.test-help { margin-top: 2rem; }.test-help ol { padding-left: 1.4rem; }.test-help li { margin-bottom: .5rem; }
.tracking-map-card { border: 1px solid #d6e3eb; border-radius: 1rem; background: white; overflow: hidden; }
.map-heading { padding: 1.5rem; }
.journey-control { padding: 0 1.5rem 1.25rem; }
.journey-control label { display: flex; align-items: center; gap: .65rem; min-height: 44px; cursor: pointer; font-weight: 600; }
.journey-control input { width: 20px; height: 20px; accent-color: #08233f; }
.journey-control p { margin: .25rem 0 0; color: #415c76; font-size: .95rem; }
#live-map { height: clamp(320px, 55vh, 540px); width: 100%; z-index: 0; }
#live-sleighs { list-style: none; margin: 0; padding: 0 1.5rem; }
.live-state { display: flex; gap: 1rem; justify-content: space-between; padding: 1rem 0; border-top: 1px solid #d6e3eb; }
.live-state span { color: #415c76; }
@media (max-width: 639px) { .winter-header .brand { width: 220px; flex-shrink: 1; }.winter-header .container { gap: 1rem; }.phone-test .test-actions { flex-direction: column; }.test-readings { grid-template-columns: 1fr; }.live-state { flex-direction: column; gap: .3rem; } }

/* The public sleigh interface shares the hierarchy of the website preview. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.sleigh-tracking-page main { padding-top: 2rem; }
.sleigh-tracking-page .charity-heading { background: white; padding: 1.75rem 2rem; border: 1px solid #d6e3eb; border-bottom: 0; border-radius: 1rem 1rem 0 0; margin: 0; }
.sleigh-tracking-page h1 { font-size: clamp(1.8rem, 3vw, 2.55rem); }
.sleigh-tracking-page .charity-heading .eyebrow { margin-top: 0; font-size: .75rem; }
.sleigh-tracking-page .charity-heading p:not(.eyebrow) { font-size: 1rem; color: #415c76; }
.public-tracker { background: white; border: 1px solid #d6e3eb; border-radius: 0 0 1rem 1rem; box-shadow: 0 10px 30px #08233f08; overflow: hidden; }
.public-tabs { display: flex; flex-wrap: wrap; gap: .3rem 1.5rem; padding-inline: 2rem; border-bottom: 1px solid #d6e3eb; }
.public-tabs a { display: inline-flex; align-items: center; gap: .5rem; padding: 1rem .2rem; border-bottom: 3px solid transparent; color: #415c76; font-weight: 600; text-decoration: none; min-height: 48px; }
.public-tabs a:hover,.public-tabs a[aria-selected=true] { color: #e20e2f; border-bottom-color: #e20e2f; }
.public-tabs svg { flex-shrink: 0; }
.public-tracker .tracking-map-card { border: 0; border-radius: 0; }
.collection-banner { display: flex; align-items: center; gap: .9rem; padding: 1rem 1.2rem; margin: 1.5rem 1.5rem 1rem; border-radius: .65rem; background: #eef4f8; }
.collection-banner[data-state=out] { background: #edf6ef; }
.collection-banner strong { font-size: 1.2rem; }
.collection-banner p { margin: .1rem 0 0; color: #415c76; }
.banner-symbol { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; color: white; background: #08233f; border-radius: 50%; font-size: 1.6rem; }
.collection-banner[data-state=out] .banner-symbol { background: #36875c; }
.current-public-update { margin: 0 1.5rem 1rem; padding: .8rem 1rem; background: #fff4df; border-left: 3px solid #bd7b20; border-radius: .35rem; white-space: pre-line; }
.map-stage { margin: 0 1.5rem; border-radius: .7rem; overflow: hidden; }
.map-placeholder { min-height: 330px; padding: 3rem 1.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: white; background: linear-gradient(#08233fc9,#08233fe8),url('./winter-village.webp') center 60% / cover; }
.map-placeholder > span { color: #ffc365; font-size: 2.5rem; }
.map-placeholder h3 { font-size: 1.6rem; }.map-placeholder p { max-width: 32rem; color: #e6eff8; }.map-placeholder a { margin-top: 1rem; color: #ffc365; font-weight: 600; }
.map-tools { padding: .9rem 1.5rem .4rem; display: flex; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; }
.map-tools .button { align-items: center; justify-content: center; min-height: 44px; padding: .5rem .85rem; border: 0; font: inherit; font-weight: 700; cursor: pointer; }
.map-tools .button:disabled { opacity: .55; cursor: default; }
.map-tools label { display: flex; align-items: center; gap: .6rem; min-height: 44px; font-weight: 600; cursor: pointer; }
.map-tools input { width: 20px; height: 20px; accent-color: #36875c; }
.map-tools select { min-height: 44px; padding: .5rem .75rem; border: 1px solid #d6e3eb; border-radius: .5rem; background: #fff; color: #08233f; font: inherit; cursor: pointer; }
.map-tools select:focus-visible { outline: 2px solid #d89a32; outline-offset: 2px; }
.map-tools p { margin: 0; font-size: .95rem; color: #415c76; flex: 1; min-width: 240px; }
.map-status { margin: 0; padding: 0 1.5rem 1rem; color: #415c76; font-size: .95rem; }
.no-script { padding: 0 1.5rem 1rem; }
.tracker-overview { display: grid; background: #f6f9fb; border-top: 1px solid #d6e3eb; }
.tracker-overview > div { padding: 1.4rem 1.5rem; }
.tracker-overview > div + div { border-top: 1px solid #d6e3eb; }
.overview-label { display: block; font-size: .9rem; font-weight: 600; color: #415c76; margin-bottom: .4rem; }
.tracker-overview strong { display: block; font-size: 1.2rem; line-height: 1.35; }
.tracker-overview #overview-stops { font-size: 1.8rem; color: #287649; }
.tracker-overview p { font-size: .95rem; color: #415c76; }
.tracker-overview a { display: inline-block; font-weight: 600; margin-top: .4rem; }
.tracker-content { padding: 2rem; min-height: 320px; }
.test-run-instructions { min-height: 0; padding-bottom: 0; }
.panel-heading { margin-bottom: 1.5rem; }.panel-heading p { color: #415c76; max-width: 48rem; }
input[type=checkbox]:focus-visible { outline: 3px solid #d89a32; outline-offset: 3px; }
.visit-filter { max-width: 40rem; margin-bottom: 1.25rem; }
.visit-filter label { display: block; font-weight: 600; margin-bottom: .5rem; }
.visit-filter select { width: 100%; min-height: 44px; padding: .8rem 1rem; border: 1px solid #adc2d3; border-radius: .5rem; color: #08233f; background: white; font: inherit; }
.visit-filter select:focus-visible,.route-information summary:focus-visible,.current-public-update summary:focus-visible { outline: 3px solid #d89a32; outline-offset: 3px; }
.route-information { margin-block: 1rem; }
.route-section-title { font-size: 1.1rem; line-height: 1.4; margin: 1rem 0 .5rem; }
.route-information > .route-section-title { margin-top: 0; }
.route-information summary,.current-public-update summary { min-height: 44px; padding-block: .6rem; cursor: pointer; font-weight: 600; overflow-wrap: anywhere; }
.route-note { white-space: pre-line; overflow-wrap: anywhere; }
.road-pills { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: .75rem 0 0; padding: 0; }
.road-pills > li { max-width: 100%; padding: .35rem .8rem; border: 1px solid #c9d9e5; border-radius: 999px; background: #eaf2f7; color: #153d5c; font-size: .95rem; overflow-wrap: anywhere; }
.route-note { color: #415c76; font-size: .95rem; }
.current-public-update p { margin-bottom: .2rem; overflow-wrap: anywhere; }
.stop-number { display: grid !important; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #e9eff5; color: #08233f !important; flex-shrink: 0; font-size: .9rem; }
.stops li > div { flex: 1; min-width: 0; }.stops li strong,.collection h3 { overflow-wrap: anywhere; }
.charity-description { white-space: pre-line; overflow-wrap: anywhere; }
.live-update { border-left: 3px solid #36875c; }
.tracker-timezone { padding: 1rem 1.5rem; margin: 0; border-top: 1px solid #d6e3eb; font-size: .9rem; color: #415c76; }
@media (min-width: 1024px) { .tracker-overview { grid-template-columns: 1.25fr .85fr 1fr; }.tracker-overview > div + div { border-top: 0; border-left: 1px solid #d6e3eb; } }
@media (min-width: 1024px) {
    .tracker-overview:not(:has(> #overview-stops-card)),
    .tracker-overview:has(> #overview-stops-card[hidden]) { grid-template-columns: 1.25fr 1fr; }
}
@media (max-width: 767px) { .sleigh-tracking-page .charity-heading { padding: 1.25rem; }.sleigh-tracking-page .other-sleighs { padding-inline: 1.25rem; }.sleigh-tracking-page .charity-heading .eyebrow { font-size: .65rem; letter-spacing: .06em; }.sleigh-tracking-page .charity-heading .button { min-height: 44px; padding: .65rem 1rem; }.public-tabs { padding-inline: 1.25rem; gap: 0 1rem; }.public-tabs a { font-size: 1rem; padding-block: .75rem; }.tracker-content { padding: 1.25rem; }.collection-heading { flex-wrap: wrap; }.collection-banner { margin: 1rem 1rem .75rem; padding: .85rem; }.collection-banner p { font-size: 1rem; }.map-stage { margin-inline: 1rem; }.map-tools { padding-inline: 1rem; gap: .2rem; }.current-public-update { margin-inline: 1rem; }#live-sleighs { padding-inline: 1rem; }.map-status { padding-inline: 1rem; } }
@media (prefers-reduced-motion: no-preference) { .public-tabs a { transition: color .15s, border-color .15s; } }

/* Sharing remains available above every public tab. */
.sleigh-sharing { padding: .6rem 1.5rem; border-bottom: 1px solid #d6e3eb; }
.sleigh-sharing summary { display: flex; align-items: center; justify-content: center; gap: .5rem; width: fit-content; margin-left: auto; min-height: 44px; padding: .4rem .8rem; border: 1px solid #adc2d3; border-radius: .5rem; cursor: pointer; font-weight: 600; list-style: none; }
.sleigh-sharing summary::-webkit-details-marker { display: none; }
.share-options { padding: 1rem 0 .4rem; }
.share-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.share-actions a,.share-actions button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem 1rem; background: #eef4f8; border: 1px solid #adc2d3; border-radius: .5rem; font: inherit; font-weight: 600; text-decoration: none; color: #08233f; cursor: pointer; }
.share-actions a:hover,.share-actions button:hover { background: #dfeaf2; }
.share-actions button:disabled { opacity: .6; cursor: wait; }
.share-options label { display: block; font-weight: 600; margin-bottom: .4rem; }
.share-options input { display: block; width: 100%; min-width: 0; padding: .7rem; border: 1px solid #adc2d3; border-radius: .5rem; font: inherit; color: #415c76; }
.sleigh-sharing :focus-visible { outline: 3px solid #d89a32; outline-offset: 3px; }

/* A self-contained tracker for organisers' websites. */
.embedded-tracker { background: white; min-width: 0; height: 100vh; display: flex; flex-direction: column; }
.embedded-tracker main { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; }
.embed-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem; border-bottom: 1px solid #d6e3eb; }
.embed-heading > div { min-width: 0; }
.embed-heading h1 { font-size: 1.45rem; overflow-wrap: anywhere; }
.embed-heading p { margin-top: .2rem; font-size: .95rem; color: #415c76; overflow-wrap: anywhere; }
.embed-heading > a { font-size: .95rem; font-weight: 600; flex-shrink: 0; }
.embedded-tracker .tracking-map-card { border: 0; border-radius: 0; }
.embedded-tracker .collection-banner { margin: .8rem 1rem; padding: .65rem .8rem; }
.embedded-tracker .collection-banner strong { font-size: 1.05rem; }
.embedded-tracker .collection-banner p { font-size: .95rem; }
.embedded-tracker .map-stage { margin-inline: 1rem; }
.embedded-tracker #live-map { height: clamp(240px, 42vh, 360px); }
.embedded-tracker .map-placeholder { min-height: 260px; padding: 1.5rem 1rem; }
.embedded-tracker .map-placeholder h3 { font-size: 1.4rem; }
.embedded-tracker .map-tools { padding-inline: 1rem; gap: .4rem 1rem; }
.embedded-tracker .map-tools p { flex-basis: 100%; min-width: 0; font-size: .85rem; }
.embedded-tracker #live-sleighs { padding-inline: 1rem; font-size: .95rem; }
.embedded-tracker .live-state { flex-wrap: wrap; gap: .3rem .8rem; }
.embedded-tracker .map-status { padding: .4rem 1rem; }
.embed-unavailable { padding: 2rem 1rem; }
.embedded-tracker .embed-credit { flex-shrink: 0; background: #eef4f8; border-top: 1px solid #d6e3eb; padding: .8rem 1rem; text-align: center; font-size: .95rem; }
.embed-credit p { margin: 0; }
.embed-credit a { font-weight: 700; }
.embed-schedule { padding: 1.25rem 1rem; border-top: 1px solid #d6e3eb; }
.embed-schedule .panel-heading { margin-bottom: 1rem; }
.embed-schedule .panel-heading h2 { font-size: 1.4rem; }
.embed-schedule .collection-heading { flex-wrap: wrap; }
.embed-schedule .collection:last-child { margin-bottom: 0; }
.embed-schedule .stops li > div { overflow-wrap: anywhere; }
.planned-stop-pin { border: 2px solid white; border-radius: 50%; background: #c80d26; color: white; box-shadow: 0 1px 5px #0005; text-align: center; font: 700 14px/26px 'Source Sans 3',sans-serif; }
.stop-attribution { margin: .5rem 1rem 1rem; font-size: .85rem; color: #415c76; }
#stop-visit-control { min-width: 0; max-width: 100%; flex: 1 1 18rem; align-items: flex-start; flex-direction: column; }
#stop-visit { width: 100%; min-width: 0; max-width: 24rem; }
.leaflet-popup-content { overflow-wrap: anywhere; }
@media (max-width: 479px) { .embed-heading { align-items: flex-start; flex-direction: column; gap: .5rem; } }
#share-feedback { margin: .6rem 0 0; color: #415c76; }
#share-feedback:empty,.map-status:empty { display: none; }
.other-sleighs { padding: 1.5rem 2rem; border-top: 1px solid #d6e3eb; }
.other-sleighs p { color: #415c76; }
.other-sleighs ul { padding: 0; list-style: none; display: grid; gap: .6rem; }
.other-sleighs a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 48px; padding: .8rem 1rem; border: 1px solid #d6e3eb; border-radius: .5rem; background: #f6f9fb; font-weight: 600; text-decoration: none; }
.other-sleighs a:hover { background: #e9f0f5; }
@media (max-width: 767px) { .sleigh-sharing { padding-inline: 1rem; } }
.sleigh-test-run .charity-description { display: block; overflow: visible; }
