@import url('/assets/brand-2027.css');
/* Brings functional and form-led pages into the 2027 stage-light system. */
body {
  background:
    radial-gradient(ellipse 70% 34% at 50% 0, rgba(213,174,103,.13), transparent 64%),
    var(--night, #070609) !important;
  color: var(--text, #f4f1fa);
}

body.is-gala,
body.is-hof {
  background:
    radial-gradient(ellipse 70% 34% at 50% 0, rgba(213,174,103,.16), transparent 64%),
    var(--onyx, #050404) !important;
}

.site-nav__row {
  width: 100%;
  max-width: 1600px;
  padding-inline: clamp(20px,5vw,80px);
}

.site-nav {
  background:rgba(5,4,4,.94);
  border-bottom:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.tk-minimal-nav {
  display:none !important;
}

.site-nav__brand {
  width: 220px;
  flex: 0 0 auto;
}

.site-nav__brand img {
  height: 32px;
  max-width: 220px;
}

.site-nav__links {
  margin-left: auto;
  gap: clamp(20px,2vw,34px);
}

.site-nav__links a {
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase;
}

.site-nav__cta {
  width: 140px;
  padding-inline: 14px !important;
  justify-content: center;
}

main,
.page,
.page-shell {
  position: relative;
}

main::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: min(720px,80vh);
  background: linear-gradient(90deg,rgba(255,59,92,.07),rgba(255,166,43,.08),rgba(47,192,255,.07),rgba(154,107,255,.07));
  mask-image: linear-gradient(#000,transparent);
  pointer-events: none;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.045) !important;
  color: inherit !important;
  min-height: 52px;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--gold-hi, #e4c07a) !important;
  outline: 2px solid rgba(228,192,122,.2) !important;
  outline-offset: 2px;
}

label,
legend {
  font-weight: 700;
}

fieldset,
.card,
.panel,
.form-card,
.summary-card,
.ticket-card,
.nom-card,
.v-card,
.tk-card {
  border-color: rgba(255,255,255,.12) !important;
  border-radius: 0 !important;
  background: rgba(13,11,17,.86) !important;
  box-shadow: none !important;
}

.btn,
button[type="submit"],
input[type="submit"] {
  border-radius: 0 !important;
  min-height: 48px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.btn--solid,
.btn-primary,
.primary,
button[type="submit"],
input[type="submit"] {
  border: 0 !important;
  background: var(--gold-flat, linear-gradient(100deg,#e4c07a,#bd8b47)) !important;
  color: #160f08 !important;
}

body.is-awards .btn--solid,
body.is-awards .btn-primary,
body.is-awards button[type="submit"],
body.is-awards input[type="submit"] {
  background: #fff !important;
  color: #0b0a0e !important;
  box-shadow: inset 0 -4px var(--c7,#2fc0ff) !important;
}

@media (max-width:1020px) {
  .site-nav__toggle { display:block; margin-left:auto; }
  .site-nav__links {
    display:none;
    position:fixed;
    inset:80px 0 auto;
    padding:24px clamp(20px,5vw,80px);
    flex-direction:column;
    align-items:stretch;
    background:rgba(7,6,9,.97);
  }
  .menu-open .site-nav__links { display:flex; }
  .site-nav__links a { min-height:44px; display:flex; align-items:center; }
  .site-nav__brand { width:auto; }
  .site-nav__brand img { height:24px; max-width:min(220px,62vw); }
  .site-nav__links { gap:0; }
  .site-nav__cta { width:auto; }
}

@media (max-width:520px) {
  .site-nav { height:73px; }
  .site-nav__links { inset-block-start:73px; }
}

/* ------------------------------------------------------------------
   Functional surfaces: light paper under the dark stage treatment.
   These rules are intentionally explicit so labels, helper copy and
   generated application states never inherit low-contrast dark colours.
   ------------------------------------------------------------------ */

body.is-awards {
  --work-surface:#f4f1fa;
  --work-surface-2:#ffffff;
  --work-ink:#111016;
  --work-muted:#56515f;
  --work-line:rgba(17,16,22,.2);
  --work-accent:#4d7cff;
}

body.is-gala,
body.is-hof {
  --work-surface:#f6eddc;
  --work-surface-2:#fffaf0;
  --work-ink:#18110a;
  --work-muted:#62584c;
  --work-line:rgba(24,17,10,.22);
  --work-accent:#bd8b47;
}

/* Nomination form. */
#nomForm,
.n-success,
.n-phase-notice {
  position:relative;
  overflow:hidden;
  background:var(--work-surface) !important;
  color:var(--work-ink) !important;
  border:1px solid rgba(255,255,255,.5) !important;
  box-shadow:0 34px 90px rgba(0,0,0,.42) !important;
}

#nomForm::before,
.b-card::before,
.pf-card::before,
.tk-state-card::before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:5px;
  background:var(--spectrum);
}

#nomForm .form-section legend,
#nomForm .field label,
#nomForm .consent label,
#nomForm .count,
#nomForm .form-status,
.n-success,
.n-phase-notice {
  color:var(--work-ink) !important;
}

#nomForm fieldset,
#nomForm .form-section {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

#nomForm .field .hint,
#nomForm .consent label,
#nomForm .count,
.n-success p,
.n-phase-notice p {
  color:var(--work-muted) !important;
}

#nomForm input:not([type="checkbox"]):not([type="radio"]),
#nomForm select,
#nomForm textarea {
  background:var(--work-surface-2) !important;
  border:1px solid var(--work-line) !important;
  color:var(--work-ink) !important;
  caret-color:var(--work-ink);
}

#nomForm select {
  background-image:none !important;
}

#nomForm option {
  background:#fff;
  color:#111016;
}

#nomForm input::placeholder,
#nomForm textarea::placeholder {
  color:#746f7b !important;
  opacity:1;
}

#nomForm .type-toggle label,
#nomForm .consent {
  background:rgba(255,255,255,.72) !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
}

#nomForm .type-toggle input:checked + label {
  background:#e8efff !important;
  border-color:var(--work-accent) !important;
  color:#172d74 !important;
}

#nomForm .n-actions {
  border-color:var(--work-line) !important;
}

body.is-awards #nomForm .btn--solid,
body.is-awards .b-card .btn--solid {
  background:#111016 !important;
  color:#fff !important;
  box-shadow:inset 0 -4px #2fc0ff !important;
}

/* Voting sign-in, ballot and review surfaces. */
.b-card,
.b-layout {
  position:relative;
  background:var(--work-surface) !important;
  color:var(--work-ink) !important;
  border-color:rgba(255,255,255,.5) !important;
}

.b-card h2,
.b-card p,
.b-signed-in,
.b-signed-in-line,
.b-panel,
.b-panel__title,
.b-prompt,
.b-slot__name,
.v-option__name {
  color:var(--work-ink) !important;
}

.b-card p,
.b-signed-in,
.b-signed-in-line,
.v-cat__empty,
.b-slot__placeholder,
.v-option__summary,
.v-option__statement,
.b-review-row__picks,
.b-review-row__status {
  color:var(--work-muted) !important;
}

.b-card input,
.b-card input[type="email"] {
  background:#fff !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
}

.b-card input::placeholder {
  color:#746f7b !important;
  opacity:1;
}

.b-rail__item,
.b-nominee,
.b-review-row,
.v-option__static,
.b-slot {
  background:rgba(255,255,255,.72) !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
}

.b-rail__item:hover,
.b-nominee:hover,
.b-review-row:hover,
.b-rail__item.is-active,
.b-slot.is-filled {
  background:#e8efff !important;
  border-color:var(--work-accent) !important;
}

.b-panel__eyebrow,
.b-slot__points,
.b-complete__title,
.b-review-row.is-done .b-review-row__status,
.b-review-row__picks span,
.b-signed-in button,
.b-signed-in-line button,
.b-slot__change {
  color:#264fc9 !important;
}

/* Ticket selection, purchaser details and review. */
.tk-product,
.tk-review-card,
.tk-state-card,
.tk-form,
.pf-card,
.guest-ticket-form,
.cf-order-card,
.guest-link-panel {
  position:relative;
  background:var(--work-surface) !important;
  border-color:rgba(255,255,255,.45) !important;
  color:var(--work-ink) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.2) !important;
}

.tk-form {
  padding:clamp(22px,4vw,34px) !important;
}

.tk-products {
  gap:18px !important;
}

.tk-product h3,
.tk-product output,
.tk-review-card h2,
.tk-review-line dt,
.tk-review-line dd,
.tk-purchaser-dl dd,
.tk-state-card h2,
.pf-card h2,
.pf-card label,
.guest-ticket-form h3,
.guest-field label,
.cf-order-card dt,
.cf-order-card dd {
  color:var(--work-ink) !important;
}

.tk-product__desc,
.tk-field-hint,
.tk-purchaser-dl dt,
.tk-state-card p,
.pf-card p,
.guest-setup__intro,
.guest-status {
  color:var(--work-muted) !important;
}

.tk-product__price,
.tk-review-total strong,
.tk-edit-link,
.guest-ticket-form h3 span {
  color:#8a5c1f !important;
}

.tk-stepper button {
  background:#fff !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
}

.tk-subtotal-bar,
.tk-order-summary,
.tk-event-band,
.pf-event-band,
.cf-event-band {
  background:rgba(213,174,103,.12) !important;
}

.tk-field label,
.guest-field label {
  color:var(--work-ink) !important;
}

.tk-field input,
.pf-card input,
.guest-field input,
.guest-field textarea {
  background:#fff !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
  caret-color:var(--work-ink);
}

.tk-form .tk-field input[type="text"],
.tk-form .tk-field input[type="email"],
.tk-form .tk-field input[type="tel"],
.pf-card input[type="text"],
.pf-card input[type="email"],
.pf-card input[type="password"],
.guest-field input[type="text"],
.guest-field input[type="email"],
.guest-field input[type="tel"],
.guest-field textarea,
.g-card input[type="text"],
.g-card input[type="email"],
.g-card input[type="tel"],
.g-card textarea,
.t-card input[type="text"],
.t-card input[type="email"],
.t-card textarea {
  background:#fff !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
  caret-color:var(--work-ink) !important;
}

.tk-field input::placeholder,
.pf-card input::placeholder,
.guest-field input::placeholder,
.guest-field textarea::placeholder {
  color:#766b5f !important;
  opacity:1;
}

#nomForm .btn--ghost,
.b-card .btn--ghost,
.b-layout .btn--ghost,
.tk-form .btn--ghost,
.tk-review-card .btn--ghost,
.pf-card .btn--ghost,
.guest-ticket-form .btn--ghost,
.cf-order-card .btn--ghost {
  background:transparent !important;
  border:1px solid var(--work-line) !important;
  color:var(--work-ink) !important;
}

.pf-card .btn--solid,
.tk-form .btn--solid,
.tk-review-card .btn--solid,
.guest-ticket-form .btn--solid,
.cf-order-card .btn--solid {
  background:var(--gold-flat) !important;
  color:#160f08 !important;
}

/* Checkout and confirmation state cards. */
.tk-state-card,
.cf-order-card,
.guest-ticket-form {
  border-style:solid !important;
}

/* Account action, nominee, guest and ticket-management forms. */
.wrap > .card,
.g-card,
.t-card,
.p-card,
.claim-card,
.tc-modal__panel {
  background:var(--work-surface) !important;
  border:1px solid rgba(255,255,255,.45) !important;
  color:var(--work-ink) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.22) !important;
}

.wrap > .card :is(h1,h2,h3,p,label,legend,dt,dd),
.g-card :is(h1,h2,h3,p,label,legend,dt,dd),
.t-card :is(h1,h2,h3,p,label,legend,dt,dd),
.p-card :is(h1,h2,h3,p,label,legend,dt,dd),
.claim-card :is(h1,h2,h3,p,label,legend,dt,dd),
.tc-modal__panel :is(h1,h2,h3,p,label,legend,dt,dd) {
  color:var(--work-ink) !important;
}

.wrap > .card :is(input,select,textarea),
.g-card :is(input,select,textarea),
.t-card :is(input,select,textarea),
.p-card :is(input,select,textarea),
.claim-card :is(input,select,textarea),
.tc-modal__panel :is(input,select,textarea) {
  background:#fff !important;
  border-color:var(--work-line) !important;
  color:var(--work-ink) !important;
}

.wrap > .card :is(input,textarea)::placeholder,
.g-card :is(input,textarea)::placeholder,
.t-card :is(input,textarea)::placeholder,
.p-card :is(input,textarea)::placeholder,
.claim-card :is(input,textarea)::placeholder,
.tc-modal__panel :is(input,textarea)::placeholder {
  color:#766b5f !important;
  opacity:1;
}

@media (max-width:680px) {
  #nomForm,
  .b-card,
  .b-layout,
  .tk-product,
  .tk-review-card,
  .pf-card {
    border-radius:16px !important;
  }

  .b-layout {
    padding:14px !important;
  }
}
