/* Get listed (/promoter-submit-new): the submission form in the /events style.
   Cream ground, plum ink, lime for the one main action, the shared cut-out
   shapes. Everything is under .sb so it can't collide with main.css, and
   main.css's broad button rules are kept off with :where() resets. */
.sb{
  --plum:#3e0a2e; --ink-2:#4d2a44; --muted:#6f4262; --cream:#fff6ef; --blush:#ffeaf2; --lilac:#e7d6ff;
  --lime:#d4f57a; --on-lime:#1c2600; --pink:#ff4f9a; --pink-ink:#d81b6a; --violet:#6a3cff;
  --line:#ead7e2; --field:#fff; --bad:#b0123f; --bad-bg:#fff0f3;
  --wrap:72rem;
  display:block;background:var(--cream);color:var(--plum);
  font:400 1rem/1.5 'Roboto Flex',Roboto,system-ui,sans-serif;overflow-x:clip;padding-bottom:4rem
}
html:has(.sb) body{background:#fff6ef}
.sb *{box-sizing:border-box}
.sb :where(h1,h2,h3,p,ul,ol,fieldset,legend){margin:0;padding:0}
.sb :where(h1,h2,h3){text-transform:none;letter-spacing:0}
.sb :where(button){font:inherit;color:inherit;background:none;border:0;min-height:0;padding:0;box-shadow:none;text-transform:none;letter-spacing:0}
.sb :where(fieldset){border:0;min-width:0}
.sb :where(img){display:block;max-width:100%}
.sb a{color:var(--violet)}
.sb [hidden]{display:none !important}
.sb-done,.sb-errors,.sb-step,#resubmit-banner{scroll-margin-top:calc(var(--bol-head-h, 72px) + 1rem)}
.sb :focus-visible{outline:3px solid var(--violet);outline-offset:3px}
.sb-wrap{max-width:var(--wrap);margin:0 auto;padding:0 1rem}
.sb-disp{font-variation-settings:'wdth' 32,'opsz' 144;font-weight:900;text-transform:uppercase;line-height:.88}
.sb-lead{font-variation-settings:'wdth' 151,'opsz' 144;font-weight:280;letter-spacing:-.02em;line-height:1.15}
.sb-lbl{font:850 .8rem/1.2 'Roboto Flex',sans-serif;font-variation-settings:'wdth' 70;letter-spacing:.1em;text-transform:uppercase}

/* shapes (the same cut-outs as /events and the newsletter) */
.sb-sh{position:absolute;pointer-events:none}
.sb-sh-flower{-webkit-mask:url(/images/newsletter/shapes/flower.svg) center/100% 100% no-repeat;mask:url(/images/newsletter/shapes/flower.svg) center/100% 100% no-repeat}
.sb-sh-burst{-webkit-mask:url(/images/newsletter/shapes/burst.svg) center/100% 100% no-repeat;mask:url(/images/newsletter/shapes/burst.svg) center/100% 100% no-repeat}
.sb-sh-cookie{-webkit-mask:url(/images/newsletter/shapes/cookie.svg) center/100% 100% no-repeat;mask:url(/images/newsletter/shapes/cookie.svg) center/100% 100% no-repeat}

/* ---------- hero ---------- */
.sb-hero{position:relative;isolation:isolate;overflow:clip;background:var(--blush);padding:1.2rem 0 1.4rem}
.sb-hero__in{display:grid;gap:1.1rem;align-items:center}
.sb-hero .sb-wrap{position:relative}
.sb-hero__f{right:-4rem;bottom:-4.5rem;width:12rem;height:12rem;background:var(--violet);z-index:-1}
.sb-hero__k{color:var(--violet)}
.sb-hero__t{margin-top:.35rem;font-size:3.1rem}
.sb-hero__t em{font-style:normal;color:var(--pink-ink)}
.sb-hero__sub{margin-top:.6rem;font-size:1.15rem;max-width:30rem}
.sb-facts{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.9rem}
.sb-facts li{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .8rem;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px #ffd1e2;font:850 .88rem 'Roboto Flex';font-variation-settings:'wdth' 70}
.sb-facts i{color:var(--pink-ink)}

/* ---------- notes (resubmit) ---------- */
.sb-note{display:flex;gap:.9rem;align-items:flex-start;margin-top:1.4rem;padding:1rem 1.1rem;border-radius:1.1rem;line-height:1.5}
.sb-note>i{margin-top:.25rem;font-size:1.1rem}
.sb-note__t{font-weight:850;font-size:1.1rem}
.sb-note__ev{color:var(--ink-2)}
.sb-note__k{margin-top:.6rem;color:var(--ink-2)}
.sb-note--edit{background:var(--lime);color:var(--on-lime)}
.sb-note--bad{background:var(--bad-bg);box-shadow:inset 0 0 0 1.5px #f5b8c8;color:var(--plum)}
.sb-note--bad>i{color:var(--bad)}

/* ---------- layout ---------- */
.sb-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:1.5rem;margin-top:1.4rem}
.sb-form{display:grid;gap:1rem;min-width:0}

/* error summary */
.sb-errors{padding:1rem 1.1rem;border-radius:1.1rem;background:var(--bad-bg);box-shadow:inset 0 0 0 2px var(--bad)}
.sb-errors__t{font-weight:850;color:var(--bad)}
.sb-errors ul{margin:.4rem 0 0 1.1rem;display:grid;gap:.2rem}
.sb-errors a{color:var(--bad);font-weight:600}

/* steps */
.sb-step{padding:1.2rem 1.1rem 1.3rem;border-radius:1.4rem;background:#fff;box-shadow:0 1px 0 var(--line),inset 0 0 0 1.5px var(--line);display:grid;gap:1rem}
.sb-step__h{display:flex;align-items:center;gap:.65rem;font:900 1.7rem/.95 'Roboto Flex',sans-serif;font-variation-settings:'wdth' 32,'opsz' 144;text-transform:uppercase}
.sb-step__n{flex:none;width:2rem;height:2rem;display:grid;place-items:center;border-radius:50%;background:var(--plum);color:var(--lime);font:900 1rem/1 'Roboto Flex';font-variation-settings:'wdth' 70}

/* fields */
.sb-field{display:grid;gap:.35rem;min-width:0}
.sb-label{display:block;font:850 1rem/1.25 'Roboto Flex',sans-serif;font-variation-settings:'wdth' 70;color:var(--plum)}
.sb-label--sub{margin-top:.2rem;font-size:.92rem}
.sb-opt{font-weight:500;color:var(--muted);font-size:.85rem;margin-left:.2rem}
.sb-input{width:100%;min-height:3rem;padding:.7rem .9rem;border:0;border-radius:.8rem;background:var(--field);box-shadow:inset 0 0 0 1.5px #d9bfce;color:var(--plum);font:400 1rem/1.4 'Roboto Flex',sans-serif;appearance:none;-webkit-appearance:none}
.sb-input::placeholder{color:#9a7a8e}
.sb-input:focus{outline:none;box-shadow:inset 0 0 0 2.5px var(--violet)}
textarea.sb-input{min-height:8rem;resize:vertical}
.sb-input[aria-invalid="true"]{box-shadow:inset 0 0 0 2.5px var(--bad);background:var(--bad-bg)}
.sb-input.is-filled{box-shadow:inset 0 0 0 1.5px #b9a3ff;background:#f6f2ff}
.sb-input.is-filled:focus{box-shadow:inset 0 0 0 2.5px var(--violet)}
.sb-from{display:inline-block;margin-left:.4rem;padding:.05rem .45rem;border-radius:999px;background:var(--lilac);color:#24104d;font:850 .72rem/1.5 'Roboto Flex';font-variation-settings:'wdth' 70;vertical-align:.1em}
.sb-help{color:var(--muted);font-size:.9rem;line-height:1.45}
.sb-help a{text-decoration:underline;text-underline-offset:2px}
.sb-help--top{margin-top:-.4rem}
.sb-err{color:var(--bad);font-weight:600;font-size:.92rem}
.sb-err:empty{display:none}
.sb-row{display:grid;gap:1rem}
.sb-sub{display:grid;gap:1rem;padding:1rem;border-radius:1rem;background:var(--blush)}
.sb-reveal{display:grid;gap:.35rem;margin-top:.5rem}

/* segmented radios and chips: real inputs, visually hidden, so keyboards and screen readers get native controls */
.sb-seg,.sb-chips{display:flex;flex-wrap:wrap;gap:.45rem}
.sb-seg label,.sb-chips label{position:relative;cursor:pointer}
.sb-seg input,.sb-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.sb-seg span,.sb-chips span{display:inline-flex;align-items:center;min-height:2.6rem;padding:0 1rem;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px #d9bfce;font:850 .95rem 'Roboto Flex';font-variation-settings:'wdth' 70;color:var(--plum);user-select:none}
.sb-chips span{min-height:2.35rem;padding:0 .85rem;font-size:.9rem}
.sb-seg input:checked+span{background:var(--plum);color:#fff;box-shadow:none}
.sb-chips input:checked+span{background:var(--lime);color:var(--on-lime);box-shadow:inset 0 0 0 1.5px #b6d65c}
.sb-chips input:checked+span::before{content:"\2713";margin-right:.35rem;font-weight:900}
.sb-seg input:focus-visible+span,.sb-chips input:focus-visible+span{outline:3px solid var(--violet);outline-offset:2px}
.sb-grp{margin-top:.2rem;font:850 .75rem 'Roboto Flex';font-variation-settings:'wdth' 70;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sb-check{display:flex;gap:.7rem;align-items:flex-start;line-height:1.45;cursor:pointer}
.sb-check input{flex:none;width:1.3rem;height:1.3rem;margin-top:.1rem;accent-color:var(--plum)}
.sb-dates{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;font-size:.9rem;color:var(--ink-2)}
.sb-dates b{font-weight:850}
.sb-date{display:inline-block;padding:.15rem .55rem;border-radius:999px;background:#fff;font:850 .82rem 'Roboto Flex';font-variation-settings:'wdth' 70}

/* poster */
.sb-file{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.sb-drop{position:relative;display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:1rem;align-items:center;padding:1rem;border-radius:1.3rem;background:#fff;box-shadow:0 18px 30px -22px rgba(62,10,46,.5),inset 0 0 0 2px transparent}
.sb-drop.is-over{box-shadow:inset 0 0 0 2px var(--violet);background:#f3ecff}
.sb-drop__frame{position:relative;aspect-ratio:4/5;border:5px solid #fff;background:#f6e2ec;box-shadow:0 14px 22px -16px rgba(36,16,77,.55);rotate:-2deg;overflow:hidden}
.sb-drop__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--plum)}
.sb-drop__empty{position:absolute;inset:0;display:grid;place-items:center;color:#d6a9c2;font-size:2rem}
.sb-drop[data-state="reading"] .sb-drop__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0 40%,rgba(212,245,122,.55) 50%,transparent 60% 100%);background-size:100% 220%;animation:sbScan 1.4s linear infinite}
@keyframes sbScan{from{background-position:0 100%}to{background-position:0 -120%}}
.sb-drop__side{display:grid;gap:.5rem;justify-items:start;min-width:0}
.sb-drop__hint{color:var(--ink-2);font-size:.92rem;line-height:1.4}
.sb-drop__status{font-weight:700;font-size:.95rem;line-height:1.4}
.sb-drop__status:empty{display:none}
.sb-drop__status.is-ok{color:#3d5a00}
.sb-skip{margin-top:.6rem;color:var(--ink-2);font-size:.92rem}
.sb-skip a{font-weight:850}

/* venue */
.sb-combo{position:relative}
.sb-combo>i{position:absolute;left:.95rem;top:1rem;color:var(--muted);pointer-events:none}
.sb-combo .sb-input{padding-left:2.5rem}
.sb-options{list-style:none;position:absolute;left:0;right:0;top:calc(100% + .35rem);z-index:20;max-height:18rem;overflow:auto;padding:.35rem;border-radius:1rem;background:#fff;box-shadow:0 18px 40px -14px rgba(36,16,77,.45),inset 0 0 0 1.5px var(--line)}
.sb-options li{display:grid;gap:.05rem;padding:.6rem .75rem;border-radius:.7rem;cursor:pointer}
.sb-options li[aria-selected="true"]{background:var(--lilac)}
.sb-options b{font-weight:850}
.sb-options small{color:var(--muted);font-size:.85rem}
.sb-venue{display:flex;gap:.75rem;align-items:center;padding:.85rem 1rem;border-radius:1rem;background:var(--lime);color:var(--on-lime)}
.sb-venue>div{flex:1;min-width:0}
.sb-venue b{display:block;font-weight:850}
.sb-venue small{font-size:.88rem}
.sb-link{color:var(--violet) !important;font-weight:850 !important;text-decoration:underline;text-underline-offset:3px;cursor:pointer;justify-self:start;font-size:.95rem}
.sb-venue .sb-link{color:var(--on-lime) !important}
.sb-link--add{display:inline-flex;gap:.45rem;align-items:center}

/* buttons */
.sb-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3rem;padding:0 1.3rem;border-radius:999px;border:0;text-decoration:none;cursor:pointer;font:850 1.05rem/1.1 'Roboto Flex',sans-serif;font-variation-settings:'wdth' 70}
.sb a.sb-btn--lime,.sb-btn--lime{background:var(--lime);color:var(--on-lime)}
.sb a.sb-btn--plum,.sb-btn--plum{background:var(--plum);color:#fff}
.sb-btn--big{min-height:3.6rem;padding:0 2rem;font-size:1.2rem;width:100%}
.sb-btn[disabled]{opacity:.65;cursor:progress}
.sb-send{display:grid;gap:.5rem;justify-items:center;text-align:center;padding:.4rem 0}

/* the checklist: what's still needed, ticking down as you go */
.sb-aside{display:grid;gap:1rem}
.sb-aside__help a{color:var(--violet)}
.sb-todo{display:none;padding:1.1rem 1.2rem 1.2rem;border-radius:1.4rem;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line)}
.sb-todo__k{color:var(--muted)}
.sb-todo__l{list-style:none;display:grid;gap:.15rem;margin:.5rem 0 .9rem}
.sb-todo__l a{display:flex;gap:.55rem;align-items:center;padding:.3rem 0;color:var(--plum);text-decoration:none;font-weight:600}
.sb-todo__l a::before{content:"";flex:none;width:.95rem;height:.95rem;border-radius:50%;box-shadow:inset 0 0 0 2px #d9bfce}
.sb-todo__l a:hover{color:var(--violet)}
.sb-todo__done{display:flex;gap:.5rem;align-items:center;font-weight:850;color:#3d5a00}
.sb-todo__go{width:100%}
.sb-todo.is-ready{box-shadow:inset 0 0 0 2px #b6d65c;background:#f8fde8}
/* phones: the same checklist as a bar on the bottom edge */
.sb-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;gap:.6rem;align-items:center;padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom));background:var(--plum);box-shadow:0 -10px 24px -14px rgba(0,0,0,.5);transition:translate .25s ease}
.sb-bar.is-away{translate:0 110%}
.sb-bar__left{flex:1;min-width:0;text-align:left;color:#fff !important;font:850 .95rem/1.2 'Roboto Flex' !important;font-variation-settings:'wdth' 70;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-bar__left b{color:var(--lime)}
.sb-bar__go{min-height:2.6rem;padding:0 1.1rem}

/* done */
.sb-done{position:relative;isolation:isolate;overflow:clip;margin-top:1.4rem;padding:1.6rem 1.3rem 1.8rem;border-radius:1.6rem;background:var(--plum);color:#fff;display:grid;gap:.8rem;justify-items:start}
.sb-done:focus{outline:none}
.sb-done__sh{right:-3rem;top:-3rem;width:10rem;height:10rem;background:var(--pink);z-index:-1}
.sb-done .sb-lbl{color:var(--lime)}
.sb-done__t{font-size:3.6rem;color:#fff}
.sb-done__ev{font-size:1.35rem;max-width:32rem}
.sb-next{list-style:none;display:grid;gap:.6rem;margin-top:.4rem;counter-reset:n;max-width:34rem}
.sb-next li{counter-increment:n;display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.7rem;align-items:start;line-height:1.45;color:#f0e2ec}
.sb-next li::before{content:counter(n);width:2rem;height:2rem;display:grid;place-items:center;border-radius:50%;background:var(--lime);color:var(--on-lime);font:900 1rem/1 'Roboto Flex'}
.sb-next b{color:#fff}
.sb-done__go{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.6rem}
.sb-done .sb-btn--plum{background:rgba(255,246,239,.12)}

/* ---------- tablet up ---------- */
@media (min-width:700px){
  .sb-wrap{padding:0 2rem}
  .sb-hero{padding:2.4rem 0 2.6rem}
  .sb-hero__t{font-size:5.6rem}
  .sb-hero__sub{font-size:1.4rem}
  .sb-hero__f{width:18rem;height:18rem;right:-4rem;bottom:-7rem}
    .sb-step{padding:1.6rem 1.7rem 1.8rem}
  .sb-step__h{font-size:2.1rem}
  .sb-row--3{grid-template-columns:1.3fr 1fr 1fr}
  .sb-row--2{grid-template-columns:1fr 1fr}
  .sb-row--2w{grid-template-columns:2fr 1fr}
  .sb-drop{grid-template-columns:9.5rem minmax(0,1fr);gap:1.3rem;padding:1.2rem}
  .sb-btn--big{width:auto}
  .sb-done{padding:2.4rem 2.4rem 2.6rem}
  .sb-done__t{font-size:5.5rem}
}
@media (min-width:1000px){
  .sb-layout{grid-template-columns:minmax(0,1fr) 19rem;gap:2rem;align-items:start}
  .sb-aside{position:sticky;top:calc(var(--bol-head-h, 72px) + 1.25rem)}
  .sb-todo{display:block}
  .sb-bar{display:none}
  .sb-hero__in{grid-template-columns:minmax(0,1fr) minmax(0,27rem);gap:3rem}
}
/* phones: the checklist is the bottom bar instead */
@media (max-width:999px){
  .sb{padding-bottom:5.5rem}
  .sb-layout{display:flex;flex-direction:column}
  .sb-form{display:contents}
  .sb-form>*{order:1}
  .sb-aside{order:2}
  .sb-form>.sb-send{order:3}
}
@media (prefers-reduced-motion:reduce){
  .sb-drop[data-state="reading"] .sb-drop__frame::after{animation:none;background:rgba(212,245,122,.35)}
}
