.participant-page {
  --workspace: min(1140px, 100% - clamp(36px, 9vw, 140px));
  --portal-border: color-mix(in srgb, var(--page-text) 17%, transparent);
  --portal-pane: color-mix(in srgb, var(--page-text) 5%, var(--page-bg));
  --portal-input: color-mix(in srgb, var(--page-text) 3%, var(--page-bg));
  --portal-blue: #a6c8ff;
  --portal-tag: rgb(157 190 255 / 12%);
  background: var(--page-bg);
  color: var(--page-text);
}
[data-theme="light"] .participant-page {
  --portal-pane: #fffaf1;
  --portal-input: #f8f4ec;
  --portal-blue: #143dbb;
  --portal-tag: rgb(20 61 187 / 8%);
}
.participant-page main { padding: 0; }
.participant-page :is(h1,h2,h3) { color: inherit; margin: 0; font-weight: 700; text-wrap: balance; }
.participant-page :is(h2,h3) { line-height: 1.45; }
.participant-page :is(p,label,small) { color: var(--page-muted); }
.participant-page :is(.quiet,.primary) {
  gap: .65em; min-height: 44px; padding: .6em 1.45em; border-radius: 999px;
  border: 1px solid var(--portal-border); font-size: .82rem; font-weight: 600; line-height: 1.5;
  transition: background .24s ease, border-color .24s ease, transform .28s var(--ease-cinema);
}
.participant-page .quiet { color: var(--page-text); background: transparent; }
.participant-page .primary { color: #fff; background: var(--cobalt); border-color: var(--cobalt); }
.participant-page .primary:is(a,button:enabled):hover { background: var(--cobalt-bright); border-color: var(--cobalt-bright); transform: translateY(-2px); }
.participant-page .quiet:is(a,button:enabled):hover { border-color: currentColor; transform: translateY(-2px); }
.participant-page :focus-visible { outline-color: var(--focus); }
.participant-page .section-label { display: flex; align-items: center; gap: .85em; margin: 0 0 10px; color: var(--page-muted); font-size: .74rem; font-weight: 600; }
.participant-page .section-label::before { content: ""; width: 34px; height: 2px; background: var(--portal-blue); }
.participant-header { position: sticky; inset-block-start: 0; z-index: 5; background: var(--header-bg); border-bottom: 1px solid var(--header-line); -webkit-backdrop-filter: blur(18px) saturate(1.24); backdrop-filter: blur(18px) saturate(1.24); }
.participant-header__inner { width: var(--workspace); min-height: 66px; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.portal-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 1.38rem; color: var(--page-text); white-space: nowrap; }
.portal-brand img { flex: 0 0 auto; border-radius: 8px; }
.portal-brand small { font-size: .7rem; font-weight: 400; }
.participant-nav,.portal-tools { display: flex; align-items: center; gap: clamp(14px, 2.3vw, 34px); margin: 0; }
.participant-nav a { position: relative; display: inline-flex; align-items: center; gap: .35em; min-height: 44px; color: var(--page-muted); font-size: .8rem; font-weight: 600; }
.participant-nav a[aria-current="page"],.participant-nav a:hover { color: var(--page-text); }
.participant-nav a[aria-current="page"]::after { position: absolute; inset: auto 0 3px; height: 2px; background: var(--portal-blue); content: ""; }
.portal-tools { gap: 6px; }
.portal-tools .quiet { min-height: 40px; padding: 6px 12px; font-size: .7rem; white-space: nowrap; }
.portal-tools button::before { content: ""; width: 12px; height: 12px; flex-shrink: 0; }
.portal-theme::before { border: 1px solid currentColor; border-radius: 50%; background: linear-gradient(90deg, transparent 50%, currentColor 50%); }
.portal-motion::before { background: linear-gradient(90deg, transparent 14%, currentColor 14% 34%, transparent 34% 66%, currentColor 66% 86%, transparent 86%); }
.portal-motion[aria-pressed="true"]::before { background: currentColor; clip-path: polygon(12% 4%, 96% 50%, 12% 96%); }

.portal-hero { position: relative; isolation: isolate; overflow: hidden; color: #fffaf0; background: #0b101a; }
.portal-art { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.portal-art :is(picture,img) { display: block; width: 100%; height: 100%; }
.portal-art img { object-fit: cover; object-position: 64% 52%; }
.portal-art::after { position: absolute; content: ""; inset: 0; pointer-events: none; background: linear-gradient(90deg,#080b13 0%,rgb(8 11 19 / 92%) 20%,rgb(8 11 19 / 73%) 37%,rgb(8 11 19 / 18%) 60%,transparent 77%),linear-gradient(0deg,rgb(8 10 15 / 32%),transparent 34%); }
.portal-prism { pointer-events: none; position: absolute; top: -22%; bottom: -12%; left: 40%; right: -7%; mix-blend-mode: screen; background: linear-gradient(118deg,transparent 40%,rgb(198 234 255 / 5%) 47%,rgb(220 246 255 / 31%) 50%,rgb(150 204 255 / 13%) 53%,transparent 61%); clip-path: polygon(31% 3%,100% 6%,69% 100%,0% 100%); }
.portal-hero__inner { width: var(--workspace); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 7%; min-height: clamp(405px, 41vw, 530px); padding-block: clamp(36px, 5vw, 74px); }
.portal-copy { grid-column: 2; grid-row: 1; justify-self: end; width: min(100%, 460px); }
.portal-copy .section-label { color: #dedddc; }
.portal-copy .section-label::before { background: #c6e6ff; box-shadow: 0 0 18px #8ba8fc; }
.portal-copy h1 { margin-block: 19px 16px; font-size: clamp(3.5rem, 5.7vw, 6.3rem); line-height: 1.1; letter-spacing: -.045em; }
.portal-copy h1 em { color: #dff5ff; font-style: normal; text-shadow: 0 0 32px rgb(104 164 229 / 24%); }
.portal-copy .portal-lead { max-width: 34ch; color: #e1dcd6; font-size: clamp(.93rem, 1.1vw, 1.08rem); line-height: 1.85; text-wrap: pretty; }
.portal-copy .hero-action { margin-top: 18px; padding-inline: 20px; background: #fffaf0; color: #10131a; border-color: transparent; }
.portal-copy .hero-action:hover { background: #dff5ff !important; color: #10131a; }
.portal-copy .hero-action span[aria-hidden] { margin-inline-start: 12px; }
.prize-note { position: relative; overflow: hidden; isolation: isolate; grid-row: 1; grid-column: 1; justify-self: start; align-self: end; display: grid; gap: 3px; min-width: min(100%, 245px); padding: 18px 24px; border-radius: 20px; border: 1px solid rgb(195 223 255 / 55%); color: #f0f6ff; background: linear-gradient(141deg,rgb(45 90 190 / 80%),rgb(9 22 56 / 84%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 35%),0 16px 34px rgb(0 0 0 / 20%); -webkit-backdrop-filter: blur(16px) saturate(1.3); backdrop-filter: blur(16px) saturate(1.3); }
.prize-note__line { height: 1px; position: absolute; inset-inline: 10%; top: 0; background: linear-gradient(90deg,transparent,#e2f7ff,transparent); }
.prize-note > span:not(.prize-note__line) { font-size: .74rem; color: #d8e8ff; }
.prize-note strong { overflow-wrap: anywhere; font-size: clamp(1.4rem, 2.4vw, 2.45rem); line-height: 1.35; }
.prize-note a { justify-self: start; padding-top: 2px; font-size: .73rem; color: #e4efff; }
.prize-note a:hover { text-decoration: underline; }
[data-theme="light"] .portal-hero { background: #e9e1d4; color: #151822; }
[data-theme="light"] .portal-art::after { background: linear-gradient(90deg,#f4eee4 0%,rgb(244 238 228 / 95%) 20%,rgb(244 238 228 / 79%) 38%,rgb(244 238 228 / 24%) 59%,transparent 76%); }
[data-theme="light"] .portal-copy :is(.portal-lead,.section-label) { color: #4e4c49; }
[data-theme="light"] .portal-copy .section-label::before { background: var(--cobalt); box-shadow: none; }
[data-theme="light"] .portal-copy em { color: var(--cobalt-deep); text-shadow: none; }
[data-theme="light"] .portal-copy .hero-action { background: #121624; color: #fffaf0; }
[data-theme="light"] .portal-copy .hero-action:hover { color: white; background: var(--cobalt) !important; }
.track-copy { display: none; }
.participant-page:has(#track-link[aria-current="page"]) .track-copy { display: inline; }
.participant-page:has(#track-link[aria-current="page"]) p.track-copy { display: block; }
.participant-page:has(#track-link[aria-current="page"]) .submit-copy { display: none; }

.portal-workspace { scroll-margin-top: 76px; width: min(960px, 100% - clamp(36px, 9vw, 140px)); margin-inline: auto; padding-block: clamp(24px, 3.2vw, 50px) clamp(45px, 7vw, 100px); }
.connection-status { display: flex; gap: 9px; align-items: center; margin-bottom: 15px; font-size: .8rem; color: var(--page-muted); overflow-wrap: anywhere; }
.connection-status::before { content: ""; width: 7px; height: 7px; flex: 0 0 auto; background: var(--portal-blue); border-radius: 50%; box-shadow: 0 0 0 4px var(--portal-tag); }
.participant-page .panel { margin-bottom: 0; padding: clamp(22px, 4.1vw, 48px); border: 1px solid var(--portal-border); border-radius: var(--radius-lg,26px); background: var(--portal-pane); color: var(--page-text); }
.participant-page .sign-in-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; background: linear-gradient(114deg,var(--portal-tag),transparent 56%),var(--portal-pane); padding-block: 24px; }
.sign-in-card h2 { font-size: clamp(1.35rem, 2vw, 1.85rem); }
.sign-in-card p { margin-top: 4px; font-size: .88rem; }
.sign-in-card .primary { flex-shrink: 0; }
.participant-page .view-title { align-items: flex-end; gap: 18px; margin: clamp(36px, 5vw, 68px) 0 22px; }
.view-title h2 { font-size: clamp(2.1rem, 3.7vw, 3.5rem); letter-spacing: -.035em; }
.view-title > p { max-width: 30ch; font-size: .87rem; line-height: 1.8; }
.form-group + .form-group { border-top: 1px solid var(--portal-border); padding-block-start: 24px; margin-block-start: 20px; }
.form-group > h3,.test-rules h3 { margin-bottom: 16px; font-size: 1.25rem; }
.participant-page .two-col { gap: 20px; }
.form-group label:not(.check) { margin-bottom: 17px; font-size: .87rem; font-weight: 600; color: var(--page-text); }
.form-group label small { font-size: .7rem; font-weight: 400; }
.form-group :is(input:not([type="checkbox"]),textarea) { min-height: 48px; padding: 10px 14px; border-radius: 12px; border-color: var(--portal-border); color: var(--page-text); background: var(--portal-input); transition: border-color .2s ease, box-shadow .2s ease; }
.form-group :is(input,textarea):focus-visible { outline: none; border-color: var(--portal-blue); box-shadow: 0 0 0 3px var(--portal-tag); }
.form-group :is(input,textarea)::placeholder { color: var(--page-muted); opacity: .78; }
.form-group .field-hint { margin: -9px 0 18px; }
.form-group .check { gap: 12px; align-items: start; margin: 14px 0; font-size: .86rem; font-weight: 400; }
.form-group input[type="checkbox"] { accent-color: var(--cobalt-bright); width: 18px; height: 18px; margin-top: 4px; cursor: pointer; }
.participant-page .micro { color: var(--page-muted); font-size: .76rem; line-height: 1.9; }
.test-rules { padding: 18px 22px; border-radius: 16px; background: var(--portal-tag); margin-bottom: 20px; }
.test-rules h3 { margin-bottom: 5px; }
.test-rules p { font-size: .85rem; line-height: 1.9; }
.rule-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: .76rem; }
.rule-links a { text-decoration: underline; text-underline-offset: 4px; color: var(--portal-blue); }
.rule-links small { font-size: .68rem; }
.verification { display: grid; justify-items: start; gap: 8px; margin: 20px 0; }
#verification-widget { max-width: 100%; }
.verification .micro { margin: 0; }
#submission-fields > .actions { margin-top: 24px; }
.participant-page :is(.notice,.form-message,.toast) { border-radius: 14px; }
.participant-page .receipt-panel { border-color: color-mix(in srgb,var(--portal-blue) 54%,transparent); background: linear-gradient(135deg,var(--portal-tag),transparent),var(--portal-pane); margin-top: 24px; }
.receipt-panel h2 { font-size: clamp(1.7rem, 3vw, 2.8rem); }
.receipt-value { margin: 12px 0; text-align: right; font-size: 1.35rem; color: var(--portal-blue) !important; overflow-wrap: anywhere; }
.receipt-panel .quiet { margin-top: 17px; }
.entry-grid { display: grid; gap: 15px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.entry-grid .entry-card { position: relative; overflow: hidden; background: linear-gradient(148deg,var(--portal-tag),transparent 45%),var(--portal-pane); padding: 25px; }
.entry-card h3 { margin: 16px 0 8px; font-size: 1.35rem; }
.entry-card p { font-size: .82rem; overflow-wrap: anywhere; }
.entry-card .quiet { margin-top: 15px; }
.entry-card .badge { display: inline-flex; border-color: var(--portal-border); color: var(--portal-blue); background: var(--portal-tag); }
.entry-grid .empty { grid-column: 1/-1; border: 1px dashed var(--portal-border); border-radius: 20px; }
.participant-page .pager { gap: 16px; }
.participant-page .footer { width: var(--workspace); margin: 0 auto; padding: 21px 0 26px; align-items: center; gap: 15px; font-size: .75rem; border-color: var(--portal-border); }
.participant-page .footer .portal-brand { font-size: 1rem; text-decoration: none; }
.footer > div { min-width: 0; max-width: 100%; display: flex; flex-wrap: wrap; gap: 12px 20px; }
.participant-page dialog { color: var(--page-text); background: var(--page-bg); border-color: var(--portal-border); border-radius: 26px; box-shadow: var(--shadow-deep, 0 44px 110px rgb(0 0 0 / 42%)); scrollbar-gutter: stable; }
.participant-page dialog::backdrop { background: rgb(4 8 19 / 73%); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.participant-page .dialog-heading { border-bottom: 1px solid var(--portal-border); background: var(--page-bg); padding-block: 10px; }
.participant-page .dialog-heading h2 { font-size: clamp(1.4rem, 3vw, 2.2rem); overflow-wrap: anywhere; }
.participant-page dialog .intro { white-space: pre-wrap; overflow-wrap: anywhere; }
.participant-page .detail-feedback { padding: 20px; }
.participant-page .detail-feedback p { margin: 5px 0; }
.participant-page .detail-feedback h3 { font-size: 1.2rem; }

@media (max-width: 760px) {
  .participant-header__inner { flex-wrap: wrap; gap: 0 12px; padding-block-start: 5px; }
  .portal-brand { font-size: 1.2rem; }
  .portal-brand img { width: 28px; height: 28px; }
  .participant-nav { order: 3; width: 100%; gap: 22px; }
  .participant-nav a { min-height: 40px; font-size: .76rem; }
  .portal-tools .quiet { font-size: .65rem; min-height: 37px; padding-inline: 10px; }
  .portal-workspace { scroll-margin-top: 95px; }
  .participant-page .view-title { flex-direction: row; align-items: end; flex-wrap: wrap; }
  .view-title > p { max-width: 100%; }
  .participant-page .two-col { grid-template-columns: 1fr; gap: 0; }
  .form-group :is(input:not([type="checkbox"]),textarea) { font-size: max(1rem,16px); }
  .participant-page .panel { border-radius: 20px; }
}
@media (max-width: 700px) {
  .portal-art { height: 100%; }
  .portal-art picture { height: clamp(230px, 50vw, 300px); }
  .portal-art img { object-position: center 48%; }
  .portal-art::after { background: linear-gradient(180deg,transparent 0%,transparent 24%,rgb(11 16 26 / 15%) 31%,#0b101a 53%),linear-gradient(90deg,rgb(3 9 19 / 23%),transparent 50%); }
  [data-theme="light"] .portal-art::after { background: linear-gradient(180deg,transparent 0%,transparent 24%,rgb(233 225 212 / 13%) 31%,#e9e1d4 53%); }
  .portal-hero__inner { min-height: auto; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: clamp(148px, 33vw, 195px) 0 27px; }
  .prize-note { max-width: 100%; align-self: flex-start; order: -1; min-width: 0; margin-inline-start: auto; margin-bottom: 13px; padding: 9px 16px; gap: 1px; border-radius: 14px; }
  .prize-note strong { overflow-wrap: anywhere; font-size: 1.25rem; }
  .prize-note > span:not(.prize-note__line),.prize-note a { font-size: .65rem; }
  .portal-copy { width: 100%; }
  .portal-copy h1 { font-size: clamp(2.8rem, 9.5vw, 3.8rem); margin: 8px 0; line-height: 1.3; }
  .portal-copy h1 br { display: none; }
  .portal-copy h1 em::before { content: " "; }
  .portal-copy .section-label { font-size: .7rem; margin-bottom: 0; }
  .portal-copy .portal-lead { max-width: 43ch; font-size: .88rem; }
  .portal-copy .hero-action { margin-top: 13px; }
  .portal-prism { inset: -10% -8% 35% 20%; }
  .participant-page .sign-in-card { flex-wrap: wrap; gap: 12px; }
  .participant-page .view-title { margin-top: 32px; }
  .entry-grid { grid-template-columns: 1fr; }
  .test-rules { padding: 15px; }
  .participant-page .footer { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 430px) {
  .participant-header .portal-brand small { display: none; }
  .portal-tools .quiet { padding-inline: 8px; }
  .portal-tools :is(.portal-theme,.portal-motion)::before { width: 10px; height: 10px; }
  .participant-header__inner { column-gap: 8px; }
  .participant-nav { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .participant-page :is(.quiet,.primary,input,textarea) { transition: none; }
}

.portal-workspace > :is(#submit-section,#track-section) > .view-title:first-child { margin-block-start: 0; }
#submit-form .form-group:first-child .two-col { row-gap: 0; }
.upload-drop {
  display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 8px 16px;
  position: relative; padding: 27px 18px; border: 1px dashed var(--portal-border);
  border-radius: 16px; background: var(--portal-input); text-align: center;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.upload-drop.is-over,.upload-drop:focus-within {
  border-color: var(--portal-blue); background: var(--portal-tag);
  box-shadow: 0 0 0 3px var(--portal-tag);
}
.form-group .file-picker:not(.check) {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  padding: 8px 18px; margin: 0; cursor: pointer; border-radius: 999px; color: var(--page-text);
  background: var(--portal-tag); border: 1px solid var(--portal-border);
}
.upload-drop input[type="file"] {
  position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0;
  border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.upload-drop .micro { margin: 0; }
#file-limit { width: 100%; }
.selected-file { overflow-wrap: anywhere; unicode-bidi: plaintext; font-size: .85rem; margin-block-start: 8px; }
.submit-panel .form-message,.track-panel .form-message { margin: 18px 0 0; }
.track-panel { max-width: 720px; }
.track-panel .actions { margin-block-start: 18px; }
#track-result { margin-block-start: 18px; }
.track-result h3 { font-size: 1.45rem; }
.track-result dl { display: grid; row-gap: 8px; column-gap: 22px; grid-template-columns: max-content 1fr; }
.track-result :is(dt,dd) { margin: 0; }
#track-feedback { white-space: pre-wrap; overflow-wrap: anywhere; }
.receipt-code { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
#receipt-value { min-width: 0; font-size: clamp(1.1rem, 3.4vw, 1.7rem); font-weight: 700; color: var(--portal-blue); overflow-wrap: anywhere; user-select: all; }
#copy-status:empty,#selected-file:empty,#submit-progress:empty { display: none; }
#pending-operations button,#config-error button { margin-block-start: 8px; }
@media (pointer: coarse) { .drop-hint { display: none; } }

.upload-instructions { margin: -8px 0 16px; font-size: .86rem; }
.track-history { margin-bottom: 18px; }
.track-history ol { margin: 10px 0 0; padding: 0; list-style: none; }
.track-history li { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; border-inline-start: 1px solid var(--portal-border); padding: 4px 14px 8px 0; }
.track-history li::before { content: ""; width: 6px; height: 6px; position: absolute; inset-inline-start: -3.5px; top: 14px; border-radius: 50%; background: var(--portal-blue); }
.track-history li span { font-size: .85rem; }
.track-history time { font-size: .75rem; color: var(--page-muted); }