    :root {
      --ink: #15120d;
      --muted: #4f493f;
      --line: #ddd5c5;
      --paper: #fffdf7;
      --canvas: #fbf7ed;
      --gold: #f1b82d;
      --gold-dark: #b68412;
      --green: #1d5c4f;
      --green-soft: #e7f3ed;
      --red: #9e2f21;
      --red-soft: #fbeaea;
      --blue-soft: #eaf1f8;
      --shadow: 0 24px 70px rgba(25, 18, 8, 0.18);
      --radius: 8px;
    }

    * { box-sizing: border-box; }

    html { scroll-behavior: smooth; }

    body {
      margin: 0;
      background: var(--canvas);
      color: var(--ink);
      font-family: "IBM Plex Sans", sans-serif;
      font-size: 16px;
      line-height: 1.45;
    }

    button,
    input,
    select,
    textarea { font: inherit; }

    button,
    a,
    input,
    select,
    textarea { outline-offset: 3px; }

    button:focus-visible,
    a:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible { outline: 3px solid var(--gold-dark); }

    button { cursor: pointer; }

    .prototype-banner {
      padding: 10px 24px;
      background: var(--ink);
      color: white;
      text-align: center;
      font-weight: 700;
    }

    .prototype-banner span { color: var(--gold); }

    .site-header {
      display: flex;
      gap: 20px;
      align-items: center;
      justify-content: space-between;
      padding: 20px clamp(20px, 4vw, 56px);
      background: var(--paper);
      border-bottom: 1px solid var(--line);
    }

    .brand {
      display: flex;
      gap: 14px;
      align-items: center;
    }

    button.brand {
      padding: 0;
      border: 0;
      background: transparent;
      color: inherit;
      text-align: left;
    }

    .brand-mark {
      display: grid;
      width: 48px;
      height: 48px;
      place-items: center;
      border-radius: 50%;
      background: var(--gold);
      color: var(--ink);
      font-family: "Besley", serif;
      font-weight: 700;
    }

    .brand strong,
    .brand span { display: block; }

    .brand strong {
      font-family: "Besley", serif;
      font-size: 1.2rem;
    }

    .brand span { color: var(--muted); }

    .header-actions,
    .heading-actions,
    .row-actions,
    .save-actions,
    .preview-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
    }

    .button {
      min-height: 48px;
      padding: 11px 18px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--paper);
      color: var(--ink);
      font-weight: 700;
      text-decoration: none;
    }

    .button:hover { border-color: var(--gold-dark); }

    .button.primary {
      border-color: var(--ink);
      background: var(--ink);
      color: white;
    }

    .button.primary:hover {
      border-color: var(--gold-dark);
      background: var(--gold-dark);
    }

    .button.danger {
      border-color: #e8bcbc;
      color: var(--red);
    }

    .page-tabs-wrap {
      padding: 16px clamp(20px, 4vw, 56px);
      background: var(--paper);
      border-bottom: 1px solid var(--line);
    }

    .page-tabs-label {
      display: block;
      margin-bottom: 10px;
      color: var(--muted);
      font-weight: 700;
    }

    .page-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .page-tab {
      min-height: 50px;
      padding: 12px 18px;
      border: 2px solid transparent;
      border-radius: 10px;
      background: transparent;
      color: var(--ink);
      font-weight: 750;
    }

    .page-tab:hover { background: #f5f1e7; }

    .page-tab.active {
      border-color: var(--gold-dark);
      background: #fff6d8;
      color: #533900;
    }

    .page-shell {
      width: min(1540px, 100%);
      margin: 0 auto;
      padding: 30px clamp(20px, 4vw, 56px) 56px;
    }

    .breadcrumb {
      margin-bottom: 12px;
      color: var(--muted);
    }

    .page-heading {
      display: flex;
      gap: 24px;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 28px;
    }

    .page-heading-copy { max-width: 760px; }

    h1,
    h2,
    h3 {
      margin: 0;
      font-family: "Besley", serif;
      line-height: 1.15;
    }

    h1 { font-size: clamp(2rem, 4vw, 3.3rem); }
    h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
    h3 { font-size: 1.25rem; }

    .page-heading p,
    .section-heading p,
    .card p,
    .row-copy p { margin: 6px 0 0; color: var(--muted); }

    .workspace {
      display: grid;
      grid-template-columns: minmax(220px, 270px) minmax(0, 1fr);
      gap: 24px;
      align-items: start;
    }

    .section-nav {
      display: grid;
      gap: 8px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .section-nav-label {
      margin-bottom: 4px;
      color: var(--muted);
      font-weight: 800;
    }

    .section-link {
      min-height: 58px;
      padding: 12px 14px;
      border: 2px solid transparent;
      border-radius: 10px;
      background: transparent;
      color: var(--ink);
      font-weight: 750;
      text-align: left;
    }

    .section-link:hover { background: var(--canvas); }

    .section-link.active {
      border-color: var(--gold-dark);
      background: #fff6d8;
      color: #533900;
    }

    .main-content {
      display: grid;
      gap: 22px;
      min-width: 0;
    }

    .section-heading {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      align-items: flex-end;
      justify-content: space-between;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
    }

    .card {
      padding: 22px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .stat-grid,
    .quick-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
    }

    .stat-card span,
    .stat-card strong { display: block; }

    .stat-card span { color: var(--muted); font-weight: 700; }

    .stat-card strong {
      margin: 4px 0;
      font-family: "Besley", serif;
      font-size: 2rem;
    }

    .quick-card {
      display: grid;
      gap: 12px;
      align-content: start;
    }

    .admin-home-panel {
      display: grid;
      gap: 18px;
      min-width: 0;
    }

    .admin-home-panel-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      padding-bottom: 16px;
      border-bottom: 1px solid var(--line);
    }

    .admin-home-panel-head > div { max-width: 760px; }
    .admin-home-panel-head h2 { font-size: clamp(1.65rem, 2.2vw, 2.2rem); }
    .admin-home-panel-head p { max-width: 690px; margin: 7px 0 0; color: var(--muted); }

    .admin-home-kicker {
      display: block;
      margin-bottom: 6px;
      color: #795700;
      font-size: .76rem;
      font-weight: 900;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .admin-home-count {
      display: flex;
      align-items: baseline;
      gap: 7px;
      color: #795700;
      white-space: nowrap;
    }

    .admin-home-count strong { font: 800 2rem/1 "Besley", serif; }
    .admin-home-count small { color: var(--muted); font-weight: 800; }

    .admin-task-list,
    .admin-history-list {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .admin-task-list article {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) auto;
      gap: 18px;
      align-items: center;
      min-height: 116px;
      padding: 20px 22px;
    }

    .admin-task-list article + article,
    .admin-history-list article + article { border-top: 1px solid var(--line); }

    .admin-task-number,
    .admin-history-mark,
    .admin-job-icon {
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      width: 42px;
      height: 42px;
      border: 1px solid #d8b85c;
      border-radius: 10px;
      background: #fff8e5;
      color: #684b00;
      font-weight: 900;
    }

    .admin-task-list h3 {
      margin-top: 8px;
      font-size: 1.13rem;
    }

    .admin-task-list p { margin: 5px 0 0; color: var(--muted); }

    .admin-task-list button,
    .admin-history-list button {
      min-height: 46px;
      padding: 11px 16px;
      border: 1.5px solid var(--ink);
      border-radius: 9px;
      background: #fff;
      color: var(--ink);
      font-weight: 850;
      white-space: nowrap;
    }

    .admin-task-list button:hover,
    .admin-history-list button:hover,
    .admin-job-grid > button:hover { background: #fff8e5; }

    .admin-job-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .admin-job-grid > button {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      min-height: 92px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      color: var(--ink);
      text-align: left;
    }

    .admin-job-grid > button span:nth-child(2) { display: grid; gap: 4px; }
    .admin-job-grid strong { font-size: 1rem; }
    .admin-job-grid small { color: var(--muted); font-size: .88rem; line-height: 1.35; }
    .admin-job-grid b { font-size: 1.2rem; }

    .admin-history-list article {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) auto auto;
      gap: 16px;
      align-items: center;
      min-height: 88px;
      padding: 16px 20px;
    }

    .admin-history-list p { margin: 5px 0 0; color: var(--muted); }

    .workspace.admin-home-workspace { grid-template-columns: minmax(0, 1fr); }

    .admin-menu-index {
      display: grid;
      gap: 18px;
    }

    .admin-menu-index-head {
      padding-bottom: 15px;
      border-bottom: 1px solid var(--line);
    }

    .admin-menu-index-head h2 { font-size: clamp(1.5rem, 2vw, 2rem); }
    .admin-menu-index-head p { margin: 6px 0 0; color: var(--muted); }

    .admin-menu-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      align-items: start;
    }

    .admin-menu-card {
      --menu-soft: #f5efe2;
      --menu-accent: #8a6500;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .admin-menu-home,
    .admin-menu-news,
    .admin-menu-about { --menu-soft: #fbf0cf; --menu-accent: #8a6200; }

    .admin-menu-pay,
    .admin-menu-contact { --menu-soft: #e5f0e8; --menu-accent: #246143; }

    .admin-menu-tickets,
    .admin-menu-site { --menu-soft: #e6edf3; --menu-accent: #315a73; }

    .admin-menu-directory,
    .admin-menu-feed { --menu-soft: #eee9f2; --menu-accent: #624c70; }

    .admin-menu-card > header {
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr);
      gap: 12px;
      align-items: start;
      min-height: 92px;
      padding: 15px;
      border-bottom: 1px solid var(--line);
      background: var(--menu-soft);
    }

    .admin-menu-card > header > span {
      display: grid;
      width: 38px;
      height: 38px;
      place-items: center;
      border: 1px solid var(--menu-accent);
      border-radius: 9px;
      background: rgba(255,255,255,.62);
      color: var(--menu-accent);
      font-weight: 900;
    }

    .admin-menu-card h3 { font-size: 1.08rem; }
    .admin-menu-card header p { margin: 4px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.35; }

    .admin-menu-card > div { display: grid; }

    .admin-menu-card > div > button {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      min-height: 44px;
      padding: 10px 14px;
      border: 0;
      border-bottom: 1px solid var(--line);
      background: #fff;
      color: var(--ink);
      font-weight: 800;
      text-align: left;
    }

    .admin-menu-card > div > button:last-child { border-bottom: 0; }
    .admin-menu-card > div > button:hover { background: var(--menu-soft); }
    .admin-menu-card > div > button b { color: var(--menu-accent); font-size: 1.05rem; }

    .icon-box {
      display: grid;
      width: 46px;
      height: 46px;
      place-items: center;
      border-radius: 12px;
      background: #fff6d8;
      color: #533900;
      font-weight: 900;
    }

    .record-list {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .record-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 16px;
      align-items: center;
      min-height: 88px;
      padding: 16px 18px;
      border-top: 1px solid var(--line);
    }

    .record-row:first-child { border-top: 0; }

    .record-row.selected {
      background: #fffaf0;
      box-shadow: inset 5px 0 0 var(--gold);
    }

    .record-row.media {
      grid-template-columns: 118px minmax(0, 1fr) auto;
    }

    .record-row.game {
      grid-template-columns: 148px minmax(0, 1fr) auto;
    }

    .media-thumb {
      width: 118px;
      height: 78px;
      object-fit: cover;
      border-radius: 10px;
      background: var(--canvas);
    }

    .matchup-thumb {
      display: grid;
      grid-template-columns: 52px auto 52px;
      gap: 8px;
      align-items: center;
      justify-content: start;
    }

    .team-logo-box {
      display: grid;
      width: 52px;
      height: 52px;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: white;
    }

    .team-logo-box img {
      width: 42px;
      height: 42px;
      object-fit: contain;
    }

    .matchup-vs {
      color: var(--muted);
      font-weight: 800;
    }

    .featured-matchup {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 18px;
      align-items: center;
      margin-top: 20px;
      padding: 20px;
      border-radius: 14px;
      background: linear-gradient(135deg, #171717, #3a321f);
      color: white;
    }

    .featured-matchup p {
      margin: 6px 0 0;
      color: #e7e1d2;
    }

    .featured-matchup-logos {
      display: flex;
      gap: 12px;
      align-items: center;
    }

    .featured-matchup-logos .team-logo-box {
      width: 72px;
      height: 72px;
    }

    .featured-matchup-logos img {
      width: 58px;
      height: 58px;
    }

    .article-cover-card {
      overflow: hidden;
      padding: 0;
    }

    .article-cover-card img {
      width: 100%;
      aspect-ratio: 16 / 9;
      object-fit: cover;
    }

    .article-cover-card > div {
      display: grid;
      gap: 10px;
      padding: 20px;
    }

    .row-symbol,
    .date-block {
      display: grid;
      min-width: 56px;
      min-height: 56px;
      place-items: center;
      border-radius: 12px;
      background: var(--canvas);
      color: var(--ink);
      font-weight: 900;
      text-align: center;
    }

    .date-block span,
    .date-block strong { display: block; line-height: 1.1; }
    .date-block span { color: var(--muted); font-size: 0.78rem; }
    .date-block strong { font-size: 1.4rem; }

    .row-copy { min-width: 0; }
    .row-copy strong { font-size: 1.05rem; }

    .badge {
      display: inline-flex;
      margin-top: 8px;
      padding: 5px 10px;
      border-radius: 999px;
      background: var(--green-soft);
      color: var(--green);
      font-size: 0.82rem;
      font-weight: 800;
    }

    .badge.warning { background: #fff1e7; color: #7d3b0c; }
    .badge.neutral { background: var(--blue-soft); color: #28527a; }

    .split {
      display: grid;
      grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.2fr);
      gap: 18px;
      align-items: start;
    }

    .form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      margin-top: 20px;
    }

    .field {
      display: grid;
      gap: 7px;
      color: var(--ink);
      font-weight: 750;
    }

    .field.wide { grid-column: 1 / -1; }

    .field input,
    .field select,
    .field textarea {
      width: 100%;
      min-height: 52px;
      padding: 12px 14px;
      border: 2px solid #b8b8b2;
      border-radius: 10px;
      background: white;
      color: var(--ink);
    }

    .field textarea { min-height: 130px; resize: vertical; }

    .help-text {
      margin: 0;
      color: var(--muted);
    }

    .table-wrap {
      overflow-x: auto;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .table-row {
      display: grid;
      grid-template-columns: minmax(180px, 1.1fr) minmax(130px, 0.8fr) minmax(130px, 0.8fr) auto;
      gap: 16px;
      align-items: center;
      min-width: 760px;
      padding: 16px 18px;
      border-top: 1px solid var(--line);
    }

    .table-row:first-child { border-top: 0; }
    .table-head { background: var(--canvas); color: var(--muted); font-weight: 800; }

    .save-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      align-items: center;
      justify-content: space-between;
      padding: 18px 20px;
      border: 2px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .save-message strong,
    .save-message span { display: block; }
    .save-message span { color: var(--muted); }

    .toast {
      position: fixed;
      right: 24px;
      bottom: 24px;
      z-index: 20;
      max-width: 420px;
      padding: 16px 20px;
      border-radius: 12px;
      background: var(--ink);
      color: white;
      box-shadow: 0 18px 48px rgba(0,0,0,0.22);
      font-weight: 700;
      opacity: 0;
      transform: translateY(16px);
      pointer-events: none;
      transition: opacity 160ms ease, transform 160ms ease;
    }

    .toast.show { opacity: 1; transform: translateY(0); }

    .toast.undo {
      display: flex;
      gap: 18px;
      align-items: center;
      justify-content: space-between;
      pointer-events: auto;
    }

    .toast.undo button {
      min-width: 72px;
      min-height: 44px;
      border: 1px solid rgba(255,255,255,0.58);
      border-radius: 9px;
      background: transparent;
      color: white;
      font: inherit;
      font-weight: 800;
    }

    .toast.undo button:disabled { opacity: 0.7; }

    .create-dialog.admin-confirm-dialog { width: min(640px, calc(100% - 32px)); }

    .admin-confirm-dialog .create-dialog-body { display: grid; gap: 20px; }

    .admin-confirm-consequence {
      padding: 18px;
      border-left: 4px solid var(--gold);
      border-radius: 8px;
      background: #fbf5e5;
    }

    .admin-confirm-consequence p { margin: 6px 0 0; color: var(--muted); }

    .admin-confirm-reason { display: grid; gap: 8px; }

    .admin-confirm-reason small { color: var(--muted); font-size: 14px; }

    .admin-confirm-reason .field-error { color: var(--red); }

    .admin-operation-status {
      position: fixed;
      left: 24px;
      bottom: 24px;
      z-index: 40;
      width: min(390px, calc(100vw - 48px));
      overflow: hidden;
      border: 1px solid #b9b6ad;
      border-radius: 10px;
      background: #fffef9;
      color: #20251f;
    }

    .admin-operation-status[hidden] { display: none; }

    .admin-operation-status-copy {
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr);
      gap: 11px;
      padding: 13px 15px 12px;
      align-items: center;
    }

    .admin-operation-status-copy > span:last-child,
    .admin-operation-status strong,
    .admin-operation-status small { display: block; min-width: 0; }

    .admin-operation-status strong { font-size: 13px; line-height: 1.25; }
    .admin-operation-status small { margin-top: 3px; color: #6d736c; font-size: 10px; line-height: 1.4; }

    .admin-operation-status-mark {
      position: relative;
      display: grid;
      width: 36px;
      height: 36px;
      place-items: center;
      border-radius: 50%;
      background: #fff1bf;
      color: #725400;
    }

    .admin-operation-status[data-state="working"] .admin-operation-status-mark::after {
      width: 14px;
      height: 14px;
      border: 2px solid #b38400;
      border-right-color: transparent;
      border-radius: 50%;
      content: "";
      animation: admin-operation-spin .75s linear infinite;
    }

    .admin-operation-status[data-state="success"] { border-color: #8fc6ad; }
    .admin-operation-status[data-state="success"] .admin-operation-status-mark { background: #dff4e9; color: #176348; }
    .admin-operation-status[data-state="success"] .admin-operation-status-mark::after { content: "✓"; font-size: 18px; font-weight: 900; }
    .admin-operation-status[data-state="error"] { border-color: #dda8a8; }
    .admin-operation-status[data-state="error"] .admin-operation-status-mark { background: #fbe4e4; color: #9c2f2f; }
    .admin-operation-status[data-state="error"] .admin-operation-status-mark::after { content: "!"; font-size: 18px; font-weight: 900; }

    .admin-operation-progress { height: 4px; overflow: hidden; background: #ece8dc; }
    .admin-operation-progress span { display: block; width: 38%; height: 100%; background: #d6a718; transform: translateX(-110%); animation: admin-operation-progress 1.15s ease-in-out infinite; }
    .admin-operation-status[data-state="success"] .admin-operation-progress span { width: 100%; background: #2c8967; transform: none; animation: none; }
    .admin-operation-status[data-state="error"] .admin-operation-progress span { width: 100%; background: #b84b4b; transform: none; animation: none; }

    .admin-operation-visible .toast { bottom: 132px; }
    .button.is-busy { cursor: wait; }

    @keyframes admin-operation-spin { to { transform: rotate(360deg); } }
    @keyframes admin-operation-progress {
      0% { transform: translateX(-110%); }
      55% { transform: translateX(120%); }
      100% { transform: translateX(260%); }
    }

    @media (prefers-reduced-motion: reduce) {
      .admin-operation-status[data-state="working"] .admin-operation-status-mark::after { animation: none; border-right-color: #b38400; }
      .admin-operation-progress span { width: 100%; transform: none; animation: none; opacity: .68; }
    }

    .create-dialog {
      width: min(980px, calc(100% - 32px));
      max-height: 92vh;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: 18px;
      background: var(--paper);
      color: var(--ink);
      box-shadow: 0 30px 90px rgba(0,0,0,0.28);
    }

    .create-dialog::backdrop {
      background: rgba(17,17,17,0.64);
      backdrop-filter: blur(3px);
    }

    .create-dialog-shell {
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      max-height: 92vh;
    }

    .create-dialog-header,
    .create-dialog-footer {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      align-items: center;
      justify-content: space-between;
      padding: 20px 24px;
      background: var(--paper);
    }

    .create-dialog-header { border-bottom: 1px solid var(--line); }
    .create-dialog-footer { border-top: 1px solid var(--line); }

    .create-dialog-header-copy {
      display: grid;
      gap: 4px;
      max-width: 720px;
    }

    .create-dialog-header-copy p,
    .create-dialog-footer p {
      margin: 0;
      color: var(--muted);
    }

    .create-dialog-close {
      width: 48px;
      height: 48px;
      padding: 0;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: var(--paper);
      color: var(--ink);
      font-size: 1.5rem;
      font-weight: 700;
    }

    .create-dialog-body {
      overflow-y: auto;
      padding: 24px;
    }

    .create-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
      gap: 24px;
      align-items: start;
    }

    .create-form {
      display: grid;
      gap: 20px;
    }

    .create-form-section {
      display: grid;
      gap: 14px;
      padding-bottom: 20px;
      border-bottom: 1px solid var(--line);
    }

    .create-form-section:last-child {
      padding-bottom: 0;
      border-bottom: 0;
    }

    .create-form-section-heading {
      display: grid;
      gap: 4px;
    }

    .create-form-section-heading p {
      margin: 0;
      color: var(--muted);
    }

    .create-check {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      min-height: 48px;
      padding: 12px 0;
      font-weight: 700;
    }

    .create-check input {
      width: 24px;
      height: 24px;
      margin: 0;
      accent-color: var(--gold-dark);
    }

    .create-preview {
      position: sticky;
      top: 0;
      display: grid;
      gap: 14px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--canvas);
    }

    .create-preview-label {
      color: var(--muted);
      font-weight: 800;
    }

    .create-preview-image {
      width: 100%;
      aspect-ratio: 16 / 9;
      object-fit: cover;
      border-radius: 12px;
      background: white;
    }

    .create-preview-copy {
      display: grid;
      gap: 6px;
    }

    .create-preview-copy p {
      margin: 0;
      color: var(--muted);
    }

    .create-preview-card {
      display: grid;
      gap: 12px;
      min-height: 220px;
      align-content: center;
      padding: 24px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: white;
    }

    .create-preview-card strong,
    .create-preview-card span { display: block; }

    .create-preview-price {
      font-family: "Besley", serif;
      font-size: 2.4rem;
      font-weight: 700;
    }

    .create-matchup-preview {
      display: grid;
      gap: 16px;
      place-items: center;
      min-height: 220px;
      padding: 22px;
      border-radius: 14px;
      background: linear-gradient(135deg, #171717, #3a321f);
      color: white;
      text-align: center;
    }

    .create-matchup-preview .featured-matchup-logos {
      justify-content: center;
    }

    .create-matchup-preview p {
      margin: 0;
      color: #e7e1d2;
    }

    .create-file-preview {
      display: grid;
      gap: 8px;
    }

    .create-file-preview input[type="file"] {
      min-height: 52px;
      padding: 10px;
      border: 2px dashed #aaa79d;
      border-radius: 10px;
      background: var(--canvas);
    }

    .dialog-footer-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
    }

    .preview-shell {
      min-height: 100vh;
      background: var(--paper);
    }

    .preview-toolbar {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      align-items: center;
      justify-content: space-between;
      padding: 18px clamp(20px, 4vw, 56px);
      border-bottom: 1px solid var(--line);
      background: var(--ink);
      color: white;
    }

    .preview-toolbar p { margin: 3px 0 0; color: #d9d9d9; }

    .public-nav,
    .public-content {
      width: min(1180px, calc(100% - 40px));
      margin: 0 auto;
    }

    .public-nav {
      display: flex;
      flex-wrap: wrap;
      gap: 18px;
      align-items: center;
      justify-content: space-between;
      padding: 20px 0;
      border-bottom: 1px solid var(--line);
    }

    .public-links { display: flex; flex-wrap: wrap; gap: 18px; color: var(--muted); }

    .public-hero {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
      gap: 34px;
      align-items: center;
      padding: 70px 0;
      border-bottom: 1px solid var(--line);
    }

    .public-hero p { color: var(--muted); font-size: 1.15rem; }

    .hero-art {
      min-height: 290px;
      overflow: hidden;
      border-radius: 22px;
      background: var(--canvas);
    }

    .hero-art img {
      width: 100%;
      height: 100%;
      min-height: 290px;
      object-fit: cover;
    }

    .public-section { padding: 46px 0; border-bottom: 1px solid var(--line); }

    .public-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
      margin-top: 22px;
    }

    .public-card {
      padding: 22px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: var(--shadow);
    }

    .public-card p { color: var(--muted); }

    /* Match the typography and sizing used by the main website views. */
    .site-header {
      min-height: 78px;
      padding: 14px clamp(18px, 4vw, 54px);
      background: rgba(251, 247, 237, 0.92);
      backdrop-filter: blur(18px);
    }

    .brand-mark {
      width: 34px;
      height: 58px;
      border-radius: 0;
      background: transparent;
    }

    .brand-mark img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .brand strong {
      font-family: "Besley", serif;
      font-size: 18px;
      line-height: 1.05;
    }

    .brand span:not(.brand-mark) {
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
    }

    h1 {
      font-size: clamp(40px, 4vw, 56px);
      font-weight: 800;
      line-height: 1;
    }

    h2 {
      font-size: clamp(26px, 3vw, 40px);
      font-weight: 800;
      line-height: 1.04;
    }

    h3 {
      font-size: 20px;
      font-weight: 700;
      line-height: 1.08;
    }

    .page-heading p {
      font-size: clamp(16px, 1.4vw, 18px);
      line-height: 1.45;
    }

    .section-heading p,
    .card p,
    .row-copy p,
    .help-text,
    .create-dialog-header-copy p,
    .create-form-section-heading p {
      font-size: 14px;
      line-height: 1.42;
    }

    .button {
      min-height: 46px;
      padding: 0 18px;
      border: 1px solid var(--ink);
      border-radius: var(--radius);
      font-size: 14px;
      font-weight: 800;
    }

    .button.primary {
      color: var(--ink);
      background: var(--gold);
      box-shadow: none;
    }

    .button.primary:hover {
      color: var(--ink);
      background: #ffd56a;
      border-color: var(--ink);
    }

    .page-tabs-wrap {
      padding: 14px clamp(18px, 4vw, 54px);
      background: rgba(251, 247, 237, 0.96);
    }

    .page-tabs-label {
      font-size: 12px;
      font-weight: 800;
      text-transform: uppercase;
    }

    .page-tab {
      min-height: 44px;
      padding: 10px 8px;
      border: 0;
      border-bottom: 2px solid transparent;
      border-radius: 0;
      font-size: 14px;
      font-weight: 700;
    }

    .page-tab:hover { background: transparent; }

    .page-tab.active {
      color: var(--ink);
      background: transparent;
      border-color: var(--gold);
    }

    .page-shell {
      padding: clamp(36px, 5vw, 64px) clamp(18px, 4vw, 54px);
    }

    .section-nav,
    .card,
    .record-list,
    .table-wrap,
    .save-bar,
    .create-dialog,
    .create-preview,
    .create-preview-card,
    .public-card {
      border-radius: var(--radius);
    }

    .card,
    .record-list,
    .table-wrap,
    .section-nav,
    .save-bar,
    .create-dialog,
    .public-card {
      background: var(--paper);
    }

    .card,
    .record-list,
    .table-wrap,
    .public-card {
      box-shadow: 0 12px 28px rgba(21,18,13,0.08);
    }

    .section-link {
      min-height: 46px;
      padding: 10px 12px;
      border-radius: 7px;
      font-size: 14px;
      font-weight: 700;
    }

    .section-link.active {
      color: var(--ink);
      background: rgba(241,184,45,0.22);
      border-color: var(--gold-dark);
    }

    .row-copy strong { font-size: 16px; }

    .row-copy p,
    .table-row,
    .save-message span { font-size: 13px; }

    .badge {
      font-size: 11px;
      font-weight: 800;
    }

    .field {
      gap: 6px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
      text-transform: uppercase;
    }

    .field input,
    .field select,
    .field textarea {
      min-height: 44px;
      padding: 10px 12px;
      border: 1px solid rgba(21,18,13,0.2);
      border-radius: var(--radius);
      color: var(--ink);
      background: var(--paper);
      text-transform: none;
    }

    .field textarea { min-height: 110px; }

    .create-check {
      min-height: 44px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
      text-transform: uppercase;
    }

    .create-dialog-close {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      font-size: 20px;
    }

    button,
    .button,
    .button.primary,
    .button.light,
    .button.danger,
    .page-tab,
    .section-link,
    .icon-button {
      box-shadow: none !important;
    }

    .site-header {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
    }

    .main-nav {
      justify-self: center;
      display: flex;
      gap: 8px;
      align-items: center;
      max-width: 100%;
      overflow-x: auto;
      scrollbar-width: none;
    }

    .main-nav::-webkit-scrollbar { display: none; }

    .main-nav button {
      position: relative;
      flex: 0 0 auto;
      min-height: 44px;
      padding: 10px 8px;
      border: 0;
      background: transparent;
      color: var(--muted);
      font-size: 14px;
      font-weight: 700;
    }

    .main-nav button::after {
      content: "";
      position: absolute;
      right: 8px;
      bottom: 5px;
      left: 8px;
      height: 2px;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 180ms ease;
    }

    .main-nav button:hover,
    .main-nav button.active { color: var(--ink); }

    .main-nav button:hover::after,
    .main-nav button.active::after { transform: scaleX(1); }

    .icon-button {
      position: relative;
      display: inline-grid;
      width: 44px;
      height: 44px;
      padding: 0;
      place-items: center;
      border: 1px solid rgba(21,18,13,0.22);
      border-radius: 50%;
      background: var(--paper);
      color: var(--ink);
    }

    .icon-button svg {
      width: 24px;
      height: 24px;
    }

    .account-dot {
      position: absolute;
      right: 2px;
      bottom: 2px;
      width: 10px;
      height: 10px;
      border: 2px solid var(--paper);
      border-radius: 50%;
      background: var(--green);
    }

    .create-dialog.is-previewing .create-layout { grid-template-columns: 1fr; }
    .create-dialog.is-previewing .create-form { display: none; }
    .create-dialog.is-previewing .create-preview {
      position: static;
      width: min(720px, 100%);
      margin: 0 auto;
    }

    .action-view {
      display: grid;
      gap: 22px;
    }

    .action-summary {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 18px;
      align-items: center;
      padding-bottom: 18px;
      border-bottom: 1px solid var(--line);
    }

    .action-summary p { margin: 6px 0 0; color: var(--muted); }

    .action-list {
      display: grid;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .action-list-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 16px;
      align-items: center;
      padding: 15px 16px;
      border-top: 1px solid var(--line);
    }

    .action-list-row:first-child { border-top: 0; }

    .action-list-row strong,
    .action-list-row span { display: block; }
    .action-list-row span { margin-top: 3px; color: var(--muted); font-size: 13px; }

    .action-detail-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .action-detail {
      padding: 15px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--canvas);
    }

    .action-detail span,
    .action-detail strong { display: block; }
    .action-detail span { color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; }
    .action-detail strong { margin-top: 4px; }

    /* Local route switcher: this is prototype chrome, not part of the real website. */
    .prototype-view-bar {
      display: flex;
      gap: 18px;
      align-items: center;
      justify-content: space-between;
      padding: 12px clamp(18px, 4vw, 54px);
      border-bottom: 1px solid #d7cfbf;
      background: #f2ecdf;
    }

    .prototype-view-label strong,
    .prototype-view-label span { display: block; }
    .prototype-view-label strong { font-size: 13px; }
    .prototype-view-label span { margin-top: 2px; color: var(--muted); font-size: 12px; }

    .prototype-view-links {
      display: flex;
      gap: 6px;
      align-items: center;
      overflow-x: auto;
      max-width: min(920px, 72vw);
      padding: 2px;
      scrollbar-width: thin;
    }

    .prototype-view-link {
      flex: 0 0 auto;
      min-height: 40px;
      padding: 8px 11px;
      border: 1px solid transparent;
      border-radius: 7px;
      background: transparent;
      color: var(--ink);
      font-size: 13px;
      font-weight: 750;
    }

    .prototype-view-link:hover,
    .prototype-view-link.active {
      border-color: #bda949;
      background: #fff8dd;
    }

    .production-main {
      width: min(1240px, calc(100% - 40px));
      margin: 0 auto;
      padding-bottom: 72px;
    }

    .route-hero {
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
      gap: clamp(30px, 6vw, 82px);
      align-items: center;
      padding: clamp(58px, 8vw, 106px) 0;
      border-bottom: 1px solid var(--line);
    }

    .route-hero.no-art { grid-template-columns: minmax(0, 820px); }
    .route-hero-copy { max-width: 760px; }
    .route-eyebrow {
      display: block;
      margin-bottom: 16px;
      color: #72520c;
      font-size: 12px;
      font-weight: 850;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }

    .route-hero h1 { max-width: 820px; }
    .route-hero p {
      max-width: 720px;
      margin: 20px 0 0;
      color: var(--muted);
      font-size: clamp(17px, 1.7vw, 21px);
      line-height: 1.55;
    }

    .route-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 28px;
    }

    .route-hero-art {
      min-height: 390px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #eee6d6;
    }

    .route-hero-art img {
      display: block;
      width: 100%;
      height: 100%;
      min-height: 390px;
      object-fit: cover;
    }

    .route-section {
      padding: clamp(48px, 7vw, 82px) 0;
      border-bottom: 1px solid var(--line);
    }

    .route-section:last-child { border-bottom: 0; }
    .route-section-heading {
      display: flex;
      gap: 24px;
      align-items: end;
      justify-content: space-between;
      margin-bottom: 26px;
    }
    .route-section-heading > div { max-width: 720px; }
    .route-section-heading p { margin: 10px 0 0; color: var(--muted); font-size: 16px; }

    .route-card-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .route-card {
      display: flex;
      min-height: 240px;
      flex-direction: column;
      padding: 24px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .route-card p { margin: 10px 0 22px; color: var(--muted); }
    .route-card .button { align-self: flex-start; margin-top: auto; }
    .route-card-number {
      display: grid;
      width: 42px;
      height: 42px;
      margin-bottom: 30px;
      place-items: center;
      border-radius: 50%;
      background: var(--gold);
      font-weight: 850;
    }

    .history-layout,
    .contact-layout,
    .giving-layout,
    .account-layout,
    .event-feature-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
      gap: 24px;
      align-items: start;
    }

    .history-image,
    .event-feature-image {
      min-height: 420px;
      overflow: hidden;
      border-radius: var(--radius);
      background: #e7dece;
    }

    .history-image img,
    .event-feature-image img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }

    .history-copy,
    .contact-panel,
    .giving-panel,
    .account-panel,
    .event-feature-copy {
      padding: clamp(24px, 4vw, 38px);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .history-copy p,
    .contact-panel p,
    .giving-panel p,
    .account-panel p,
    .event-feature-copy p { color: var(--muted); }

    .ledger {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }

    .ledger-row {
      display: grid;
      grid-template-columns: 96px minmax(220px, 1.4fr) minmax(170px, 0.9fr) minmax(150px, 0.8fr) 120px;
      gap: 18px;
      align-items: center;
      min-height: 106px;
      padding: 16px 18px;
      border-top: 1px solid var(--line);
    }

    .ledger-row:first-child { border-top: 0; }
    .ledger-row.ledger-head {
      min-height: 48px;
      background: #f1ebdf;
      color: var(--muted);
      font-size: 11px;
      font-weight: 850;
      letter-spacing: 0.07em;
      text-transform: uppercase;
    }

    .ledger-main {
      display: grid;
      grid-template-columns: 86px minmax(0, 1fr);
      gap: 14px;
      align-items: center;
    }

    .ledger-main.no-image { grid-template-columns: 1fr; }
    .ledger-cover {
      width: 86px;
      height: 64px;
      object-fit: cover;
      border-radius: 6px;
      background: #e5ddce;
    }

    .ledger-main strong,
    .ledger-main span { display: block; }
    .ledger-main span,
    .ledger-cell small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }

    .date-tile {
      display: grid;
      width: 68px;
      height: 68px;
      place-items: center;
      align-content: center;
      border: 1px solid #cabd9d;
      border-radius: 6px;
      background: #fff8e5;
      line-height: 1;
    }
    .date-tile small { margin-bottom: 5px; font-size: 11px; font-weight: 850; text-transform: uppercase; }
    .date-tile strong { font-family: "Besley", serif; font-size: 24px; }

    .season-tabs {
      display: flex;
      gap: 8px;
      margin-bottom: 20px;
      border-bottom: 1px solid var(--line);
    }
    .season-tab {
      min-height: 46px;
      padding: 10px 5px;
      border: 0;
      border-bottom: 3px solid transparent;
      background: transparent;
      color: var(--muted);
      font-weight: 800;
    }
    .season-tab.active { border-color: var(--gold); color: var(--ink); }

    .game-matchup {
      display: grid;
      grid-template-columns: 58px minmax(0, 1fr) 58px;
      gap: 12px;
      align-items: center;
    }
    .team-logo {
      display: grid;
      width: 58px;
      height: 58px;
      padding: 6px;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: white;
    }
    .team-logo img { width: 100%; height: 100%; object-fit: contain; }
    .game-matchup-copy { text-align: center; }
    .game-matchup-copy strong,
    .game-matchup-copy span { display: block; }
    .game-matchup-copy span { margin-top: 4px; color: var(--muted); font-size: 12px; }

    .leadership-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }
    .leader-card {
      display: grid;
      grid-template-columns: 82px minmax(0, 1fr);
      gap: 18px;
      align-items: center;
      padding: 22px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
    }
    .leader-photo {
      display: grid;
      width: 82px;
      height: 96px;
      place-items: center;
      overflow: hidden;
      border-radius: 6px;
      background: #e7dcc4;
      color: #4e3b12;
      font-family: "Besley", serif;
      font-size: 23px;
      font-weight: 800;
    }
    .leader-card p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }

    .photo-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 14px;
    }
    .photo-tile {
      position: relative;
      grid-column: span 4;
      min-height: 260px;
      overflow: hidden;
      border-radius: var(--radius);
      background: #e9e0d1;
    }
    .photo-tile.wide { grid-column: span 8; }
    .photo-tile img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; }
    .photo-tile-overlay {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      padding: 36px 18px 16px;
      color: white;
      background: linear-gradient(transparent, rgba(10,8,5,0.86));
    }
    .photo-tile-overlay strong,
    .photo-tile-overlay span { display: block; }
    .photo-tile-overlay span { margin-top: 3px; font-size: 12px; }

    .contact-paths,
    .account-nav { display: grid; gap: 10px; }
    .contact-path,
    .account-nav button {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      min-height: 68px;
      padding: 14px 16px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: var(--paper);
      color: var(--ink);
      text-align: left;
    }
    .contact-path span,
    .account-nav button span { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; }
    .contact-path b { font-size: 20px; }

    .account-layout { grid-template-columns: 260px minmax(0, 1fr); }
    .account-nav button { min-height: 56px; }
    .account-nav button.active { border-color: var(--gold-dark); background: #fff7dc; }
    .account-summary-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin: 22px 0;
    }
    .account-stat { padding: 18px; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); }
    .account-stat span,
    .account-stat strong { display: block; }
    .account-stat span { color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; }
    .account-stat strong { margin-top: 5px; font-size: 17px; }

    .amount-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 20px 0; }
    .amount-option {
      min-height: 54px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: white;
      color: var(--ink);
      font-weight: 850;
    }
    .amount-option.active { border-color: var(--ink); background: var(--gold); }
    .secure-note { margin-top: 16px; color: var(--muted); font-size: 12px; }

    .site-footer {
      display: flex;
      gap: 24px;
      align-items: center;
      justify-content: space-between;
      padding: 34px clamp(18px, 4vw, 54px);
      border-top: 1px solid var(--line);
      background: #f2ecdf;
    }
    .site-footer strong,
    .site-footer span { display: block; }
    .site-footer strong { font-family: "Besley", serif; }
    .site-footer span { margin-top: 3px; color: var(--muted); font-size: 12px; text-transform: uppercase; }
    .site-footer nav { display: flex; gap: 8px; }
    .site-footer button { min-height: 44px; padding: 8px 12px; border: 0; background: transparent; font-weight: 750; }

    @media (max-width: 980px) {
      .workspace,
      .split,
      .public-hero,
      .create-layout,
      .route-hero,
      .history-layout,
      .contact-layout,
      .giving-layout,
      .event-feature-layout { grid-template-columns: 1fr; }

      .route-card-grid,
      .leadership-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

      .admin-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

      .prototype-view-bar { align-items: flex-start; flex-direction: column; }
      .prototype-view-links { max-width: 100%; width: 100%; }

      .ledger { overflow-x: auto; }
      .ledger-row { min-width: 920px; }

      .section-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .admin-home-shell .section-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }

      .section-nav-label { grid-column: 1 / -1; }

      .site-header {
        grid-template-columns: 1fr auto;
      }

      .main-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: start;
        width: 100%;
      }
    }

    @media (max-width: 720px) {
      body { font-size: 16px; }

      .site-header,
      .page-heading,
      .save-bar { align-items: stretch; }

      .header-actions,
      .heading-actions,
      .save-actions,
      .header-actions .button,
      .heading-actions .button,
      .save-actions .button { width: 100%; }

      .stat-grid,
      .quick-grid,
      .form-grid,
      .public-grid,
      .section-nav { grid-template-columns: 1fr; }

      .admin-job-grid { grid-template-columns: 1fr; }

      .admin-menu-grid { grid-template-columns: 1fr; }

      .admin-home-shell .section-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
        padding: 12px;
      }

      .admin-home-shell .section-nav-label { grid-column: 1 / -1; }
      .admin-home-shell .section-link {
        min-height: 58px;
        padding: 8px 6px;
        font-size: .82rem;
        line-height: 1.2;
        text-align: center;
      }

      .admin-task-list article,
      .admin-history-list article {
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: start;
      }

      .admin-task-list article > button,
      .admin-history-list article > button {
        grid-column: 1 / -1;
        width: 100%;
      }

      .admin-history-list article > .badge { justify-self: start; }

      .field.wide,
      .section-nav-label { grid-column: auto; }

      .record-row { grid-template-columns: 1fr; }

      .record-row.media,
      .record-row.game,
      .featured-matchup { grid-template-columns: 1fr; }

      .row-symbol,
      .date-block,
      .media-thumb,
      .matchup-thumb { justify-self: start; }

      .media-thumb {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
      }

      .row-actions,
      .row-actions .button { width: 100%; }

      .toast { right: 16px; bottom: 16px; left: 16px; }
      .admin-operation-status { right: 16px; bottom: 16px; left: 16px; width: auto; }
      .admin-operation-visible .toast { bottom: 126px; }

      .create-dialog {
        width: calc(100% - 16px);
        max-height: 96vh;
      }

      .create-dialog-shell { max-height: 96vh; }

      .create-dialog-header,
      .create-dialog-body,
      .create-dialog-footer { padding: 18px; }

      .create-preview { position: static; }

      .dialog-footer-actions,
      .dialog-footer-actions .button { width: 100%; }

      .action-summary,
      .action-detail-grid,
      .route-card-grid,
      .leadership-grid,
      .account-layout,
      .account-summary-grid { grid-template-columns: 1fr; }

      .production-main { width: min(100% - 32px, 1240px); }
      .route-hero-art,
      .route-hero-art img { min-height: 280px; }
      .route-section-heading,
      .site-footer { align-items: flex-start; flex-direction: column; }
      .photo-tile,
      .photo-tile.wide { grid-column: 1 / -1; }
      .amount-options { grid-template-columns: 1fr; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition-duration: 0.01ms !important; }
    }
/* Ticket and event controls group operational settings without turning the editor into a spreadsheet. */
.admin-control-group { display:grid; gap:16px; margin-top:20px; padding:20px; border:1px solid var(--line,#d8d2c5); border-radius:10px; background:#fbf8f0; }
.admin-control-group h3 { margin:3px 0 0; font-family:Georgia,serif; font-size:24px; }
.admin-control-group > div:first-child p { margin:5px 0 0; color:#6f6b62; }
.admin-inline-actions { display:flex; justify-content:flex-end; margin:12px 0; }
