  :root {
    --ps-black: #0a0a0a;
    --ps-black-soft: #141414;
    --ps-white: #f0ede0;
    --ps-surface: #111118;
    --ps-gold: #d4a830;
    --ps-gold-light: #f0c940;
    --ps-blue: #2563eb;
    --ps-gray-100: #1a1a26;
    --ps-gray-200: rgba(212,168,48,.14);
    --ps-gray-300: #2a2a38;
    --ps-gray-500: #8f8a7c;
    --ps-gray-700: #c0bdb0;
    --ps-success-bg: #ecfdf3;
    --ps-success-border: #86efac;
    --ps-success-text: #166534;
    --ps-warning-bg: #fffbeb;
    --ps-warning-border: #fcd34d;
    --ps-warning-text: #92400e;
    --ps-danger-bg: #fef2f2;
    --ps-danger-border: #fca5a5;
    --ps-danger-text: #991b1b;
    --ps-radius-sm: 8px;
    --ps-radius-md: 12px;
    --ps-shadow: 0 8px 24px rgba(0,0,0,.5);
    --ps-max-width: 1200px;
    --ps-gold-border: rgba(212,168,48,0.45);
    --team-hitam-bg: #111827;
    --team-hitam-text: #f9fafb;
    --team-merah-bg: #dc2626;
    --team-merah-text: #fff;
    --team-putih-bg: #f3f4f6;
    --team-putih-text: #111827;
    --team-biru-bg: #2563eb;
    --team-biru-text: #fff;
    --team-kuning-bg: #eab308;
    --team-kuning-text: #111827;
    --team-hijau-bg: #16a34a;
    --team-hijau-text: #fff;
    --team-neutral-bg: #4b5563;
    --team-neutral-text: #fff;
  }

  *, *::before, *::after { box-sizing: border-box; }
  body {
    margin: 0;
    font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
    color: var(--ps-white);
    background: #09090f;
    line-height: 1.5;
  }
  a { color: var(--ps-gold); }
  img { max-width: 100%; height: auto; }

  .site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: linear-gradient(180deg, var(--ps-black) 0%, var(--ps-black-soft) 100%);
    color: #fff;
    border-bottom: 3px solid var(--ps-gold);
  }
  .site-header__inner {
    max-width: var(--ps-max-width);
    margin: 0 auto;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }
  .brand-link {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: inherit;
    text-decoration: none;
    font-weight: 700;
    flex-shrink: 0;
  }
  .brand-link img {
    border-radius: 50%;
    border: 1.5px solid var(--ps-gold-border);
    object-fit: cover;
    background: #fff;
  }
  .brand-link span { font-size: 1.05rem; letter-spacing: 0.02em; }

  /* Hamburger toggle — shown only on mobile */
  .nav-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid rgba(212,168,48,0.35);
    border-radius: var(--ps-radius-sm);
    color: var(--ps-gold);
    cursor: pointer;
    padding: 0;
    transition: background 0.15s, border-color 0.15s;
  }
  .nav-toggle:hover { background: rgba(212,168,48,0.1); border-color: var(--ps-gold); }

  .site-nav {
    display: flex;
    align-items: center;
    gap: 0.25rem 0.85rem;
  }
  .site-nav a {
    color: #d1d5db;
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 500;
    padding: 0.3rem 0;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
    white-space: nowrap;
  }
  .site-nav a:hover, .site-nav a.active {
    color: var(--ps-gold-light);
    border-bottom-color: var(--ps-gold);
  }
  .site-nav a.site-nav__cta {
    display: inline-flex;
    align-items: center;
    background: var(--ps-gold);
    color: #0a0a0a;
    padding: 0.45rem 1.1rem;
    border-radius: var(--ps-radius-sm);
    font-weight: 600;
    font-size: 0.9rem;
    border-bottom: none;
    margin-left: 0.25rem;
  }
  .site-nav a.site-nav__cta:hover,
  .site-nav a.site-nav__cta.active {
    background: var(--ps-gold-light);
    color: #0a0a0a;
    border-bottom: none;
  }

  /* Thin vertical rule between nav links and user section */
  .nav-separator {
    width: 1px;
    height: 1.1rem;
    background: rgba(212,168,48,0.22);
    flex-shrink: 0;
    align-self: center;
  }

  /* Logged-in user chip */
  .nav-user-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .nav-user-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: rgba(212,168,48,0.09);
    border: 1px solid rgba(212,168,48,0.28);
    border-radius: 999px;
    padding: 0.25rem 0.7rem 0.25rem 0.35rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ps-white);
    white-space: nowrap;
  }
  .nav-user-icon {
    width: 16px;
    height: 16px;
    color: var(--ps-gold);
    flex-shrink: 0;
  }

  /* Public nav dropdown groups */
  .nav-dropdown {
    position: relative;
  }
  .nav-dropdown > summary {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    list-style: none;
    cursor: pointer;
    color: #d1d5db;
    font-size: 0.92rem;
    font-weight: 500;
    padding: 0.3rem 0;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
    white-space: nowrap;
    user-select: none;
  }
  .nav-dropdown > summary::-webkit-details-marker { display: none; }
  .nav-dropdown > summary:hover,
  .nav-dropdown > summary.active,
  .nav-dropdown[open] > summary {
    color: var(--ps-gold-light);
    border-bottom-color: var(--ps-gold);
  }
  .nav-dropdown__caret {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    transition: transform 0.15s;
  }
  .nav-dropdown[open] .nav-dropdown__caret { transform: rotate(180deg); }
  .nav-dropdown__menu {
    position: absolute;
    top: calc(100% + 0.55rem);
    left: 50%;
    transform: translateX(-50%);
    min-width: 170px;
    background: var(--ps-black-soft);
    border: 1px solid rgba(212,168,48,0.28);
    border-radius: var(--ps-radius-sm);
    box-shadow: 0 12px 30px rgba(0,0,0,0.45);
    padding: 0.4rem;
    display: flex;
    flex-direction: column;
    z-index: 300;
  }
  .nav-dropdown__menu--right {
    left: auto;
    right: 0;
    transform: none;
  }
  .site-nav .nav-dropdown__menu a {
    padding: 0.55rem 0.75rem;
    border-bottom: none;
    border-radius: var(--ps-radius-sm);
    font-size: 0.9rem;
  }
  .site-nav .nav-dropdown__menu a:hover,
  .site-nav .nav-dropdown__menu a.active {
    background: rgba(212,168,48,0.12);
    color: var(--ps-gold-light);
  }
  .nav-dropdown--user > summary {
    background: rgba(212,168,48,0.09);
    border: 1px solid rgba(212,168,48,0.28);
    border-radius: 999px;
    padding: 0.25rem 0.7rem 0.25rem 0.45rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ps-white);
  }
  .nav-dropdown--user > summary:hover,
  .nav-dropdown--user > summary.active,
  .nav-dropdown--user[open] > summary {
    border-color: var(--ps-gold);
    border-bottom-color: var(--ps-gold);
    color: var(--ps-gold-light);
  }
  .nav-dropdown__name {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .nav-dropdown__menu .logout-form {
    margin-top: 0.25rem;
    padding-top: 0.4rem;
    border-top: 1px solid rgba(212,168,48,0.18);
  }
  .nav-dropdown__menu .btn-logout { width: 100%; }

  /* Admin left sidebar */
  .admin-sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 150;
  }
  .admin-sidebar-backdrop.show { display: block; }

  .admin-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 250px;
    overflow-y: auto;
    background: var(--ps-black-soft);
    border-right: 1px solid rgba(212,168,48,0.22);
    padding: 1rem 0.85rem 1.5rem;
    z-index: 200;
    transform: translateX(-100%);
    transition: transform 0.2s ease;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .admin-sidebar.sidebar-open { transform: translateX(0); }
  .admin-sidebar__brand { padding: 0 0.25rem; }
  .admin-sidebar__logout { margin-top: auto; }
  .admin-sidebar__logout .btn-logout { width: 100%; justify-content: center; }

  .admin-nav {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }
  .admin-nav-standalone,
  .admin-nav-group summary,
  .admin-nav-group__items a {
    display: block;
    color: #d1d5db;
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 500;
    padding: 0.55rem 0.6rem;
    border-radius: var(--ps-radius-sm);
    cursor: pointer;
  }
  .admin-nav-standalone:hover,
  .admin-nav-standalone.active,
  .admin-nav-group__items a:hover,
  .admin-nav-group__items a.active {
    color: var(--ps-gold-light);
    background: rgba(212,168,48,0.1);
  }
  .admin-nav-group summary {
    list-style: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .admin-nav-group summary::-webkit-details-marker { display: none; }
  .admin-nav-group summary::after {
    content: '\25B8';
    transition: transform 0.15s;
    color: var(--ps-gray-500);
  }
  .admin-nav-group[open] summary::after { transform: rotate(90deg); }
  .admin-nav-group__items {
    display: flex;
    flex-direction: column;
    padding-left: 0.75rem;
  }

  .admin-main { padding: 1.5rem 1rem; max-width: var(--ps-max-width); margin: 0 auto; }

  @media (min-width: 861px) {
    .admin-topbar { display: none; }
    .admin-sidebar {
      transform: none;
      transition: none;
    }
    .admin-sidebar ~ .admin-main {
      margin-left: 250px;
      max-width: none;
    }
  }

  /* Logout pill button */
  .logout-form { display: inline; margin: 0; }
  .btn-logout {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: transparent;
    border: 1px solid rgba(248,113,113,0.35);
    border-radius: 999px;
    color: #f87171;
    cursor: pointer;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 500;
    padding: 0.25rem 0.65rem;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
  }
  .btn-logout:hover {
    background: rgba(248,113,113,0.12);
    border-color: #f87171;
    color: #fca5a5;
  }
  .btn-logout:disabled {
    opacity: 0.55;
    cursor: not-allowed;
  }

  main {
    max-width: var(--ps-max-width);
    margin: 0 auto;
    padding: 1.25rem 1rem 2.5rem;
  }
  main.main--landing {
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .page-header { margin-bottom: 1.25rem; }
  .page-header h1 {
    margin: 0 0 0.35rem;
    font-size: clamp(1.35rem, 2.5vw, 1.85rem);
  }
  .page-header p { margin: 0; color: var(--ps-gray-500); }

  .page-hero { margin-bottom: 1.25rem; }
  .page-eyebrow {
    margin: 0 0 0.5rem;
    color: var(--ps-gold);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .page-heading {
    margin: 0;
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    font-weight: 800;
    line-height: 1.15;
  }
  .page-heading em {
    font-style: normal;
    color: var(--ps-gold);
  }

  .contact-headline {
    margin: 0 0 1.25rem;
    color: var(--ps-gray-700);
    font-size: 1.02rem;
  }
  .contact-channels {
    display: grid;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
  }
  .contact-channel {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-radius: var(--ps-radius-md);
    border: 1px solid var(--ps-gray-200);
    background: var(--ps-surface);
    text-decoration: none;
    color: var(--ps-white);
    transition: border-color 0.15s, background 0.15s;
  }
  .contact-channel:hover {
    border-color: rgba(212,168,48,0.45);
    background: rgba(212,168,48,0.06);
  }
  .contact-channel__icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(212,168,48,0.1);
    color: var(--ps-gold);
  }
  .contact-channel__icon svg {
    width: 24px;
    height: 24px;
    display: block;
  }
  .contact-channel__body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
  }
  .contact-channel--wa {
    border-color: rgba(37,211,102,0.35);
  }
  .contact-channel--wa:hover {
    border-color: rgba(37,211,102,0.65);
    background: rgba(37,211,102,0.08);
  }
  .contact-channel--wa .contact-channel__icon {
    background: rgba(37,211,102,0.14);
    color: #25d366;
  }
  .contact-channel--ig .contact-channel__icon {
    background: rgba(225,48,108,0.14);
    color: #e1306c;
  }
  .contact-channel--ig:hover {
    border-color: rgba(225,48,108,0.45);
    background: rgba(225,48,108,0.06);
  }
  .contact-channel--tiktok .contact-channel__icon {
    background: rgba(0,242,234,0.1);
    color: #00f2ea;
  }
  .contact-channel--tiktok:hover {
    border-color: rgba(0,242,234,0.35);
    background: rgba(0,242,234,0.05);
  }
  .contact-channel--email .contact-channel__icon {
    background: rgba(212,168,48,0.14);
    color: var(--ps-gold-light);
  }
  .contact-channel__label {
    font-weight: 700;
    font-size: 1rem;
  }
  .contact-channel__hint {
    color: var(--ps-gray-500);
    font-size: 0.88rem;
  }
  .contact-cta { margin: 0; }

  .card {
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow);
    padding: 1rem;
    margin-bottom: 1rem;
  }
  .card--flat { box-shadow: none; }
  .card__title {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 700;
  }

  .stats-period {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
  }

  /* ── Dashboard ── */
  .dash { display: flex; flex-direction: column; gap: 1.25rem; }
  .dash-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    padding: 1.35rem 1.5rem;
    background: linear-gradient(135deg, rgba(212,168,48,0.12) 0%, var(--ps-surface) 45%, #0d0d14 100%);
    border-color: rgba(212,168,48,0.35);
    margin-bottom: 0;
  }
  .dash-hero__eyebrow {
    margin: 0 0 0.25rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ps-gold);
  }
  .dash-hero__title {
    margin: 0 0 0.35rem;
    font-size: clamp(1.5rem, 3vw, 2rem);
    line-height: 1.15;
  }
  .dash-hero__subtitle {
    margin: 0;
    color: var(--ps-gray-500);
    max-width: 36rem;
    font-size: 0.95rem;
  }
  .dash-hero__subtitle strong { color: var(--ps-gray-700); font-weight: 600; }

  .stats-segment {
    display: inline-flex;
    padding: 0.25rem;
    gap: 0.2rem;
    background: rgba(0,0,0,0.35);
    border: 1px solid var(--ps-gray-300);
    border-radius: 999px;
  }
  .stats-segment__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.4rem 1rem;
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--ps-gray-500);
    text-decoration: none;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
  }
  .stats-segment__btn:hover { color: var(--ps-gray-700); background: rgba(255,255,255,0.04); }
  .stats-segment__btn.is-active {
    color: var(--ps-black);
    background: linear-gradient(180deg, var(--ps-gold-light), var(--ps-gold));
    box-shadow: 0 2px 12px rgba(212,168,48,0.35);
  }

  .dash-block__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
  }
  .dash-block__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
  }
  .dash-block__badge {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    background: rgba(212,168,48,0.12);
    border: 1px solid rgba(212,168,48,0.28);
    color: var(--ps-gold-light);
  }

  .dash-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(16rem, 1fr);
    gap: 1rem;
    align-items: start;
  }
  .dash-layout__main,
  .dash-layout__side { display: flex; flex-direction: column; gap: 1rem; }

  .dash-panel {
    margin-bottom: 0;
    padding: 0;
    overflow: hidden;
  }
  .dash-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.15rem 0.75rem;
    border-bottom: 1px solid var(--ps-gray-200);
  }
  .dash-panel__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
  }
  .dash-panel__meta {
    margin: 0.2rem 0 0;
    font-size: 0.82rem;
    color: var(--ps-gray-500);
  }
  .dash-panel__foot {
    margin: 0;
    padding: 0.65rem 1.15rem 1rem;
    font-size: 0.78rem;
    border-top: 1px solid var(--ps-gray-200);
  }
  .dash-empty { margin: 0; padding: 1.25rem 1.15rem 1.5rem; }
  .dash-actions { margin-top: 0.25rem; }

  .stats-section { margin-bottom: 1.5rem; }
  .stats-section__period { font-size: 0.9rem; font-weight: 500; }
  .stats-section__hint { margin: -0.35rem 0 0.85rem; }
  .stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.75rem;
  }
  .stats-grid--kpi {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .stats-grid--narrow { max-width: 36rem; }
  .stats-card {
    position: relative;
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow);
    padding: 1rem 1.1rem 1.05rem;
    transition: border-color 0.15s, transform 0.15s;
  }
  .stats-card:hover {
    border-color: rgba(212,168,48,0.35);
    transform: translateY(-1px);
  }
  .stats-card--featured {
    background: linear-gradient(160deg, rgba(212,168,48,0.14) 0%, var(--ps-surface) 55%);
    border-color: rgba(212,168,48,0.4);
  }
  .stats-card--featured .stats-card__value {
    color: var(--ps-gold-light);
    font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  }
  .stats-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-bottom: 0.5rem;
    font-size: 1rem;
    border-radius: 0.55rem;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--ps-gray-200);
  }
  .stats-card__label {
    margin: 0 0 0.35rem;
    font-size: 0.82rem;
    color: var(--ps-gray-500);
    font-weight: 500;
  }
  .stats-card__value {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
  }
  .stats-card__hint {
    margin: 0.35rem 0 0;
    font-size: 0.78rem;
    line-height: 1.35;
  }

  .stats-chart {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(3.75rem, 1fr));
    gap: 0.65rem;
    align-items: end;
    min-height: 11rem;
    padding: 1rem 1.15rem 1.15rem;
    background:
      linear-gradient(180deg, transparent 0%, transparent 88%, rgba(212,168,48,0.08) 88%, rgba(212,168,48,0.08) 89%, transparent 89%),
      repeating-linear-gradient(90deg, transparent, transparent calc(100% / 6 - 1px), rgba(255,255,255,0.03) calc(100% / 6 - 1px), rgba(255,255,255,0.03) calc(100% / 6));
  }
  .stats-chart__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    min-width: 0;
  }
  .stats-chart__amount {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--ps-gray-700);
    text-align: center;
    line-height: 1.2;
    word-break: break-word;
    min-height: 1.5rem;
  }
  .stats-chart__bar-wrap {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    height: 7.5rem;
  }
  .stats-chart__bar {
    width: min(2.5rem, 78%);
    min-height: 6px;
    border-radius: 0.45rem 0.45rem 0.15rem 0.15rem;
    background: linear-gradient(180deg, #f5d76e 0%, var(--ps-gold) 55%, #a67c00 100%);
    box-shadow: 0 0 18px rgba(212,168,48,0.25);
    transition: filter 0.15s;
  }
  .stats-chart__item:hover .stats-chart__bar { filter: brightness(1.08); }
  .stats-chart__label {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--ps-gray-700);
    text-align: center;
    line-height: 1.2;
  }
  .stats-chart__share {
    font-size: 0.68rem;
    line-height: 1;
  }

  .stats-event-list {
    list-style: none;
    margin: 0;
    padding: 0.35rem 0;
  }
  .stats-event { border-bottom: 1px solid var(--ps-gray-200); }
  .stats-event:last-child { border-bottom: none; }
  .stats-event__link {
    display: block;
    padding: 0.85rem 1.15rem;
    color: inherit;
    text-decoration: none;
    transition: background 0.15s;
  }
  .stats-event__link:hover { background: rgba(212,168,48,0.06); }
  .stats-event__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
  }
  .stats-event__date {
    margin: 0 0 0.15rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ps-gold);
  }
  .stats-event__venue {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.3;
  }
  .stats-event__meta { margin: 0.15rem 0 0; font-size: 0.8rem; }
  .stats-event__amount {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ps-gold-light);
    white-space: nowrap;
  }
  .stats-event__track {
    height: 0.35rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    overflow: hidden;
  }
  .stats-event__fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--ps-gold), var(--ps-gold-light));
    min-width: 0;
    transition: width 0.2s ease;
  }

  .stats-community {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0.75rem;
    align-items: center;
    padding: 1.15rem;
    text-align: center;
  }
  .stats-community__divider {
    width: 1px;
    height: 3.5rem;
    background: var(--ps-gray-200);
  }
  .stats-community__value {
    display: block;
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--ps-gold-light);
  }
  .stats-community__label {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--ps-gray-500);
  }
  .stats-community__hint {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.72rem;
  }

  .stats-leaderboard {
    list-style: none;
    margin: 0;
    padding: 0.35rem 0 0;
    counter-reset: none;
  }
  .stats-leaderboard__row {
    display: grid;
    grid-template-columns: 2rem 1fr auto;
    gap: 0.65rem;
    align-items: center;
    padding: 0.65rem 1.15rem;
    border-bottom: 1px solid var(--ps-gray-200);
  }
  .stats-leaderboard__row:last-child { border-bottom: none; }
  .stats-leaderboard__row--top {
    background: linear-gradient(90deg, rgba(212,168,48,0.1), transparent);
  }
  .stats-leaderboard__rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.45rem;
    font-size: 0.82rem;
    font-weight: 800;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--ps-gray-200);
    color: var(--ps-gray-700);
  }
  .stats-leaderboard__row--top .stats-leaderboard__rank {
    background: linear-gradient(180deg, var(--ps-gold-light), var(--ps-gold));
    border-color: transparent;
    color: var(--ps-black);
  }
  .stats-leaderboard__name {
    display: block;
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1.25;
  }
  .stats-leaderboard__meta { font-size: 0.78rem; }
  .stats-leaderboard__amount {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ps-gray-700);
    white-space: nowrap;
  }

  @media (max-width: 960px) {
    .dash-layout { grid-template-columns: 1fr; }
    .stats-grid--kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 520px) {
    .stats-grid--kpi { grid-template-columns: 1fr; }
    .stats-community { grid-template-columns: 1fr; }
    .stats-community__divider { display: none; }
    .dash-hero { padding: 1.1rem; }
  }

  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 44px;
    padding: 0.55rem 1rem;
    background: var(--ps-gold);
    color: var(--ps-black);
    text-decoration: none;
    border: 1px solid var(--ps-gold);
    border-radius: var(--ps-radius-sm);
    cursor: pointer;
    font: inherit;
    font-weight: 600;
  }
  .btn:hover { background: var(--ps-gold-light); border-color: var(--ps-gold-light); }
  .btn:focus-visible,
  .btn-secondary:focus-visible,
  .btn-info:focus-visible,
  .btn-success:focus-visible,
  .btn-danger:focus-visible,
  .btn-warning:focus-visible,
  .btn-outline:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.28);
  }
  .btn-secondary {
    background: var(--ps-gray-700);
    border-color: var(--ps-gray-700);
    color: var(--ps-black);
  }
  .btn-secondary:hover { background: #1f2937; border-color: #1f2937; color: #fff; }
  .btn-info {
    background: var(--ps-blue);
    border-color: var(--ps-blue);
    color: #fff;
  }
  .btn-info:hover { background: #1d4ed8; border-color: #1d4ed8; }
  .btn-info:focus-visible { box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.28); }
  .btn-success {
    background: #15803d;
    border-color: #15803d;
    color: #fff;
  }
  .btn-success:hover { background: #166534; border-color: #166534; }
  .btn-success:focus-visible { box-shadow: 0 0 0 3px rgba(21, 128, 61, 0.28); }
  .btn-danger {
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
  }
  .btn-danger:hover { background: #b91c1c; border-color: #b91c1c; }
  .btn-danger:focus-visible { box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.28); }
  .btn-warning {
    background: #d97706;
    border-color: #d97706;
    color: #fff;
  }
  .btn-warning:hover { background: #b45309; border-color: #b45309; }
  .btn-warning:focus-visible { box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.28); }
  .btn-outline {
    background: transparent;
    border-color: var(--ps-gold);
    color: var(--ps-white);
  }
  .btn-outline:hover {
    background: rgba(212, 168, 48, 0.1);
    border-color: var(--ps-gold-light);
    color: var(--ps-gold-light);
  }
  .btn-small { min-height: 36px; padding: 0.35rem 0.75rem; font-size: 0.875rem; }
  .btn:disabled { opacity: 0.55; cursor: not-allowed; }
  .btn.is-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.75;
    padding-left: 2.25rem;
  }
  .btn.is-loading::before {
    content: "";
    position: absolute;
    left: 0.85rem;
    top: 50%;
    width: 0.95rem;
    height: 0.95rem;
    margin-top: -0.475rem;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: btn-spin 0.7s linear infinite;
  }
  @keyframes btn-spin {
    to { transform: rotate(360deg); }
  }

  form.is-submitting {
    pointer-events: none;
  }

  .actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1rem 0; }
  .inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
  }
  .inline-actions form.inline-form { margin: 0; }

  .action-cell { white-space: nowrap; }
  .btn-action {
    min-height: 36px;
    padding: 0.35rem 0.85rem;
    font-size: 0.875rem;
    font-weight: 600;
  }
  .btn-action--review {
    border-color: var(--ps-warning-border);
    color: var(--ps-warning-text);
    background: var(--ps-warning-bg);
  }

  .admin-dialog {
    border: none;
    padding: 0;
    margin: auto;
    max-width: min(94vw, 540px);
    width: 100%;
    background: transparent;
    color: inherit;
  }
  .admin-dialog::backdrop {
    background: rgba(0, 0, 0, 0.72);
  }
  .admin-dialog__panel {
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-300);
    border-radius: var(--ps-radius-md);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
    overflow: hidden;
  }
  .admin-dialog__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--ps-gray-200);
    background: var(--ps-gray-100);
  }
  .admin-dialog__title {
    margin: 0;
    padding-top: 0.1rem;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.45;
    flex: 1;
    min-width: 0;
  }
  .admin-dialog__close {
    border: none;
    background: transparent;
    color: var(--ps-gray-700);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    padding: 0.15rem 0.35rem;
    border-radius: var(--ps-radius-sm);
  }
  .admin-dialog__close:hover { color: var(--ps-white); background: rgba(255,255,255,0.08); }
  .admin-dialog__body { padding: 0; }
  .admin-dialog__body > .admin-dialog__meta {
    margin: 0;
    padding: 1rem 1.25rem 0.35rem;
  }
  .admin-dialog__section {
    padding: 1.1rem 1.25rem 1.15rem;
    border-top: 1px solid var(--ps-gray-200);
  }
  .admin-dialog__section:first-child { border-top: none; }
  .admin-dialog__section-title {
    margin: 0 0 0.65rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ps-gray-500);
  }
  .admin-dialog__meta {
    margin: 0 0 0.75rem;
    font-size: 0.9rem;
    color: var(--ps-gray-700);
    line-height: 1.45;
  }
  .admin-dialog__proof {
    margin: 0.5rem 0 0.85rem;
    text-align: center;
  }
  .admin-dialog__proof img {
    display: inline-block;
    max-width: 100%;
    max-height: 300px;
    object-fit: contain;
    border-radius: var(--ps-radius-sm);
    border: 1px solid var(--ps-gray-300);
    background: var(--ps-gray-100);
  }
  .proof-history__item + .proof-history__item {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--ps-gray-200);
  }
  .proof-history .admin-dialog__proof img {
    max-height: 220px;
  }
  .admin-dialog__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
  }
  .stack-form {
    display: grid;
    gap: 0.55rem;
  }
  .stack-form label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ps-gray-700);
  }
  .stack-form .field-input,
  .stack-form textarea.field-input {
    width: 100%;
    min-height: 44px;
  }
  .stack-form textarea.field-input { min-height: 72px; resize: vertical; }

  .review-summary-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.15rem;
    padding-top: 1rem;
    border-top: 1px solid var(--ps-gray-200);
  }
  .review-proof-preview {
    margin-top: 1rem;
    padding: 0.85rem;
    border: 1px dashed var(--ps-gray-300);
    border-radius: var(--ps-radius-sm);
    background: var(--ps-gray-100);
    text-align: center;
  }
  .review-proof-preview__img {
    max-width: 180px;
    max-height: 180px;
    margin: 0 auto;
  }
  .review-proof-preview__hint {
    margin: 0.5rem 0 0;
    font-size: 0.82rem;
  }

  .badge {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: capitalize;
    border: 1px solid transparent;
  }
  .badge-success { background: var(--ps-success-bg); border-color: var(--ps-success-border); color: var(--ps-success-text); }
  .badge-warning { background: var(--ps-warning-bg); border-color: var(--ps-warning-border); color: var(--ps-warning-text); }
  .badge-danger { background: var(--ps-danger-bg); border-color: var(--ps-danger-border); color: var(--ps-danger-text); }
  .badge-neutral { background: var(--ps-gray-100); border-color: var(--ps-gray-300); color: var(--ps-gray-700); }

  .payment-method-icon {
    flex-shrink: 0;
    width: 40px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: #fff;
    padding: 3px 5px;
    vertical-align: middle;
    margin-right: 0.5rem;
  }
  .payment-method-icon img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: contain;
  }
  .payment-method-card {
    padding: 0;
  }
  .payment-method-card__header {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin: 0;
    padding: 0.75rem 2.25rem 0.75rem 1rem;
    background: rgba(212,168,48,0.06);
    border-radius: var(--ps-radius-md);
    cursor: pointer;
    list-style: none;
    position: relative;
  }
  .payment-method-card[open] > .payment-method-card__header {
    border-bottom: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md) var(--ps-radius-md) 0 0;
  }
  .payment-method-card__header::-webkit-details-marker { display: none; }
  .payment-method-card__header::after {
    content: '▾';
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ps-gray-500);
    transition: transform 0.15s;
  }
  .payment-method-card[open] > .payment-method-card__header::after {
    transform: translateY(-50%) rotate(180deg);
  }
  .payment-method-card__body {
    padding: 1rem;
  }
  .payment-method-card__logo {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 46px;
    background: #fff;
    border-radius: 8px;
    padding: 0.4rem 0.55rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.18);
  }
  .payment-method-card__logo img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: contain;
  }

  .qris-display {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.85rem;
  }
  .qris-display img {
    width: 100%;
    max-width: 180px;
    background: #fff;
    border: 1px solid var(--ps-gray-300);
    padding: 0.65rem;
    border-radius: 12px;
  }

  .bank-account-card {
    background: var(--ps-gray-100);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 1rem 1.15rem;
  }
  .bank-account-card__label {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ps-gray-500);
    margin-bottom: 0.4rem;
  }
  .bank-account-card__number-row {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
  }
  .bank-account-card__number {
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    color: var(--ps-white);
  }
  .bank-account-card__meta {
    margin-top: 0.65rem;
    padding-top: 0.65rem;
    border-top: 1px solid var(--ps-gray-200);
    color: var(--ps-gray-500);
    font-size: 0.9rem;
  }

  .payment-method-select {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
  }
  .payment-method-option {
    display: block;
    flex: 1 1 160px;
    cursor: pointer;
    margin: 0;
  }
  .payment-method-option input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
  }
  .payment-method-option__card {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    height: 100%;
    border: 2px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 0.65rem 0.85rem;
    background: var(--ps-gray-100);
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
  }
  .payment-method-option input:checked + .payment-method-option__card {
    border-color: var(--ps-gold);
    background: rgba(212,168,48,0.08);
    box-shadow: 0 0 0 3px rgba(212,168,48,0.2);
  }
  .payment-method-option input:focus-visible + .payment-method-option__card {
    outline: 2px solid var(--ps-gold-light);
    outline-offset: 2px;
  }
  .payment-method-option__logo {
    flex-shrink: 0;
    width: 52px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 6px;
    padding: 4px 6px;
  }
  .payment-method-option__logo img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: contain;
  }
  .payment-method-option__label {
    flex: 1;
    font-weight: 700;
    color: var(--ps-white);
  }
  .payment-method-option__radio {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--ps-gray-300);
    position: relative;
  }
  .payment-method-option input:checked + .payment-method-option__card .payment-method-option__radio {
    border-color: var(--ps-gold);
  }
  .payment-method-option input:checked + .payment-method-option__card .payment-method-option__radio::after {
    content: '';
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--ps-gold);
  }

  .team-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
  }
  .team-card {
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    overflow: hidden;
    background: var(--ps-surface);
    box-shadow: var(--ps-shadow);
  }
  .team-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-weight: 700;
  }
  .inline-team-badges {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    vertical-align: middle;
  }
  .team-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.85rem;
    border: 1px solid rgba(255,255,255,0.25);
  }
  .team-hitam .team-card__header { background: var(--team-hitam-bg); color: var(--team-hitam-text); }
  .team-merah .team-card__header { background: var(--team-merah-bg); color: var(--team-merah-text); }
  .team-putih .team-card__header { background: var(--team-putih-bg); color: var(--team-putih-text); border-bottom: 1px solid var(--ps-gray-300); }
  .team-biru .team-card__header { background: var(--team-biru-bg); color: var(--team-biru-text); }
  .team-kuning .team-card__header { background: var(--team-kuning-bg); color: var(--team-kuning-text); }
  .team-hijau .team-card__header { background: var(--team-hijau-bg); color: var(--team-hijau-text); }
  .team-neutral .team-card__header { background: var(--team-neutral-bg); color: var(--team-neutral-text); }
  .team-badge.team-hitam { background: var(--team-hitam-bg); color: var(--team-hitam-text); }
  .team-badge.team-merah { background: var(--team-merah-bg); color: var(--team-merah-text); }
  .team-badge.team-putih { background: var(--team-putih-bg); color: var(--team-putih-text); border: 1px solid var(--ps-gray-300); }
  .team-badge.team-biru { background: var(--team-biru-bg); color: var(--team-biru-text); }
  .team-badge.team-kuning { background: var(--team-kuning-bg); color: var(--team-kuning-text); }
  .team-badge.team-hijau { background: var(--team-hijau-bg); color: var(--team-hijau-text); }
  .team-badge.team-neutral { background: var(--team-neutral-bg); color: var(--team-neutral-text); }

  .team-card__body { padding: 1rem; }
  .capacity-row { margin-bottom: 0.85rem; }
  .capacity-row:last-child { margin-bottom: 0; }
  .capacity-row__label {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 0.35rem;
    color: var(--ps-gray-700);
  }
  .capacity-bar {
    height: 8px;
    background: var(--ps-gray-200);
    border-radius: 999px;
    overflow: hidden;
  }
  .capacity-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--ps-gold), var(--ps-gold-light));
    border-radius: 999px;
  }

  .roster-list { list-style: none; margin: 0.75rem 0 0; padding: 0; }
  .roster-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.45rem 0;
    border-bottom: 1px dashed var(--ps-gray-200);
    font-size: 0.92rem;
  }
  .roster-list li:last-child { border-bottom: 0; }
  .roster-list .slot-empty { color: var(--ps-gray-500); font-style: italic; }
  .roster-role {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ps-gray-500);
  }

  .meta-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .meta-item {
    background: var(--ps-gray-100);
    border-radius: var(--ps-radius-sm);
    padding: 0.75rem;
  }
  .meta-item__label {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ps-gray-500);
    margin-bottom: 0.2rem;
  }
  .meta-item__value { font-weight: 600; }

  .table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.sheet {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
    background: var(--ps-surface);
  }
  table.sheet th, table.sheet td {
    border: 1px solid var(--ps-gray-300);
    padding: 0.6rem 0.7rem;
    text-align: left;
    vertical-align: top;
  }
  table.sheet th {
    background: var(--ps-gray-100);
    color: var(--ps-white);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
  }

  .proof-thumb-link { display: inline-block; line-height: 0; }
  .proof-thumb {
    display: block;
    width: 88px;
    height: 88px;
    object-fit: cover;
    border-radius: var(--ps-radius-sm, 6px);
    border: 1px solid var(--ps-gray-300);
    background: var(--ps-gray-100);
  }

  tr.row-highlight td {
    background: rgba(255, 193, 7, 0.12);
  }
  tr.row-ended td {
    color: var(--ps-gray-600);
  }

  .filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
  }

  .schedule-cards { display: grid; gap: 0.85rem; }
  .schedule-card {
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 1rem;
    background: var(--ps-surface);
    box-shadow: var(--ps-shadow);
  }
  .schedule-card--ended {
    opacity: 0.82;
  }
  .schedule-card__top {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
    margin-bottom: 0.75rem;
  }
  .schedule-card__date { font-weight: 700; font-size: 1.05rem; }
  .schedule-card__meta { color: var(--ps-gray-700); font-size: 0.9rem; }
  .schedule-card__actions { margin-top: 0.85rem; }

  .desktop-only { display: none; }
  .mobile-only { display: block; }

  .error, .success, .notice {
    padding: 0.75rem 0.9rem;
    margin-bottom: 1rem;
    border-radius: var(--ps-radius-sm);
    border: 1px solid transparent;
  }
  .error { background: var(--ps-danger-bg); border-color: var(--ps-danger-border); color: var(--ps-danger-text); }
  .success { background: var(--ps-success-bg); border-color: var(--ps-success-border); color: var(--ps-success-text); }
  .notice { background: var(--ps-warning-bg); border-color: var(--ps-warning-border); color: var(--ps-warning-text); }

  form.grid,
  .form-fields {
    display: grid;
    gap: 0.85rem;
    max-width: 100%;
  }
  .form-fields--registrant {
    grid-template-columns: 1fr;
    margin-bottom: 0.5rem;
  }
  .form-section {
    margin-bottom: 1.25rem;
  }
  .form-section__hint {
    margin: -0.25rem 0 0.85rem;
    font-size: 0.9rem;
    line-height: 1.45;
  }
  .form-field label,
  .form-field__label {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--ps-gray-700);
  }
  .form-field__label {
    display: block;
    margin-bottom: 0.35rem;
  }
  .pick-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .pick-chips--role {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }
  .pick-chip {
    position: relative;
    cursor: pointer;
    margin: 0;
  }
  .pick-chip input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .pick-chip > span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.55rem 0.85rem;
    border-radius: var(--ps-radius-sm);
    border: 2px solid var(--ps-gray-200);
    background: var(--ps-gray-100);
    color: var(--ps-white);
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.2;
    text-align: center;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.1s;
    user-select: none;
  }
  .pick-chip input:checked + span {
    border-color: var(--ps-gold);
    box-shadow: 0 0 0 3px rgba(212, 168, 48, 0.22);
  }
  .pick-chip input:focus-visible + span {
    outline: 2px solid var(--ps-gold-light);
    outline-offset: 2px;
  }
  .pick-chip.team-hitam span { background: var(--team-hitam-bg); color: var(--team-hitam-text); border-color: rgba(249,250,251,0.2); }
  .pick-chip.team-merah span { background: var(--team-merah-bg); color: var(--team-merah-text); border-color: rgba(255,255,255,0.2); }
  .pick-chip.team-putih span { background: var(--team-putih-bg); color: var(--team-putih-text); border-color: rgba(17,24,39,0.15); }
  .pick-chip.team-biru span { background: var(--team-biru-bg); color: var(--team-biru-text); border-color: rgba(255,255,255,0.2); }
  .pick-chip.team-kuning span { background: var(--team-kuning-bg); color: var(--team-kuning-text); border-color: rgba(17,24,39,0.12); }
  .pick-chip.team-hijau span { background: var(--team-hijau-bg); color: var(--team-hijau-text); border-color: rgba(255,255,255,0.2); }
  .pick-chip.team-neutral span { background: var(--team-neutral-bg); color: var(--team-neutral-text); }
  .pick-chip--role span {
    background: var(--ps-gray-100);
    color: var(--ps-white);
  }
  .field-input,
  form.grid input:not([type="checkbox"]):not([type="radio"]),
  form.grid select, form.grid textarea,
  .form-field input:not([type="checkbox"]):not([type="radio"]),
  .form-field select, .form-field textarea,
  textarea.field-input {
    width: 100%;
    min-height: 44px;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-sm);
    font: inherit;
    font-size: 1rem;
    line-height: 1.35;
    background: var(--ps-gray-100);
    color: var(--ps-white);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }
  select.field-input,
  .form-field select,
  form.grid select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2.5rem;
    background-color: var(--ps-gray-100);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c0bdb0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.125rem;
    cursor: pointer;
  }
  textarea.field-input {
    min-height: 4.5rem;
    resize: vertical;
  }
  form.inline-form .field-input {
    min-width: 8rem;
    width: auto;
  }
  .field-input::placeholder,
  .form-field input::placeholder {
    color: var(--ps-gray-500);
    opacity: 1;
  }
  .field-input:hover,
  .form-field input:not([type="checkbox"]):not([type="radio"]):hover,
  .form-field select:hover {
    border-color: var(--ps-gray-500);
  }
  .field-input:focus,
  .form-field input:not([type="checkbox"]):not([type="radio"]):focus,
  .form-field select:focus,
  .form-field textarea:focus {
    outline: none;
    border-color: var(--ps-gold);
    box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.22);
  }
  .form-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }
  .field-hint {
    margin: 0.15rem 0 0;
    padding-left: 0.6rem;
    border-left: 2px solid var(--ps-gray-300);
    font-size: 0.8rem;
    line-height: 1.45;
    font-weight: 400;
    color: var(--ps-gray-500);
  }
  .field-checkbox {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.92rem;
    color: var(--ps-gray-700);
    cursor: pointer;
    line-height: 1.4;
  }
  .field-checkbox input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    min-height: 0;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    accent-color: var(--ps-gold);
    cursor: pointer;
  }
  .field-radio {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.92rem;
    color: var(--ps-gray-700);
    cursor: pointer;
    line-height: 1.4;
    margin-bottom: 0.35rem;
  }
  .field-radio input[type="radio"] {
    width: 1.1rem;
    height: 1.1rem;
    min-height: 0;
    margin: 0.15rem 0 0;
    padding: 0;
    flex-shrink: 0;
    accent-color: var(--ps-gold);
    cursor: pointer;
  }
  .form-field-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr;
  }
  .participant-rows {
    display: grid;
    gap: 0.85rem;
  }
  .participant-row-card {
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 0.9rem;
    background: var(--ps-gray-100);
  }
  .participant-row-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
  }
  .participant-row-card__title {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ps-gray-500);
  }
  form.inline-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
  }
  form.inline-form select { min-width: 8rem; min-height: 44px; font-size: 1rem; }

  .participant-table-wrap { overflow-x: auto; }
  .participant-row-mobile { display: none; }
  .back-link { display: inline-block; margin-bottom: 0.75rem; text-decoration: none; }
  .section-title { margin: 1.5rem 0 0.75rem; font-size: 1.15rem; }

  .login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: radial-gradient(circle at top, #1f2937 0%, var(--ps-black) 55%);
  }
  .login-card {
    width: min(100%, 420px);
    background: var(--ps-surface);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow);
    padding: 1.5rem;
    border-top: 4px solid var(--ps-gold);
  }
  .login-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    text-align: center;
  }
  .login-brand img {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    border: 3px solid var(--ps-gold);
  }

  @media (min-width: 640px) {
    .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .meta-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .form-fields--registrant { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .desktop-only { display: block; }
    .mobile-only { display: none; }
  }
  @media (min-width: 768px) {
    .form-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (min-width: 1024px) {
    .team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .meta-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  }
  @media (max-width: 639px) {
    .hide-mobile { display: none !important; }
    .btn-small, .btn-action { min-height: 44px; }
    form.inline-form { align-items: stretch; }
    form.inline-form select, form.inline-form button {
      width: 100%;
      font-size: 16px;
      min-height: 48px;
    }

    .field-input,
    form.grid select,
    .form-field select,
    select.field-input {
      font-size: 16px;
      min-height: 48px;
      padding: 0.8rem 0.9rem;
      padding-right: 2.75rem;
    }
    .form-field-grid {
      grid-template-columns: 1fr;
      gap: 1rem;
    }
    .participant-row-card {
      padding: 1rem;
    }
    .form-field label,
    .form-field__label {
      font-size: 0.95rem;
    }
    .pick-chips:not(.pick-chips--role) {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.65rem;
    }
    .pick-chip > span {
      min-height: 48px;
      font-size: 1rem;
      padding: 0.7rem 0.75rem;
    }
    .pick-chips--role {
      gap: 0.65rem;
    }

    /* Mobile nav: hamburger + dropdown */
    .nav-toggle { display: flex; }
    .site-nav {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      background: var(--ps-black);
      border-bottom: 2px solid var(--ps-gold);
      padding: 0.5rem 1rem 0.75rem;
      z-index: 200;
    }
    .site-nav.nav-open { display: flex; }
    .site-nav a {
      padding: 0.85rem 0.5rem;
      border-bottom: 1px solid var(--ps-gray-100);
      font-size: 1.05rem;
    }
    .site-nav a.site-nav__cta {
      justify-content: center;
      margin: 0.65rem 0 0;
      padding: 0.85rem 1rem;
      font-size: 1rem;
      border-bottom: none;
    }
    .site-nav a:last-of-type:not(.site-nav__cta) { border-bottom: none; }
    .nav-separator { display: none; }
    .nav-user-group {
      flex-direction: column;
      align-items: flex-start;
      gap: 0.5rem;
      padding: 0.65rem 0.25rem 0;
      border-top: 1px solid var(--ps-gray-100);
    }
    .nav-user-chip { border-radius: var(--ps-radius-sm); }
    .btn-logout { border-radius: var(--ps-radius-sm); padding: 0.4rem 0.75rem; font-size: 0.88rem; }

    /* Mobile: dropdowns become inline accordions */
    .nav-dropdown > summary {
      display: flex;
      justify-content: space-between;
      padding: 0.85rem 0.5rem;
      border-bottom: 1px solid var(--ps-gray-100);
      font-size: 1.05rem;
    }
    .nav-dropdown[open] > summary { border-bottom-color: transparent; }
    .nav-dropdown__menu,
    .nav-dropdown__menu--right {
      position: static;
      transform: none;
      min-width: 0;
      border: none;
      border-left: 2px solid rgba(212,168,48,0.35);
      border-radius: 0;
      box-shadow: none;
      background: transparent;
      margin: 0 0 0.35rem 0.85rem;
      padding: 0 0 0 0.35rem;
    }
    .site-nav .nav-dropdown__menu a {
      padding: 0.7rem 0.5rem;
      font-size: 1rem;
      border-radius: 0;
    }
    .nav-dropdown--user > summary {
      border: 1px solid rgba(212,168,48,0.28);
      border-radius: var(--ps-radius-sm);
      margin-top: 0.5rem;
      padding: 0.6rem 0.75rem;
      font-size: 0.95rem;
    }
    .nav-dropdown__name { max-width: none; }
    .nav-dropdown__menu .logout-form { padding: 0.4rem 0.5rem 0.25rem; }
    .nav-dropdown__menu .btn-logout { width: auto; }
  }

  .muted { color: var(--ps-gray-500); font-size: 0.9rem; }

  .star-rating {
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 0.15rem;
  }
  .star-rating input[type="radio"] { display: none; }
  .star-rating label {
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    color: var(--ps-gray-500);
    transition: color 0.12s;
    padding: 0.1rem;
    user-select: none;
  }
  .star-rating input:checked ~ label,
  .star-rating label:hover,
  .star-rating label:hover ~ label { color: var(--ps-gold); }

  html { scroll-behavior: smooth; }

  /* ── Landing page ── */
  .lp-hero {
    min-height: 92vh;
    display: flex;
    align-items: center;
    padding: 5rem 1.25rem 3rem;
    position: relative;
    overflow: hidden;
  }
  .lp-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 30% 50%, rgba(212,168,48,.07) 0%, transparent 70%);
    pointer-events: none;
  }
  .lp-hero__inner {
    max-width: var(--ps-max-width);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
    width: 100%;
    position: relative;
  }
  .lp-hero__tag {
    display: inline-block;
    background: var(--ps-gray-200);
    border: 1px solid rgba(212,168,48,.3);
    color: var(--ps-gold);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    margin-bottom: 1.25rem;
  }
  .lp-hero__title {
    font-size: clamp(2rem, 4.5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 1rem;
    letter-spacing: -.02em;
  }
  .lp-hero__title em {
    font-style: normal;
    color: var(--ps-gold);
  }
  .lp-hero__sub {
    font-size: 1.05rem;
    color: var(--ps-gray-700);
    margin: 0 0 2rem;
    max-width: 480px;
  }
  .lp-hero__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
  .lp-btn {
    display: inline-flex;
    align-items: center;
    padding: 0.7rem 1.6rem;
    border-radius: var(--ps-radius-sm);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all .15s;
  }
  .lp-btn--primary {
    background: var(--ps-gold);
    color: #0a0a0a;
    border-color: var(--ps-gold);
  }
  .lp-btn--primary:hover { background: var(--ps-gold-light); border-color: var(--ps-gold-light); }
  .lp-btn--outline {
    background: transparent;
    color: var(--ps-white);
    border-color: rgba(240,237,224,.25);
  }
  .lp-btn--outline:hover { border-color: var(--ps-gold); color: var(--ps-gold); }
  .lp-stats {
    display: flex;
    gap: 2rem;
    margin-top: 2.5rem;
    flex-wrap: wrap;
  }
  .lp-stat__num {
    font-size: 2rem;
    font-weight: 800;
    color: var(--ps-gold);
    line-height: 1;
  }
  .lp-stat__label { font-size: 0.8rem; color: var(--ps-gray-500); margin-top: 0.25rem; }
  #lp-canvas {
    width: 100%;
    height: 340px;
    border-radius: var(--ps-radius-md);
    border: 1px solid var(--ps-gray-200);
    display: block;
  }
  .lp-section { padding: 5rem 1.25rem; }
  .lp-section__inner {
    max-width: var(--ps-max-width);
    margin: 0 auto;
  }
  .lp-section__header {
    text-align: center;
    margin-bottom: 3rem;
  }
  .lp-section__eyebrow {
    display: inline-block;
    color: var(--ps-gold);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
  }
  .lp-section__title {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 700;
    margin: 0 0 0.75rem;
  }
  .lp-section__desc { color: var(--ps-gray-700); max-width: 560px; margin: 0 auto; }
  .lp-how { background: #0d0d14; }
  .lp-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
  }
  .lp-step {
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 1.5rem;
    text-align: center;
  }
  .lp-step__num {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: var(--ps-gray-200);
    border: 2px solid rgba(212,168,48,.4);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1rem;
    font-weight: 800;
    color: var(--ps-gold);
    font-size: 1.1rem;
  }
  .lp-step h3 { margin: 0 0 0.5rem; font-size: 1rem; }
  .lp-step p { margin: 0; color: var(--ps-gray-700); font-size: 0.88rem; }
  .lp-schedules { background: #09090f; }
  .lp-sched-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
  }
  .lp-sched-table th {
    text-align: left;
    padding: 0.7rem 1rem;
    color: var(--ps-gray-500);
    font-weight: 600;
    border-bottom: 1px solid var(--ps-gray-200);
    font-size: 0.8rem;
    letter-spacing: .05em;
    text-transform: uppercase;
  }
  .lp-sched-table td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgba(42,42,56,.5);
    vertical-align: middle;
  }
  .lp-sched-table tr:last-child td { border-bottom: none; }
  .lp-sched-table tr:hover td { background: rgba(212,168,48,.04); }
  .lp-sched-wrap {
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    overflow-x: auto;
  }
  .lp-empty { color: var(--ps-gray-500); text-align: center; padding: 2rem; }
  .lp-sched-actions { text-align: center; margin-top: 1.75rem; }
  .lp-testimonials { background: #0d0d14; }
  .lp-testi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.25rem;
  }
  .lp-testi-card {
    background: var(--ps-surface);
    border: 1px solid var(--ps-gray-200);
    border-radius: var(--ps-radius-md);
    padding: 1.5rem;
  }
  .lp-testi-stars { color: var(--ps-gold); font-size: 1.1rem; margin-bottom: 0.75rem; }
  .lp-testi-content { color: var(--ps-gray-700); font-size: 0.92rem; margin-bottom: 1rem; font-style: italic; }
  .lp-testi-author { font-weight: 600; font-size: 0.88rem; color: var(--ps-white); }
  .lp-footer {
    background: #0a0a0a;
    border-top: 1px solid var(--ps-gray-200);
    padding: 3rem 1.25rem 2rem;
    color: var(--ps-gray-500);
    font-size: 0.85rem;
  }
  .lp-footer__inner {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 1.5rem 3rem;
    align-items: start;
  }
  .lp-footer__brand { grid-column: 1; }
  .lp-footer__logo {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--ps-gold);
    display: block;
    margin-bottom: 0.4rem;
  }
  .lp-footer__tagline { color: var(--ps-gray-500); margin: 0; line-height: 1.5; }
  .lp-footer__links {
    grid-column: 2;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    text-align: right;
  }
  .lp-footer__links a { color: var(--ps-gray-500); text-decoration: none; }
  .lp-footer__links a:hover { color: var(--ps-gold); }
  .lp-footer__copy {
    grid-column: 1 / -1;
    border-top: 1px solid var(--ps-gray-200);
    padding-top: 1.25rem;
    margin: 0;
    color: var(--ps-gray-700);
    font-size: 0.78rem;
  }
  @media (max-width: 820px) {
    .lp-hero__inner { grid-template-columns: 1fr; }
    #lp-canvas { height: 220px; }
    .lp-hero { padding-top: 3rem; }
  }
  @media (max-width: 600px) {
    .lp-footer__inner { grid-template-columns: 1fr; }
    .lp-footer__links { grid-column: 1; flex-direction: row; flex-wrap: wrap; text-align: left; }
  }

  .pagination-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--ps-gray-300);
  }
  .pagination-nav__disabled {
    opacity: 0.45;
    pointer-events: none;
  }

  /* ── Score prediction contests ── */
  .prediction-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
    gap: 1rem;
  }
  .prediction-grid--admin { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
  .prediction-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.1rem;
    margin-bottom: 1rem;
    background: linear-gradient(155deg, rgba(212,168,48,0.1), var(--ps-surface) 38%);
    border: 1px solid rgba(212,168,48,0.28);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow);
  }
  .prediction-grid .prediction-card { margin-bottom: 0; }
  .prediction-card__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
  }
  .prediction-card__eyebrow {
    margin: 0 0 0.15rem;
    color: var(--ps-gold);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
  }
  .prediction-card__title {
    margin: 0;
    color: var(--ps-white);
    font-size: clamp(1rem, 3vw, 1.2rem);
    line-height: 1.3;
  }
  .prediction-match {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
    padding: 0.9rem 0.5rem;
    border-top: 1px solid var(--ps-gray-200);
    border-bottom: 1px solid var(--ps-gray-200);
  }
  .prediction-team {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
    text-align: center;
  }
  .prediction-team__logo,
  .prediction-team__monogram,
  .prediction-logo-preview {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    border: 1px solid rgba(212,168,48,0.35);
    border-radius: 50%;
    background: #fff;
    object-fit: contain;
  }
  .prediction-team__logo { padding: 0.35rem; }
  .prediction-team__monogram {
    color: var(--ps-gold-light);
    background: var(--ps-gray-100);
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0.04em;
  }
  .prediction-team__name {
    max-width: 100%;
    color: var(--ps-white);
    font-size: 0.95rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .prediction-score {
    min-width: 3.4rem;
    color: var(--ps-gold-light);
    font-size: clamp(1.15rem, 4vw, 1.55rem);
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
  }
  .prediction-card__meta p { margin: 0.2rem 0; color: var(--ps-gray-700); font-size: 0.88rem; }
  .prediction-card__meta strong { color: var(--ps-white); }
  .prediction-card__action { width: 100%; margin-top: auto; }
  .prediction-odds { padding: 1rem 1.1rem; }
  .prediction-odds__title {
    margin: 0 0 1rem;
    color: var(--ps-white);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-align: center;
    text-transform: uppercase;
  }
  .prediction-odds__labels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    margin-bottom: 0.6rem;
  }
  .prediction-odds__labels div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.15rem;
  }
  .prediction-odds__labels div:nth-child(2) { align-items: center; text-align: center; }
  .prediction-odds__labels div:last-child { align-items: flex-end; text-align: right; }
  .prediction-odds__labels strong {
    max-width: 100%;
    overflow: hidden;
    color: var(--ps-white);
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .prediction-odds__labels span { font-size: 0.95rem; font-weight: 900; }
  .prediction-odds__labels div:first-child span { color: #f09aa0; }
  .prediction-odds__labels div:nth-child(2) span { color: var(--ps-gray-700); }
  .prediction-odds__labels div:last-child span { color: #8fb3ff; }
  .prediction-odds__bar {
    display: flex;
    height: 0.65rem;
    overflow: hidden;
    border-radius: 999px;
    background: var(--ps-gray-200);
  }
  .prediction-odds__bar span { display: block; min-width: 0; }
  .prediction-odds__bar-home { background: #f09aa0; }
  .prediction-odds__bar-draw { background: #9ca3af; }
  .prediction-odds__bar-away { background: #8fb3ff; }
  .prediction-odds__note,
  .prediction-odds__empty {
    margin: 0.65rem 0 0;
    color: var(--ps-gray-700);
    font-size: 0.78rem;
    text-align: center;
  }
  .prediction-entry-summary { text-align: center; }
  .prediction-entry-summary__score {
    margin: 0.25rem 0;
    color: var(--ps-gold-light);
    font-size: 2rem;
    font-weight: 900;
  }
  .prediction-entry-summary p { margin: 0.35rem 0; }
  .prediction-winner-list { list-style: none; margin: 0; padding: 0; }
  .prediction-winner-list li {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--ps-gray-200);
  }
  .prediction-winner-list li:last-child { border-bottom: 0; }
  .prediction-logo-field { align-content: start; }
  .prediction-logo-preview { margin-top: 0.4rem; }
  .prediction-winner-check {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    cursor: pointer;
  }
  .prediction-winner-check input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
  }
  .prediction-winner-check span {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    color: transparent;
    border: 2px solid var(--ps-gray-500);
    border-radius: var(--ps-radius-sm);
    background: var(--ps-gray-100);
    font-weight: 900;
  }
  .prediction-winner-check input:checked + span {
    color: var(--ps-black);
    border-color: var(--ps-gold);
    background: var(--ps-gold);
  }
  .prediction-winner-check input:focus-visible + span {
    outline: 2px solid var(--ps-gold-light);
    outline-offset: 2px;
  }
  .visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  @media (max-width: 420px) {
    .prediction-card { padding: 0.9rem; }
    .prediction-match { gap: 0.35rem; padding-inline: 0; }
    .prediction-team__logo,
    .prediction-team__monogram {
      width: 60px;
      height: 60px;
      flex-basis: 60px;
    }
    .prediction-team__name { font-size: 0.85rem; }
    .prediction-score { min-width: 2.8rem; font-size: 1.1rem; }
    .prediction-results-table th,
    .prediction-results-table td { padding: 0.5rem; }
  }

.tournament-section { margin-bottom: 1.5rem; }
.tournament-summary {
  display: grid;
  gap: 0.85rem;
  margin-bottom: 1.25rem;
}
.tournament-summary__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.tournament-summary__item,
.tournament-summary__teams {
  display: grid;
  gap: 0.25rem;
}
.tournament-summary__teams {
  gap: 0.45rem;
}
.tournament-summary__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ps-gray-500);
}
.tournament-summary__value {
  font-weight: 700;
  color: var(--ps-white);
}
.tournament-summary__inactive {
  margin: 0;
  font-size: 0.9rem;
}
.tournament-round {
  margin-bottom: 1rem;
}
.tournament-round__title {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--ps-gold-light);
  letter-spacing: 0.02em;
}
.tournament-match-list {
  display: grid;
  gap: 0.65rem;
}
.tournament-match-card {
  border: 1px solid var(--ps-gray-200, #2a2a2f);
  border-radius: var(--ps-radius-md, 12px);
  padding: 0.85rem 0.9rem;
  background: var(--ps-surface);
}
.tournament-match-card--playoff {
  padding-top: 0.7rem;
}
.tournament-match-card__phase {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ps-gray-500);
}
.tournament-match-card__match {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 0.65rem;
}
.tournament-match-card__team {
  display: flex;
  justify-content: center;
  min-width: 0;
}
.tournament-match-card__team:first-child {
  justify-content: flex-end;
}
.tournament-match-card__team:last-child {
  justify-content: flex-start;
}
.tournament-match-card__score {
  min-width: 4.5rem;
  padding: 0.35rem 0.5rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--ps-gold-light);
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}
.tournament-match-card__score--pending {
  color: var(--ps-gray-500);
  font-size: 1.35rem;
  font-weight: 700;
}
.tournament-standings .team-badge {
  vertical-align: middle;
}
.tournament-champion {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 1rem;
}
.tournament-score-form {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.tournament-score-form__scores {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
.tournament-score-form__penalty-toggle {
  width: fit-content;
  max-width: 100%;
  color: var(--ps-white);
}
.tournament-score-form__penalties {
  display: grid;
  gap: 0.65rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--ps-gray-200, #2a2a2f);
}
.tournament-score-form .btn {
  justify-self: start;
}
@media (max-width: 640px) {
  .tournament-score-form__scores { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .tournament-summary__grid { grid-template-columns: 1fr; }
  .tournament-match-card__match {
    grid-template-columns: 1fr;
    gap: 0.45rem;
    text-align: center;
  }
  .tournament-match-card__team,
  .tournament-match-card__team:first-child,
  .tournament-match-card__team:last-child {
    justify-content: center;
  }
  .tournament-match-card__score {
    order: -1;
    width: 100%;
    max-width: 8rem;
    margin: 0 auto;
  }
}

/* Doorprize spinner */
.doorprize-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 1rem;
  align-items: start;
}
.doorprize-wheel-wrap {
  position: relative;
  width: min(100%, 320px);
  margin: 0.75rem auto;
}
.doorprize-wheel-wrap canvas {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #0d1117, 0 8px 24px rgba(0,0,0,.35);
}
.doorprize-pointer {
  position: absolute;
  top: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 22px solid #f0f3f6;
  z-index: 2;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.4));
}
.doorprize-winner {
  text-align: center;
  font-weight: 700;
  min-height: 1.5rem;
  margin: 0.5rem 0 0;
}
.doorprize-winners,
.doorprize-pool {
  margin: 0;
  padding-left: 1.25rem;
  display: grid;
  gap: 0.35rem;
}
.doorprize-pool {
  list-style: none;
  padding-left: 0;
}
.doorprize-pool li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
@media (max-width: 800px) {
  .doorprize-layout { grid-template-columns: 1fr; }
}
