@property --sc-bg { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-boat { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-cloud { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-dune { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-glow1 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-glow2 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-headland { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-islet { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-moondark { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-palm { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-ridge { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sea1 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sea2 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sea3 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sea4 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sea5 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-shimmer { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky1 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky2 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky3 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky4 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky5 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky6 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sky7 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sun1 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sun2 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-sun3 { syntax: '<color>'; inherits: true; initial-value: #1f8fa0; }
    @property --sc-cloudOp { syntax: '<number>'; inherits: true; initial-value: 0; }
    @property --sc-lightsOp { syntax: '<number>'; inherits: true; initial-value: 0; }
    @property --sc-starOp { syntax: '<number>'; inherits: true; initial-value: 0; }
    :root { transition: --sc-bg 60s linear,
                  --sc-boat 60s linear,
                  --sc-cloud 60s linear,
                  --sc-dune 60s linear,
                  --sc-glow1 60s linear,
                  --sc-glow2 60s linear,
                  --sc-headland 60s linear,
                  --sc-islet 60s linear,
                  --sc-moondark 60s linear,
                  --sc-palm 60s linear,
                  --sc-ridge 60s linear,
                  --sc-sea1 60s linear,
                  --sc-sea2 60s linear,
                  --sc-sea3 60s linear,
                  --sc-sea4 60s linear,
                  --sc-sea5 60s linear,
                  --sc-shimmer 60s linear,
                  --sc-sky1 60s linear,
                  --sc-sky2 60s linear,
                  --sc-sky3 60s linear,
                  --sc-sky4 60s linear,
                  --sc-sky5 60s linear,
                  --sc-sky6 60s linear,
                  --sc-sky7 60s linear,
                  --sc-sun1 60s linear,
                  --sc-sun2 60s linear,
                  --sc-sun3 60s linear,
                  --sc-cloudOp 60s linear,
                  --sc-lightsOp 60s linear,
                  --sc-starOp 60s linear; }
    @media (prefers-reduced-motion: reduce) { :root { transition: none; } }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html, body { height: 100%; }
    body {
      font-family: var(--font-body);
      
      background: var(--sc-dune, #143b46); 
      color: var(--white);
      min-height: 100svh;
      overflow-x: hidden;
    }
    
    
    .scene {
      position: absolute; top: 0; left: 0; right: 0; height: 100svh;
      z-index: 0; overflow: hidden;
      pointer-events: none;
    }
    .scene svg { width: 100%; height: 100%; display: block; }
    .layer { will-change: transform; }
    
    
    .sway { transform-box: fill-box; transform-origin: 50% 100%;
            animation: sway var(--sway-t, 3.5s) ease-in-out infinite alternate; }
    .sway.s2 { animation-duration: calc(var(--sway-t, 3.5s) * 1.22);
               animation-delay: calc(var(--sway-t, 3.5s) * -0.33); }
    .sway.s3 { animation-duration: calc(var(--sway-t, 3.5s) * 1.44);
               animation-delay: calc(var(--sway-t, 3.5s) * -0.67); }
    @keyframes sway {
      from { transform: rotate(calc(var(--sway-half, 3deg) * -1)); }
      to   { transform: rotate(var(--sway-half, 3deg)); }
    }
    
    .shimmer rect { animation: shim 3.2s ease-in-out infinite; }
    .shimmer rect:nth-child(2n) { animation-delay: -1.1s; }
    .shimmer rect:nth-child(3n) { animation-delay: -2.2s; }
    .shimmer rect:nth-child(5n) { animation-duration: 4.1s; }
    @keyframes shim { 0%,100% { opacity: .15; } 50% { opacity: .75; } }
    
    .string-lights { opacity: var(--sc-lightsOp, .55); }
    
    .twinkle circle { animation: twk 4.5s ease-in-out infinite; }
    .twinkle circle:nth-child(2n) { animation-delay: -1.4s; }
    .twinkle circle:nth-child(3n) { animation-delay: -2.8s; animation-duration: 6s; }
    @keyframes twk { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
    
    .cloud { animation: drift 140s linear infinite; }
    .cloud.c2 { animation-duration: 180s; animation-delay: -60s; }
    .cloud.c3 { animation-duration: 220s; animation-delay: -130s; }
    @keyframes drift {
      0%   { transform: translateX(-160px); opacity: 0; }
      7%   { opacity: calc(var(--cloud-op, .5) * var(--cloud-day, 1)); }
      93%  { opacity: calc(var(--cloud-op, .5) * var(--cloud-day, 1)); }
      100% { transform: translateX(1600px); opacity: 0; }
    }
    
    .birds { animation: fly 47s linear infinite; opacity: 0; }
    @keyframes fly {
      0% { transform: translate(-120px, 40px); opacity: 0; }
      4% { opacity: .8; }
      38% { opacity: .8; }
      46% { transform: translate(1560px, -60px); opacity: 0; }
      100% { transform: translate(1560px, -60px); opacity: 0; }
    }
    
    
    .sky-body { transform: translate(var(--bx), var(--by)); opacity: var(--bo, 1);
                transition: opacity 1.2s linear; }
    .sky-body.moon { opacity: var(--bo, 0); }
   
    .sunglow { animation: breathe 7s ease-in-out infinite alternate;
               transform-box: fill-box; transform-origin: center;
               scale: var(--sun-glow-scale, 1); }
    
    .shimmer { transform: translateX(var(--shim-x, 0px));
               opacity: calc(var(--shim-op, 1) * var(--shim-day, 1));
               transition: opacity 1.2s linear; }
    
    .cloud { opacity: calc(var(--cloud-op, .5) * var(--cloud-day, 1)); }
    .cloud[hidden] { display: none; }
    .starfield circle { animation: twk 4.5s ease-in-out infinite; }
    .starfield circle:nth-child(2n) { animation-delay: -1.4s; }
    .starfield circle:nth-child(3n) { animation-delay: -2.8s; animation-duration: 6s; }
    .starfield circle:nth-child(5n) { animation-duration: 3.6s; }
    
    .starfield circle.planet { animation: none; }
    
    .pod { animation: podswim var(--pod-lap, 38s) linear infinite;
           animation-delay: var(--pod-delay, -9s); opacity: 0; }
    @keyframes podswim {
      0%, 4% { opacity: 0; transform: translateX(-260px); }
      8% { opacity: .92; }
      22% { opacity: .92; }
      26%, 100% { opacity: 0; transform: translateX(760px); }
    }
    .pod .leap { animation: leap 2.1s ease-in-out infinite; }
    .pod .leap.d2 { animation-delay: -.7s; }
    .pod .leap.d3 { animation-delay: -1.4s; }
    @keyframes leap {
      0%, 100% { transform: translateY(14px) rotate(-8deg); }
      45% { transform: translateY(-16px) rotate(10deg); }
    }
    
    
    .shooting-star { animation: shoot 62s linear infinite;
                     animation-delay: var(--star-delay, -20s); opacity: 0; }
    @keyframes shoot {
      0%, 97.4% { opacity: 0; transform: translate(0, 0); }
      97.6% { opacity: .95; }
      99.2% { opacity: .55; }
      99.6%, 100% { opacity: 0; transform: translate(150px, 96px); }
    }
    @keyframes breathe { from { opacity: .75; } to { opacity: 1; } }
    
    
    
    .skyway {
      position: absolute; left: 50%; translate: -50%;
      width: 100vw; top: 0; bottom: 0;
      z-index: 1; pointer-events: none; overflow: hidden;
    }
    .cx { position: relative; display: block; flex: none;
          width: clamp(112px, 13vw, 184px); }
    
    .cx img.cx-plane { width: 100%; height: auto; display: block; }
    .cx img.cx-mark { position: absolute; right: 3.2%; top: 21%; width: 11%;
                      height: auto; }
    .sign { width: clamp(132px, 15vw, 212px); height: auto; flex: none; }
    .tow { flex: none; width: clamp(14px, 1.6vw, 24px); height: 1px;
           background: rgba(30, 24, 76, .5); }
    .prop { transform-origin: 171px 73.4px; animation: spin .14s linear infinite; }
    @keyframes spin { to { transform: rotate(360deg); } }
    
    
    
    
    .characters {
      position: absolute; top: 0; left: 0; right: 0; height: 100svh;
      z-index: 3; pointer-events: none; overflow: hidden;
    }
    body { position: relative; }
    .char { position: absolute;
            filter: drop-shadow(0 6px 10px rgba(10, 40, 45, .25)); }
    
    .char-surf {
      width: clamp(180px, 19vw, 280px);  
      aspect-ratio: 899 / 702;      
      background-image: url("../landing/twurtle-surf-loop.504f8acae6e6.webp");
      background-size: 1200% 100%;  
      background-position: 0 0;
      animation: bob 4.5s ease-in-out infinite alternate;
    }
    @keyframes bob {
      from { transform: translateY(0) rotate(-1.5deg); }
      to   { transform: translateY(9px) rotate(1.5deg); }
    }
    
    .char-surf { pointer-events: auto; cursor: grab; touch-action: none; }
    .char-surf.trick { animation: trick .95s cubic-bezier(.3, .7, .3, 1); }
    @keyframes trick {
      0%   { transform: translateY(0) rotate(0); }
      35%  { transform: translateY(-26px) rotate(-160deg); }
      70%  { transform: translateY(2px) rotate(-330deg); }
      100% { transform: translateY(0) rotate(-360deg); }
    }
    .splash {
      position: absolute; z-index: 1; pointer-events: none;
      width: 16px; height: 16px; border-radius: 50%;
      border: 2px solid rgba(255, 253, 248, .75);
      transform: translate(-50%, -50%) scale(.4); opacity: .9;
      animation: splash .7s ease-out forwards;
    }
    @keyframes splash { to { transform: translate(-50%, -50%) scale(4); opacity: 0; } }
    
    .edge-palm { position: absolute; right: -28px; width: clamp(120px, 30vw, 190px);
                 display: none; }
    @media (max-width: 860px) { .edge-palm { display: block; } }
    
    .boat { animation: boatdrift var(--boat-lap, 96s) linear infinite;
            animation-delay: var(--boat-delay, 0s); }
    @keyframes boatdrift {
      from { transform: translateX(-120px); } to { transform: translateX(1580px); }
    }
    
    
    .page {
      position: relative; z-index: 2;
      min-height: 100svh;
      display: grid; justify-items: center; align-content: start;
      grid-template-rows: auto minmax(3svh, 1fr) auto var(--water, 24svh) auto;
      padding: 3.5svh 1.25rem 0;
      pointer-events: none;   
    }
    
    .page a, .page .card, .page .popup { pointer-events: auto; }
    .masthead { display: flex; flex-direction: column; align-items: center;
                position: relative; }
    
    .mist {
      position: absolute; inset: -18% -30% auto -30%; height: 150%;
      pointer-events: none; mix-blend-mode: soft-light; opacity: 0;
      background: radial-gradient(46% 62% at 50% 50%,
        rgba(255, 255, 255, .92), rgba(255, 255, 255, .34) 46%,
        rgba(255, 255, 255, 0) 72%);
      animation: mistpass 104s linear infinite;
      will-change: transform;
    }
    @keyframes mistpass {
      0%   { transform: translateX(-62%) scaleX(1.15); opacity: 0; }
      14%  { opacity: .95; }
      86%  { opacity: .95; }
      100% { transform: translateX(62%) scaleX(1.15); opacity: 0; }
    }
    .skyband, .waterband { width: 100%; pointer-events: none; position: relative; }
    
    .skyband { min-height: clamp(34px, 4.5svh, 56px); }
    .brand {
      font-family: var(--font-brand); font-weight: 700;
      font-size: clamp(2.8rem, 9vw, 4rem); letter-spacing: -0.01em;
      background: linear-gradient(180deg, var(--white) 38%, #ffe9b8 78%, var(--golden));
      -webkit-background-clip: text; background-clip: text; color: transparent;
      filter: drop-shadow(0 2px 14px rgba(12, 45, 52, .45));
      animation: rise .8s ease-out both;
    }
    .brand-wave { width: 8.5rem; height: .8rem; margin-top: .5rem; opacity: .85; }
    .brand-wave path {
      stroke-dasharray: 220; stroke-dashoffset: 220;
      animation: wavedraw 1.1s .45s ease-out forwards;
    }
    @keyframes wavedraw { to { stroke-dashoffset: 0; } }
    .tagline {
      color: var(--sand-light); font-size: clamp(1rem, 2.6vw, 1.15rem);
      opacity: .95; margin-top: .45rem;
      text-shadow: 0 1px 10px rgba(12, 45, 52, .5);
      animation: rise .8s .15s ease-out both;
    }
    :root { --spring: linear(0, .0039 1.86%, .0157 3.72%, .0629 7.75%,
            .1416 11.93%, .2523 16.27%, .4459 22.62%, .8078 33.99%, .9163 37.87%,
            1.0022 41.9%, 1.0466 45.93%, 1.0635 49.96%, 1.0454 57.15%,
            1.0018 66.16%, .9924 70.34%, .9986 79.35%, 1); }
    @keyframes rise { from { opacity: 0; transform: translateY(16px); } }
    
    .doors {
      margin-top: auto; width: 100%; max-width: 1020px;
      display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem;
      padding-top: 4svh;
    }
    .doors > .card { grid-column: span var(--span, 3); container-type: inline-size; }
    .doors--below { margin-top: .5svh; }
    
    .doors { align-items: stretch; }
    
    .card {
      display: block; text-decoration: none; text-align: center;
      
      background: linear-gradient(165deg, rgba(16, 50, 60, .40), rgba(16, 50, 60, .24));
      color: var(--white);
      border-radius: 1.1rem; padding: .85rem 1rem;
      border: 1px solid rgba(250, 243, 232, .30);
      border-top-color: rgba(250, 243, 232, .50);
      box-shadow: 0 14px 34px rgba(4, 20, 25, .42);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
      transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
    }
    .card:hover {
      transform: translateY(-3px);
      border-color: rgba(243, 181, 72, .6);
      box-shadow: 0 16px 40px rgba(6, 26, 31, .4), 0 0 26px rgba(243, 181, 72, .16);
    }
    .card:active { transform: scale(.985); }
    
    button.card { font: inherit; cursor: pointer; width: 100%;
                  appearance: none; -webkit-appearance: none; }
    
    
    .doors .card { animation: rise .78s var(--spring) both;
                   animation-delay: calc(.25s + var(--i, 0) * .09s); }
    .card h2 { font-family: var(--font-brand); font-size: clamp(1.02rem, 1.35vw, 1.18rem);
               font-weight: 600; text-wrap: balance;
               text-shadow: 0 1px 8px rgba(8, 30, 36, .5); }
    .card p { font-size: .85rem; color: var(--sand-light); opacity: .85; margin-top: .25rem; }
    
    .tiles {
      display: flex; gap: .32rem; justify-content: center;
      margin-top: .55rem; perspective: 600px;
    }
    .tiles[hidden] { display: none; }
    .tile {
      width: clamp(32px, 7.5vw, 40px); aspect-ratio: 1 / 1;
      border-radius: 5px; background: var(--white);
      border: 2px solid #C8DFE0; color: var(--palm);
      font-family: 'Outfit', var(--font-body);
      font-weight: 700; font-size: clamp(19px, 4.8vw, 25px);
      text-transform: uppercase;
      display: flex; align-items: center; justify-content: center;
      
      transition: background .1s ease, border-color .1s ease, color .1s ease;
      
      box-shadow: 0 3px 10px rgba(6, 26, 31, .3);
    }
    .tile.t-g { background: var(--turq-deep); border-color: var(--turq-deep); color: #fff; }
    .tile.t-y { background: var(--golden); border-color: var(--golden); color: #fff; }
    .tile.t-x { background: #C8BDAD; border-color: #C8BDAD; color: var(--white); }
    .tile.hop { animation: hop .72s var(--spring); }
   
    @keyframes hop {
      30% { transform: translateY(-17px); }
      55% { transform: translateY(3px); }
      75% { transform: translateY(-6px); }
      100% { transform: translateY(0); }
    }
    .snug .tile { width: clamp(32px, 8vw, 40px); font-size: clamp(17px, 4.2vw, 22px); }
    
    .next-up {
      display: flex; align-items: center; gap: .7rem;
      justify-content: center; margin-top: .6rem; color: var(--white);
    }
    .nu-chip {
      flex: none; display: flex; flex-direction: column; line-height: 1.05;
      border: 1px solid rgba(243, 181, 72, .55); border-radius: .55rem;
      padding: .3rem .55rem; color: var(--golden);
      background: rgba(243, 181, 72, .1);
    }
    .nu-chip b { font-size: 1.05rem; color: var(--white); font-weight: 700; }
    .nu-chip i { font-style: normal; font-size: .62rem; letter-spacing: .14em; }
    .nu-side { text-align: left; max-width: 15.5rem; }
    .nu-kicker { display: block; font-size: .68rem; letter-spacing: .16em;
                 text-transform: uppercase; color: var(--golden); opacity: .9; }
    .nu-place { font-family: var(--font-brand); font-size: 1rem; color: var(--white); }
    a.next-up { text-decoration: none; }
    a.next-up .nu-place { text-decoration: underline dotted; }
    footer {
      width: 100%;
      
      display: flex; flex-wrap: wrap;
      justify-content: center; align-items: baseline;
      text-align: center; padding-top: 1.1rem;
      font-size: .8rem; color: var(--sand-light); opacity: .75;
    }
    footer a { color: inherit; }
    
    .trivia { margin-top: .7rem; text-align: left; }
    .tq {
      font-family: var(--font-brand); font-size: 1.02rem; line-height: 1.35;
      color: var(--white); text-wrap: balance; margin-bottom: .6rem;
    }
    
    .topts { display: grid; gap: .4rem; grid-template-columns: 1fr 1fr; }
    .topt {
      display: flex; align-items: center; gap: .55rem; width: 100%;
      font: inherit; font-size: .9rem; text-align: left; cursor: pointer;
      padding: .48rem .6rem; border-radius: .6rem;
      color: var(--white);
      background: rgba(250, 243, 232, .07);
      border: 1px solid rgba(250, 243, 232, .22);
      transition: background .14s ease, border-color .14s ease;
    }
    .topt:hover:not(:disabled) { background: rgba(250, 243, 232, .14);
                                 border-color: rgba(243, 181, 72, .5); }
    .topt i {
      flex: none; font-style: normal; font-weight: 700; font-size: .7rem;
      width: 1.35rem; height: 1.35rem; border-radius: 50%;
      display: grid; place-items: center; color: var(--golden);
      border: 1px solid rgba(243, 181, 72, .45);
    }
    .topt:disabled { cursor: default; opacity: .75; }
    
    .topt.right { background: rgba(70, 194, 201, .22); border-color: var(--turq);
                  opacity: 1; }
    .topt.right i { color: var(--turq); border-color: var(--turq); }
    .topt.wrong { background: rgba(200, 120, 100, .16);
                  border-color: rgba(224, 138, 118, .55); }
    
    .topt.right i, .topt.wrong i { font-size: 0; }
    .topt.right i::after, .topt.wrong i::after { font-size: .82rem; }
    .topt.right i::after { content: '✓'; }
    .topt.wrong i::after { content: '✕'; }
    .topt.right span, .topt.wrong span { font-weight: 600; }
    .topt.picked { background: rgba(243, 181, 72, .16);
                   border-color: rgba(243, 181, 72, .55); }
    .tsaid:empty { display: none; }
    .tsaid { margin-top: .55rem; font-size: .85rem; color: var(--sand-light);
             line-height: 1.45; }
    
    .popup {
      position: fixed; inset: 0; margin: auto;
      width: min(30rem, calc(100vw - 2.5rem));
      max-height: min(34rem, calc(100svh - 3rem));
      overflow-y: auto; overscroll-behavior: contain;
      padding: 1.6rem 1.5rem 1.35rem;
      border: 1px solid color-mix(in srgb, var(--p-border) var(--p-border-a), transparent);
      border-radius: var(--p-radius);
      background:
        linear-gradient(165deg,
          color-mix(in srgb, var(--p-top) var(--p-alpha), transparent),
          color-mix(in srgb, var(--p-bottom) var(--p-alpha), transparent));
      color: var(--p-ink);
      box-shadow: 0 24px 60px rgba(6, 26, 31, .45);
      backdrop-filter: blur(var(--p-blur)) saturate(130%);
      -webkit-backdrop-filter: blur(var(--p-blur)) saturate(130%);
    }
    
    .popup::backdrop { background: rgba(6, 22, 28, .5); }
    .popup h2 {
      font-family: var(--font-brand); font-size: 1.45rem; font-weight: 600;
      color: var(--p-heading); text-wrap: balance; padding-right: 1.6rem;
    }
    .popup-body { margin-top: .6rem; }
    .popup-body p { font-size: .96rem; line-height: 1.55; }
    .popup-body p + p { margin-top: .7rem; }
    .popup-x {
      position: absolute; top: .55rem; right: .6rem;
      width: 2rem; height: 2rem; border-radius: 50%;
      border: 0; background: transparent; cursor: pointer;
      font: 400 1.5rem/1 system-ui; color: var(--p-ink); opacity: .55;
    }
    .popup-x:hover { opacity: 1; }
    
    .capture { display: grid; gap: .55rem; margin-top: 1.1rem; }
    .capture-row { display: flex; gap: .5rem; flex-wrap: wrap; }
    .capture input, .capture textarea {
      flex: 1 1 12rem; min-width: 0; font: inherit; font-size: .95rem;
      padding: .6rem .7rem; border-radius: calc(var(--p-radius) / 2.5);
      border: 1px solid color-mix(in srgb, var(--p-border) var(--p-border-a), transparent);
      background: color-mix(in srgb, var(--p-ink) 7%, transparent);
      color: var(--p-ink);
    }
    .capture textarea { resize: vertical; }
    .capture ::placeholder { color: var(--p-ink); opacity: .5; }
    .capture input:focus-visible, .capture textarea:focus-visible,
    .capture button:focus-visible, .popup-x:focus-visible {
      outline: 2px solid var(--p-accent); outline-offset: 2px;
    }
    .capture button[type="submit"] {
      font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer;
      padding: .6rem 1rem; border: 0;
      border-radius: calc(var(--p-radius) / 2.5);
      background: var(--p-accent); color: var(--p-accent-ink);
    }
    .capture button[type="submit"]:disabled { opacity: .55; cursor: default; }
    .capture-said:empty { display: none; }
    .capture-said { font-size: .92rem; font-weight: 600; color: var(--p-heading); }
    .capture-said.bad { color: var(--p-ink); opacity: .85; font-weight: 400; }
    .capture-fine { font-size: .76rem; opacity: .6; line-height: 1.45; }
    .capture-fine a { color: inherit; }
    .sr-only {
      position: absolute; width: 1px; height: 1px; overflow: hidden;
      clip-path: inset(50%); white-space: nowrap;
    }