/* VolleyPoint web clarity. Native web controls, not an emulated iOS shell.
   Loaded last in the head; trusted template allowlist supplies the scope.
   Do not change visibility, layout/size of courts, team colours or score actions. */
body[data-vp-interface] {
  --vp-ui-font: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --vp-ui-ink: #182438;
  --vp-ui-muted: #526176;
  --vp-ui-page: #f5f6f8;
  --vp-ui-surface: #fff;
  --vp-ui-soft: #f1f3f6;
  --vp-ui-line: #dce1e8;
  --vp-ui-blue: #075ecf;
  --vp-ui-focus: #075ecf;
  --vp-ui-shadow: 0 4px 18px #18243808;
  font-family: var(--vp-ui-font);
}
/* Public spectator theme stays user-controlled. No automatic theme switching. */
[data-theme="dark"] body[data-vp-interface], body[data-vp-interface][data-theme="dark"] {
  --vp-ui-ink: #f2f4f8;
  --vp-ui-muted: #bac4d4;
  --vp-ui-page: #11151d;
  --vp-ui-surface: #1c222e;
  --vp-ui-soft: #272f3d;
  --vp-ui-line: #414c5d;
  --vp-ui-blue: #82b5ff;
  --vp-ui-focus: #82b5ff;
  --vp-ui-shadow: 0 4px 18px #0002;
}
body[data-vp-interface]:not([data-vp-interface="broadcast"]) {
  background: var(--vp-ui-page);
  color: var(--vp-ui-ink);
  --muted: var(--vp-ui-muted);
  --line: var(--vp-ui-line);
}
body[data-vp-interface] :where(button, input, textarea, select) { font-family: inherit; }
body[data-vp-interface] :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--vp-ui-focus);
  outline-offset: 3px;
}
body[data-vp-interface] :where(input, select, textarea)[aria-invalid="true"] {
  border-color: #b42338;
  outline-color: #b42338;
}
/* Common forms. Radios/checkboxes, colour swatches, hidden inputs and range
   controls retain their native semantics and specialized geometry. */
body[data-vp-interface]:not([data-vp-interface="broadcast"]) :where(
  input:not([type]), input[type="text"], input[type="email"], input[type="password"],
  input[type="tel"], input[type="url"], input[type="search"], input[type="number"],
  input[type="date"], input[type="time"], input[type="datetime-local"], select, textarea
) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--vp-ui-line);
  border-radius: 10px;
  background-color: var(--vp-ui-surface);
  color: var(--vp-ui-ink);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.45;
  padding: 10px 12px;
  box-shadow: none;
}
body[data-vp-interface]:not([data-vp-interface="broadcast"]) select { padding-inline-end: 36px; }
body[data-vp-interface] textarea { resize: vertical; }
body[data-vp-interface] :where(input, textarea)::placeholder { color: var(--vp-ui-muted); opacity: 1; }
body[data-vp-interface] :where(input, select, textarea):disabled { opacity: .65; cursor: not-allowed; }
body[data-vp-interface] :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--vp-ui-blue); }
body[data-vp-interface="standard"] :where(h1, h2, h3) { letter-spacing: -.025em; line-height: 1.2; font-weight: 700; }
body[data-vp-interface="standard"] :where(label, legend) { line-height: 1.5; }
body[data-vp-interface="standard"] :where(.button, .ops-button) {
  min-height: 44px;
  height: auto;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  padding: 11px 18px;
  white-space: normal;
  text-align: center;
  box-shadow: none;
  text-decoration: none;
}
body[data-vp-interface="standard"] :is(.button.primary, .ops-button.primary) {
  background: #075ecf;
  color: #fff;
  border-color: #075ecf;
}
body[data-vp-interface="standard"] :is(.button.secondary, .button.ghost, .button.light) {
  background: var(--vp-ui-surface);
  border: 1px solid var(--vp-ui-line);
  color: var(--vp-ui-ink);
}
body[data-vp-interface="standard"] :where(.text-button, .back-button) { font-weight: 600; }
/* Destructive actions and live/warning/error/success badges keep original colors. */
body[data-vp-interface="standard"] :where(.button, .ops-button):hover:not(:disabled) { transform: none; }
body[data-vp-interface="standard"] :where(.button, .ops-button):active:not(:disabled) { filter: brightness(.94); }
body[data-vp-interface="standard"] :where(.button, .ops-button):disabled { cursor: not-allowed; }

/* Header and shared menus: retain existing auth visibility, sticky offsets and
   mobile menu behavior. The main navigation stays prominent. */
body[data-vp-interface] > .vp-site-header {
  font-family: var(--vp-ui-font) !important;
  box-shadow: 0 1px 0 #1824380a !important;
}
body[data-vp-interface] .vp-site-nav > a { font-weight: 650 !important; }
body[data-vp-interface] :where(.vp-language-menu, .vp-account-menu-panel) {
  border-radius: 16px !important;
  box-shadow: 0 12px 40px #1824381f !important;
}
body[data-vp-interface] :where(.vp-language-option, .vp-account-menu-panel a) {
  font-family: var(--vp-ui-font) !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
}

/* Home, sign-in and profile: product imagery remains; decorative card shadows
   and backgrounds are restrained. Existing primary calls to action stay put. */
body[data-vp-page="home"] :where(.hero-home, .feature-section, .screenshot-section, .account-cta) {
  background: transparent;
}
body[data-vp-page="home"] :is(.feature-section, .account-cta) { color: var(--vp-ui-ink); box-shadow: none; }
body[data-vp-page="home"] :is(.feature-section .section-heading > p:last-child, .feature-grid p, .account-cta > div > p:last-child) { color: var(--vp-ui-muted); }
body[data-vp-page="home"] .feature-grid article { background: var(--vp-ui-surface); }
body[data-vp-page="home"] .feature-grid article:hover { background: var(--vp-ui-surface); transform: none; }
body[data-vp-page="home"] :is(.feature-icon, .account-cta .eyebrow-home) { color: var(--vp-ui-blue); }
body[data-vp-page="home"] .account-cta { border: 1px solid var(--vp-ui-line); border-radius: 18px; }
body[data-vp-page="home"] .account-cta .button.light { color: #fff; background: #075ecf; border-color: #075ecf; }
body[data-vp-page="home"] .hero-copy h1 { font-weight: 750; line-height: 1.06; }
body[data-vp-page="home"] :where(.hero-lead, .section-heading p) { color: var(--vp-ui-muted); line-height: 1.6; }
/* Download block intentionally remains dark: store marks and light copy were
   designed together. Only its chrome is simplified. */
body[data-vp-page="home"] .store-section { border-radius: 18px; box-shadow: var(--vp-ui-shadow); }
body[data-vp-page="home"] :where(.feature-grid > article, .feature-grid > div, .discipline, .screenshot-card) {
  border-radius: 18px;
  border-color: var(--vp-ui-line);
  box-shadow: var(--vp-ui-shadow);
}
body[data-vp-page="home"] .feature-icon { border-radius: 12px; box-shadow: none; }
body[data-vp-page="account"] .account-page-heading h1 { font-size: clamp(30px, 4.5vw, 48px); line-height: 1.12; }
body[data-vp-page="account"] :where(.account-profile-card, .account-section) {
  border-radius: 18px;
  border-color: var(--vp-ui-line);
  background: var(--vp-ui-surface);
  box-shadow: var(--vp-ui-shadow);
}
body[data-vp-page="account"] .account-section h2 { font-size: 21px; }
body[data-vp-interface="standard"] :where(.auth-form, .profile-panel) { line-height: 1.55; }
body[data-vp-interface="standard"] .legal-check { font-size: 14px; font-weight: 400; line-height: 1.5; }
body[data-vp-interface="standard"] :where(.cloud-note, .small-note) { color: var(--vp-ui-muted); line-height: 1.55; }

/* Catalog and public pages: no resizing of the map or virtualized lists. */
body[data-vp-page="tournament-catalog"] .catalog-hero { background: transparent; }
body[data-vp-page="tournament-catalog"] .catalog-hero h1 { font-size: clamp(32px, 5vw, 52px); }
body[data-vp-page="tournament-catalog"] :where(.catalog-card, .catalog-map-card, .catalog-filters) {
  border-radius: 18px;
  border-color: var(--vp-ui-line);
  background: var(--vp-ui-surface);
  box-shadow: var(--vp-ui-shadow);
}
body[data-vp-page="tournament-catalog"] .catalog-card:hover { transform: none; box-shadow: 0 0 0 1px var(--vp-ui-blue); }
body[data-vp-page="tournament-catalog"] .catalog-search input { padding-inline-start: 46px; }
body[data-vp-interface="standard"] .search-box input { border: 0; background: transparent; }
body[data-vp-page="tournament-application"] :where(.panel, .consents) { border-radius: 16px; box-shadow: none; }
body[data-vp-page="tournament-application"] .panel { border-color: var(--vp-ui-line); }
body[data-vp-page="tournament-application"] .hero h1 { font-size: clamp(30px, 5vw, 46px); line-height: 1.15; }
body[data-vp-page="tournament-application"] .consents { background: var(--vp-ui-soft); }
body[data-vp-page="info"] article { border-radius: 18px; box-shadow: none; }
body[data-vp-page="info"] article :where(p, li) { line-height: 1.7; }

/* Organizer/organization workspaces and operational pages share quiet surfaces. */
body[data-vp-interface="standard"] :where(
  .state-card, .tournament-card, .summary-card, .panel, .panel-card,
  .ops-panel, .ops-card, .ops-match, .staff-card, .application-card,
  .announcement-editor, .application-note, .invite-card
) {
  border-color: var(--vp-ui-line);
  border-radius: 16px;
  box-shadow: var(--vp-ui-shadow);
}
body[data-vp-interface="standard"] :where(.state-card, .summary-card, .panel-card, .staff-card, .application-card, .ops-panel, .ops-card) {
  background: var(--vp-ui-surface);
}
body[data-vp-interface="standard"] :where(.page-heading h1, .detail-header h1, .ops-shell h1) {
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.18;
}
body[data-vp-interface="standard"] :where(.detail-tabs, .resource-tabs, .view-filters, .catalog-tabs) {
  background: var(--vp-ui-soft);
  border-radius: 12px;
}
body[data-vp-interface="standard"] :where(.detail-tabs, .resource-tabs, .view-filters, .catalog-tabs) > button {
  min-height: 44px;
  border-radius: 9px;
  font-weight: 600;
  font-size: 14px;
}
body[data-vp-interface="standard"] :where(.detail-tabs, .resource-tabs, .view-filters, .catalog-tabs) > button.active {
  color: var(--vp-ui-ink);
  background: var(--vp-ui-surface);
  box-shadow: 0 1px 4px #18243812;
}
body[data-vp-interface="standard"] :where(.progressive-details, .ops-court, .review-summary) { border-radius: 12px; }
body[data-vp-interface="standard"] .ops-court { background: var(--vp-ui-soft); }
body[data-vp-interface="standard"] :where(.form-grid, .form-grid .field, .ops-tools label, .ops-field) { min-width: 0; }
body[data-vp-page="organization-admin"] :where(.metric, .logo-editor, .panel-card) { border-radius: 16px; box-shadow: none; }
body[data-vp-page="public-organization"] :where(.card, .stat) { border-radius: 16px; box-shadow: none; }
/* Organization hero retains the organization's own primary/secondary colours. */
body[data-vp-page="system-admin"] .card { border-radius: 14px; border-color: var(--vp-ui-line); box-shadow: none; }
body[data-vp-page="system-admin"] :where(button, .toolbar a) { min-height: 44px; border-radius: 9px; font-weight: 600; }
body[data-vp-page="system-admin"] button.primary { background: #075ecf; color: #fff; border-color: #075ecf; }
body[data-vp-page="system-admin"] :where(th, td) { padding: 12px; }

/* Dialog geometry stays native. Never set display here: a closed dialog must
   remain closed; the previously shipped tournament wizard keeps its own layout. */
body[data-vp-interface]:not([data-vp-interface="broadcast"]) dialog:not(#editorDialog) {
  box-sizing: border-box;
  max-width: calc(100vw - 24px);
  max-height: calc(100dvh - 32px);
  border: 1px solid var(--vp-ui-line);
  border-radius: 18px;
  background: var(--vp-ui-surface);
  color: var(--vp-ui-ink);
  box-shadow: 0 24px 80px #18243826;
}
body[data-vp-interface] dialog::backdrop { background: #10182766; backdrop-filter: blur(4px); }
body[data-vp-interface] :where(.dialog-head h2, .vp-feedback-head h2) { font-size: clamp(21px, 3vw, 28px); font-weight: 700; letter-spacing: -.02em; }
body[data-vp-interface] :where(.close-button, .vp-feedback-close) { min-width: 44px; min-height: 44px; border-radius: 10px; }
body[data-vp-interface] :where(.dialog-actions, .vp-feedback-actions) { gap: 10px; }
body[data-vp-interface] .vp-feedback-dialog { border-radius: 18px !important; }
body[data-vp-interface] .vp-feedback-submit { border-radius: 10px; font-weight: 600; box-shadow: none; }
body[data-vp-interface] .vp-feedback-dialog :where(input, textarea, select) { font-size: 16px; }
body[data-vp-interface] #vp-cookie-banner {
  font-family: var(--vp-ui-font);
  border-radius: 16px;
  border-color: #dce1e8;
  box-shadow: 0 8px 32px #1824381a;
}
body[data-vp-interface] #vp-cookie-banner button {
  font-family: var(--vp-ui-font);
  min-height: 44px;
  border-radius: 10px;
}
body[data-vp-interface] #vp-cookie-banner .vp-cookie-accept { background: #075ecf; border-color: #075ecf; }
body[data-vp-interface] .vp-cookie-settings { font-family: var(--vp-ui-font); border-radius: 9px; }

/* Referee and demo: keep court geometry, team/action colours, mobile dock,
   fullscreen layout, score typography and history sequence exactly as before. */
body[data-vp-interface="referee"] :where(.state-card, .match-card, .rf-history, .rf-details, .demo-start, .demo-stage) {
  border-radius: 16px;
  border-color: var(--vp-ui-line);
  box-shadow: var(--vp-ui-shadow);
}
body[data-vp-interface="referee"] :where(.page-heading h1, .demo-intro h1) { font-weight: 750; }
body[data-vp-interface="referee"] :where(.demo-lead, .demo-bottom p) { color: var(--vp-ui-muted); }
body[data-vp-interface="referee"] .rf-history { background: var(--vp-ui-surface); }
body[data-vp-interface="spectator"] {
  --ink: var(--vp-ui-ink);
  --card: var(--vp-ui-surface);
  --soft: var(--vp-ui-soft);
  --page: var(--vp-ui-page);
  --shadow: var(--vp-ui-shadow);
}
body[data-vp-interface="spectator"] :where(.card, .match-card, .info-card) { border-radius: 18px; backdrop-filter: none; }
body[data-vp-interface="spectator"] :where(.hero h1, .info-card h2) { font-weight: 700; letter-spacing: -.025em; line-height: 1.2; }
body[data-vp-interface="spectator"] :where(.tab, .action-button, .icon-button) { min-height: 44px; font-weight: 600; }
body[data-vp-interface="spectator"] .icon-button { min-width: 44px; }
body[data-vp-interface="spectator"] .match-card:hover { transform: none; }
/* Broadcast/OBS: no surface/background/opacity rules, preserve transparency. */
body[data-vp-interface="broadcast"] { --vp-ui-focus: #9ac3ff; }

@media (max-width: 640px) {
  body[data-vp-interface="standard"] :where(.dialog-actions, .ops-actions, .dashboard-tools) { flex-wrap: wrap; }
  body[data-vp-interface="standard"] :where(.dialog-actions, .ops-actions) > .button { flex: 1 1 auto; }
  body[data-vp-page="account"] .account-profile-card { padding: 20px; }
  body[data-vp-page="tournament-application"] .panel { padding: 20px 16px; }
  body[data-vp-interface="standard"] :where(.form-grid label, .ops-tools label) { overflow-wrap: anywhere; }
  body[data-vp-interface="standard"] :where(.page-heading, .detail-title-row) { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-vp-interface] *, body[data-vp-interface] *::before, body[data-vp-interface] *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
@media (forced-colors: active) {
  body[data-vp-interface] :where(button, .button, input, select, textarea) { border: 1px solid ButtonText; }
  body[data-vp-interface] :focus-visible { outline-color: Highlight; }
}