:root {
      --bg: #071f22;
      --bg2: #0f3438;
      --panel: rgba(255,255,255,.08);
      --panelSolid: #ffffff;
      --text: #ffffff;
      --muted: #d1dfe1;
      --cardText: #102326;
      --cardMuted: #667d82;
      --border: rgba(255,255,255,.12);
      --button: #09252a;
      --buttonHover: #103136;
      --shadow: 0 12px 28px rgba(0,0,0,.18);
      --safe-top: env(safe-area-inset-top, 0px);
      --safe-bottom: env(safe-area-inset-bottom, 0px);
    }

    * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
    html, body { margin: 0; padding: 0; scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
    body {
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--text);
      background: radial-gradient(circle at 18% 12%, rgba(143, 220, 231, 0.22), transparent 32%), radial-gradient(circle at 86% 18%, rgba(15, 82, 87, 0.38), transparent 34%), linear-gradient(135deg, #071f22 0%, #0f3438 48%, #09252a 100%) fixed;
    }

    .info-card {
      background: #ffffff;
      color: #102326;
      border-radius: 20px;
      padding: 18px;
      box-shadow: 0 8px 24px rgba(15,23,42,.12);
      border: 1px solid #d7e3e5;
      margin-top: 14px;
    }

    .info-card h2 {
      margin: 0 0 10px;
      font-size: 22px;
      line-height: 1.15;
    }

    .info-card p {
      margin: 0 0 12px;
      color: #667d82;
      font-size: 14px;
      line-height: 1.6;
    }

    .info-card p:last-child {
      margin-bottom: 0;
    }

    .wrap {
      width: min(100%, 1100px);
      max-width: 1100px;
      margin: 0 auto;
      padding: calc(16px + var(--safe-top)) 16px calc(20px + var(--safe-bottom));
      min-width: 0;
    }

    .hero, .panel {
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 24px;
      padding: 24px;
      box-shadow: var(--shadow);
      margin-bottom: 16px;
      backdrop-filter: blur(8px);
      max-width: 100%;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    h1 {
      margin: 0 0 10px;
      font-size: clamp(30px, 5vw, 46px);
      line-height: 1.05;
    }

    h2 {
      margin: 0 0 10px;
      font-size: clamp(24px, 3vw, 32px);
      line-height: 1.15;
    }

    h3 {
      margin: 0 0 8px;
      font-size: 20px;
      color: var(--cardText);
    }

    .hero p, .panel-intro {
      margin: 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.6;
      max-width: 850px;
    }

    .btn-row {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 18px;
      min-width: 0;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 46px;
      padding: 12px 16px;
      border-radius: 14px;
      background: var(--button);
      color: white;
      text-decoration: none;
      font-weight: 800;
      font-size: 14px;
      transition: background .15s ease, transform .08s ease;
      box-shadow: 0 2px 8px rgba(15,23,42,.08);
      border: 0;
      cursor: pointer;
    }

    .btn:hover { background: var(--buttonHover); }
    .btn:active { transform: scale(.99); }
    .btn[aria-disabled="true"] {
      background: rgba(9,37,42,.55);
      cursor: default;
      pointer-events: none;
    }

    .event-list {
      display: grid;
      gap: 14px;
      min-width: 0;
    }

    .event-item {
      background: var(--panelSolid);
      color: var(--cardText);
      border-radius: 20px;
      padding: 18px;
      box-shadow: 0 8px 24px rgba(15,23,42,.12);
      border: 1px solid #d7e3e5;
      max-width: 100%;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .event-item h3 { margin-bottom: 6px; }
    .event-item p { margin: 0; color: var(--cardMuted); }

    .event-item-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: 12px 0 14px;
    }

    .event-item-meta span {
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      padding: 5px 9px;
      border-radius: 999px;
      background: rgba(9,37,42,.08);
      color: #36585d;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .event-item-changelog {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      max-width: 100%;
      margin: 0 0 14px;
      min-height: 28px;
      padding: 5px 10px;
      border-radius: 10px;
      background: rgba(9,37,42,.07);
      border: 1px solid rgba(9,37,42,.10);
      color: #36585d;
      font-size: 12px;
      font-weight: 900;
      line-height: 1.25;
    }

    .kicker {
      display: inline-block;
      margin-bottom: 12px;
      padding: 6px 10px;
      border-radius: 999px;
      background: rgba(255,255,255,.12);
      border: 1px solid rgba(255,255,255,.15);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .footer-note {
      margin-top: 14px;
      color: #c5d4d6;
      font-size: 13px;
      line-height: 1.4;
    }

    #site-nav-placeholder {
      position: relative;
      z-index: 5000;
    }

    .hero,
    .hero-card,
    header,
    main,
    .section,
    .section-card {
      position: relative;
      z-index: 1;
    }

    .legal-links-card {
      background: #ffffff;
      color: #102326;
      border-radius: 20px;
      padding: 18px;
      box-shadow: 0 8px 24px rgba(15,23,42,.12);
      border: 1px solid #d7e3e5;
      margin-top: 14px;
      max-width: 100%;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .legal-links-card h2 {
      margin: 0 0 10px;
      font-size: 22px;
      line-height: 1.15;
    }

    .legal-links-card p {
      margin: 0 0 14px;
      color: #667d82;
      font-size: 14px;
      line-height: 1.6;
    }

    .view-all-row {
      margin-top: 14px;
    }

    @media (max-width: 800px) {
      body { background-attachment: scroll; }
      .wrap { padding: calc(12px + var(--safe-top)) 12px calc(16px + var(--safe-bottom)); }
      .hero, .panel { border-radius: 18px; padding: 18px; }
      .event-item { border-radius: 16px; padding: 16px; }
    }

    @media (max-width: 700px) {
      .btn-row {
        display: grid;
        grid-template-columns: 1fr;
      }

      .btn-row .btn {
        width: 100%;
        max-width: 100%;
        white-space: normal;
      }

      .legal-links-card {
        border-radius: 16px;
        padding: 16px;
      }
    }

    .event-item-kingsday {
      background: linear-gradient(180deg, #fff1da, #ffe2b3);
      border-color: #ffb347;
      box-shadow: 0 10px 24px rgba(245, 124, 0, 0.16);
    }

    .event-item-kingsday h3 {
      color: #8f3b00;
    }

    .event-item-kingsday p {
      color: #9a4b00;
    }

    .event-item-kingsday .event-item-meta span {
      background: rgba(245, 124, 0, 0.14);
      color: #8f3b00;
    }

    .event-item-kingsday .btn {
      background: linear-gradient(180deg, #ff9800, #f57c00);
    }

    .event-item-kingsday .btn:hover {
      background: linear-gradient(180deg, #ffa726, #fb8c00);
    }

    .event-item-kingsday .btn[aria-disabled="true"] {
      background: rgba(245, 124, 0, 0.55);
    }



    .weekend-empty {
      margin: 0 0 14px;
      padding: 18px;
      border-radius: 18px;
      background: rgba(255,255,255,.08);
      border: 1px dashed rgba(255,255,255,.2);
      color: var(--muted);
      line-height: 1.6;
      backdrop-filter: blur(8px);
    }

    .event-date-badge {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      margin-bottom: 10px;
      padding: 6px 10px;
      border-radius: 999px;
      background: rgba(9,37,42,.08);
      color: #36585d;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .event-item-kingsday .event-date-badge {
      background: rgba(245, 124, 0, 0.14);
      color: #8f3b00;
    }

    .event-item-halloween {
      background: linear-gradient(180deg, #f6edff, #ffe3c7);
      border-color: #fb923c;
      box-shadow: 0 10px 24px rgba(126, 34, 206, 0.16);
    }

    .event-item-halloween h3 {
      color: #4c1d95;
    }

    .event-item-halloween p {
      color: #7c2d12;
    }

    .event-item-halloween .event-item-meta span,
    .event-item-halloween .event-date-badge {
      background: rgba(249, 115, 22, 0.14);
      color: #7c2d12;
    }

    .event-item-halloween .btn {
      background: linear-gradient(180deg, #7c3aed, #ea580c);
    }

    .event-item-halloween .btn:hover {
      background: linear-gradient(180deg, #8b5cf6, #f97316);
    }

    .event-item-halloween .btn[aria-disabled="true"] {
      background: rgba(249, 115, 22, 0.55);
    }

    .event-item-christmas {
      background: linear-gradient(180deg, #e9fff1, #ffe9e9);
      border-color: #4ade80;
      box-shadow: 0 10px 24px rgba(22, 101, 52, 0.14);
    }

    .event-item-christmas h3 {
      color: #14532d;
    }

    .event-item-christmas p {
      color: #7f1d1d;
    }

    .event-item-christmas .event-item-meta span,
    .event-item-christmas .event-date-badge {
      background: rgba(34, 197, 94, 0.14);
      color: #14532d;
    }

    .event-item-christmas .btn {
      background: linear-gradient(180deg, #16a34a, #b91c1c);
    }

    .event-item-christmas .btn:hover {
      background: linear-gradient(180deg, #22c55e, #dc2626);
    }

    .event-item-christmas .btn[aria-disabled="true"] {
      background: rgba(34, 197, 94, 0.55);
    }


#seo-event-links ul { margin: 12px 0 0; padding-left: 20px; }
#seo-event-links li + li { margin-top: 6px; }
#seo-event-links a { color: inherit; }

html[data-bc-theme="dark"] {
  --bg: #03080a;
  --bg2: #071317;
  --panel: rgba(8, 18, 23, 0.86);
  --panelSolid: #091217;
  --text: #e5eef0;
  --muted: #b6c7cc;
  --cardText: #e5eef0;
  --cardMuted: #b6c7cc;
  --border: rgba(148, 163, 184, 0.26);
  --button: #020617;
  --buttonHover: #0f172a;
  color-scheme: dark;
}

html[data-bc-theme="dark"] body {
  background:
    radial-gradient(circle at 18% 12%, rgba(20, 184, 166, 0.12), transparent 34%),
    radial-gradient(circle at 86% 18%, rgba(14, 116, 144, 0.16), transparent 36%),
    linear-gradient(135deg, #03080a 0%, #071317 48%, #05090c 100%) fixed;
}

html[data-bc-theme="dark"] .info-card,
html[data-bc-theme="dark"] .event-item,
html[data-bc-theme="dark"] .legal-links-card,
html[data-bc-theme="dark"] .hero,
html[data-bc-theme="dark"] .panel,
html[data-bc-theme="dark"] .weekend-empty {
  border-color: var(--border);
  background: rgba(8, 18, 23, 0.94);
  color: var(--text);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
}

html[data-bc-theme="dark"] .info-card p,
html[data-bc-theme="dark"] .event-item p,
html[data-bc-theme="dark"] .legal-links-card p,
html[data-bc-theme="dark"] .event-item-meta span,
html[data-bc-theme="dark"] .event-date-badge,
html[data-bc-theme="dark"] .event-item-changelog {
  color: var(--cardMuted);
}

html[data-bc-theme="dark"] .event-item-meta span,
html[data-bc-theme="dark"] .event-date-badge,
html[data-bc-theme="dark"] .event-item-changelog {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(148, 163, 184, 0.12);
}