/* Live Polls · Summer Camp phone skin ("Campfire Trail", owner decision
   2026-10-07), from the Holiday Themes canvas boards CP-Polls-Phone and
   -Anim. Every rule is scoped to #poll-content.poll-design.pld-summerCamp or
   #voted-message.poll-design.pld-summerCamp, so no other screen or feature
   is touched; the classic screens (no .poll-design) never match.

   The tent-canvas panel under a dusk band ("Live Poll" over the pines), the
   question on a routed pine plaque, each option a painted trail sign
   pointing right in the display's colour by place (A lake, B campfire,
   C pine, D berry, E goldenrod, F twilight, G teal, H rust) with its letter
   on a merit patch, "Vote counted!" under a green merit patch with sparks
   and the pick on its own sign, and the host's pause as a red sign that
   swings up at the foot while the signs dim. The projector never shows a
   paused label; the phones do.

   The Stop: the paused sign lands 0.6 s after it shows (scpSignUp;
   PollsSummerCampDesign.phoneStopEntrance, the tests read it). The Mac holds
   it for the display's WINNER pennant less that (stopDelayMs), so it lands
   with the projector. /poll-designs/summer-camp.js letters each option and
   keeps a re-render of the same poll from replaying the entrances
   (.scp-same), and plays the stop's change once (.scp-stopping).

   The theme's web fonts (the Mac's bundled faces, ShowThemeFonts) are
   declared below; the colours are ShowThemePalettes.swift's
   SummerCampPalette. Motion is transforms only (and the signs' colour as
   they switch off). The panel colour lives on these in-flow panels, never
   on html/body or a fixed element (the iOS 26 rule). */

@font-face { font-family: 'Alfa Slab One'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/alfa-slab-one-regular-v1.woff2') format('woff2'); }
@font-face { font-family: 'Sidekick Trivia Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/sidekick-trivia-barlow-medium-v1.woff2') format('woff2'); }
@font-face { font-family: 'Sidekick Trivia Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/sidekick-trivia-barlow-semi-bold-v1.woff2') format('woff2'); }
@font-face { font-family: 'Sidekick Trivia Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/sidekick-trivia-barlow-bold-v1.woff2') format('woff2'); }
@font-face { font-family: 'Sidekick Trivia Barlow'; font-style: normal; font-weight: 800; font-display: swap; src: url('/fonts/sidekick-trivia-barlow-extra-bold-v1.woff2') format('woff2'); }

/* ── The panels: tent canvas ── */
#poll-content.poll-design.pld-summerCamp,
#voted-message.poll-design.pld-summerCamp {
    --scp-ink: #1A1C19; --scp-brown: #2B1B0E; --scp-cream: #FFF7E8; --scp-canvas: #F6EEDB;
    --scp-wood: #EBCB94; --scp-wood-deep: #8B5A2B; --scp-gold: #F5B532; --scp-pine: #2C7A48;
    --scp-red: #B4332A; --scp-caption: #6A5440; --scp-dim-ink: #B3B0BE;
    --scp-spring: cubic-bezier(0.34, 1.45, 0.64, 1);
    --scp-arrow: polygon(6px 0, calc(100% - 27px) 0, 100% 50%, calc(100% - 27px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
    --scp-arrow-in: polygon(4px 0, calc(100% - 25px) 0, 100% 50%, calc(100% - 25px) 100%, 4px 100%, 0 calc(100% - 4px), 0 4px);
    position: relative;
    margin: -8px -4px 0; padding: 22px 16px 22px;
    min-height: calc(100vh - 112px);
    min-height: calc(100dvh - 112px);
    box-sizing: border-box;
    border-radius: 26px; overflow: hidden;
    background:
        repeating-linear-gradient(0deg, rgba(139,90,43,0.05) 0 2px, rgba(0,0,0,0) 2px 5px),
        repeating-linear-gradient(90deg, rgba(139,90,43,0.05) 0 2px, rgba(0,0,0,0) 2px 5px),
        var(--scp-canvas);
    color: var(--scp-brown);
    font-family: 'Sidekick Trivia Barlow', 'Barlow', system-ui, sans-serif; font-weight: 800;
    text-align: center;
}
/* renderPoll shows the screen with an inline display: block. */
#poll-content.poll-design.pld-summerCamp[style*="block"] { display: flex !important; flex-direction: column; align-items: stretch; }
#poll-content.poll-design.pld-summerCamp > * { flex: 0 0 auto; }

/* ── The dusk band: "Live Poll" over the pines and the moon ── */
#poll-content.poll-design.pld-summerCamp::before,
#voted-message.poll-design.pld-summerCamp::before {
    content: 'Live Poll';
    order: 0; display: flex; align-items: flex-start; justify-content: center;
    height: 84px; margin: -22px -16px 18px; padding-top: 22px; box-sizing: border-box;
    background:
        url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 96' preserveAspectRatio='xMidYMax slice'><circle cx='336' cy='34' r='11' fill='%23FCEFC8'/><circle cx='341' cy='31' r='10' fill='%23222D55'/><circle cx='60' cy='28' r='1.6' fill='%23FFF3D0'/><circle cx='120' cy='18' r='1.3' fill='%23FFF3D0'/><circle cx='270' cy='22' r='1.5' fill='%23FFF3D0'/><circle cx='200' cy='12' r='1.2' fill='%23FFF3D0'/><path d='M-10 62 L-6 69 L-8 67 L-5 75 L-8 74 L-4 82 L-7 81 L-3 88 L-17 88 L-13 81 L-16 82 L-12 74 L-15 75 L-12 67 L-14 69 Z M-14 86 L-6 86 L-6 92 L-14 92 Z M12 67 L14 72 L13 71 L15 76 L13 75 L16 80 L13 80 L16 85 L14 84 L17 89 L6 89 L10 84 L7 85 L10 80 L8 80 L10 75 L9 76 L11 71 L9 72 Z M8 87 L16 87 L16 92 L8 92 Z M36 54 L41 63 L38 61 L42 71 L38 69 L44 79 L39 78 L46 88 L26 88 L32 78 L27 79 L33 69 L29 71 L34 61 L31 63 Z M32 86 L40 86 L40 92 L32 92 Z M54 62 L58 69 L55 68 L59 75 L56 74 L60 82 L56 81 L61 88 L46 88 L51 81 L48 82 L52 74 L49 75 L52 68 L50 69 Z M50 86 L58 86 L58 92 L50 92 Z M77 64 L81 69 L79 68 L82 74 L79 73 L82 79 L80 78 L83 84 L80 83 L84 89 L70 89 L75 83 L71 84 L75 78 L72 79 L76 73 L73 74 L76 68 L74 69 Z M73 87 L81 87 L81 92 L73 92 Z M100 55 L104 62 L101 60 L105 68 L102 67 L106 75 L102 73 L107 81 L103 80 L108 88 L91 88 L96 80 L92 81 L97 73 L93 75 L97 67 L94 68 L98 60 L96 62 Z M96 86 L104 86 L104 92 L96 92 Z M116 69 L118 73 L117 72 L119 77 L117 77 L120 81 L118 81 L120 85 L118 85 L121 89 L111 89 L114 85 L112 85 L115 81 L113 81 L115 77 L113 77 L115 72 L114 73 Z M112 87 L120 87 L120 92 L112 92 Z M146 64 L149 69 L147 68 L150 74 L148 73 L151 79 L148 78 L152 84 L148 83 L152 89 L139 89 L144 83 L140 84 L144 78 L141 79 L144 73 L142 74 L145 68 L143 69 Z M142 87 L150 87 L150 92 L142 92 Z M173 61 L177 66 L175 65 L178 72 L175 71 L179 77 L176 76 L180 83 L176 82 L181 88 L166 88 L171 82 L167 83 L171 76 L168 77 L172 71 L169 72 L172 65 L170 66 Z M169 86 L177 86 L177 92 L169 92 Z M194 53 L198 62 L196 60 L200 70 L197 69 L201 79 L197 77 L203 87 L186 87 L191 77 L187 79 L192 69 L188 70 L192 60 L190 62 Z M190 85 L198 85 L198 92 L190 92 Z M216 55 L220 63 L218 62 L222 71 L218 70 L224 79 L219 78 L226 88 L206 88 L212 78 L207 79 L213 70 L209 71 L213 62 L211 63 Z M212 86 L220 86 L220 92 L212 92 Z M237 59 L241 66 L239 65 L243 73 L240 72 L244 81 L240 79 L246 88 L228 88 L234 79 L230 81 L235 72 L231 73 L235 65 L233 66 Z M233 86 L241 86 L241 92 L233 92 Z M263 55 L267 62 L265 61 L269 68 L265 67 L270 75 L266 74 L271 81 L266 80 L273 88 L254 88 L260 80 L255 81 L260 74 L256 75 L261 67 L257 68 L261 61 L259 62 Z M259 86 L267 86 L267 92 L259 92 Z M285 60 L289 67 L286 66 L290 74 L287 73 L292 81 L288 80 L293 88 L276 88 L282 80 L278 81 L282 73 L279 74 L283 66 L281 67 Z M281 86 L289 86 L289 92 L281 92 Z M312 56 L316 64 L314 62 L318 72 L314 70 L319 80 L315 78 L320 88 L304 88 L309 78 L305 80 L310 70 L307 72 L310 62 L308 64 Z M308 86 L316 86 L316 92 L308 92 Z M340 64 L343 70 L341 69 L344 76 L342 75 L346 83 L342 82 L347 89 L333 89 L337 82 L334 83 L338 75 L335 76 L338 69 L336 70 Z M336 87 L344 87 L344 92 L336 92 Z M366 68 L369 72 L367 72 L370 76 L368 76 L371 81 L368 80 L372 85 L368 84 L372 89 L360 89 L364 84 L361 85 L364 80 L362 81 L364 76 L362 76 L365 72 L363 72 Z M362 87 L370 87 L370 92 L362 92 Z M393 57 L397 65 L394 63 L398 72 L395 71 L399 80 L396 79 L401 88 L385 88 L390 79 L386 80 L391 71 L388 72 L391 63 L389 65 Z M389 86 L397 86 L397 92 L389 92 Z' fill='%230B1418'/></svg>") center bottom / 100% 96px no-repeat,
        linear-gradient(180deg, #1B2549 0%, #3A3768 55%, #B9644F 100%);
    border-bottom: 4px solid var(--scp-ink);
    color: var(--scp-cream); text-shadow: 0 2px 0 rgba(0,0,0,0.5);
    font-family: 'Alfa Slab One', Georgia, serif; font-weight: 400; font-size: 26px; line-height: 1;
}
#voted-message.poll-design.pld-summerCamp::before { display: flex; align-self: stretch; }

/* ── The question on a routed pine plaque ── */
#poll-content.poll-design.pld-summerCamp .question {
    order: 1;
    display: flex; align-items: center; justify-content: center;
    min-height: 112px; margin: 0 2px 22px; padding: 16px 24px; box-sizing: border-box;
    background:
        repeating-linear-gradient(176deg, rgba(139,90,43,0) 0 17px, rgba(139,90,43,0.16) 17px 19px, rgba(139,90,43,0) 19px 30px),
        var(--scp-wood);
    border: 4px solid var(--scp-ink); border-radius: 18px;
    box-shadow: inset 0 0 0 7px var(--scp-wood), inset 0 0 0 9.5px rgba(139,90,43,0.8),
                inset 0 0 0 11.5px rgba(255,250,235,0.55), 0 8px 0 rgba(4,8,14,0.6);
    color: var(--scp-brown);
    font-family: 'Alfa Slab One', Georgia, serif; font-weight: 400; font-size: 27px; line-height: 1.15;
    overflow-wrap: anywhere;
    animation: scpDrop 0.75s var(--scp-spring) both;
}

/* ── The options: painted trail signs pointing right ── */
#poll-content.poll-design.pld-summerCamp .options { order: 2; gap: 18px; margin: 0 0 0 2px; }
#poll-content.poll-design.pld-summerCamp .option-btn {
    --c: #1E6FA6; --d: #375B7B;
    position: relative; isolation: isolate;
    display: flex; align-items: center; gap: 14px;
    width: 100%; min-height: 78px; margin: 0; padding: 8px 44px 8px 12px; box-sizing: border-box;
    background: transparent; border: none; border-radius: 0; box-shadow: none;
    filter: drop-shadow(0 7px 0 rgba(4,8,14,0.55));
    color: var(--scp-cream); text-shadow: 0 3px 0 rgba(10,12,10,0.55); text-align: left;
    font-family: 'Sidekick Trivia Barlow', 'Barlow', system-ui, sans-serif; font-weight: 800;
    font-size: 25px; line-height: 1.1; overflow-wrap: anywhere;
    opacity: 1;
    transition: transform 0.12s ease;
    animation: scpSlideIn 0.62s var(--scp-spring) both;
    animation-delay: 0.2s;
}
/* The sign: its ink edge, then its paint with the grain and a highlight. */
#poll-content.poll-design.pld-summerCamp .option-btn::before,
#voted-message.poll-design.pld-summerCamp .scp-pick::before {
    content: ''; position: absolute; inset: 0; z-index: -2;
    background: var(--scp-ink); clip-path: var(--scp-arrow);
}
#poll-content.poll-design.pld-summerCamp .option-btn::after,
#voted-message.poll-design.pld-summerCamp .scp-pick::after {
    content: ''; position: absolute; inset: 4px; z-index: -1;
    background:
        linear-gradient(180deg, rgba(0,0,0,0) 0 4px, rgba(255,255,255,0.2) 4px 8px, rgba(0,0,0,0) 8px) 6px 0 / calc(100% - 40px) 100% no-repeat,
        repeating-linear-gradient(178deg, rgba(0,0,0,0) 0 15px, rgba(0,0,0,0.1) 15px 17px, rgba(0,0,0,0) 17px 26px),
        var(--c);
    clip-path: var(--scp-arrow-in);
}
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="1"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="1"] { --c: #C94A17; --d: #844A3A; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="2"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="2"] { --c: #2C7A48; --d: #3D6050; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="3"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="3"] { --c: #AE2C59; --d: #783C58; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="4"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="4"] { --c: #9A7209; --d: #6F5C34; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="5"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="5"] { --c: #654A99; --d: #574A75; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="6"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="6"] { --c: #17777B; --d: #345E67; }
#poll-content.poll-design.pld-summerCamp .option-btn[data-index="7"], #voted-message.poll-design.pld-summerCamp .scp-pick[data-index="7"] { --c: #8E431D; --d: #69473D; }
/* They slide in along the trail, one after another. */
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(2) { animation-delay: 0.28s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(3) { animation-delay: 0.36s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(4) { animation-delay: 0.44s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(5) { animation-delay: 0.52s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(6) { animation-delay: 0.6s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(7) { animation-delay: 0.68s; }
#poll-content.poll-design.pld-summerCamp .option-btn:nth-child(8) { animation-delay: 0.76s; }
#poll-content.poll-design.pld-summerCamp .option-btn:active:not(:disabled) { transform: scale(0.94); }
/* The tap: a gold ring round the pick as it presses in. */
#poll-content.poll-design.pld-summerCamp .option-btn.scp-picked {
    transform: scale(0.95);
    filter: drop-shadow(0 0 0 var(--scp-gold)) drop-shadow(3px 0 0 var(--scp-gold)) drop-shadow(-3px 0 0 var(--scp-gold))
            drop-shadow(0 3px 0 var(--scp-gold)) drop-shadow(0 -3px 0 var(--scp-gold)) drop-shadow(0 7px 0 rgba(4,8,14,0.55));
}
/* Switched off (voting paused, or the vote on its way): dusk-grey signs. */
#poll-content.poll-design.pld-summerCamp .option-btn:disabled {
    opacity: 1; cursor: default; color: var(--scp-dim-ink); text-shadow: none;
}
#poll-content.poll-design.pld-summerCamp .option-btn:disabled::after { background-color: var(--d); }
#poll-content.poll-design.pld-summerCamp .option-btn:disabled .scp-patch { filter: saturate(0.4) brightness(0.92); }
#poll-content.poll-design.pld-summerCamp .option-btn .scp-text { flex: 1 1 auto; min-width: 0; }

/* The letter on a merit patch: gold rim, cream field, stitched. */
#poll-content.poll-design.pld-summerCamp .scp-patch,
#voted-message.poll-design.pld-summerCamp .scp-patch {
    flex: 0 0 auto; position: relative;
    width: 54px; height: 54px; box-sizing: border-box; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; padding-top: 2px;
    background: radial-gradient(circle, var(--scp-cream) 0 17.5px, var(--scp-ink) 18px 19.5px, var(--scp-gold) 20px);
    border: 2px solid var(--scp-ink);
    outline: 2px dashed rgba(0,0,0,0.28); outline-offset: -6px;
    box-shadow: 0 2px 0 rgba(4,8,14,0.45);
    color: var(--scp-brown); text-shadow: none;
    font-family: 'Alfa Slab One', Georgia, serif; font-weight: 400; font-size: 25px; line-height: 1;
}

/* ── The status line ── */
#poll-content.poll-design.pld-summerCamp .status {
    order: 3; margin: 26px 0 0; color: var(--scp-caption);
    font-weight: 700; font-size: 21px; line-height: 1.25;
    animation: scpRise 0.55s 0.7s var(--scp-spring) both;
}
#poll-content.poll-design.pld-summerCamp .status:empty { display: none; }

/* ── Paused: a red sign swings up at the foot (on the display's beat) ── */
#poll-content.poll-design.pld-summerCamp .stopped-banner.show {
    order: 4; position: relative; isolation: isolate;
    display: grid; grid-template-columns: 66px 1fr; column-gap: 14px; row-gap: 4px; align-items: center;
    margin: auto -2px 0; padding: 16px 18px 16px 16px; box-sizing: border-box;
    background:
        repeating-linear-gradient(178deg, rgba(0,0,0,0) 0 17px, rgba(0,0,0,0.1) 17px 19px, rgba(0,0,0,0) 19px 30px),
        var(--scp-red);
    border: 4px solid var(--scp-ink); border-radius: 14px; box-shadow: 0 9px 0 rgba(4,8,14,0.6);
    color: var(--scp-cream); text-align: left;
    font-family: 'Sidekick Trivia Barlow', 'Barlow', system-ui, sans-serif; font-weight: 700; font-size: 18px; line-height: 1.2;
    transform: rotate(-2deg);
}
#poll-content.poll-design.pld-summerCamp:has(#options.scp-stopping) .stopped-banner.show {
    animation: scpSignUp 0.6s var(--scp-spring) both;
}
#poll-content.poll-design.pld-summerCamp .stopped-banner.show::before {
    content: ''; grid-column: 1; grid-row: 1 / span 2;
    width: 66px; height: 66px; box-sizing: border-box; border-radius: 50%; border: 3px solid var(--scp-ink);
    background:
        linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% - 7px) 50% / 7px 24px,
        linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% + 7px) 50% / 7px 24px,
        radial-gradient(circle, var(--scp-red) 0 22px, var(--scp-ink) 22.5px 24px, var(--scp-cream) 24.5px);
}
#poll-content.poll-design.pld-summerCamp .stopped-banner.show::after {
    content: 'Paused'; grid-column: 2; grid-row: 1;
    font-family: 'Alfa Slab One', Georgia, serif; font-weight: 400; font-size: 31px; line-height: 1;
}

/* A re-render of the same poll (a vote count, a settings write) never
   replays the entrances; the stop switches the signs off once, the resume
   back on. */
#poll-content.poll-design.pld-summerCamp:has(#options.scp-same) .question,
#poll-content.poll-design.pld-summerCamp #options.scp-same .option-btn,
#poll-content.poll-design.pld-summerCamp:has(#options.scp-same) .status { animation: none; }
#poll-content.poll-design.pld-summerCamp #options.scp-stopping .option-btn:disabled::after { animation: scpOff 0.3s ease both; }
#poll-content.poll-design.pld-summerCamp #options.scp-resuming .option-btn::after { animation: scpOn 0.3s ease both; }

/* Many options: smaller signs so all of them fit. */
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .options { gap: 11px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .option-btn { min-height: 62px; font-size: 21px; padding: 6px 40px 6px 10px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .scp-patch { width: 44px; height: 44px; font-size: 20px;
    background: radial-gradient(circle, var(--scp-cream) 0 13.5px, var(--scp-ink) 14px 15.5px, var(--scp-gold) 16px); outline-offset: -5px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .question { min-height: 88px; margin-bottom: 16px; padding: 12px 20px; font-size: 23px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .status { margin-top: 18px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .option-btn { font-size: 19px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .scp-patch { width: 40px; height: 40px; font-size: 18px;
    background: radial-gradient(circle, var(--scp-cream) 0 12px, var(--scp-ink) 12.5px 14px, var(--scp-gold) 14.5px); }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .question { min-height: 70px; margin-bottom: 12px; padding: 10px 18px; font-size: 19px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7))::before { height: 62px; margin-bottom: 12px; padding-top: 16px; font-size: 22px; background-size: 100% 74px, auto; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .option-btn { min-height: 48px; padding: 4px 38px 4px 8px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .options { gap: 6px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .status { margin-top: 12px; font-size: 18px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .stopped-banner.show { margin-top: 12px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show { padding-top: 10px; padding-bottom: 10px; grid-template-columns: 54px 1fr; font-size: 16px; }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show::before { width: 54px; height: 54px;
    background:
        linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% - 6px) 50% / 6px 19px,
        linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% + 6px) 50% / 6px 19px,
        radial-gradient(circle, var(--scp-red) 0 17px, var(--scp-ink) 17.5px 19px, var(--scp-cream) 19.5px); }
#poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show::after { font-size: 26px; }

/* ── Vote counted! ── */
#voted-message.poll-design.pld-summerCamp.show { display: flex; flex-direction: column; align-items: center; }
#voted-message.poll-design.pld-summerCamp .checkmark {
    position: relative; width: 196px; height: 196px; margin: 42px auto 0; box-sizing: border-box;
    border-radius: 50%; border: 3px solid var(--scp-ink);
    background: radial-gradient(circle, var(--scp-pine) 0 72px, var(--scp-ink) 72.5px 75px, var(--scp-gold) 75.5px);
    box-shadow: 0 6px 0 rgba(4,8,14,0.45);
    outline: 5px dotted rgba(0,0,0,0.26); outline-offset: -13px;
    font-size: 0; color: transparent;
    animation: scpPatch 0.62s 0.05s var(--scp-spring) both;
}
/* The tick, in cream. */
#voted-message.poll-design.pld-summerCamp .checkmark::after {
    content: ''; position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M33 51 L45 63 L68 38' fill='none' stroke='%23FFF7E8' stroke-width='9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
/* Campfire sparks thrown out round it. */
#voted-message.poll-design.pld-summerCamp .checkmark::before {
    content: ''; position: absolute; left: 50%; top: 50%; width: 290px; height: 290px; margin: -145px 0 0 -145px;
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'><circle cx='22' cy='125' r='5.7' fill='%23FFCC4D' stroke='%231A1C19' stroke-width='1.6'/><path d='M0 -11.9 L5.2 0 L0 11.9 L-5.2 0Z' transform='translate(25 183) rotate(255)' fill='%23F2701F' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><path d='M0 -10.2 L4.4 0 L0 10.2 L-4.4 0Z' transform='translate(41 62) rotate(309)' fill='%23F5B532' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><circle cx='37' cy='240' r='5.3' fill='%23FFE9A0' stroke='%231A1C19' stroke-width='1.6'/><path d='M0 -6.5 L2.9 0 L0 6.5 L-2.9 0Z' transform='translate(32 120) rotate(284)' fill='%23E04A12' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><path d='M0 -12.8 L5.6 0 L0 12.8 L-5.6 0Z' transform='translate(138 31) rotate(354)' fill='%23FFCC4D' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><circle cx='17' cy='192' r='2.8' fill='%23F2701F' stroke='%231A1C19' stroke-width='1.6'/><path d='M0 -13.7 L6.0 0 L0 13.7 L-6.0 0Z' transform='translate(193 32) rotate(380)' fill='%23F5B532' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><path d='M0 -15.0 L6.6 0 L0 15.0 L-6.6 0Z' transform='translate(120 21) rotate(347)' fill='%23FFE9A0' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><circle cx='31' cy='73' r='5.8' fill='%23E04A12' stroke='%231A1C19' stroke-width='1.6'/><path d='M0 -9.6 L4.2 0 L0 9.6 L-4.2 0Z' transform='translate(235 41) rotate(398)' fill='%23FFCC4D' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><path d='M0 -10.8 L4.7 0 L0 10.8 L-4.7 0Z' transform='translate(267 89) rotate(422)' fill='%23F2701F' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><circle cx='29' cy='103' r='5.3' fill='%23F5B532' stroke='%231A1C19' stroke-width='1.6'/><path d='M0 -15.2 L6.6 0 L0 15.2 L-6.6 0Z' transform='translate(246 73) rotate(411)' fill='%23FFE9A0' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><path d='M0 -9.1 L4.0 0 L0 9.1 L-4.0 0Z' transform='translate(23 126) rotate(281)' fill='%23E04A12' stroke='%231A1C19' stroke-width='1.8' stroke-linejoin='round'/><circle cx='249' cy='65' r='3.5' fill='%23FFCC4D' stroke='%231A1C19' stroke-width='1.6'/></svg>") center / 100% 100% no-repeat;
    animation: scpSparks 0.9s 0.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}
#voted-message.poll-design.pld-summerCamp h2 {
    margin: 30px 0 0; color: var(--scp-pine);
    font-family: 'Alfa Slab One', Georgia, serif; font-weight: 400; font-size: 44px; line-height: 1.05; white-space: nowrap;
    animation: scpSlam 0.42s 0.4s var(--scp-spring) both;
}
/* The pick: its own trail sign. */
#voted-message.poll-design.pld-summerCamp .voted-pick:not(:empty) { display: flex; justify-content: center; width: 100%; margin-top: 22px; }
#voted-message.poll-design.pld-summerCamp .scp-pick {
    --c: #1E6FA6;
    position: relative; isolation: isolate;
    display: flex; align-items: center; gap: 14px; width: 100%; max-width: 360px;
    min-height: 78px; padding: 8px 44px 8px 12px; box-sizing: border-box;
    filter: drop-shadow(0 7px 0 rgba(4,8,14,0.55));
    color: var(--scp-cream); text-shadow: 0 3px 0 rgba(10,12,10,0.55); text-align: left;
    font-family: 'Sidekick Trivia Barlow', 'Barlow', system-ui, sans-serif; font-weight: 800; font-size: 24px; line-height: 1.1;
    overflow-wrap: anywhere;
    animation: scpSlideIn 0.62s 0.55s var(--scp-spring) both;
}
#voted-message.poll-design.pld-summerCamp .scp-pick .scp-text { flex: 1 1 auto; min-width: 0; }
#voted-message.poll-design.pld-summerCamp p {
    margin: 28px 0 0; color: var(--scp-caption);
    font-family: 'Sidekick Trivia Barlow', 'Barlow', system-ui, sans-serif; font-weight: 600; font-size: 21px; line-height: 1.3;
    animation: scpRise 0.55s 0.75s var(--scp-spring) both;
}

/* Short screens (an SE in Safari): the whole poll still fits. */
@media (max-height: 720px) {
    #poll-content.poll-design.pld-summerCamp, #voted-message.poll-design.pld-summerCamp { padding: 18px 14px 16px; }
    #poll-content.poll-design.pld-summerCamp::before, #voted-message.poll-design.pld-summerCamp::before {
        height: 64px; margin: -18px -14px 12px; padding-top: 15px; font-size: 22px; background-size: 100% 74px, auto; }
    #poll-content.poll-design.pld-summerCamp .question { min-height: 84px; margin-bottom: 14px; padding: 10px 18px; font-size: 22px; }
    #poll-content.poll-design.pld-summerCamp .options { gap: 11px; }
    #poll-content.poll-design.pld-summerCamp .option-btn { min-height: 62px; font-size: 21px; }
    #poll-content.poll-design.pld-summerCamp .scp-patch { width: 44px; height: 44px; font-size: 20px;
        background: radial-gradient(circle, var(--scp-cream) 0 13.5px, var(--scp-ink) 14px 15.5px, var(--scp-gold) 16px); outline-offset: -5px; }
    #poll-content.poll-design.pld-summerCamp .status { margin-top: 14px; font-size: 18px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .question { min-height: 64px; margin-bottom: 10px; padding: 8px 16px; font-size: 18px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .options { gap: 7px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .option-btn { min-height: 46px; font-size: 17px; padding: 4px 36px 4px 8px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .scp-patch { width: 34px; height: 34px; font-size: 16px;
        background: radial-gradient(circle, var(--scp-cream) 0 10px, var(--scp-ink) 10.5px 12px, var(--scp-gold) 12.5px); outline: none; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .status { margin-top: 10px; font-size: 16px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7))::before { height: 52px; margin-bottom: 10px; padding-top: 12px; font-size: 20px; background-size: 100% 64px, auto; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .stopped-banner.show { margin-top: 8px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .options { gap: 5px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .option-btn { min-height: 40px; font-size: 15px; }
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(7)) .scp-patch { width: 30px; height: 30px; font-size: 14px;
        background: radial-gradient(circle, var(--scp-cream) 0 8.5px, var(--scp-ink) 9px 10.5px, var(--scp-gold) 11px); }
    #poll-content.poll-design.pld-summerCamp .stopped-banner.show,
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show {
        padding-top: 8px; padding-bottom: 8px; grid-template-columns: 48px 1fr; font-size: 15px; }
    #poll-content.poll-design.pld-summerCamp .stopped-banner.show::before,
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show::before { width: 48px; height: 48px;
        background:
            linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% - 5px) 50% / 5px 17px,
            linear-gradient(var(--scp-cream), var(--scp-cream)) no-repeat calc(50% + 5px) 50% / 5px 17px,
            radial-gradient(circle, var(--scp-red) 0 15px, var(--scp-ink) 15.5px 17px, var(--scp-cream) 17.5px); }
    #poll-content.poll-design.pld-summerCamp .stopped-banner.show::after,
    #poll-content.poll-design.pld-summerCamp:has(.option-btn:nth-child(5)) .stopped-banner.show::after { font-size: 24px; }
    #voted-message.poll-design.pld-summerCamp .checkmark { width: 156px; height: 156px; margin-top: 22px;
        background: radial-gradient(circle, var(--scp-pine) 0 56px, var(--scp-ink) 56.5px 59px, var(--scp-gold) 59.5px); outline-offset: -10px; }
    #voted-message.poll-design.pld-summerCamp .checkmark::before { width: 230px; height: 230px; margin: -115px 0 0 -115px; }
    #voted-message.poll-design.pld-summerCamp h2 { margin-top: 20px; font-size: 38px; }
    #voted-message.poll-design.pld-summerCamp .voted-pick:not(:empty) { margin-top: 16px; }
    #voted-message.poll-design.pld-summerCamp p { margin-top: 18px; font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    #poll-content.poll-design.pld-summerCamp *, #poll-content.poll-design.pld-summerCamp *::before,
    #poll-content.poll-design.pld-summerCamp *::after,
    #voted-message.poll-design.pld-summerCamp *, #voted-message.poll-design.pld-summerCamp *::before,
    #voted-message.poll-design.pld-summerCamp *::after { animation: none !important; transition: none !important; }
}

/* Motion: transforms only (and the signs' colour as they switch off). */
@keyframes scpDrop { from { transform: translateY(-300px) rotate(-6deg); } }
@keyframes scpSlideIn { from { transform: translateX(460px) rotate(4deg); } }
@keyframes scpRise { from { transform: translateY(180px); } }
@keyframes scpSignUp { from { transform: translateY(420px) rotate(4deg); } to { transform: rotate(-2deg); } }
@keyframes scpOff { from { background-color: var(--c); } }
@keyframes scpOn { from { background-color: var(--d); } }
@keyframes scpPatch { from { transform: scale(0) rotate(-30deg); } }
@keyframes scpSparks { from { transform: scale(0.3) rotate(-20deg); } }
@keyframes scpSlam { from { transform: scale(0); } }