:root {
    --bg:#0a0a0c; --panel:#131317; --border:#26262d; --silver:#c9cdd6;
    --brass:#b98d3e; --blue:#3b6bd6; --text:#e7e7ea; --muted:#9a9aa4; --green:#3fae5e; --red:#c04949;
  }
  * { box-sizing: border-box; }
  body { margin:0; background:var(--bg); color:var(--text); font-family:'Inter',-apple-system,sans-serif; }
  a { color: var(--blue); }
  header { position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:16px 4vw; border-bottom:1px solid var(--border); background:rgba(10,10,12,0.9); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  @media (max-width:760px) {
    header { flex-wrap:wrap; row-gap:10px; }
    nav { width:100%; display:flex; flex-wrap:wrap; justify-content:center; }
  }
  .wordmark { display:inline-flex; align-items:center; gap:9px; font-family:'Cinzel',serif; font-weight:700; letter-spacing:.08em; color:var(--silver); text-decoration:none; font-size:1.2rem; }
  .wordmark span { color: var(--brass); }
  .wholesale-tag { font-family:'Inter',sans-serif; font-size:.72rem; font-weight:700; letter-spacing:.13em; color:#171208; background:var(--brass); border-radius:4px; padding:4px 10px; margin-left:8px; text-transform:uppercase; vertical-align:middle; }
  .brand-banner { text-align:center; }
  .brand-banner-frame { position:relative; width:100%; }
  .brand-banner img { width:100%; height:auto; display:block; }
  /* The starburst "logo light": a soft breathing glow positioned at the
     star's actual location in bs-banner-opt.jpg (~49.6% across, ~78.3%
     down, measured from the source image so it lines up at any rendered
     width). mix-blend-mode:screen keeps pure-black overlay pixels a total
     no-op against the art beneath (screen(x,0)=x). */
  /* Shape-matched flare pulse: a soft ambient halo plus a small round core
     and thin horizontal/vertical/diagonal spikes laid directly over the
     artwork's own asterisk rays (measured from the source image). Kept
     dim enough (peak opacity well under 1, screen-blended) that the
     original rays remain visible through the glow rather than being
     washed out to solid white. */
  .bs-star-glow {
    position: absolute;
    left: 49.6%;
    top: 78.3%;
    width: 46%;
    height: 46%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    mix-blend-mode: screen;
  }
  .bs-star-halo {
    position: absolute;
    left: 50%; top: 50%;
    width: 70%; height: 70%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(150,205,255,0.32) 0%, rgba(150,205,255,0.14) 35%, rgba(150,205,255,0) 68%);
    animation: bs-flare-pulse 4s infinite;
  }
  .bs-star-core {
    position: absolute;
    left: 50%; top: 50%;
    width: 15%; height: 15%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(235,248,255,0.65) 0%, rgba(150,205,255,0.35) 40%, rgba(150,205,255,0) 78%);
    animation: bs-flare-pulse 4s infinite;
  }
  .bs-star-spike {
    position: absolute;
    left: 50%; top: 50%;
    pointer-events: none;
    transform-origin: center;
  }
  .bs-star-spike.h {
    width: 100%; height: 3%;
    transform: translate(-50%, -50%);
    background: linear-gradient(90deg, transparent 0%, rgba(150,205,255,.45) 32%, rgba(220,240,255,.68) 50%, rgba(150,205,255,.45) 68%, transparent 100%);
    animation: bs-flare-pulse-h 4s infinite;
  }
  .bs-star-spike.v {
    width: 3%; height: 100%;
    transform: translate(-50%, -50%);
    background: linear-gradient(180deg, transparent 0%, rgba(150,205,255,.45) 32%, rgba(220,240,255,.68) 50%, rgba(150,205,255,.45) 68%, transparent 100%);
    animation: bs-flare-pulse-v 4s infinite;
  }
  .bs-star-spike.d1 {
    width: 58%; height: 1.4%;
    background: linear-gradient(90deg, transparent 0%, rgba(150,205,255,.3) 34%, rgba(220,240,255,.5) 50%, rgba(150,205,255,.3) 66%, transparent 100%);
    animation: bs-flare-pulse-d1 4s infinite;
  }
  .bs-star-spike.d2 {
    width: 58%; height: 1.4%;
    background: linear-gradient(90deg, transparent 0%, rgba(150,205,255,.3) 34%, rgba(220,240,255,.5) 50%, rgba(150,205,255,.3) 66%, transparent 100%);
    animation: bs-flare-pulse-d2 4s infinite;
  }
  /* Shared pulse envelope: a quick brightening flash, then a SLOW decay
     back down to a near-invisible floor (opacity 0.1) - at that floor
     almost none of this overlay shows, leaving just the artwork's own
     original starlight and its base glow, exactly as it looks with no
     overlay at all. Every layer below (halo/core/spikes) uses this same
     timing envelope, only differing in which transform axis it scales, so
     they all flash and fade together. */
  @keyframes bs-flare-pulse {
    0%   { transform: translate(-50%, -50%) scale(0.85); opacity: 0.1; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { transform: translate(-50%, -50%) scale(1.18); opacity: 1;   animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { transform: translate(-50%, -50%) scale(0.85); opacity: 0.1; }
  }
  @keyframes bs-flare-pulse-h {
    0%   { transform: translate(-50%, -50%) scaleX(0.82); opacity: 0.1; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { transform: translate(-50%, -50%) scaleX(1.2);  opacity: 1;   animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { transform: translate(-50%, -50%) scaleX(0.82); opacity: 0.1; }
  }
  @keyframes bs-flare-pulse-v {
    0%   { transform: translate(-50%, -50%) scaleY(0.82); opacity: 0.1; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { transform: translate(-50%, -50%) scaleY(1.2);  opacity: 1;   animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { transform: translate(-50%, -50%) scaleY(0.82); opacity: 0.1; }
  }
  @keyframes bs-flare-pulse-d1 {
    0%   { transform: translate(-50%, -50%) rotate(45deg) scaleX(0.85); opacity: 0.1; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { transform: translate(-50%, -50%) rotate(45deg) scaleX(1.18); opacity: 1;   animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { transform: translate(-50%, -50%) rotate(45deg) scaleX(0.85); opacity: 0.1; }
  }
  @keyframes bs-flare-pulse-d2 {
    0%   { transform: translate(-50%, -50%) rotate(-45deg) scaleX(0.85); opacity: 0.1; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { transform: translate(-50%, -50%) rotate(-45deg) scaleX(1.18); opacity: 1;   animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { transform: translate(-50%, -50%) rotate(-45deg) scaleX(0.85); opacity: 0.1; }
  }
  /* Lights that light up the actual "1"s and "0"s in the artwork's binary
     text, one digit after the next, giving the illusion of light traveling
     without any element actually moving. Character positions were measured
     directly from the source image (column-peak detection on the digit
     glyphs), so each light sits exactly on one digit and is smaller than
     it. Uses only the starburst's own pale blue-white color. Each digit is
     a separate, fixed dot that blinks briefly; staggering the delay by one
     row's step size means the previous digit is already dark by the time
     the next one lights, so exactly one is lit at a time per row. */
  .bs-digit-led {
    position: absolute;
    width: 0.5%;
    aspect-ratio: 1;
    border-radius: 50%;
    pointer-events: none;
    mix-blend-mode: screen;
    transform: translate(-50%, -50%);
    background: #9fd0ff;
    box-shadow: 0 0 1.5px #cfe9ff, 0 0 3px rgba(120,190,255,.85);
    opacity: 0;
    animation-name: bs-digit-blink;
    animation-timing-function: steps(1, jump-end);
    animation-iteration-count: infinite;
  }
  @keyframes bs-digit-blink {
    0%    { opacity: 1; }
    1.0%  { opacity: 0; }
    100%  { opacity: 0; }
  }
  @media (prefers-reduced-motion: reduce) {
    .bs-star-halo, .bs-star-core, .bs-star-spike { animation: none !important; }
    .bs-digit-led { animation: none !important; }
    .beam-fade { animation: none !important; }
  }
  .beam-fade { width:260px; height:42px; margin:0 auto -42px; background:radial-gradient(ellipse 60% 100% at 50% 0%, rgba(148,205,255,.55), rgba(148,205,255,.22) 40%, rgba(10,10,12,0) 85%); pointer-events:none; position:relative; z-index:1; animation: bs-flare-pulse-opacity 4s infinite; }
  @keyframes bs-flare-pulse-opacity {
    0%   { opacity: 0.75; animation-timing-function: cubic-bezier(.3,0,.6,1); }
    12%  { opacity: 1;    animation-timing-function: cubic-bezier(.22,1,.36,1); }
    100% { opacity: 0.75; }
  }
  .brand-banner .banner-word { font-family:'Cinzel',serif; font-weight:700; font-size:clamp(1.3rem, 3.2vw, 1.9rem); letter-spacing:.18em; color:#fff; margin:16px 0 6px; }
  .brand-banner .banner-word span { color:var(--brass); }
  .brand-banner .banner-tag { font-family:'Inter',sans-serif; font-size:.66rem; letter-spacing:.3em; text-transform:uppercase; color:var(--muted); margin-bottom:30px; }
  main { max-width: 760px; margin: 0 auto; padding: 4vw 4vw 8vw; }
  h1 { font-family:'Cinzel',serif; font-size:1.7rem; margin:0 0 6px; color:#fff; }
  .sub { color:var(--muted); font-size:.92rem; margin-bottom:28px; }

  .steps-bar { display:flex; gap:4px; margin-bottom:30px; flex-wrap:wrap; }
  .steps-bar .dot { flex:1; min-width:8px; height:5px; border-radius:3px; background:var(--border); }
  .steps-bar .dot.done { background:var(--brass); }
  .steps-bar .dot.current { background:var(--blue); }
  .step-label { color:var(--muted); font-size:.8rem; margin-bottom:26px; text-transform:uppercase; letter-spacing:.06em; }

  .card { background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:28px; }
  .card h2 { font-size:1.15rem; color:#fff; margin:0 0 20px; }
  .card h3 { font-size:.98rem; color:var(--silver); margin:22px 0 14px; text-transform:uppercase; letter-spacing:.04em; }
  .card h3:first-child { margin-top:0; }
  .field { margin-bottom:18px; }
  .field label { display:block; font-size:.85rem; color:var(--muted); margin-bottom:6px; }
  .field label .req { color:var(--red); }
  .field .hint { color:var(--muted); font-size:.78rem; margin-top:5px; }
  input, select, textarea {
    width:100%; background:#0d0d10; border:1px solid var(--border); border-radius:6px;
    color:var(--text); padding:11px 12px; font-size:.95rem; font-family:inherit;
  }
  textarea { resize: vertical; min-height: 70px; }
  .row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .row3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }
  @media (max-width:600px) { .row, .row3 { grid-template-columns:1fr; } }
  .radio-group { display:flex; gap:20px; align-items:center; margin-top:4px; flex-wrap:wrap; }
  .radio-group label { display:flex; align-items:center; gap:6px; color:var(--text); font-size:.92rem; }
  .radio-group input { width:auto; }
  .conditional { border-left:2px solid var(--border); padding-left:16px; margin-top:14px; }

  .error-banner {
    background: rgba(192,73,73,.1); border:1px solid var(--red); border-radius:8px;
    padding:14px 16px; color:#f0b8b8; font-size:.88rem; margin-bottom:22px;
  }
  .error-banner strong { color:#fff; display:block; margin-bottom:4px; }

  .nav-row { display:flex; justify-content:space-between; margin-top:26px; }
  button { background:var(--brass); color:#171208; border:none; border-radius:6px; padding:12px 24px; font-weight:600; font-size:.95rem; cursor:pointer; }
  button.secondary { background:transparent; border:1px solid var(--border); color:var(--text); }
  button.small { padding:8px 14px; font-size:.85rem; }
  button:disabled { opacity:.5; cursor:not-allowed; }

  .review-section { margin-bottom:24px; }
  .review-section-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:4px; }
  .review-section-head h3 { font-size:.95rem; color:var(--silver); margin:0; text-transform:uppercase; letter-spacing:.04em; }
  .review-section-head button { background:transparent; border:1px solid var(--border); color:var(--blue); padding:4px 12px; font-size:.8rem; font-weight:600; }
  .review-list { list-style:none; margin:0 0 20px; padding:0; }
  .review-list li { padding:9px 0; border-bottom:1px solid var(--border); font-size:.9rem; display:flex; justify-content:space-between; gap:16px; }
  .review-list .k { color:var(--muted); }
  .review-list .v { color:#fff; text-align:right; }

  .sig-row { display:flex; gap:10px; align-items:flex-end; }
  .sig-row input { font-family:'Cinzel', serif; font-size:1.2rem; }
  .checkbox-line { display:flex; gap:10px; align-items:flex-start; margin:18px 0; }
  .checkbox-line input { width:auto; margin-top:3px; }
  .checkbox-line label { font-size:.88rem; color:var(--silver); }

  .honeypot { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; }

  .verify-box { background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:18px; margin-top:10px; }
  .verify-status { font-size:.85rem; margin-top:10px; }
  .verify-status.ok { color: var(--green); }
  .verify-status.err { color: var(--red); }
  .inline-row { display:flex; gap:10px; align-items:center; }
  .inline-row input { flex:1; }

  .doc-links { background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:16px 18px; margin-bottom:18px; }
  .doc-links .doc-link-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; font-size:.9rem; }
  .doc-links .doc-link-row + .doc-link-row { border-top:1px solid var(--border); }
  .doc-links .ver { color:var(--brass); font-family:monospace; font-size:.82rem; }

  .challenge-box { background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:16px 18px; margin:14px 0; }
  .challenge-box label { color:#fff; font-size:.92rem; }

  .repeat-card { background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:20px; margin-bottom:16px; position:relative; }
  .repeat-card-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
  .repeat-card-head h4 { margin:0; font-size:.92rem; color:var(--brass); text-transform:uppercase; letter-spacing:.05em; }
  .repeat-card-head button { padding:5px 12px; font-size:.78rem; }
  .ssn-row { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:10px; }
  .add-row { text-align:center; margin-bottom:16px; }
  .legal-text { background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:18px 20px; max-height:260px; overflow-y:auto; font-size:.85rem; color:var(--silver); line-height:1.6; margin-bottom:18px; }
  .legal-text p { margin:0 0 12px; }
  .legal-text p:last-child { margin-bottom:0; }
  .optional-tag { color:var(--muted); font-weight:400; font-size:.78rem; text-transform:none; letter-spacing:0; margin-left:6px; }

  #confirm-shell { display:none; text-align:center; padding:20px 0; }
  #confirm-shell h2 { color:#fff; margin-bottom:10px; }
  .creds-box {
    background:#0d0d10; border:1px solid var(--border); border-radius:8px; padding:18px;
    text-align:left; font-family:monospace; font-size:.88rem; margin:18px 0; color:var(--silver);
  }
  .creds-box div { margin-bottom:6px; }
  .creds-box b { color:#fff; }