/* HK Regional · registration and cover authoring */
:root{--pitch:#0d0b0a;--panel:#171412;--pale:#251f1c;--stroke:#38312e;--cream:#f4eee7;--muted:#b6a99b;--ember:#ff903c;--wash:#302016;--bg:var(--pitch);--bg-2:var(--pitch);--surface:var(--panel);--surface-hi:var(--pale);--line:var(--stroke);--ink:var(--cream);--ink-dim:var(--muted);--orange:var(--ember);--accent-text:#ffa358;--accent-soft:var(--wash);--header:rgba(17,14,12,.97)}
html[data-theme="light"]{--pitch:#faf5ed;--panel:#fffdf9;--pale:#eee6dc;--stroke:#d8cbbd;--cream:#261d17;--muted:#6b5b50;--ember:#f48b3c;--wash:#fff0de;--bg:var(--pitch);--bg-2:var(--pitch);--surface:var(--panel);--surface-hi:var(--pale);--line:var(--stroke);--ink:var(--cream);--ink-dim:var(--muted);--orange:var(--ember);--accent-text:#964600;--accent-soft:var(--wash);--header:rgba(255,251,245,.97)}
.event-page{background:var(--pitch)}.event-page .layout{padding-block:48px 56px;max-width:1220px;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,80px)}
.event-page .event-intro{display:block;padding:0;top:28px}.hero-scene{position:relative}.event-intro .poster-button{width:100%;height:auto;aspect-ratio:4/3;border-radius:22px;border:0;display:block;margin:0;background:#221811}
.cover-window{position:relative;overflow:hidden;isolation:isolate}.cover-window .cover-art,.cover-window:hover .cover-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--cx,100%) var(--cy,19.8%);transform-origin:var(--cx,100%) var(--cy,19.8%);transform:scale(var(--cz,1.01));transition:none;display:block}
/* Only soften the artwork at the join; the controls stay on the next layer. */
.cover-window::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 27%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent, var(--pitch) 97%);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  --edge-mask: linear-gradient(to bottom, transparent, rgb(0 0 0 / 40%) 33%, black 85%);
  -webkit-mask-image: var(--edge-mask);
  mask-image: var(--edge-mask);
}
.cover-window > .media-loading { z-index: 4; }
.crop-window .crop-guides { z-index: 3; }
html[data-theme="light"] .poster-overlay > span:first-child { color: var(--ink); }
.hero-scene .poster-overlay{inset:0;display:flex;align-items:flex-end;justify-content:space-between;padding:0 14px 13px;color:#fff;background:none;z-index:2;pointer-events:none}.poster-overlay>span:first-child{display:block;font-size:8px;letter-spacing:.24em;opacity:.65}.poster-overlay>span:last-child{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#201915bb}.poster-overlay svg{width:19px;height:19px}

.festival-facts{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--stroke);border-radius:20px;background:var(--panel);margin:14px 0 0;padding:16px 4px;line-height:1.35}.festival-facts>div{display:grid;align-content:start;gap:5px;padding-inline:clamp(10px,2vw,22px)}.festival-facts>div+div{border-left:1px solid var(--line)}.festival-facts small,.festival-facts span{font-size:12px;color:var(--muted);font-weight:550}.festival-facts strong{font-size:19px;font-weight:800;letter-spacing:-.045em;white-space:nowrap}.festival-facts em{font-size:12px;font-style:normal;color:var(--muted);letter-spacing:0}.festival-facts .accent{color:var(--accent-text)}
.hero-notes{padding:25px 2px 0}.hero-stamp{font-size:10px;letter-spacing:.16em;color:var(--muted)}.hero-stamp b{color:var(--accent-text)}.hero-notes>p{font-size:clamp(28px,3vw,44px);font-weight:850;letter-spacing:-.045em;margin:6px 0}.hero-notes .intro-links{gap:16px;margin:0}.hero-notes .intro-links button{font-size:12px;min-height:40px}
.event-page .registration{border:0;box-shadow:none;border-radius:0;background:transparent;overflow:visible}.event-page .stepper{display:flex;align-items:center;gap:10px;margin:0;padding:0}.event-page .stepper ol{display:flex;align-items:center;width:auto;gap:0}.event-page .stepper li{width:auto;flex:0}.event-page .stepper button{display:grid;place-items:center;width:24px;height:36px;padding:0;opacity:1}.stepper button::before{content:"";width:19px;height:4px;background:var(--stroke);border-radius:4px}.stepper button[aria-current]::before,.stepper button.is-done::before{background:var(--ember)}.stepper b{font-size:13px;color:var(--muted);line-height:1.3}
.event-page .step-content{padding:6px 0 20px}.event-page .section-heading{align-items:center;margin:0 0 15px}.event-page .section-heading .section-kicker,.event-page .section-heading>.outline-icon{display:none}.event-page .section-heading h2{font-size:clamp(26px,2.7vw,36px);line-height:1.18;letter-spacing:-.045em;font-weight:850;margin:0 0 8px}.event-page .section-heading p{color:var(--muted);font-size:14px;line-height:1.5;margin:0}.section-heading p strong{color:var(--accent-text);font-weight:750}
.event-page .event-grid{gap:9px}.event-page .event-card{background:var(--panel);border:1px solid var(--stroke);border-radius:17px}.event-page .event-card:has(.event-choice input:checked){background:var(--wash);border-color:var(--ember);box-shadow:inset 0 0 0 .5px var(--ember)}.event-page .event-choice{min-height:0;display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 14px 0;position:static}.event-choice:after{content:"";position:absolute;inset:0;cursor:pointer}.event-card .event-meta button,.event-card .kids-moves{position:relative;z-index:1}.event-page .event-choice input{appearance:none;width:24px;height:24px;margin:0;border:1px solid color-mix(in srgb,var(--muted) 53%,transparent);border-radius:8px;background:transparent;display:grid;place-items:center;flex-shrink:0}.event-page .event-choice input:checked{background:var(--ember);border-color:var(--ember)}.event-page .event-choice input:checked:after{content:"";width:9px;height:5px;border:solid #21140a;border-width:0 0 2px 2px;transform:rotate(-45deg) translateY(-1px)}
.event-page .event-copy b{font-size:17px;line-height:1.3;font-weight:800;letter-spacing:-.035em}.event-copy i{font-size:11px;white-space:nowrap;font-style:normal;background:color-mix(in srgb,var(--success) 12%,var(--panel));color:var(--success);border-radius:6px;padding:2px 6px;margin-left:6px;vertical-align:middle}.event-page .event-price{font-size:24px;line-height:1.15;font-weight:800;letter-spacing:-.05em}.event-page .event-price small{font-size:11px;font-weight:650;letter-spacing:0;margin:0 2px;color:var(--ink-dim)}
.event-page .event-meta{display:flex;align-items:center;min-height:34px;padding:0 14px 5px 50px;font-size:13px;line-height:1.45;gap:8px}.event-page .event-meta>span{max-width:none}.event-page .event-meta button{min-height:32px;font-size:12px;color:var(--ink-dim);padding:2px 0 2px 8px}.event-page .event-meta button:hover{color:var(--accent-text)}.event-page .selection-note{margin-top:16px;font-size:12px;color:var(--muted)}
.event-page .form-footer{position:sticky;bottom:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--header);border-radius:0;border-top:1px solid var(--line);padding:12px 0;backdrop-filter:blur(16px)}.event-page .total-line{display:grid;justify-content:start;align-content:center;align-items:start;gap:0;margin:0;min-height:48px;text-align:left;background:none;border:0;color:var(--ink);padding:0}.total-line #selection-count{font-size:12px;color:var(--muted)}.total-values{display:flex;gap:8px;align-items:baseline;line-height:1.15}.total-values>strong{font-size:31px;font-weight:850;letter-spacing:-.06em;font-variant-numeric:tabular-nums}.total-values>strong small{font-size:13px;font-weight:650;letter-spacing:-.03em}.total-values #footer-saving{font-size:12px;font-weight:700;color:var(--accent-text)}.event-page .footer-actions{display:flex;gap:6px;flex-shrink:0}.event-page .footer-actions .primary-button{min-height:52px;border-radius:15px;font-size:15px;padding:12px 19px;gap:12px}.event-page .footer-actions .primary-button:disabled{background:var(--pale);color:var(--muted);cursor:not-allowed}.event-page .back-button{width:42px;min-width:0;padding:0;justify-content:center}
.event-page .form-section,.event-page .review-card,.event-page .consents{border-color:var(--stroke);background:var(--panel);border-radius:17px}.event-page .field input,.event-page .field select{background:var(--pitch);border-color:var(--stroke);border-radius:11px}.event-page .field input:focus,.event-page .field select:focus{border-color:var(--ember)}.event-page .payment-choice{border-radius:14px;background:var(--panel)}.event-page .payment-choice:has(input:checked){background:var(--wash);border-color:var(--ember)}.event-page .payment-total,.event-page .demo-ticket{border-radius:15px}.event-page .form-bottom{margin-top:8px}
@media(max-width:999px){.event-page .layout{display:block;width:min(100%,780px);padding:0 0 20px}.event-page .event-intro{position:static}.event-intro .poster-button{aspect-ratio:4/3;border-radius:0 0 18px 18px}.festival-facts{margin:0 22px}.hero-notes{display:none}.event-page .registration{padding:18px 22px 0}.event-page .form-footer{padding:12px 22px calc(12px + env(safe-area-inset-bottom));margin-inline:-22px}.event-page .event-meta{padding-bottom:7px}.event-page .event-choice{padding-top:14px}}
@media(max-width:700px){.event-page .layout{width:100%;margin:0}.event-intro .poster-button{aspect-ratio:4/3;border-radius:0}.festival-facts{margin:0 18px;padding-block:14px}.festival-facts>div{padding-inline:13px}.festival-facts strong{font-size:18px}.event-page .registration{padding:19px 18px 0}.event-page .form-footer{position:fixed;left:0;right:0;margin:0;padding:10px 18px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -4px 18px #0001}.event-page .step-content{padding-top:4px}.event-page .section-heading h2{font-size:25px}.event-page .event-choice{padding-top:12px}.event-page .event-meta{min-height:35px;padding-bottom:5px}.event-page .form-bottom{padding:18px 0}.event-page .total-values>strong{font-size:30px}.event-page .section-heading p{font-size:14px}.event-page .event-copy b{font-size:16px}}
@media(max-width:360px){.festival-facts{margin-inline:12px}.festival-facts>div{padding-inline:9px}.event-page .registration{padding-inline:13px}.event-page .event-choice{gap:8px;padding-inline:10px}.event-page .event-meta{padding-left:42px;padding-right:10px}.event-copy i{font-size:10px;margin-left:3px}.event-page .event-price{font-size:21px}.event-page .footer-actions .primary-button{padding-inline:13px}}
.preview-page .preview-heading h1{font-weight:820}.preview-page .preview-actions{flex-wrap:wrap;align-items:center}.preview-page .edit-link{color:var(--accent-text)}.preview-page .device-switch button[aria-pressed="true"]{background:var(--wash);color:var(--accent-text);border-color:var(--ember)}.preview-page .preview-stage{background:var(--panel)}.preview-page .open-form{white-space:nowrap}
.editor-page{min-height:100dvh;background:var(--pitch)}.editor-bar,.editor-main{width:min(calc(100% - 40px),1100px);margin:auto}.editor-bar{display:flex;align-items:center;gap:18px;padding-block:18px;border-bottom:1px solid var(--stroke)}.editor-bar>a:nth-child(2){margin-left:auto;font-size:12px;color:var(--accent-text)}.editor-main{padding:38px 0 60px}.editor-heading h1{margin:9px 0 5px;font-size:clamp(28px,4vw,44px);font-weight:850;letter-spacing:-.05em}.editor-heading>p:last-child,.crop-caption,.crop-actions p{color:var(--muted);font-size:14px}.crop-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,.85fr);align-items:start;gap:22px;margin-top:22px}.crop-studio,.crop-controls{background:var(--panel);border:1px solid var(--stroke);border-radius:19px;padding:20px}.crop-toolbar,.crop-tabs{display:flex;align-items:center;gap:8px}.crop-toolbar{justify-content:space-between}.crop-toolbar>span{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}.crop-tabs button,.crop-preview{padding:8px 15px;background:var(--pitch);border:1px solid var(--stroke);border-radius:24px;min-height:42px;color:var(--ink);font-size:13px;font-weight:650}.crop-tabs button[aria-pressed=true]{color:var(--accent-text);background:var(--wash);border-color:var(--ember)}.crop-mat{display:grid;place-items:center;padding:16px 0 8px}.crop-window{width:100%;max-width:640px;background:#241a14;aspect-ratio:4/3;cursor:grab;touch-action:none;user-select:none;border-radius:9px}.crop-window:active{cursor:grabbing}.crop-window img{pointer-events:none}.crop-guides,.crop-overlay{position:absolute;inset:0;pointer-events:none}.crop-guides{background:linear-gradient(90deg,transparent calc(33.33% - .5px),#ffffff48 33.33%,transparent calc(33.33% + .5px),transparent calc(66.67% - .5px),#ffffff48 66.67%,transparent calc(66.67% + .5px)),linear-gradient(0deg,transparent calc(33.33% - .5px),#ffffff48 33.33%,transparent calc(33.33% + .5px),transparent calc(66.67% - .5px),#ffffff48 66.67%,transparent calc(66.67% + .5px))}.crop-overlay{background:none;z-index:2;color:white}.crop-expand{position:absolute}.crop-expand{bottom:10px;right:10px;font-size:22px}.crop-caption{margin-top:6px;font-size:12px}.crop-controls h2{margin:4px 0 18px;letter-spacing:-.035em;font-size:24px}.crop-controls label{display:grid;grid-template-columns:1fr auto;align-items:center;font-size:14px;font-weight:650;margin-bottom:11px}.crop-controls label output{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.crop-controls input[type=range]{grid-column:1/-1;accent-color:var(--ember);width:100%;min-height:32px;cursor:pointer}.crop-reset,.crop-actions>a:last-of-type{color:var(--accent-text);font-size:13px;min-height:36px}.crop-actions{border-top:1px solid var(--stroke);margin-top:14px;padding-top:16px;display:grid;gap:10px}.crop-preview{text-align:center;line-height:24px}.crop-actions p,.crop-actions #editor-status{font-size:12px;line-height:1.6}.crop-actions #editor-status:empty{display:none}.crop-actions .primary-button{background:var(--ember);color:#21140a}.crop-reset{justify-self:start}.editor-page .media-loading button{background:var(--pitch);color:var(--ink);border-radius:10px;padding:12px}
@media(max-width:780px){.crop-layout{grid-template-columns:1fr;gap:14px}.editor-main{padding-block:24px}.crop-studio,.crop-controls{padding:15px}.crop-mat{padding-top:12px}.editor-bar,.editor-main{width:calc(100% - 32px)}.editor-bar{gap:10px}.editor-bar .brand span{font-size:14px}}
.event-page .stepper li{flex:0 0 24px;width:24px}
.crop-expand{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#201915bb}

/* Shared glass layer for the public cover and the framing tool. */
.hero-scene, .crop-window {
  container-type: inline-size;
}
.cover-topbar {
  position: absolute;
  inset: 0 0 auto;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  height: clamp(54px, 17cqi, 82px);
  padding: clamp(4px, 1.2cqi, 8px) clamp(12px, 4.1cqi, 22px) 0;
  pointer-events: none;
}
.hero-scene .cover-topbar { border-radius: 22px 22px 0 0; }
.cover-topbar::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(105deg, rgb(130 60 24 / 65%), rgb(125 61 25 / 57%) 55%, rgb(110 45 19 / 52%));
  box-shadow: inset 0 1px rgb(255 218 175 / 9%);
  -webkit-backdrop-filter: blur(5px) saturate(108%);
  backdrop-filter: blur(5px) saturate(108%);
  --glass-fade: linear-gradient(to bottom, black 0%, black 36%, rgb(0 0 0 / 65%) 65%, transparent 100%);
  -webkit-mask-image: var(--glass-fade);
  mask-image: var(--glass-fade);
  pointer-events: none;
}
@media (prefers-reduced-transparency: reduce) {
  .cover-topbar::before {
    background: linear-gradient(to bottom, #61331f 55%, transparent);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
.cover-studio-slot {
  align-self:flex-start;
  min-height:44px;
  color:#fff9f0;
  text-shadow:0 1px 4px rgb(0 0 0 / 42%);
}
.cover-studio-slot img { width:32px; height:32px; flex:none; }
.cover-studio-link { pointer-events: auto; }
@media (max-width: 999px) {
  .hero-scene .cover-topbar { border-radius: 0; }
}

/* Athlete details */
#step-2 .section-heading { align-items:flex-start; gap:8px; margin-bottom:26px; }
#step-2 .section-heading h2 { margin-bottom:6px; }
#sample-fill { display:inline-flex; align-items:center; gap:5px; min-height:36px; padding:2px 0; color:var(--accent-text); flex:none; }
#sample-fill svg { width:14px; height:14px; }
#step-2 .form-section { padding:0; background:transparent; border:0; border-radius:0; }
#step-2 .form-section + .form-section { padding-top:21px; margin-top:23px; border-top:1px solid var(--line); }
#step-2 .form-section h3 { margin:0 0 15px; }
#step-2 .athlete-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 10px; }
#step-2 .field.span-2 { grid-column:1/-1; }
#step-2 .field { gap:7px; }
#step-2 .field > input, #step-2 .field > select:not(.liquid-select__native), #step-2 .phone-field, #step-2 .liquid-select__trigger {
  border:1px solid var(--stroke); border-radius:12px; background:var(--panel); min-height:46px;
}
#step-2 .field input:focus, #step-2 .phone-field:focus-within, #step-2 .liquid-select.is-open .liquid-select__trigger { border-color:var(--ember); }
#step-2 .athlete-fields { --athlete-input-height:max(50px,3.125rem); }
#step-2 .athlete-fields > .field > input { height:var(--athlete-input-height); }
#step-2 .athlete-fields .dob-field {
  display:grid; grid-template-columns:minmax(0,1fr); align-content:start;
}
.dob-field > span:first-child { grid-area:1 / 1; }
.dob-field > #dob, .dob-field > #dob-hint { grid-area:2 / 1; }
#step-2 .dob-field > .tl-field-feedback {
  grid-area:3 / 1; color:var(--error); font-size:12px; line-height:1.4;
  position:static !important; width:auto !important; height:auto !important; margin:0 !important;
  overflow:visible !important; clip-path:none !important; white-space:normal !important;
}
#step-2 #dob {
  /* Native iOS appearance forces content-box and adds padding beyond the grid column. */
  -webkit-appearance:none; appearance:none; box-sizing:border-box;
  width:100%; min-width:0; max-width:100%; color-scheme:dark;
}
#dob-hint { display:none; }
@media (pointer:coarse) {
  .dob-field:not(:focus-within) #dob-hint:not([hidden]) {
    display:block; pointer-events:none; align-self:center; justify-self:start;
    z-index:1; margin-inline-start:13px; color:var(--muted); background:var(--panel); font-size:14px; font-weight:400;
  }
  .dob-field:has(#dob-hint:not([hidden])) #dob:not(:focus) { color:transparent; }
}
#step-2 .phone-field { display:flex; align-items:center; gap:0; padding-inline:4px; }
#step-2 .phone-field > :is(select,input) { min-height:44px; border:0; border-radius:8px; background:transparent; }
#step-2 .phone-field > select { width:8rem; padding-inline:8px; font-size:14px; }
#step-2 .phone-field > input { flex:1; min-width:0; padding-left:7px; }
.event-page { --surface-rgb:255,246,233; --shade-rgb:12,8,6; --orange-soft:var(--wash); --orange-hi:var(--accent-text); --ink-faint:var(--muted); --glass:var(--panel); --glass-border-hi:var(--stroke); --glass-hi:var(--pale); }
#step-2 .liquid-select__trigger { height:46px; font:inherit; font-size:16px; font-weight:500; }
#step-2 .liquid-select .liquid-select__native { width:1px; height:1px; min-height:0; padding:0; border:0; }
#step-2 .guardian-fields { --control-height:max(50px,3.125rem); row-gap:18px; }
#step-2 .guardian-fields > .field { min-width:0; }
#guardian-same-row { grid-column:1/-1; margin:0; padding-block:0; }
#step-2 .guardian-fields :is(#guardianName,.field > .liquid-select > button,.phone-field) { height:var(--control-height); }
#step-2 .phone-field > .liquid-select { flex:0 0 8rem; min-width:0; }
#step-2 .phone-field .liquid-select__trigger { min-height:44px; height:44px; padding-inline:8px; gap:5px; border:0; box-shadow:none; background:transparent; }
@media (min-width:821px) {
  #step-2 #emergency-fields { grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); }
}
.event-page .liquid-select__menu { background:linear-gradient(150deg,#30211a,#1c1816 65%); }
@media(max-width:999px) {
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .layout { background:
    linear-gradient(180deg,transparent,var(--pitch) 174px),
    linear-gradient(105deg,#a94915,#773311 55%,#492318); }
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .event-intro :is(.poster-button,.festival-facts,.hero-notes) { display:none; }
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .hero-scene { height:62px; }
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .cover-topbar::before { content:none; }
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .registration { padding-top:0; }
  .event-page:is([data-entry-step="2"],[data-entry-step="3"],[data-entry-step="4"]) .form-footer .back-button { min-width:44px; min-height:48px; border:1px solid var(--stroke); border-radius:13px; background:var(--panel); }
}

/* Event-specific rule sheets share the same modal as the information dialogs. */
#info-dialog.rule-sheet[open] {
  display:flex; flex-direction:column; overflow:hidden; width:min(520px,calc(100vw - 32px));
  max-height:min(88dvh,870px); background:linear-gradient(165deg,#45271a 0,#291b14 31%,#151210 58%);
  color:var(--ink); border:1px solid #45352c;
}
.rule-sheet::backdrop { background:rgb(8 6 5 / 62%); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); }
.rule-sheet .dialog-header { flex:none; align-items:flex-start; background:transparent; border:0; padding:26px 22px 15px; }
.rule-sheet .dialog-header .section-kicker { font-size:12px; color:var(--accent-text); letter-spacing:.06em; font-weight:700; }
.rule-sheet .dialog-header h2 { font-size:26px; margin:4px 0; line-height:1.24; font-weight:800; }
#rule-english { margin:4px 0 0; font-size:14px; color:var(--muted); }
.rule-sheet #close-dialog { border:0; background:rgb(255 235 213 / 10%); border-radius:50%; color:var(--ink); width:40px; height:40px; }
.rule-sheet .dialog-content { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 22px 18px; font-size:14px; line-height:1.8; }
.rule-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:15px 0; border-block:1px solid rgb(255 236 217 / 12%); }
.rule-stats > div { display:grid; gap:1px; align-content:start; padding:0 10px; }
.rule-stats > div:first-child { padding-left:0; }
.rule-stats > div + div { border-left:1px solid rgb(255 236 217 / 13%); }
.rule-stats strong { line-height:1.45; font-size:clamp(15px,4.3vw,19px); }
.rule-stats span, .trick-score h3 small { font-size:12px; color:var(--muted); }
.rule-sheet .trick-score { padding:17px 0; border-bottom:1px solid var(--line); }
.rule-sheet .trick-score h3 { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin:0 0 9px; font-size:14px; color:var(--muted); }
.trick-score h3 small { font-weight:500; }
.score-letters { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; margin-bottom:10px; }
.score-letters b { display:grid; place-items:center; min-height:47px; border:1px solid #a96632; border-radius:10px; color:var(--ember); font-size:22px; }
.score-letters b:last-child { background:var(--entry-action-fill); color:#22150a; }
.rule-rows { margin:0; }
.rule-rows > div { display:grid; grid-template-columns:56px 1fr; gap:11px; padding:15px 0; border-bottom:1px solid rgb(255 236 217 / 11%); }
.rule-rows dt { font-weight:700; color:var(--accent-text); }
.rule-rows dd, .rule-rows p { margin:0; }
.rule-sheet .rule-rows p + p { margin-top:3px; }
.rule-note { display:flex; align-items:baseline; gap:8px; margin:12px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.rule-note svg { width:15px; height:15px; flex:none; align-self:flex-start; margin-top:2px; }
#rule-footer { flex:none; padding:12px 21px max(14px,env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#13100e; }
#rule-footer .primary-button { width:100%; min-height:54px; font-size:16px; border-radius:15px; }
@media(max-width:650px) {
  #info-dialog.rule-sheet[open] { width:100%; max-height:89dvh; margin:auto 0 0; border-radius:23px 23px 0 0; border-bottom:0; }
  .rule-sheet .dialog-header::before { content:""; position:absolute; width:40px; height:5px; border-radius:5px; background:#786456; top:8px; left:50%; transform:translateX(-50%); }
  .rule-sheet .dialog-header { padding-top:26px; }
}
#info-dialog.rule-sheet[open] { animation:none; }
@media (prefers-reduced-motion:no-preference) {
  .rule-sheet::backdrop { opacity:1; transition:opacity .2s ease; }
  .rule-sheet.is-closing::backdrop { opacity:0; }
  @starting-style { .rule-sheet[open]::backdrop { opacity:0; } }
}

/* Orange action surfaces are shared by every step and the rule sheet. */
.event-page {
  --entry-action-fill: linear-gradient(110deg,#ffb051 0%,#ff983a 50%,#ff852a 100%);
  --entry-glow: 0 3px 9px rgb(255 128 30 / 22%), 0 5px 20px rgb(255 122 25 / 29%);
  --entry-glow-hover: 0 3px 10px rgb(255 144 35 / 32%), 0 5px 23px rgb(255 128 26 / 40%);
}
html[data-theme="dark"] .event-page {
  --ember: #ff9e39;
  --orange: var(--ember);
  --accent-text: #ffb561;
  --focus: #ffc67b;
  --wash: #3a2417;
  --accent-soft: var(--wash);
}
.event-page .primary-button:enabled {
  background: var(--entry-action-fill);
  color: #211307;
  box-shadow: inset 0 1px 0 rgb(255 231 187 / 42%), var(--entry-glow);
  transition: box-shadow .18s ease, transform .16s ease;
}
@media (hover:hover) {
  .event-page .primary-button:enabled:hover {
    box-shadow: inset 0 1px 0 rgb(255 238 206 / 54%), var(--entry-glow-hover);
  }
}
.event-page .primary-button:enabled:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}
.event-page .primary-button:enabled:active {
  box-shadow: inset 0 1px 2px rgb(115 55 0 / 24%), 0 2px 8px rgb(255 126 25 / 22%);
}
.event-page .primary-button:disabled { box-shadow:none; }
@media (prefers-reduced-motion:reduce) {
  .event-page .primary-button { transition:none; }
}

/* The mobile action bar sticks to the viewport until its normal place at the end of the form. */
@media (max-width:700px) {
  html:has(.event-page), .event-page { overscroll-behavior-y:none; }
  .event-page .layout { display:flex; flex-direction:column; align-items:stretch; min-height:100dvh; padding-bottom:0; }
  .event-page .registration, .event-page #entry-form:not([hidden]) { display:flex; flex-direction:column; flex:1 0 auto; }
  .event-page .form-footer {
    flex:none; margin-top:auto;
    position:sticky; inset:auto auto 0;
    margin-inline:calc(-1 * var(--entry-gutter));
    padding-inline:var(--entry-gutter);
    padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));
  }
  .event-page .registration { --entry-gutter:18px; padding-inline:var(--entry-gutter); }
  #step-2 .athlete-fields > .field { grid-column:auto; min-width:0; }
  #step-2 .athlete-fields input { min-width:0; width:100%; }
}
@media (max-width:360px) {
  .event-page .registration { --entry-gutter:13px; }
}
.script-toggle {
  pointer-events:auto; display:inline-flex; align-items:center; justify-content:center;
  align-self:flex-start; min-height:44px; min-width:64px; gap:5px; padding:0 8px;
  border:0; border-radius:12px; background:transparent; color:#fff9f0;
  font:600 14px/1 system-ui,sans-serif; cursor:pointer; text-shadow:0 1px 5px #301408;
}
.script-toggle:hover,.script-toggle:focus-visible { background:#32180d80; }
.script-toggle .script-divider { opacity:.5; }
.script-toggle[aria-pressed="false"] [lang="zh-Hans"], .script-toggle[aria-pressed="true"] [lang="zh-Hant"] { opacity:.65; }
.script-toggle[aria-pressed="false"] [lang="zh-Hant"], .script-toggle[aria-pressed="true"] [lang="zh-Hans"] { text-decoration:underline; text-underline-offset:4px; }

/* Review and payment use the same inset and type scale as the athlete form. */
#step-3, #step-4 {
  --card-inset:clamp(15px,2.7vw,22px);
  --card-edge:1px solid var(--stroke);
}
#step-3 :is(.review-card,.consents), #step-4 #manual-proof {
  padding:var(--card-inset);
  border:var(--card-edge);
  background:var(--panel);
  border-radius:17px;
}
#step-3 .review-card { margin:0 0 12px; }
#step-3 .review-card-head {
  min-height:35px;
  margin:0 0 13px;
  padding:0 0 10px;
  border-color:var(--stroke);
}
#step-3 .review-card-head h3, #proof-heading, #payment-options legend { font-size:16px; font-weight:700; }
#step-3 .review-card-head .text-button { min-height:36px; padding:4px 0 4px 8px; }
#step-3 .review-tag {
  color:var(--muted);
  padding:2px 8px;
  border:1px solid var(--stroke);
  border-radius:20px;
  font-size:11px;
}
#step-3 .summary-grid { gap:14px 12px; }
#step-3 .summary-grid dt { font-size:12px; }
#step-3 .summary-grid dd { font-size:14px; }
#order-summary .price-row { align-items:baseline; padding:7px 0; font-size:14px; }
#order-summary .price-row strong { font-variant-numeric:tabular-nums; }
#order-summary .price-row.total { margin:8px 0 0; padding:12px 0 0; }
#order-summary .price-row.total strong { font-size:clamp(23px,5vw,28px); }
#step-3 .review-card .quiet-note { margin:8px 0 0; color:var(--muted); font-size:12px; }
#step-3 .consents { margin:0; }
#step-3 .consent-links { display:grid; gap:0; margin:0 0 12px; }
#step-3 .terms-link {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-height:42px; padding:8px 0; border-bottom:var(--card-edge); font-size:13px;
}
#step-3 .terms-link[hidden] { display:none; }
#step-3 .consent { align-items:flex-start; padding:6px 0; font-size:13px; line-height:1.7; }
#step-3 .media-permission { margin-top:14px; padding-top:4px; }
#step-3 .media-permission summary { padding:9px 0 2px; min-height:38px; color:var(--ink); font-size:13px; }
#step-3 .media-permission summary small { color:var(--accent-text); margin-inline-start:6px; }
#step-4 .payment-total {
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:0 12px;
  margin:0 0 18px; padding:14px var(--card-inset);
  border:1px solid color-mix(in srgb,var(--ember) 31%,var(--stroke));
  background:linear-gradient(120deg,var(--wash),var(--panel));
}
#payment-total-label { color:var(--muted); font-size:13px; }
#step-4 .payment-total > strong { grid-column:2; grid-row:1/3; white-space:nowrap; font-variant-numeric:tabular-nums; }
#step-4 .payment-total .text-button { justify-self:start; margin:0; min-height:32px; padding:3px 0; }
#payment-options { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
#payment-options legend { padding:0; margin-bottom:10px; }
#payment-options .payment-choice { min-width:0; min-height:65px; padding:12px; gap:9px; font-size:13px; }
#payment-options .payment-choice > span:last-child { min-width:0; line-height:1.4; }
#payment-options .payment-choice small { margin-top:2px; font-size:11px; }
#payment-options .payment-choice:last-child:nth-of-type(odd) { grid-column:1/-1; }
#payment-options .payment-choice:has(input:focus-visible) { outline:2px solid var(--focus); outline-offset:2px; }
#step-4 .payment-detail { min-width:0; padding:12px 0 0; }
#step-4 .payment-placeholder {
  display:block; padding:var(--card-inset); background:var(--panel);
  border:var(--card-edge); border-radius:15px;
}
#step-4 .payment-instruction-head { display:flex; align-items:center; gap:9px; margin-bottom:8px; }
#step-4 .payment-instruction-head .payment-icon {
  display:grid; place-items:center; flex:none; width:30px; height:30px;
  border-radius:9px; background:var(--pale); color:var(--accent-text);
}
#step-4 .payment-instruction-head svg { width:17px; height:17px; }
#step-4 .payment-instruction-head h4 { margin:0; font-size:15px; line-height:1.4; }
#step-4 .payment-placeholder p { font-size:13px; line-height:1.65; }
#step-4 .currency-note { margin:10px 0 0; }
#step-4 .alipay-code a { margin-inline:auto; }
#step-4 .alipay-code figcaption { text-align:center; }
#step-4 #manual-proof { margin:12px 0 0; }
#proof-heading { display:flex; align-items:center; gap:8px; margin:0; }
#proof-heading svg { width:18px; height:18px; color:var(--accent-text); }
#manual-proof .section-helper { margin:4px 0 14px; font-size:12px; line-height:1.5; }
#step-4 .upload-zone {
  padding:16px 12px; display:grid; grid-template-columns:40px minmax(0,1fr);
  align-items:center; gap:2px 12px; text-align:start; background:var(--pitch);
}
#step-4 .upload-zone .upload-icon { grid-row:1/3; width:40px; height:40px; }
#step-4 .upload-zone > strong { align-self:end; font-size:14px; }
#step-4 .upload-zone > span:last-child { align-self:start; font-size:11px; }
#step-4 .file-preview { background:var(--pitch); }
#step-4 .file-preview strong { overflow-wrap:anywhere; }
#step-4 #manual-proof > .check-line { padding:14px 0 0; font-size:13px; }
#step-4 #manual-status {
  border-top:var(--card-edge); margin:13px 0 0; padding:12px 0 0;
  background:transparent; border-radius:0; line-height:1.55;
}
@media(max-width:360px) {
  #payment-options .payment-choice { padding:10px 8px; gap:6px; }
}

/* Payment marks keep the source artwork and its original proportions. */
#payment-options .payment-icon:has(.method-mark),
#step-4 .payment-instruction-head .payment-icon:has(.method-mark) {
  width:auto; height:auto; flex:none; padding:0; background:transparent;
}
.method-mark { display:block; width:auto; height:29px; object-fit:contain; }
.payment-icon.wallet .method-mark { height:31px; margin:3px; }
#alipay-region-field:not([hidden]) { margin:16px 0 2px; }
#alipay-region-field .liquid-select__trigger { background:var(--panel); font-size:15px; }
/* Display the HK code with its white margin; the link opens the full original photo. */

.apple-wallet-frame { display:block; width:100%; height:100px; margin-top:12px; border:0; }

/* Keep the brand artwork intact within a rounded tile in both payment views. */
.method-mark { border-radius:7px; }
.payment-icon.wallet .method-mark { border-radius:5px; }
.live-pay-code { display:block; width:min(100%,240px); height:auto; margin:12px auto 0; }
.alipay-qr-image, #step-4 .alipay-code a {
  width:min(100%,240px,54dvh);
  scroll-margin-block:12px calc(82px + env(safe-area-inset-bottom,0px));
}
.payment-placeholder > :is(strong,.primary-button) { display:block; width:fit-content; margin:10px 0; white-space:pre-line; }
.live-wallet-frame { width:100%; height:150px; display:block; border:0; border-radius:12px; background:#171412; }
#complete-panel .primary-button { display:inline-flex; margin:8px 4px; }

/* Apple Pay stays inside the selected method on step four. */
.event-page.has-event-wallet #next { display:none; }
.event-inline-wallet { width:100%; min-width:0; }
.event-inline-wallet [role="status"]:empty { display:none; }
.event-inline-wallet [role="status"] { margin:8px 0; color:var(--ink-dim); }
.event-inline-wallet .primary-button { margin:4px 0 8px; }
.event-inline-wallet .live-wallet-frame { min-height:90px; border:0; }

/* The receipt uses the full form column, including when the page restores a saved receipt. */
.event-page.has-entry-receipt {
  --receipt-gutter:clamp(14px,3.8vw,20px);
  background:linear-gradient(180deg,transparent,var(--pitch) 204px),linear-gradient(110deg,#79380f,#622a11 62%,#37190e);
}
.event-page.has-entry-receipt .layout {
  display:flex; flex-direction:column; align-items:stretch; width:min(100%,680px); max-width:none;
  min-height:100dvh; margin:0 auto; padding:0; gap:0; background:transparent;
}
.has-entry-receipt .event-intro { position:static; padding:0; }
.has-entry-receipt .event-intro :is(.poster-button,.festival-facts,.hero-notes),
.has-entry-receipt .stepper, .has-entry-receipt .cover-studio-link > * { display:none; }
.event-page.has-entry-receipt .hero-scene { height:68px; }
.has-entry-receipt .hero-scene .cover-topbar { height:68px; align-items:center; padding:0 var(--receipt-gutter); border-radius:0; }
.has-entry-receipt .hero-scene .cover-topbar::before { content:none; }
.has-entry-receipt .cover-studio-link { align-self:center; min-width:104px; min-height:44px; }
.has-entry-receipt .cover-studio-link::before {
  content:""; display:block; width:104px; height:32px;
  background:url("assets/studio-mark-cover.webp") left center/31px auto no-repeat,
    linear-gradient(#ead5bd88,#ead5bd88) 42px center/1px 17px no-repeat,
    url("assets/studio-script-white.webp") right center/50px auto no-repeat;
}
.event-page.has-entry-receipt .registration { display:flex; flex:1; flex-direction:column; padding:0; border:0; background:transparent; }
.has-entry-receipt #complete-panel { display:flex; flex:1; flex-direction:column; margin:0; padding:0; border:0; text-align:start; background:transparent; }
.receipt-view { display:flex; flex:1; flex-direction:column; min-width:0; min-height:calc(100dvh - 68px); padding-inline:var(--receipt-gutter); color:var(--cream); }
.receipt-progress { display:flex; align-items:center; gap:13px; margin-top:23px; color:var(--accent-text); font-size:13px; }
.receipt-progress > span { display:flex; gap:5px; }
.receipt-progress i { display:block; width:19px; height:3px; border-radius:4px; background:var(--ember); }
.receipt-heading { display:flex; align-items:center; gap:16px; margin:27px 0 26px; }
.receipt-seal { display:grid; flex:0 0 58px; height:58px; place-items:center; border:1.5px solid #bd691e; border-radius:50%; background:#352012; color:var(--accent-text); }
.receipt-seal svg { width:24px; height:24px; stroke-width:2.8; }
.receipt-view .receipt-heading h2 { margin:0; font-size:clamp(27px,7.3vw,34px); line-height:1.25; letter-spacing:-.035em; }
.receipt-heading p { margin:5px 0 0; color:var(--muted); font-size:15px; line-height:1.55; }
.receipt-card { padding:19px 17px 0; background:var(--panel); border:1px solid var(--stroke); border-radius:17px; }
.receipt-card > p,.receipt-next h3,.receipt-card dt { margin:0; color:var(--muted); font-size:14px; font-weight:650; }
.receipt-reference { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:5px 12px; margin:-3px 0 16px; }
.receipt-reference strong { min-width:0; overflow-wrap:anywhere; user-select:all; font-size:clamp(18px,5.2vw,23px); line-height:1.3; letter-spacing:.01em; }
.receipt-copy { display:inline-flex; margin-left:auto; min-height:40px; padding:8px 12px; gap:5px; align-items:center; border-radius:10px; background:var(--pale); color:var(--accent-text); font-size:14px; font-weight:650; }
.receipt-copy svg { width:15px; height:15px; }
.receipt-card dl { margin:0; }
.receipt-card dl > div { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:56px; padding:10px 0; border-top:1px solid var(--stroke); }
.receipt-card dd { margin:0; text-align:end; font-weight:750; font-size:16px; overflow-wrap:anywhere; }
.receipt-status { display:flex; align-items:center; gap:7px; color:#ffb777; }
.receipt-status::before { content:""; width:8px; height:8px; flex:none; border-radius:50%; background:currentColor; }
.receipt-status.is-paid { color:#93d9b3; }
.receipt-amount strong { font-size:21px; }
.receipt-amount small { color:var(--muted); font-size:13px; }
.receipt-next { margin:25px 0 32px; }
.receipt-next ol { margin:13px 0 0; padding:0; list-style:none; counter-reset:receipt-step; }
.receipt-next li { position:relative; counter-increment:receipt-step; padding:3px 0 20px 47px; }
.receipt-next li:last-child { padding-bottom:0; }
.receipt-next li::before { content:counter(receipt-step); position:absolute; left:0; top:0; z-index:1; display:grid; place-items:center; width:32px; height:32px; box-sizing:border-box; border-radius:50%; background:linear-gradient(130deg,#ffab51,#ea741e); color:#21150d; font-weight:750; }
.receipt-next li:not(:last-child)::after { content:""; position:absolute; inset:34px auto 0 15px; width:1px; background:var(--stroke); }
.receipt-next .is-waiting::before { border:2px solid #534941; color:var(--muted); background:var(--pitch); }
.receipt-next h4 { margin:0; font-size:18px; font-weight:750; }
.receipt-next p { margin:2px 0 0; color:var(--muted); font-size:15px; line-height:1.6; }
.receipt-next a,.receipt-next .receipt-review,.receipt-demo-link { display:inline-block; padding:4px 0; color:var(--accent-text); font-size:16px; font-weight:700; }
.receipt-next .payment-placeholder { margin:4px 0; padding:0; border:0; background:transparent; }
.receipt-next .live-pay-code { margin:8px 0; }
.receipt-feedback { margin:0 0 12px; font-size:14px; color:var(--muted); }
.receipt-actions {
  position:sticky; bottom:0; z-index:3; margin:auto calc(-1 * var(--receipt-gutter)) 0;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;
  padding:13px var(--receipt-gutter) calc(24px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--stroke); background:var(--pitch);
}
.receipt-actions button { min-height:55px; padding:9px 6px; border-radius:16px; font-size:clamp(14px,3.65vw,17px); font-weight:750; line-height:1.35; }
.receipt-new { border:1px solid #49403a; background:#25201d; color:var(--cream); }
.receipt-check { background:linear-gradient(110deg,#ffa546,#f17b29); color:#201106; box-shadow:0 3px 19px #e87a2825; }
.receipt-check:disabled { opacity:.8; }

.has-entry-receipt .script-toggle { align-self:center; padding-inline:3px; font-size:16px; }
.receipt-preview-data { margin:12px 0; color:var(--muted); font-size:14px; }
.receipt-preview-data summary { cursor:pointer; }

.cover-tools { display:flex; align-items:center; gap:4px; pointer-events:auto; }
.currency-picker { position:relative; display:inline-flex; align-items:center; gap:4px; min-height:40px; padding:0 6px; color:#fff8ef; font:650 13px/1 system-ui,sans-serif; text-shadow:0 1px 5px #301408; }
.currency-picker select { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; font-size:16px; }
.currency-picker:focus-within { outline:2px solid var(--ember); outline-offset:0; border-radius:8px; }
.currency-picker:has(select:disabled) { opacity:.75; }
#currency-guidance { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.55; }
#rate-source,#rate-retry { color:var(--accent-text); }
.has-entry-receipt #currency-guidance { display:none; }
@media(max-width:380px){.cover-tools{gap:0}.cover-tools .script-toggle{padding-inline:4px}.cover-studio-link{gap:6px}.cover-studio-link span{font-size:14px}}