/* The staff application.
   Loaded after core-foundation.css on staff pages only. A theme never replaces
   this file: the staff interface is product, not presentation.

   Split out of public/assets/site.css. Placement is recorded in
   docs/theme-contract/stylesheet-ownership.json; source order within this file
   is the order those rules had in site.css. Rules whose class the attribution
   marks `duplicated` also appear in theme.css, so that each surface owns its
   own copy and neither is held hostage by the other. */

/* The staff application's palette.
   The `:root` in core-foundation.css is the core default for the public site:
   an installation configures against it, and the first customer's warm sand and
   deep forest are what it still says. The staff application is product, not
   presentation, so it cannot inherit that — it reads fourteen of the sixteen
   tokens across 604 of its rule blocks, which is how one customer's brand came
   to paint every installation's staff screens.

   The values, not the six hundred rules, are what is wrong, so the values are
   what this redeclares. `#0a0a0a`, `#fcfcfc` and `#7c8152` are the product's
   own artwork; the rest of the ramp is derived from them and held to WCAG AA by
   tests/run.php.

   The brand accent is in `--olive-light`, not in `--olive`, and that placement
   is the measurement's doing. `--olive` is a text-bearing surface here — 21
   rules put a literal white on it and 12 more use it as link text on paper — so
   `#7c8152` in that slot computes 4.00:1 against both, under the 4.5:1 AA floor
   for body text. `--olive-light` is the accent the artwork describes, so the
   brand hex goes there unmodified and `--olive` is derived from it at the same
   hue and chroma, dark enough to carry white. The alternative was to
   approximate the brand to satisfy a constraint the slot imposes; this way the
   exact hex ships.

   `--shell` and `--display` are deliberately absent. One is a layout width and
   the other a typeface; neither is a brand colour, and the staff typeface is
   not changing, so both go on inheriting from core-foundation.css.

   `@entry-point` is read by bin/split-stylesheet.php and dropped by every
   browser. A bare second `:root` here would be placed by the same rule that
   places every other class-free selector — into core-foundation.css, which the
   public site loads — and would repaint the site this block exists to leave
   alone. See the at-rule's own note in the generator. */

:root {
    --ink: #0a0a0a;
    --ink-2: #141414;
    --ink-3: #1f1f1f;
    --paper: #fcfcfc;
    --paper-2: #f1f1ef;
    --muted: #6b6d68;
    --olive: #6f7349;
    --olive-light: #7c8152;
    --signal: #8f9560;
    --signal-dark: #5f6440;
    --tan: #b0b48f;
    --line: rgb(10 10 10 / 20%);
}

.shell {
    width: var(--shell);
    margin-inline: auto;
}

.section {
    padding-block: clamp(76px, 9vw, 140px);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    font-family: var(--display);
    font-size: 16px;
    font-stretch: condensed;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
}

.brand-logo {
    display: block;
    width: 210px;
    line-height: 0;
}

.brand-logo-image {
    display: block;
    width: 100%;
    height: auto;
}

/* Both headers are a fixed height, so a logo must be clamped by height rather
   than by the container's width. Applies to every configured logo, not only a
   bundled one: an uploaded square image would otherwise render 210px tall in an
   84px header. Footer, ticket and kiosk contexts are deliberately unclamped —
   they size to the container. */

.staff-app-header .brand-logo-image {
    width: auto;
    max-width: 100%;
}

.staff-app-header .brand-logo-image {
    max-height: 48px;
}

/* Shown when an installation has configured no logo. One line, clipped at the
   width its container gives it, so a long public name cannot grow the header. */

/* A wordmark is text, so it sizes to what it says rather than to the width an
   image logo was given. The cap stops a long public name or a wide display face
   crowding out the navigation beside it, and the ellipsis below still handles
   anything past that. */

.brand-wordmark {
    display: block;
    width: max-content;
    max-width: min(340px, 42vw);
}

.brand-logo-wordmark {
    display: block;
    overflow: hidden;
    font-family: var(--display);
    font-size: 20px;
    font-stretch: condensed;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.flash {
    position: relative;
    z-index: 45;
    padding: 12px 0;
    color: white;
    background: var(--olive);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.flash-success {
    background: #52613c;
}

.read-only-banner .shell {
    display: flex;
    gap: 12px 24px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.location-compliance-flags {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 14px;
}

.eyebrow,
.section-index {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.eyebrow i {
    width: 22px;
    height: 1px;
    background: currentColor;
}

.button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 13px 24px;
    border: 1px solid transparent;
    border-radius: 0;
    cursor: pointer;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.09em;
    line-height: 1.1;
    text-transform: uppercase;
    transition: color 160ms ease, background 160ms ease, border 160ms ease, transform 160ms ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button:active {
    transform: translateY(0) scale(0.98);
}

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

.button-primary:hover {
    background: var(--signal-dark);
}

.button-outline {
    color: var(--ink);
    border-color: var(--line);
    background: transparent;
}

.button-danger {
    color: white;
    border-color: #7b281b;
    background: #7b281b;
}

.button-danger:hover {
    background: #5f1e14;
}

.button-disabled {
    color: rgb(255 255 255 / 55%);
    border-color: rgb(255 255 255 / 16%);
    background: rgb(255 255 255 / 8%);
}

.button-full {
    width: 100%;
}

.button[disabled] {
    cursor: not-allowed;
    opacity: 0.45;
    transform: none;
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--ink);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.text-link span {
    color: var(--signal);
    font-size: 18px;
    transition: transform 160ms ease;
}

.text-link:hover span {
    transform: translateX(4px);
}

.section-index.light {
    color: rgb(255 255 255 / 46%);
}

.back-link {
    align-self: flex-start;
    color: rgb(255 255 255 / 72%);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.back-link.dark {
    color: var(--muted);
}

.team-table i {
    width: 7px;
    height: 7px;
    background: currentColor;
}

.team-olive {
    color: var(--olive-light);
}

.team-tan {
    color: var(--tan);
}

.team-black {
    color: #afb0aa;
}

.team-blue {
    color: #8ba5b0;
}

/* The fifth team identifier, and the only one measured against every ground it
   lands on. `team_class()` puts these on the dark event and ticket panels, on
   the light booking option, event dress-code card and dress-code dialog, and on
   the near-white staff tables, and the four above it were only ever chosen for
   the dark ones: on a light ground olive is 2.8:1 and tan, black and blue are
   between 1.7:1 and 2.2:1, all of them under the 3:1 a 7px square carrying
   meaning has to meet. #d2322d is 3.26:1 or better on all seven of those grounds
   and 3.62:1 on the dark panel, so it is the one identifier that passes
   everywhere rather than the one that matches the others' arithmetic.
   tests/checks/neutral-content-defaults.php computes it from this declaration. */

.team-red {
    color: #d2322d;
}

.staff-toolbar h1 {
    margin: 12px 0 16px;
    font-family: var(--display);
    font-size: clamp(54px, 7vw, 90px);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.95;
    text-transform: uppercase;
}

.form-errors {
    margin: 0 0 28px;
    padding: 16px 18px;
    border-left: 3px solid #a64028;
    color: #772a1d;
    background: #eddbd3;
}

.login-error {
    margin: 0 0 28px;
    padding: 16px 18px;
    border-left: 3px solid #a64028;
    color: #772a1d;
    background: #eddbd3;
}

.form-errors strong {
    display: block;
    font-size: 13px;
}

.form-errors p {
    margin: 2px 0 0;
    font-size: 12px;
}

.event-form fieldset {
    margin: 0 0 46px;
    padding: 0;
    border: 0;
}

.event-form legend {
    width: 100%;
    margin-bottom: 22px;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--line);
    font-family: var(--display);
    font-size: 18px;
    font-weight: 850;
    text-transform: uppercase;
}

.event-form legend span {
    margin-right: 14px;
    color: var(--signal);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.form-grid .form-span-two {
    grid-column: 1 / -1;
}

.form-grid label {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.login-panel label,
.team-builder-card label {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.form-grid label > span {
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.login-panel label > span,
.team-builder-card label > span,
.file-field > span {
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.form-grid label > span em {
    margin-left: 6px;
    color: #96998f;
    font-style: normal;
    font-weight: 600;
}

.file-field > span em {
    margin-left: 6px;
    color: #96998f;
    font-style: normal;
    font-weight: 600;
}

.field-requirement,
.event-form .field-requirement {
    margin-left: 6px;
    color: #40503b;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.form-grid input,
.form-grid textarea,
.form-grid select {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #cbc8bf;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
}

.login-panel input,
.team-builder-card input,
.team-builder-card textarea,
.team-builder-card select,
.status-form select {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #cbc8bf;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
}

.form-grid textarea {
    min-height: 110px;
    resize: vertical;
}

.form-grid .has-error input,
.form-grid .has-error textarea,
.has-error input {
    border-color: #a64028;
}

.form-grid label small {
    color: var(--muted);
    font-size: 10px;
}

.team-builder-card label small {
    color: var(--muted);
    font-size: 10px;
}

.input-suffix {
    display: flex;
    align-items: stretch;
}

.input-suffix input {
    flex: 1;
    min-width: 0;
}

.input-suffix > span {
    display: grid;
    min-width: 48px;
    place-items: center;
    border: 1px solid #cbc8bf;
    border-left: 0;
    color: var(--ink);
    background: #ebe7dc;
    font-weight: 800;
}

.form-grid label.has-error small:last-child {
    color: #9b3424;
}

.team-builder-card label.has-error small:last-child,
.navigation-setting-card label.has-error small:last-child {
    color: #9b3424;
}

.field-error {
    margin: 9px 0 0;
    color: #9b3424;
    font-size: 11px;
}

.terms-check {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: 12px;
    align-items: start;
    margin-bottom: 9px;
    color: var(--muted);
    cursor: pointer;
    font-size: 12px;
}

.terms-check input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--signal);
}

.terms-check > span {
    min-width: 0;
}

.terms-check > span > small {
    display: block;
    margin-top: 6px;
    line-height: 1.45;
}

/* A help or error note written as a direct child of .terms-check rather than
   inside its <span>. The grid is `20px 1fr`, so auto-placement put such a note in
   the checkbox gutter -- twenty pixels wide -- where it wrapped one or two
   characters per line. That is what "Set up at least one operational day before
   enabling automatic checkout." was doing under the automatic-checkout box. It is
   the rule above's sibling and not a replacement for it: both spellings of the
   note appear across the staff forms, and this puts them in the same column. */

.terms-check > small {
    grid-column: 2;
    margin-top: 6px;
    line-height: 1.45;
}

/* Tickets and messages */

.message-section {
    min-height: 75vh;
    padding-top: 150px;
}

.status-card h1 {
    margin: 10px 0 12px;
    font-family: var(--display);
    font-size: clamp(52px, 7vw, 88px);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.95;
    text-transform: uppercase;
}

.status-card p {
    max-width: 610px;
    margin: 0;
    color: var(--muted);
}

.status-card {
    max-width: 780px;
    padding: clamp(38px, 7vw, 86px);
    border-left: 4px solid var(--signal);
    background: var(--paper-2);
}

.status-card .button {
    margin-top: 30px;
}

.error-code {
    color: var(--signal);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

/* Staff */

.staff-page {
    --staff-app-header-height: 72px;
    --staff-sidebar-width: 252px;
    --staff-content-max-width: 1240px;
    --staff-content-gutter: 32px;
    padding-top: var(--staff-app-header-height);
}

.staff-page .shell {
    width: min(
        var(--staff-content-max-width),
        calc(100% - var(--staff-content-gutter) - var(--staff-content-gutter))
    );
}

.staff-app-header {
    position: fixed;
    z-index: 60;
    top: 0;
    right: 0;
    left: 0;
    height: var(--staff-app-header-height);
    color: white;
    border-bottom: 1px solid rgb(255 255 255 / 10%);
    background: var(--ink);
}

.staff-app-header-inner {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 28px;
}

/* `flex: 0 1 auto` and `min-width: 0`, where this was `flex: 0 0 auto`, because
   the group now holds the installation's name as well as the product mark, and
   that name is customer-supplied and unbounded. A group that cannot shrink has
   nowhere to put an over-long one: it grows instead, and pushes the navigation
   off the compact header. Shrinking lands entirely on the name — the mark's own
   box stays `flex: 0 0 auto` below — which is what makes its ellipsis fire. */

.staff-app-brand-group {
    display: flex;
    min-width: 0;
    flex: 0 1 auto;
    gap: 16px;
    align-items: center;
}

.staff-app-brand {
    width: 190px;
    flex: 0 0 auto;
}

/* The product mark. Unlike a customer logo it is one known file at one known
   ratio, so it fills the width its link is given and takes its height from
   that: 190px wide is 38.7px tall, inside a 72px header. */

.product-lockup {
    display: block;
    width: 100%;
    height: auto;
}

/* The installation's public name, beside the product mark rather than inside
   its link. It is customer-supplied and unbounded, so it is bounded twice: the
   cap stops a long name dominating a wide header, and `min-width: 0` lets it
   give way below that on a narrow one, since a flex item refuses to shrink
   past its content otherwise. Either bound is a box the ellipsis can overflow,
   which is the whole reason the name is clipped rather than pushing the
   navigation across the header. */

.staff-app-installation {
    overflow: hidden;
    min-width: 0;
    max-width: 220px;
    color: rgb(255 255 255 / 70%);
    font-size: 0.8125rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-app-public-site {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    padding: 0 14px;
    color: white;
    border: 1px solid rgb(255 255 255 / 24%);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: border-color 160ms ease, background-color 160ms ease;
}

.staff-app-public-site:hover,
.staff-app-public-site:focus-visible {
    border-color: var(--signal);
    background: rgb(255 255 255 / 8%);
}

.staff-app-menu-toggle {
    display: none;
    min-height: 40px;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    color: white;
    border: 1px solid rgb(255 255 255 / 18%);
    cursor: pointer;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
}

.staff-app-menu-icon {
    position: relative;
    display: inline-flex;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
}

.staff-app-menu-icon span {
    position: absolute;
    width: 12px;
    height: 2px;
    background: var(--signal);
    transition: transform 180ms ease;
}

.staff-app-menu-icon span:last-child {
    transform: rotate(90deg);
}

.staff-app-menu-toggle[aria-expanded="true"] .staff-app-menu-icon span:first-child {
    transform: rotate(45deg);
}

.staff-app-menu-toggle[aria-expanded="true"] .staff-app-menu-icon span:last-child {
    transform: rotate(-45deg);
}

.staff-nav {
    position: fixed;
    z-index: 50;
    top: var(--staff-app-header-height);
    bottom: 0;
    left: 0;
    width: var(--staff-sidebar-width);
    padding: 22px 16px 30px;
    overflow-y: auto;
    color: white;
    border-right: 1px solid rgb(255 255 255 / 10%);
    background: var(--ink-2);
}

.staff-nav nav {
    display: grid;
    gap: 24px;
}

.staff-nav-public-site {
    display: none;
}

.staff-nav-group {
    display: grid;
    gap: 8px;
}

.staff-nav-group + .staff-nav-group {
    padding-top: 22px;
    border-top: 1px solid rgb(255 255 255 / 10%);
}

.staff-nav-group h2 {
    margin: 0;
    padding: 0 10px;
    color: rgb(255 255 255 / 42%);
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.staff-nav-group > div {
    display: grid;
    gap: 3px;
}

.staff-nav-group a {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: 0 10px;
    color: rgb(255 255 255 / 70%);
    border-left: 3px solid transparent;
    font-size: 13px;
    font-weight: 700;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.staff-nav-group a:hover,
.staff-nav-group a.is-active {
    color: white;
    border-left-color: var(--signal);
    background: rgb(255 255 255 / 7%);
}

.staff-nav-group a.staff-nav-restricted {
    color: #ff6d5c;
    font-weight: 900;
}

.staff-nav-group a.staff-nav-restricted:hover,
.staff-nav-group a.staff-nav-restricted.is-active {
    color: #ff8d80;
    border-left-color: #ff5c4d;
    background: rgb(255 92 77 / 8%);
}

.staff-nav-version {
    display: block;
    margin: 28px 10px 0;
    color: rgb(255 255 255 / 34%);
    font-size: 11px;
}

.staff-nav-mobile-session {
    display: none;
}

.staff-nav-session {
    display: flex;
    flex: 0 0 auto;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.staff-nav-session > a {
    max-width: 180px;
    overflow: hidden;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-nav-session button {
    min-height: 36px;
    padding: 0 10px;
    color: white;
    border: 1px solid rgb(255 255 255 / 18%);
    cursor: pointer;
    background: transparent;
    font-size: 12px;
    font-weight: 800;
}

.staff-page #main-content,
.staff-page > .read-only-banner,
.staff-page > .staff-alert-stack {
    margin-left: var(--staff-sidebar-width);
}

@media (max-width: 1280px) {
    .staff-page {
        --staff-content-gutter: 24px;
        padding-top: 0;
    }

    .staff-app-header {
        position: relative;
        height: 68px;
    }

    .staff-app-header-inner {
        gap: 12px;
        padding: 0 18px;
    }

    .staff-app-brand-group {
        gap: 12px;
    }

    .staff-app-brand {
        width: 140px;
    }

    .staff-app-public-site {
        display: none;
    }

    /* The brand group beside it can now shrink, and flex would otherwise take
       the same liberty here: the toggle is the only way into the navigation on
       a compact header, so it keeps its size and the installation's name gives
       way instead. */

    .staff-app-menu-toggle {
        display: inline-flex;
        flex: 0 0 auto;
        margin-left: auto;
    }

    .staff-app-header .staff-nav-session {
        display: none;
    }

    .staff-nav {
        position: relative;
        top: auto;
        bottom: auto;
        display: block;
        width: auto;
        max-height: none;
        padding: 20px 18px 24px;
        overflow: visible;
        border-right: 0;
        border-bottom: 1px solid rgb(255 255 255 / 10%);
    }

    .has-js .staff-nav:not(.is-open) {
        display: none;
    }

    .staff-nav.is-open {
        animation: staff-menu-open 180ms ease-out both;
    }

    .staff-nav nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    .staff-nav-public-site {
        display: flex;
        min-height: 42px;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
        color: white;
        border: 1px solid rgb(255 255 255 / 22%);
        font-size: 11px;
        font-weight: 850;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .staff-nav-mobile-session {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 22px;
        padding: 18px 10px 0;
        border-top: 1px solid rgb(255 255 255 / 10%);
    }

    .staff-nav-mobile-session > a {
        min-width: 0;
        overflow: hidden;
        color: white;
        font-size: 13px;
        font-weight: 700;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .staff-nav-mobile-session button {
        min-height: 36px;
        padding: 0 10px;
        color: white;
        border: 1px solid rgb(255 255 255 / 18%);
        cursor: pointer;
        background: transparent;
        font-size: 12px;
        font-weight: 800;
    }

    .staff-nav-group + .staff-nav-group {
        padding-top: 0;
        padding-left: 18px;
        border-top: 0;
        border-left: 1px solid rgb(255 255 255 / 10%);
    }

    .staff-page #main-content,
    .staff-page > .read-only-banner,
    .staff-page > .staff-alert-stack {
        margin-left: 0;
    }
}

@media (max-width: 620px) {
    .staff-page {
        --staff-content-gutter: 16px;
    }

    .staff-app-header-inner {
        gap: 10px;
        padding: 0 14px;
    }

    .staff-app-menu-toggle {
        padding: 0 9px;
        font-size: 12px;
    }

    .staff-nav nav {
        grid-template-columns: 1fr;
    }

    .staff-nav-group + .staff-nav-group {
        padding-top: 18px;
        padding-left: 0;
        border-top: 1px solid rgb(255 255 255 / 10%);
        border-left: 0;
    }
}

.staff-login-page .site-header,
.staff-page .site-header {
    position: absolute;
    color: white;
    background: var(--ink);
}

.staff-login {
    min-height: 100vh;
    padding-top: 150px;
    color: white;
    background:
        linear-gradient(90deg, var(--ink) 0%, var(--ink) 55%, var(--paper) 55%, var(--paper) 100%);
}

.staff-login-grid {
    display: grid;
    grid-template-columns: 1fr 0.82fr;
    gap: clamp(80px, 12vw, 190px);
    align-items: center;
}

.staff-login-intro h1 {
    margin: 10px 0 18px;
    font-family: var(--display);
    font-size: clamp(62px, 8vw, 112px);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 0.84;
    text-transform: uppercase;
}

.staff-restricted-label {
    color: #ff5c4d;
    font-weight: 900;
}

.staff-login-intro > p {
    max-width: 480px;
    color: rgb(255 255 255 / 55%);
}

.security-note {
    display: flex;
    max-width: 430px;
    gap: 13px;
    align-items: flex-start;
    margin-top: 55px;
    padding-top: 20px;
    border-top: 1px solid rgb(255 255 255 / 13%);
    color: rgb(255 255 255 / 38%);
    font-size: 10px;
}

.security-note i {
    color: var(--signal);
    font-style: normal;
}

.login-panel {
    padding: 42px;
    color: var(--ink);
    background: white;
    box-shadow: 0 24px 80px rgb(0 0 0 / 20%);
}

.login-panel h2 {
    margin: 7px 0 28px;
    font-family: var(--display);
    font-size: 34px;
    font-weight: 900;
    text-transform: uppercase;
}

.login-panel form {
    display: grid;
    gap: 18px;
}

.login-panel .button {
    margin-top: 5px;
}

.login-panel > .text-link {
    margin-top: 26px;
}

.passkey-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0;
    color: var(--muted);
    font-size: 11px;
    text-transform: uppercase;
}

.passkey-divider::before,
.passkey-divider::after {
    width: 100%;
    height: 1px;
    background: var(--line);
    content: "";
}

.passkey-status {
    margin-top: 14px;
}

.two-factor-panel {
    max-width: 560px;
}

.setup-steps {
    display: grid;
    gap: 16px;
    margin: 0 0 26px;
    padding-left: 22px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.65;
}

.setup-steps .text-link {
    display: inline;
}

.two-factor-qr {
    display: grid;
    width: fit-content;
    max-width: 100%;
    margin: 14px auto 18px;
    padding: 12px;
    place-items: center;
    border: 1px solid var(--line);
    background: white;
}

.two-factor-qr img {
    width: 240px;
    height: auto;
}

.two-factor-manual {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    background: rgb(8 11 8 / 4%);
}

.two-factor-manual summary {
    cursor: pointer;
    color: var(--olive);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.two-factor-manual > p {
    margin: 12px 0;
    color: var(--muted);
    font-size: 11px;
}

.two-factor-secret {
    display: block;
    margin-top: 10px;
    padding: 12px;
    overflow-wrap: anywhere;
    color: white;
    background: var(--ink);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-align: center;
}

.two-factor-help {
    margin: 22px 0 0;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.6;
}

.login-error {
    font-size: 12px;
}

.preview-notice {
    padding: 12px 14px;
    color: #625b3e;
    background: #eee9d1;
    font-size: 11px;
}

.staff-shell {
    min-height: 100vh;
    padding: 48px 0 96px;
}

.staff-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 40px;
}

.staff-toolbar .back-link {
    display: block;
    margin-bottom: 18px;
}

.staff-toolbar h1 {
    font-size: clamp(38px, 4vw, 52px);
}

.staff-page-intro {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}

.staff-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.staff-section {
    margin-top: 42px;
}

.staff-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.staff-section-heading h2 {
    margin: 4px 0 0;
    font-family: var(--display);
    font-size: 27px;
    font-weight: 900;
    text-transform: uppercase;
}

.staff-section-heading > span:not(.status-pill) {
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
}

.passkey-list {
    display: grid;
    gap: 12px;
    margin: 20px 0;
}

.passkey-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px;
    border: 1px solid var(--line);
    background: white;
}

.passkey-card > div:first-child,
.passkey-card small {
    display: grid;
    gap: 6px;
}

.passkey-card small {
    color: var(--muted);
}

.passkey-actions,
.passkey-actions form,
.passkey-enrolment {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
}

.passkey-actions input {
    max-width: 190px;
}

.passkey-enrolment {
    margin-top: 20px;
}

.passkey-enrolment .staff-field {
    min-width: min(100%, 260px);
}

@media (max-width: 760px) {
    .passkey-card,
    .passkey-actions,
    .passkey-actions form,
    .passkey-enrolment {
        align-items: stretch;
        flex-direction: column;
    }

    .passkey-actions input,
    .passkey-actions .button,
    .passkey-enrolment .button {
        width: 100%;
        max-width: none;
    }
}

.dashboard-revenue {
    display: grid;
    grid-template-columns: minmax(230px, 1.4fr) repeat(2, minmax(180px, 1fr)) auto;
    gap: 18px;
    align-items: center;
    padding: 24px;
    border: 1px solid var(--line);
    background: #161c14;
    color: white;
}

.dashboard-revenue h2 {
    margin: 5px 0 6px;
    font-family: var(--display);
    font-size: 25px;
    text-transform: uppercase;
}

.dashboard-revenue p,
.dashboard-revenue small {
    margin: 0;
    color: rgb(255 255 255 / 53%);
    font-size: 10px;
    line-height: 1.5;
}

.dashboard-revenue article {
    padding: 4px 18px;
    border-left: 1px solid rgb(255 255 255 / 15%);
}

.dashboard-revenue article > span {
    display: block;
    color: var(--signal);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.report-metrics article > span {
    display: block;
    color: var(--signal);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.dashboard-revenue article > strong {
    display: block;
    margin: 4px 0;
    font-family: var(--display);
    font-size: 30px;
}

.dashboard-revenue > .button-outline {
    color: white;
    border-color: rgb(255 255 255 / 48%);
    background: rgb(255 255 255 / 8%);
}

.dashboard-revenue > .button-outline:hover {
    color: #10140e;
    border-color: var(--signal);
    background: var(--signal);
}

.report-toolbar {
    margin-bottom: 34px;
}

.report-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.report-tabs a {
    display: grid;
    gap: 4px;
    min-height: 88px;
    align-content: center;
    padding: 18px 20px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: white;
    text-decoration: none;
}

.report-tabs a.is-active {
    border-color: var(--olive);
    box-shadow: inset 0 -4px 0 var(--signal);
    color: white;
    background: var(--olive);
}

.report-tabs strong {
    font-family: var(--display);
    font-size: 20px;
    text-transform: uppercase;
}

.report-tabs span {
    color: var(--muted);
    font-size: 10px;
}

.report-tabs a.is-active span {
    color: rgb(255 255 255 / 68%);
}

.report-gateway-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.report-gateway-options label {
    display: flex;
    gap: 9px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid var(--line);
    cursor: pointer;
    background: var(--paper-2);
}

.report-gateway-options label:has(input:checked) {
    border-color: var(--olive);
    background: #e2e6da;
}

.report-gateway-options label.is-test-gateway {
    border-color: #d6aaa0;
}

.report-gateway-options input {
    width: 17px;
    height: 17px;
    accent-color: var(--signal);
}

.report-gateway-options strong,
.report-gateway-options small {
    display: block;
}

.report-gateway-options strong {
    font-size: 11px;
}

.report-gateway-options small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
}

.report-scope {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 18px;
    padding: 17px 20px;
    border-left: 4px solid var(--signal);
    background: #e5e4d8;
}

.report-scope span,
.report-scope strong {
    display: block;
}

.report-scope span {
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 8px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.report-scope strong {
    font-family: var(--display);
    font-size: 18px;
    text-transform: uppercase;
}

.report-scope a {
    color: var(--olive);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.report-empty-filter {
    margin-top: 18px;
}

.report-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 22px;
}

.report-gift-card-metrics {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.report-metrics article {
    min-height: 130px;
    padding: 22px;
    border: 1px solid var(--line);
    background: white;
}

.report-metrics article > strong {
    display: block;
    margin: 12px 0 7px;
    font-family: var(--display);
    font-size: clamp(27px, 3vw, 42px);
}

.report-metrics article > small {
    color: var(--muted);
    font-size: 9px;
}

.report-metrics .report-net {
    color: white;
    background: var(--olive);
}

.report-metrics .report-contribution {
    color: white;
    background: var(--olive);
}

.report-metrics .report-net small {
    color: rgb(255 255 255 / 60%);
}

.report-metrics .report-contribution small {
    color: rgb(255 255 255 / 60%);
}

.report-integrity-note {
    margin: 12px 0 0;
    padding: 14px 16px;
    border-left: 3px solid var(--signal);
    color: var(--muted);
    background: rgb(255 255 255 / 70%);
    font-size: 11px;
    line-height: 1.6;
}

.report-integrity-note strong {
    color: var(--ink);
}

.report-chart-section {
    padding: 26px;
    border: 1px solid var(--line);
    background: white;
}

.report-chart-legend {
    display: flex;
    gap: 18px;
    margin-bottom: 10px;
    color: var(--muted);
    font-size: 9px;
    text-transform: uppercase;
}

.report-chart-legend span::before {
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-right: 6px;
    content: "";
}

.report-chart-legend .is-gross::before {
    background: var(--olive);
}

.report-chart-legend .is-refund::before {
    background: #b45a49;
}

.report-chart-legend .is-booked::before {
    background: #8d937b;
}

.report-chart-legend .is-attended::before {
    background: var(--olive);
}

.report-chart-legend .is-no-show::before {
    background: #b45a49;
}

.report-chart-legend .is-purchase::before {
    background: var(--olive);
}

.report-chart-legend .is-redemption::before {
    background: #a89c72;
}

.report-chart-scroll {
    overflow-x: auto;
}

.report-chart {
    display: block;
    min-width: 900px;
    width: 100%;
    height: auto;
    background: linear-gradient(#f7f5ee, #fff);
}

.report-chart-months-12 {
    min-width: 1200px;
}

.report-chart-months-18 {
    min-width: 1800px;
}

.report-chart-months-24 {
    min-width: 2400px;
}

.report-chart-axis {
    stroke: #bbbcb3;
    stroke-width: 1;
}

.report-chart-gridline {
    stroke: #dedfd8;
    stroke-width: 1;
}

.report-chart-gross {
    fill: var(--olive);
}

.report-chart-refund {
    fill: #b45a49;
}

.report-chart-booked {
    fill: #8d937b;
}

.report-chart-attended {
    fill: var(--olive);
}

.report-chart-no-show {
    fill: #b45a49;
}

.report-chart-purchase {
    fill: var(--olive);
}

.report-chart-redemption {
    fill: #a89c72;
}

.report-chart text {
    fill: #6c7067;
    font-size: 10px;
    text-transform: uppercase;
}

.report-chart .report-chart-axis-title,
.report-chart .report-chart-axis-value {
    fill: #4f544b;
    font-size: 9px;
    font-weight: 750;
    text-transform: none;
}

.report-month-values {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin-top: 12px;
    background: var(--line);
}

.report-month-values div {
    padding: 12px;
    background: var(--paper-2);
}

.report-month-values span,
.report-month-values strong,
.report-month-values small {
    display: block;
}

.report-month-values span {
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
}

.report-month-values strong {
    margin-top: 4px;
    font-size: 12px;
}

.report-month-values small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 8px;
}

.report-table {
    min-width: 980px;
}

.report-pie-section {
    padding: 26px;
    border: 1px solid var(--line);
    background: white;
}

.report-pie-layout {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(260px, 1.3fr);
    gap: clamp(24px, 5vw, 64px);
    align-items: center;
}

.report-pie {
    display: block;
    width: min(100%, 360px);
    margin: auto;
    transform: rotate(-90deg);
}

.report-pie-base,
.report-pie-segment {
    fill: none;
    stroke-width: 22;
}

.report-pie-base {
    stroke: var(--paper-2);
}

.report-pie-segment-0 { stroke: #3d5139; }

.report-pie-segment-1 { stroke: #a89c72; }

.report-pie-segment-2 { stroke: #73816a; }

.report-pie-segment-3 { stroke: #8d5c45; }

.report-pie-segment-4 { stroke: #b8aa83; }

.report-pie-segment-5 { stroke: #53615b; }

.report-pie-legend {
    display: grid;
    gap: 1px;
    background: var(--line);
}

.report-pie-legend > div {
    display: grid;
    grid-template-columns: 13px 1fr;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    background: var(--paper-2);
}

.report-pie-key {
    width: 13px;
    height: 13px;
}

.report-pie-key-0 { background: #3d5139; }

.report-pie-key-1 { background: #a89c72; }

.report-pie-key-2 { background: #73816a; }

.report-pie-key-3 { background: #8d5c45; }

.report-pie-key-4 { background: #b8aa83; }

.report-pie-key-5 { background: #53615b; }

.report-pie-legend strong,
.report-pie-legend small {
    display: block;
}

.report-pie-legend strong {
    font-size: 11px;
}

.report-pie-legend small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 9px;
}

@media (max-width: 1000px) {
    .dashboard-revenue {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-revenue > div,
    .dashboard-revenue > a {
        grid-column: 1 / -1;
    }

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

    .report-month-values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .report-pie-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .dashboard-revenue,
    .report-tabs,
    .report-month-values {
        grid-template-columns: 1fr;
    }

    .report-metrics {
        grid-template-columns: 1fr;
    }

    .dashboard-revenue article {
        padding: 12px 0;
        border-top: 1px solid rgb(255 255 255 / 15%);
        border-left: 0;
    }

    .filter-bar > p {
        grid-column: 1;
    }

    .dashboard-revenue > div,
    .dashboard-revenue > a {
        grid-column: 1;
    }

    .report-scope {
        align-items: flex-start;
        flex-direction: column;
    }
}

.staff-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    background: white;
}

.staff-table {
    width: 100%;
    min-width: 830px;
    border-collapse: collapse;
    font-size: 12px;
}

.staff-table th,
.staff-table td {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: middle;
}

.staff-table th {
    color: var(--muted);
    background: var(--paper-2);
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.staff-table tbody tr:last-child td {
    border-bottom: 0;
}

.staff-table td > strong,
.staff-table td > small {
    display: block;
}

.staff-table td > small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.status-pill {
    display: inline-flex;
    padding: 4px 8px;
    color: #3f4935;
    background: #e0e7d8;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.status-draft {
    color: #625b3e;
    background: #eee9d1;
}

.status-pending_payment {
    color: #625b3e;
    background: #eee9d1;
}

.status-withdrawn {
    color: #714b0a;
    background: #f5dfac;
}

.status-cancelled {
    color: #782f25;
    background: #f0ddd8;
}

.status-payment_failed {
    color: #782f25;
    background: #f0ddd8;
}

.status-form {
    display: flex;
    gap: 6px;
}

.event-list-controls {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.filter-bar {
    --filter-label-height: 16px;
    --filter-control-height: 44px;
    --filter-label-gap: 8px;

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    margin-bottom: 16px;
    padding: 20px;
    border: 1px solid var(--line);
    background: white;
}

.filter-bar--events {
    grid-template-columns: minmax(170px, 0.8fr) minmax(230px, 1.2fr);
    margin-bottom: 0;
}

.filter-bar--event-bookings {
    grid-template-columns: minmax(150px, 0.8fr) minmax(170px, 1fr) minmax(220px, 1.4fr) minmax(150px, 0.8fr) auto;
    margin-bottom: 0;
}

.filter-bar--event-bookings .filter-options > legend span {
    margin-left: 4px;
    color: var(--muted);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.event-booking-export-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
    margin: 12px 0 16px;
}

.event-booking-export-actions > span {
    margin-right: 4px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.event-booking-export-actions .button {
    min-height: 36px;
    padding: 8px 14px;
    font-size: 10px;
}

.event-booking-group-row th {
    padding: 10px 14px;
    border-top: 2px solid var(--olive);
    color: #34382f;
    background: var(--paper-2);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.filter-bar--visibility {
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 0;
}

.filter-bar--authentication {
    grid-template-columns: repeat(2, minmax(180px, 1fr)) auto;
}

.filter-bar--game-day {
    grid-template-columns: minmax(150px, 0.65fr) minmax(0, 2.35fr) auto;
}

.game-day-search-submit {
    width: 44px;
    min-width: 44px;
    padding: 0;
}

.game-day-search-submit svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.filter-bar--tokens {
    grid-template-columns: minmax(180px, 1.2fr) minmax(180px, 1fr) minmax(150px, 0.8fr) auto;
}

.filter-bar--transactions {
    grid-template-columns: minmax(360px, 1.6fr) minmax(190px, 0.85fr) minmax(150px, 0.7fr) auto;
    gap: 16px;
    margin-bottom: 34px;
    padding: 24px;
}

.filter-bar--gift-cards {
    grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(180px, 1fr)) auto;
    margin-bottom: 34px;
}

.filter-bar--refunds {
    grid-template-columns: minmax(220px, 320px) auto;
    margin-bottom: 34px;
}

.filter-bar--affiliates {
    grid-template-columns: minmax(220px, 320px) auto;
}

.filter-bar--promotions {
    grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(160px, 1fr)) auto;
    margin-bottom: 24px;
}

.filter-bar--promotions .filter-actions {
    align-self: end;
}

.filter-bar--reports {
    grid-template-columns: minmax(0, 1fr) 190px auto;
}

.filter-bar--reports .filter-options > legend {
    margin-bottom: 9px;
}

.filter-bar--attendance {
    grid-template-columns: 190px auto;
}

.filter-field {
    display: grid;
    grid-template-rows: var(--filter-label-height) var(--filter-control-height);
    gap: var(--filter-label-gap);
    min-width: 0;
    align-self: start;
}

.filter-date-range {
    display: grid;
    grid-template-rows: var(--filter-label-height) var(--filter-control-height);
    gap: var(--filter-label-gap);
    min-width: 0;
    align-self: start;
}

.filter-field > span:first-child {
    display: flex;
    min-height: var(--filter-label-height);
    align-items: flex-end;
    margin: 0;
    color: #34382f;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.filter-options > legend,
.filter-group-label {
    display: flex;
    min-height: var(--filter-label-height);
    align-items: flex-end;
    margin: 0;
    color: #34382f;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.filter-field > input,
.filter-field > select {
    display: block;
    width: 100%;
    height: var(--filter-control-height);
    min-height: var(--filter-control-height);
    margin: 0;
    padding: 0 12px;
    border: 1px solid #918e85;
    border-radius: 0;
    color: var(--ink);
    background: #f8f7f2;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.2;
}

.filter-date-time-input {
    color: var(--ink);
    color-scheme: light;
}

.filter-date-time-input::-webkit-date-and-time-value,
.filter-date-time-input::-webkit-datetime-edit {
    color: var(--ink);
    opacity: 1;
    text-align: left;
}

.filter-date-time-input::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.78;
}

.filter-date-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    height: var(--filter-control-height);
}

.filter-date-control {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    min-width: 0;
    height: var(--filter-control-height);
    overflow: hidden;
    border: 1px solid #918e85;
    background: white;
}

.filter-date-control:focus-within {
    border-color: var(--olive);
    outline: 3px solid rgb(85 102 58 / 18%);
    outline-offset: 1px;
}

.filter-date-control.has-error {
    border-color: #a13a2b;
}

.filter-date-control > span {
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-right: 1px solid #b8b4a9;
    color: #34382f;
    background: #ece9df;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.filter-date-control > input {
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0 10px;
    border: 0;
    border-radius: 0;
    color: var(--ink);
    background: white;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.2;
}

.filter-date-control > input:focus-visible {
    outline: 0;
}

.filter-date-errors {
    display: flex;
    grid-row: 3;
    flex-wrap: wrap;
    gap: 4px 16px;
}

.filter-date-errors .field-error {
    margin: 0;
}

.filter-field > .field-error {
    grid-row: 3;
    margin-top: 0;
}

.filter-actions {
    display: flex;
    gap: 8px;
    align-items: stretch;
    align-self: start;
    padding-top: calc(var(--filter-label-height) + var(--filter-label-gap));
}

.filter-actions .button {
    height: var(--filter-control-height);
    min-height: var(--filter-control-height);
    margin: 0;
    padding: 10px 16px;
    font-size: 10px;
}

.filter-options {
    display: grid;
    grid-template-rows: var(--filter-label-height) minmax(var(--filter-control-height), auto);
    gap: var(--filter-label-gap);
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.filter-options > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: var(--filter-control-height);
    align-items: center;
}

.filter-options > div > label {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    font-size: 10px;
}

.filter-bar > p {
    grid-column: 1 / -1;
    margin: -6px 0 0;
    color: var(--muted);
    font-size: 10px;
}

.staff-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.staff-tag-list span {
    display: inline-flex;
    padding: 5px 7px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: var(--paper-2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

.walk-on-player-results {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
    margin-bottom: 18px;
}

.walk-on-player-results a {
    display: grid;
    gap: 4px;
    padding: 16px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: white;
}

.walk-on-player-results a:hover,
.walk-on-player-results a:focus-visible {
    border-color: var(--olive);
    background: var(--paper-2);
}

.walk-on-player-results span,
.walk-on-player-results small {
    color: var(--muted);
    font-size: 10px;
}

.walk-on-payment-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.walk-on-payment-option {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 12px;
    align-items: start;
    padding: 18px;
    border: 2px solid var(--line);
    cursor: pointer;
    background: white;
}

.walk-on-payment-option:has(input:checked) {
    border-color: var(--olive);
    box-shadow: inset 0 0 0 1px var(--olive);
}

.walk-on-payment-option input {
    width: 18px;
    height: 18px;
    margin: 3px 0 0;
    accent-color: var(--olive);
}

.walk-on-payment-option span {
    display: grid;
    gap: 5px;
}

.walk-on-payment-option strong {
    font-family: var(--display);
    font-size: 16px;
    text-transform: uppercase;
}

.walk-on-payment-option small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.walk-on-payment-complete .self-check-in-ready-mark {
    width: 68px;
    height: 68px;
    margin-bottom: 18px;
    border-color: var(--olive);
    color: var(--olive);
}

.staff-account-shell {
    max-width: 860px;
}

.dashboard-attention {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    margin-bottom: 20px;
    padding: 24px;
    border-left: 5px solid #a33e32;
    background: #f3e9e4;
}

.dashboard-attention h2 {
    margin: 5px 0 7px;
    font-family: var(--display);
    font-size: 28px;
    text-transform: uppercase;
}

.dashboard-attention p {
    color: var(--muted);
    line-height: 1.6;
}

.staff-section > p {
    color: var(--muted);
    line-height: 1.6;
}

.dashboard-attention-actions {
    display: grid;
    gap: 12px;
}

.calendar-secret {
    display: grid;
    gap: 12px;
}

.calendar-secret {
    margin: 20px 0;
    padding: 20px;
    border-left: 4px solid var(--signal);
    color: white;
    background: var(--ink);
}

.calendar-secret input {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid rgb(255 255 255 / 25%);
    color: white;
    background: rgb(255 255 255 / 8%);
}

.calendar-secret p {
    margin: 0;
    color: rgb(255 255 255 / 65%);
    font-size: 13px;
    line-height: 1.55;
}

.calendar-setup-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.calendar-setup-actions .button {
    margin: 0;
}

.calendar-secret .calendar-setup-help {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
}

.calendar-secret .calendar-setup-help p {
    padding: 12px;
    border: 1px solid rgb(255 255 255 / 14%);
    background: rgb(255 255 255 / 5%);
}

.calendar-secret .calendar-setup-help strong {
    display: block;
    margin-bottom: 4px;
    color: white;
}

.calendar-secret .calendar-private-warning {
    color: rgb(255 255 255 / 78%);
}

.player-email-identity > summary > * {
    min-width: 0;
}

@media (max-width: 760px) {
    .dashboard-attention {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

/* Chronograph operator */

.chrono-operator-shell {
    padding-top: 32px;
}

.chrono-toolbar {
    align-items: center;
    margin-bottom: 28px;
}

.chrono-toolbar h1 {
    max-width: 760px;
    margin-bottom: 8px;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.chrono-response-errors {
    margin-bottom: 20px;
}

.chrono-response-errors p {
    margin: 4px 0 0;
}

.chrono-context-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: stretch;
}

.chrono-event-selector,
.chrono-search-panel,
.chrono-player-workspace,
.chrono-add-weapon[open] {
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 23%);
}

.chrono-event-selector {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
    padding: 18px;
}

.chrono-day-switch {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.chrono-event-selector label,
.chrono-operator-form label {
    min-width: 0;
}

.chrono-event-selector label > span,
.chrono-operator-form label > span {
    display: block;
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.chrono-event-selector select,
.chrono-event-selector input,
.chrono-operator-form select,
.chrono-operator-form input,
.chrono-operator-form textarea {
    width: 100%;
    min-width: 0;
}

.staff-form-controls input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.staff-form-controls select,
.staff-form-controls textarea {
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid #aaa69b;
    border-radius: 0;
    color: var(--ink);
    background: white;
    font: inherit;
    font-size: 14px;
}

.staff-form-controls textarea {
    resize: vertical;
}

.staff-form-controls input:focus-visible,
.staff-form-controls select:focus-visible,
.staff-form-controls textarea:focus-visible {
    border-color: var(--olive);
    outline: 3px solid rgb(85 102 58 / 18%);
    outline-offset: 1px;
}

.staff-form-controls .has-error input,
.staff-form-controls .has-error select,
.staff-form-controls .has-error textarea,
.staff-form-controls [aria-invalid="true"] {
    border-color: #a13a2b;
}

.chrono-event-selector .button {
    white-space: nowrap;
}

.chrono-metrics {
    display: grid;
    grid-template-columns: repeat(6, minmax(78px, 1fr));
    margin: 0;
    border: 1px solid var(--line);
    background: var(--ink-2);
    color: white;
}

.chrono-metrics div {
    display: flex;
    min-height: 96px;
    padding: 14px;
    border-right: 1px solid rgb(255 255 255 / 13%);
    flex-direction: column-reverse;
    justify-content: space-between;
}

.chrono-metrics div:last-child {
    border-right: 0;
}

.chrono-metrics dt {
    color: rgb(255 255 255 / 62%);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.35;
    text-transform: uppercase;
}

.chrono-metrics dd {
    margin: 0;
    font-family: var(--display);
    font-size: 32px;
    font-weight: 900;
    line-height: 1;
}

.chrono-search-panel {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(320px, 1.3fr);
    gap: 18px 30px;
    margin-top: 18px;
    padding: 24px;
}

.chrono-search-panel h2,
.chrono-player-heading h2,
.chrono-status-body h2 {
    margin: 3px 0 0;
    font-family: var(--display);
    font-size: 28px;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
}

.chrono-search-panel > form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.chrono-search-panel input[type="search"] {
    width: 100%;
    min-width: 0;
    min-height: 48px;
}

.chrono-search-results {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
}

.chrono-not-checked-in-results {
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.chrono-not-checked-in-results > p,
.chrono-status-sticky p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.chrono-player-row {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.chrono-player-row > div {
    display: grid;
    min-width: 0;
}

.chrono-player-row strong,
.chrono-player-row span {
    overflow-wrap: anywhere;
}

.chrono-player-row span {
    color: var(--muted);
    font-size: 12px;
}

.chrono-player-workspace {
    margin-top: 22px;
    padding: clamp(20px, 3vw, 34px);
}

.chrono-player-heading {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.chrono-player-heading p {
    margin: 6px 0 0;
    color: var(--muted);
    overflow-wrap: anywhere;
}

.chrono-state,
.chrono-result {
    display: inline-flex;
    padding: 7px 10px;
    border: 1px solid currentColor;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.chrono-state[data-status="cleared"],
.chrono-result.is-pass {
    color: #385122;
}

.chrono-state[data-status="no_passing_weapons"],
.chrono-result.is-fail,
.chrono-result.is-invalidated {
    color: #7b281b;
}

.chrono-weapon-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.chrono-weapon-card {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--line);
    background: var(--paper);
}

.chrono-weapon-card.is-incomplete {
    border: 2px solid #7b281b;
}

.chrono-weapon-card > header {
    display: flex;
    gap: 16px;
    align-items: start;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.chrono-weapon-card > header span,
.chrono-weapon-card > header > strong {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.chrono-weapon-card h3 {
    margin: 3px 0 0;
    font-family: var(--display);
    font-size: 25px;
    line-height: 1;
    text-transform: uppercase;
}

.chrono-evidence {
    min-height: 118px;
    padding: 18px 0;
}

.chrono-evidence p,
.chrono-guidance {
    margin: 9px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.chrono-measurements {
    display: flex;
    gap: 8px 14px;
    flex-wrap: wrap;
    margin-top: 12px;
    font-family: var(--display);
    font-size: 20px;
}

.chrono-guidance {
    padding: 10px 12px;
    border-left: 3px solid var(--signal-dark);
    background: rgb(255 255 255 / 25%);
    overflow-wrap: anywhere;
}

.chrono-card-form {
    margin-top: 16px;
    border-top: 1px solid var(--line);
}

.chrono-card-form > summary,
.chrono-add-weapon > summary {
    padding: 12px 0;
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}

.chrono-card-form > summary::marker,
.chrono-add-weapon > summary::marker,
.chrono-status-panel > summary::marker {
    content: "";
}

.chrono-operator-form {
    min-width: 0;
}

.chrono-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.chrono-operator-form small {
    display: block;
    margin-top: 4px;
    color: #7b281b;
    font-size: 11px;
}

.chrono-test-form {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.chrono-conflict {
    margin-top: 16px;
    padding: 14px;
    border: 2px solid #7b281b;
    background: #eee0d2;
}

.chrono-conflict p {
    margin: 5px 0 0;
    font-size: 12px;
}

.chrono-add-weapon {
    width: 100%;
    margin-top: 20px;
}

.chrono-add-weapon[open] {
    padding: 18px;
}

.chrono-player-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.chrono-completion-warning,
.chrono-finish-confirmation {
    padding: 12px 14px;
    border-left: 4px solid #7b281b;
    background: #eee0d2;
    color: #5e2118;
}

.chrono-completion-warning {
    margin: 0 0 18px;
    font-size: 12px;
    font-weight: 800;
}

.chrono-finish-confirmation {
    margin-bottom: 12px;
}

.chrono-start-form {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border: 1px dashed var(--line);
}

.chrono-start-form p {
    margin: 0;
}

.chrono-operator-main {
    min-width: 0;
}

.chrono-status-panel {
    position: relative;
}

.chrono-status-panel > summary {
    list-style: none;
    cursor: pointer;
}

.chrono-status-close-label,
.chrono-status-panel[open] .chrono-status-open-label {
    display: none;
}

.chrono-status-panel[open] .chrono-status-close-label {
    display: inline;
}

@media (min-width: 1281px) {
    .staff-page .chrono-operator-shell > .shell {
        width: calc(100% - 64px);
    }
}

@media (min-width: 1181px) {
    .chrono-operator-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(380px, 32vw, 480px);
        gap: 24px;
        align-items: start;
    }

    .chrono-operator-main {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
    }

    .chrono-status-panel {
        min-width: 0;
        grid-column: 2;
        grid-row: 1;
        position: sticky;
        top: calc(var(--staff-app-header-height) + 16px);
        height: calc(100dvh - var(--staff-app-header-height) - 32px);
    }

    .chrono-status-panel > summary,
    .chrono-status-close {
        display: none;
    }

    .chrono-status-panel:not([open]) > .chrono-status-body,
    .chrono-status-panel[open] > .chrono-status-body {
        display: flex;
    }

    .chrono-status-body {
        height: 100%;
        padding: 24px;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid var(--line);
        background: var(--paper);
        box-shadow: 0 12px 32px rgb(8 11 8 / 12%);
    }

    .chrono-weapon-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 1181px) and (max-width: 1280px) {
    .chrono-status-panel {
        top: 16px;
        height: calc(100dvh - 32px);
    }
}

.chrono-status-sticky {
    position: sticky;
    z-index: 1;
    top: 0;
    flex: 0 0 auto;
    background: var(--paper);
}

.chrono-status-sticky > header {
    display: flex;
    gap: 16px;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 18px;
}

.chrono-status-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.chrono-status-heading-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

.chrono-status-close {
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    background: transparent;
    cursor: pointer;
    font-size: 25px;
}

.chrono-status-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    margin-bottom: 18px;
    border-top: 1px solid var(--line);
}

.chrono-status-filters a {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 10px 2px;
    border-bottom: 1px solid var(--line);
    font-size: 12px;
    font-weight: 750;
}

.chrono-status-filters a.is-current {
    padding-left: 10px;
    border-left: 4px solid var(--signal-dark);
    font-weight: 900;
}

/* Chronograph history and print */

.chrono-history-shell {
    padding-top: 32px;
}

.chrono-history-toolbar {
    margin-bottom: 24px;
}

.chrono-history-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
}

.chrono-history-filters label {
    display: grid;
    min-width: 0;
    gap: 6px;
}

.chrono-history-filters label > span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.chrono-history-filters input,
.chrono-history-filters select {
    width: 100%;
    min-width: 0;
}

.chrono-history-search {
    grid-column: span 2;
}

.chrono-history-filters .filter-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.chrono-history-list {
    display: grid;
    gap: 14px;
}

.chrono-history-weapon-heading {
    display: flex;
    gap: 20px;
    align-items: end;
    justify-content: space-between;
    margin-top: 18px;
    padding: 20px;
    color: white;
    background: var(--ink-2);
}

.chrono-history-weapon-heading:first-child {
    margin-top: 0;
}

.chrono-history-weapon-heading span,
.chrono-history-weapon-heading p {
    color: rgb(255 255 255 / 65%);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.5;
    text-transform: uppercase;
}

.chrono-history-weapon-heading h3,
.chrono-history-weapon-heading p {
    margin: 0;
}

.chrono-history-weapon-heading h3 {
    margin-top: 5px;
    font-family: var(--display);
    font-size: 23px;
    text-transform: uppercase;
}

.chrono-history-entry {
    padding: 20px;
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 23%);
}

.chrono-history-entry > header {
    display: flex;
    gap: 16px;
    align-items: start;
    justify-content: space-between;
}

.chrono-history-entry > header span:first-child {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.chrono-history-entry h4 {
    margin: 5px 0 0;
    font-family: var(--display);
    font-size: 22px;
    text-transform: uppercase;
}

.chrono-history-evidence {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 18px 0 0;
    background: var(--line);
}

.chrono-history-evidence div {
    min-width: 0;
    padding: 13px;
    background: var(--paper);
}

.chrono-history-evidence dt,
.chrono-history-evidence dd {
    margin: 0;
}

.chrono-history-evidence dt {
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.chrono-history-evidence dd {
    font-size: 12px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.chrono-history-conflict {
    margin: 14px 0 0;
    padding: 10px 12px;
    color: #7b281b;
    border-left: 3px solid currentColor;
    background: #eee0d2;
    font-size: 11px;
    font-weight: 850;
}

.chrono-status-print-shell {
    width: min(900px, calc(100% - 48px));
    min-height: 100vh;
    margin: 0 auto;
    padding: 52px 0 72px;
}

.chrono-status-print-heading {
    padding-bottom: 22px;
    border-bottom: 3px solid var(--ink);
}

.chrono-status-print-heading > span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.chrono-status-print-heading h1 {
    margin: 8px 0 5px;
    font-family: var(--display);
    font-size: clamp(34px, 6vw, 58px);
    line-height: 1;
    text-transform: uppercase;
}

.chrono-status-print-heading p,
.chrono-status-print-empty,
.chrono-status-print-error {
    margin: 0;
    color: var(--muted);
}

.chrono-status-print-list {
    margin: 24px 0 0;
    padding: 0;
    list-style-position: inside;
}

.chrono-status-print-list li {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 20px;
    align-items: center;
    padding: 14px 2px;
    border-bottom: 1px solid var(--line);
}

.chrono-status-print-list li > div {
    display: inline-flex;
    gap: 10px;
    align-items: baseline;
}

.chrono-status-print-list strong {
    font-family: var(--display);
    font-size: 18px;
    text-transform: uppercase;
}

.chrono-status-print-list span {
    color: var(--muted);
    font-size: 11px;
}

.chrono-status-print-empty,
.chrono-status-print-error {
    padding: 24px 0;
}

@media (max-width: 1180px) {
    html.chrono-status-modal-open {
        overflow: hidden;
    }

    .chrono-operator-layout {
        display: flex;
        flex-direction: column;
    }

    .chrono-status-panel {
        order: -1;
        margin-bottom: 20px;
    }

    .chrono-status-panel > summary {
        width: 100%;
        list-style: none;
    }

    .chrono-status-panel[open] .chrono-status-body {
        position: fixed;
        z-index: 70;
        inset: 0;
        width: 100%;
        height: 100dvh;
        display: flex;
        padding: 76px 18px 18px;
        flex-direction: column;
        overflow: hidden;
        border: 0;
        background: var(--paper);
    }

    .chrono-status-panel[open] > summary {
        position: fixed;
        z-index: 72;
        top: 12px;
        left: 12px;
        width: auto;
        max-width: calc(100vw - 80px);
        background: var(--paper);
    }
}

@media (max-width: 1080px) {
    .chrono-context-grid,
    .chrono-search-panel {
        grid-template-columns: 1fr;
    }

    .chrono-search-results {
        grid-column: 1;
    }

    .chrono-metrics {
        grid-template-columns: repeat(3, 1fr);
    }

    .chrono-metrics div:nth-child(3) {
        border-right: 0;
    }

    .chrono-metrics div:nth-child(-n + 3) {
        border-bottom: 1px solid rgb(255 255 255 / 13%);
    }

}

@media (max-width: 760px) {
    .chrono-weapon-grid {
        grid-template-columns: repeat(2, minmax(250px, 1fr));
        overflow-x: auto;
        scroll-snap-type: x proximity;
    }

    .chrono-weapon-card {
        scroll-snap-align: start;
    }

    .chrono-history-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .chrono-operator-shell {
        padding-top: 22px;
        padding-bottom: 130px;
    }

    .chrono-toolbar,
    .chrono-player-heading,
    .chrono-start-form {
        align-items: stretch;
        flex-direction: column;
    }

    .chrono-toolbar-actions,
    .chrono-toolbar-actions > .button {
        width: 100%;
    }

    .chrono-event-selector,
    .chrono-search-panel > form,
    .chrono-form-grid,
    .chrono-weapon-grid {
        grid-template-columns: 1fr;
    }

    .chrono-weapon-grid {
        max-width: 100%;
        overflow: visible;
    }

    .chrono-metrics {
        grid-template-columns: repeat(2, 1fr);
    }

    .chrono-metrics div,
    .chrono-metrics div:nth-child(3) {
        border-right: 1px solid rgb(255 255 255 / 13%);
        border-bottom: 1px solid rgb(255 255 255 / 13%);
    }

    .chrono-metrics div:nth-child(2n) {
        border-right: 0;
    }

    .chrono-metrics div:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .chrono-search-panel,
    .chrono-player-workspace {
        padding: 18px;
    }

    .chrono-player-row {
        align-items: stretch;
        flex-direction: column;
    }

    .chrono-player-row .button,
    .chrono-test-form .button,
    .chrono-player-actions,
    .chrono-player-actions form,
    .chrono-player-actions .button {
        width: 100%;
    }

    .chrono-player-actions {
        position: sticky;
        z-index: 15;
        bottom: 0;
        padding: 14px 0;
        background: var(--paper);
    }

    .chrono-history-filters,
    .chrono-history-evidence {
        grid-template-columns: 1fr;
    }

    .chrono-history-search {
        grid-column: auto;
    }

    .chrono-history-weapon-heading,
    .chrono-history-entry > header,
    .chrono-status-print-list li {
        align-items: stretch;
        grid-template-columns: 1fr;
        flex-direction: column;
    }
}

/* The rental-desk list. Screen styles first; the print block that matters is
   further down beside the other print rules. The page carries no interactive
   chrome at all, so there is nothing here to hide on paper except the staff
   application's own header and navigation. */

.add-on-print-shell {
    display: grid;
    gap: 24px;
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 24px;
}

.add-on-print-heading {
    display: grid;
    gap: 4px;
}

.add-on-print-heading span {
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6b6754;
}

.add-on-print-heading h1 {
    margin: 0;
    font-size: 26px;
}

.add-on-print-heading p {
    margin: 0;
    color: #4a4738;
}

.add-on-print-capacity {
    font-weight: 600;
}

.add-on-print-error,
.add-on-print-empty {
    margin: 0;
    padding: 12px 16px;
    border: 1px solid #d6d3c5;
    border-radius: 6px;
    background: #fbfaf5;
}

.add-on-print-day {
    display: grid;
    gap: 12px;
    break-inside: avoid;
}

.add-on-print-day h2 {
    margin: 0;
    padding-bottom: 6px;
    border-bottom: 2px solid #2f2d24;
    font-size: 19px;
}

.add-on-print-totals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.add-on-print-totals li {
    display: flex;
    gap: 8px;
    align-items: baseline;
    padding: 6px 10px;
    border: 1px solid #d6d3c5;
    border-radius: 6px;
}

.add-on-print-totals em {
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.06em;
}

.add-on-print-list {
    width: 100%;
    border-collapse: collapse;
}

.add-on-print-list th,
.add-on-print-list td {
    padding: 7px 8px;
    border-bottom: 1px solid #d6d3c5;
    text-align: left;
    vertical-align: top;
    font-size: 13px;
}

.add-on-print-list th {
    border-bottom-width: 2px;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.add-on-print-list td span {
    display: block;
    color: #6b6754;
    font-size: 12px;
}

.add-on-print-tick {
    width: 90px;
    border-left: 1px solid #d6d3c5;
}

/* The staff event form's add-on slots, inside the tickets step. */

.add-on-builder {
    display: grid;
    gap: 16px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--line, #d6d3c5);
}

.add-on-builder-card {
    display: grid;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--line, #d6d3c5);
    border-radius: 8px;
    background: #fbfaf5;
}

/* The button that reveals the next hidden add-on slot. .add-on-builder is a
   single-column grid, which would otherwise stretch the button the full width of
   the step and make it read as the primary action of the section. */

.add-on-builder-add {
    justify-self: start;
}

@media print {
    .chrono-toolbar-actions,
    .chrono-event-selector,
    .chrono-search-panel,
    .chrono-status-panel,
    .chrono-operator-form,
    .chrono-card-form,
    .chrono-add-weapon,
    .chrono-player-actions {
        display: none !important;
    }

    .chrono-operator-shell,
    .chrono-player-workspace,
    .chrono-weapon-card {
        min-height: 0;
        padding: 0;
        border-color: #888;
        background: white;
        box-shadow: none;
    }

    .chrono-status-print-page {
        padding: 0;
    }

    .chrono-status-print-page .skip-link,
    .chrono-status-print-page .staff-app-header,
    .chrono-status-print-page .staff-nav,
    .chrono-status-print-page .staff-alert-stack {
        display: none !important;
    }

    .chrono-status-print-page #main-content {
        margin: 0;
    }

    .chrono-status-print-shell {
        width: 100%;
        min-height: 0;
        padding: 0;
    }

    .chrono-status-print-list li {
        break-inside: avoid;
    }

    .game-day-add-ons-print-page {
        padding: 0;
    }

    .game-day-add-ons-print-page .skip-link,
    .game-day-add-ons-print-page .staff-app-header,
    .game-day-add-ons-print-page .staff-nav,
    .game-day-add-ons-print-page .staff-alert-stack,
    .game-day-add-ons-print-page .add-on-print-filter {
        display: none !important;
    }

    .game-day-add-ons-print-page #main-content {
        margin: 0;
    }

    .add-on-print-shell {
        width: 100%;
        padding: 0;
    }

    .add-on-print-list tr,
    .add-on-print-totals li {
        break-inside: avoid;
    }
}

.booking-import-intro ul {
    display: grid;
    gap: 8px;
    margin: 18px 0 0;
    padding-left: 22px;
}

.booking-import-mode-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.booking-import-mode-options label {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
    min-height: 104px;
    padding: 20px;
    border: 1px solid var(--line, #d6d3c5);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
}

.booking-import-mode-options label:has(input:checked) {
    border-color: var(--accent, #a78335);
    box-shadow: 0 0 0 2px rgb(167 131 53 / 18%);
}

.booking-import-mode-options small,
.booking-import-player-heading span,
.booking-import-review-row small {
    display: block;
    margin-top: 5px;
    color: var(--muted, #68685e);
}

.booking-import-players,
.booking-import-review-list {
    display: grid;
    gap: 18px;
}

.booking-import-player,
.booking-import-review-row {
    padding: 22px;
    border: 1px solid var(--line, #d6d3c5);
    border-radius: 8px;
    background: #faf9f4;
}

.booking-import-player-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}

.booking-import-player-heading > div {
    display: flex;
    gap: 10px;
    align-items: center;
}

.booking-import-mapping {
    margin: 24px 0;
}

.booking-import-form .form-grid.three-column,
.booking-import-mapping {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.booking-import-review-row .form-grid.four-column {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.booking-import-sample {
    margin: 24px 0;
}

.booking-import-sample .staff-table {
    min-width: max-content;
}

.booking-import-metrics {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 24px;
}

.booking-import-review-row.status-error {
    border-color: #b94b45;
    box-shadow: inset 4px 0 #b94b45;
}

.booking-import-review-row.status-excluded {
    opacity: .72;
}

.booking-import-row-error {
    margin: -4px 0 18px;
    padding: 12px 14px;
    border-radius: 6px;
    background: #fff0ee;
}

.booking-import-row-decisions {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.booking-import-commit,
.booking-import-actions {
    margin-top: 24px;
}

.booking-import-reverse {
    max-width: 680px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--line, #d6d3c5);
}

.booking-import-reverse > label {
    display: grid;
    gap: 7px;
    margin-top: 16px;
}

@media (max-width: 980px) {
    .booking-import-mode-options,
    .booking-import-metrics {
        grid-template-columns: 1fr 1fr;
    }

    .booking-import-form .form-grid.three-column,
    .booking-import-mapping,
    .booking-import-review-row .form-grid.four-column {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .booking-import-mode-options,
    .booking-import-metrics,
    .booking-import-form .form-grid.three-column,
    .booking-import-mapping,
    .booking-import-review-row .form-grid.four-column {
        grid-template-columns: 1fr;
    }

    .booking-import-player,
    .booking-import-review-row {
        padding: 16px;
    }

    .booking-import-player-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

.table-action-link {
    display: inline-flex;
    margin: 0 8px 8px 0;
    padding: 7px 9px;
    color: white;
    background: var(--olive);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.staff-role-label,
.staff-page-lead {
    max-width: 680px;
    color: var(--muted);
    font-size: 12px;
}

.conduct-panel label {
    display: grid;
    gap: 7px;
}

.conduct-panel label > span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.conduct-panel textarea,
.conduct-panel select {
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 0;
    background: var(--paper-2);
}

.ticket-scan-notice {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
    margin-top: 22px;
    padding: 22px 24px;
    border-left: 4px solid var(--signal);
    color: white;
    background: var(--ink);
}

.ticket-scan-notice div {
    display: grid;
    gap: 6px;
}

.ticket-scan-notice .eyebrow {
    color: var(--signal);
}

.ticket-scan-notice strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 18px;
}

.ticket-scan-notice .button-outline {
    border-color: rgb(255 255 255 / 45%);
    color: white;
}

.balance-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.balance-grid article {
    padding: 24px;
    border: 1px solid var(--line);
    background: white;
}

.balance-grid article > strong {
    display: block;
    margin: 18px 0;
    font-family: var(--display);
    font-size: 42px;
    line-height: 1;
}

.balance-grid dl {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
    margin: 0;
}

.balance-grid dl div {
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.balance-grid dt,
.balance-grid dd {
    margin: 0;
}

.balance-grid dt {
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
}

.balance-grid dd {
    margin-top: 4px;
    font-weight: 800;
}

.attendance-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.game-day-orbat-summary {
    display: flex;
    align-items: center;
    gap: 12px;
}

.game-day-mode-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0;
}

.game-day-mode-link {
    display: grid;
    min-width: 44px;
    min-height: 44px;
    gap: 3px;
    align-content: center;
    padding: 14px 16px;
    border: 2px solid #686c61;
    color: #273021;
    background: #ffffff;
}

.game-day-mode-link:hover {
    border-color: #364a32;
    color: #273021;
    background: #f3f1e9;
}

.game-day-mode-link.is-active,
.game-day-mode-link.is-active:hover {
    border-color: #364a32;
    color: #244325;
    background: #d8e8d4;
}

.game-day-mode-link strong {
    font-family: var(--display);
    font-size: 18px;
    line-height: 1.1;
    text-transform: uppercase;
}

.game-day-mode-link span {
    font-size: 12px;
    line-height: 1.35;
}

.game-day-safety-summary {
    position: sticky;
    z-index: 12;
    top: 16px;
    display: grid;
    min-height: 44px;
    grid-template-columns: auto auto;
    gap: 2px 18px;
    align-items: center;
    margin-bottom: 16px;
    padding: 10px;
    border: 1px solid var(--line);
    background: var(--paper);
}

.game-day-safety-summary > .eyebrow {
    color: var(--olive);
    font-size: 9px;
}

.game-day-safety-summary > strong {
    grid-row: 1 / span 2;
    grid-column: 2;
    color: var(--ink);
    font-family: var(--display);
    font-size: 16px;
    font-weight: 900;
    text-align: right;
}

.game-day-orbat-summary > span {
    color: var(--muted);
    font-size: 10px;
    text-transform: uppercase;
}

.game-day-safety-summary > span:not(.eyebrow) {
    color: var(--ink);
    font-size: 10px;
}

.game-day-register-pages {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 16px;
}

.game-day-register-pages .button {
    min-width: 44px;
    min-height: 44px;
}

.game-day-attendance-counts > a {
    display: block;
    min-width: 44px;
    min-height: 44px;
    padding: 18px;
    border: 1px solid #686c61;
    color: #273021;
    background: #ffffff;
}

.game-day-attendance-counts > a:hover,
.game-day-attendance-counts > a[aria-current="page"] {
    border-color: #364a32;
    color: #244325;
    background: #d8e8d4;
}

.game-day-attendance-counts > a:focus-visible {
    outline: 3px solid #364a32;
    outline-offset: 3px;
}

.game-day-attendance-counts dl {
    grid-template-columns: 1fr;
}

.game-day-orbat-summary .button {
    min-width: 44px;
    min-height: 44px;
    padding: 9px 13px;
    font-size: 9px;
}

.game-day-back-link {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
}

.game-day-pagination .pagination a {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
}

.game-day-toolbar .button {
    min-width: 44px;
    min-height: 44px;
}

.game-day-primary-actions { align-items: flex-start; }

.game-day-more-actions { position: relative; }

.game-day-more-actions > summary,
.game-day-team-balance > summary {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border: 1px solid #686c61;
    color: #273021;
    background: #ffffff;
    cursor: pointer;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.game-day-more-actions-panel {
    position: absolute;
    z-index: 20;
    top: calc(100% + 6px);
    right: 0;
    display: grid;
    min-width: 220px;
    gap: 8px;
    padding: 10px;
    border: 1px solid #686c61;
    background: #ffffff;
    box-shadow: 0 12px 30px rgb(8 11 8 / 18%);
}

.game-day-more-actions-panel .button,
.game-day-more-actions-panel form,
.game-day-more-actions-panel form .button { width: 100%; }

.game-day-workspace:has(.game-day-check-in-presentation) {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
    gap: 18px;
    align-items: start;
}

.game-day-check-in-queue {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.game-day-queue-link {
    position: relative;
    display: grid;
    min-width: 44px;
    min-height: 44px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid #686c61;
    color: #273021;
    background: #ffffff;
}

.game-day-queue-link:hover { color: #273021; background: #f3f1e9; }

.game-day-queue-link.is-selected {
    padding-left: 18px;
    border: 2px solid #364a32;
    border-left-width: 7px;
    background: #d8e8d4;
}

.game-day-queue-link.is-selected::after {
    position: absolute;
    top: 5px;
    right: 7px;
    color: #244325;
    content: "Selected";
    font-size: 8px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.game-day-queue-link:focus-visible,
.game-day-player-panel a:focus-visible,
.game-day-player-panel button:focus-visible,
.game-day-player-panel input:focus-visible,
.game-day-player-panel select:focus-visible,
.game-day-more-actions > summary:focus-visible,
.game-day-team-balance > summary:focus-visible {
    outline: 3px solid #364a32;
    outline-offset: 3px;
}

.game-day-queue-identity { display: grid; gap: 2px; }

.game-day-queue-identity strong { font-family: var(--display); font-size: 17px; text-transform: uppercase; }

.game-day-queue-link .status-pill,
.game-day-attention-reason { width: fit-content; }

.game-day-attention-reason {
    grid-column: 1 / -1;
    padding: 5px 7px;
    border: 1px solid #a97831;
    color: #56380f;
    background: #fff4d8;
    font-weight: 800;
}

.game-day-player-panel,
.game-day-player-empty { padding: 18px; border: 1px solid #686c61; background: #ffffff; }

.game-day-player-panel { display: grid; gap: 12px; }

.game-day-player-heading { display: grid; gap: 5px; }

.game-day-player-heading h2,
.game-day-player-heading p { margin: 0; }

.game-day-player-heading h2 { font-family: var(--display); font-size: 26px; text-transform: uppercase; }

.game-day-player-close { display: none; min-width: 44px; min-height: 44px; }

.game-day-player-section { border: 1px solid #cbc8bf; background: #f9f7f1; }

.game-day-player-section > summary {
    display: flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    padding: 10px 12px;
    color: #273021;
    cursor: pointer;
    font-weight: 850;
    text-transform: uppercase;
}

.game-day-player-section[data-game-day-section-state="blocker"],
.game-day-player-section[data-game-day-section-state="validation"] { border-left: 5px solid #a97831; }

.game-day-player-section-body { display: grid; gap: 10px; padding: 0 12px 12px; }

.game-day-player-section-body p,
.game-day-player-section-body form { margin: 0; }

.game-day-shell .game-day-player-panel button,
.game-day-player-panel .button,
.game-day-player-panel .table-action-link,
.game-day-player-panel .waiver-check,
.game-day-shell .game-day-player-panel select { min-width: 44px; min-height: 44px; }

.game-day-check-in-form { display: grid; gap: 12px; }

.game-day-check-in-submit { width: 100%; }

.game-day-team-balance { margin-top: 16px; }

.game-day-team-balance > summary { width: 100%; justify-content: flex-start; }

.game-day-team-balance > .balance-grid {
    grid-template-columns: 1fr;
    margin-top: 14px;
}

.game-day-team-balance .balance-grid dl {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.game-day-live { display: block; }

.game-day-live > [data-staff-region="game-day-summary"]:has(.game-day-safety-summary) {
    display: contents;
}

.game-day-list-region {
    display: grid;
    gap: 10px;
}

.game-day-fire-item {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(150px, 0.7fr) minmax(170px, 0.8fr) minmax(210px, 1fr) minmax(120px, 0.5fr);
    grid-template-areas:
        "group group group group group"
        "identity team presence overnight checkout"
        "details details details details details";
    gap: 12px;
    align-items: start;
    padding: 14px;
    border: 1px solid #686c61;
    color: #273021;
    background: #ffffff;
}

.game-day-fire-group-heading {
    grid-area: group;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 2px solid #686c61;
}

.game-day-fire-group-heading strong,
.game-day-fire-label {
    color: #41483d;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.game-day-fire-identity {
    grid-area: identity;
    display: grid;
    gap: 4px;
}

.game-day-fire-identity > strong:first-of-type {
    font-family: var(--display);
    font-size: 18px;
    text-transform: uppercase;
}

.game-day-fire-team { grid-area: team; }

.game-day-fire-presence {
    grid-area: presence;
    display: grid;
    gap: 7px;
}

.game-day-fire-presence small { font-weight: 750; }

.game-day-fire-overnight {
    grid-area: overnight;
    display: grid;
    gap: 7px;
}

.game-day-fire-overnight .waiver-recorded { width: fit-content; }

.game-day-fire-overnight .attendance-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
}

.game-day-fire-overnight .attendance-actions label {
    display: grid;
    gap: 4px;
}

.game-day-fire-checkout {
    grid-area: checkout;
    display: grid;
}

.game-day-fire-checkout button { width: 100%; }

.game-day-player-details {
    grid-area: details;
    border-top: 1px solid #cbc8bf;
}

.game-day-fire-item summary,
.game-day-site-closure > summary {
    display: flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    padding: 10px 12px;
    color: #273021;
    cursor: pointer;
    font-weight: 850;
    text-transform: uppercase;
}

.game-day-player-details-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px 16px;
    margin: 0;
    padding: 0 12px 12px;
}

.game-day-player-details-grid div { min-width: 0; }

.game-day-player-details-grid dt {
    color: #41483d;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.game-day-player-details-grid dd {
    margin: 3px 0 0;
    overflow-wrap: anywhere;
}

.game-day-player-details .game-day-player-actions { padding: 0 12px 12px; }

.game-day-site-closure {
    margin-top: 16px;
    border: 1px solid #686c61;
    background: #ffffff;
}

.game-day-site-closure-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 0 12px 12px;
}

.game-day-site-closure-action {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 12px;
    border: 1px solid #cbc8bf;
    background: #f9f7f1;
}

.game-day-site-closure-action p,
.game-day-site-closure-action form { margin: 0; }

.game-day-site-closure-action--danger {
    border-color: #9c554a;
    color: #5d231b;
    background: #f8e8e4;
}

.game-day-shell .game-day-fire-item button,
.game-day-shell .game-day-fire-item select,
.game-day-shell .game-day-fire-item summary {
    min-width: 44px;
    min-height: 44px;
}

.game-day-shell .game-day-fire-item summary:focus-visible,
.game-day-site-closure > summary:focus-visible {
    outline: 3px solid #364a32;
    outline-offset: 3px;
}

.game-day-shell .button-primary {
    color: var(--ink);
    background: var(--signal);
}

.game-day-shell .button-primary:hover {
    color: var(--ink);
    background: var(--signal);
}

.game-day-shell .button-primary:focus-visible {
    color: var(--ink);
    background: var(--signal);
}

.game-day-shell .button-disabled {
    color: #ffffff;
    border-color: var(--olive);
    background: var(--olive);
    opacity: 1;
}

.game-day-shell .button-disabled:disabled {
    color: #ffffff;
    background: var(--olive);
    opacity: 1;
}

.game-day-shell a:focus-visible,
.game-day-shell button:focus-visible,
.game-day-shell input:focus-visible,
.game-day-shell select:focus-visible {
    outline: 3px solid var(--olive);
    outline-offset: 3px;
}

.game-day-group-heading th {
    padding: 10px 12px;
    border-top: 2px solid var(--olive);
    background: var(--paper-2);
    text-align: left;
}

.game-day-group-heading th > * {
    margin: 0 14px 0 0;
}

.game-day-group-heading strong {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.game-day-register button,
.game-day-records button,
.game-day-register .table-action-link,
.game-day-records .table-action-link,
.game-day-register .waiver-check,
.game-day-records .waiver-check,
.game-day-register select,
.game-day-records select {
    min-width: 44px;
    min-height: 44px;
}

.game-day-register a:focus-visible,
.game-day-records a:focus-visible,
.game-day-register button:focus-visible,
.game-day-records button:focus-visible,
.game-day-register input:focus-visible,
.game-day-records input:focus-visible,
.game-day-register select:focus-visible,
.game-day-records select:focus-visible {
    outline: 3px solid var(--olive);
    outline-offset: 2px;
}

.attendance-overdue {
    border-left: 5px double var(--ink);
}

.attendance-status-overdue {
    border: 2px solid currentColor;
    text-decoration: underline double;
    text-underline-offset: 3px;
}

.waiver-email-action {
    margin-bottom: 7px;
}

.waiver-email-action button {
    min-height: 30px;
    padding: 6px 8px;
    border: 1px solid #a97831;
    cursor: pointer;
    background: #fff4d8;
    color: #56380f;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.waiver-check {
    display: grid;
    width: 100%;
    grid-template-columns: auto 1fr;
    gap: 7px;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid #a97831;
    background: #fff4d8;
    color: #56380f;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.waiver-check input {
    width: 15px;
    height: 15px;
    min-height: 0;
    margin: 0;
    accent-color: var(--olive);
}

.waiver-recorded {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid #66805b;
    background: #e4eee0;
    color: #294322;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.waiver-recorded-manual {
    border-color: #a97831;
    color: #56380f;
    background: #fff4d8;
}

.waiver-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.waiver-status-rescinded {
    border-color: #9d442e;
    color: #783521;
    background: #f7dfd7;
}

.staff-local-nav {
    display: flex;
    gap: 6px;
    width: fit-content;
    padding: 5px;
    border: 1px solid var(--line);
    background: #e9e6dc;
}

.staff-local-nav a {
    min-height: 40px;
    padding: 10px 15px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.staff-local-nav a:hover,
.staff-local-nav a.is-active {
    color: var(--ink);
    background: white;
    box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
}

.staff-context-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 0.32fr);
    gap: 26px;
    padding: 22px 24px;
    border: 1px solid var(--line);
    background: #f3f0e7;
}

.staff-context-card > div {
    display: grid;
    align-content: start;
    gap: 5px;
}

.staff-context-card > div + div {
    padding-left: 24px;
    border-left: 1px solid var(--line);
}

.staff-context-card strong {
    font-size: 15px;
}

.staff-context-card p {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.staff-context-card span {
    color: var(--muted);
    font-size: 12px;
}

.staff-context-card a {
    width: fit-content;
    color: var(--olive);
    font-size: 12px;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.staff-context-card-warning {
    grid-template-columns: 1fr;
    border-color: #a97831;
    color: #56380f;
    background: #fff8e8;
}

.staff-form {
    display: grid;
    width: 100%;
    max-width: 980px;
    gap: 22px;
    margin-top: 24px;
}

.staff-form-section {
    display: grid;
    gap: 24px;
    padding: 28px;
    border: 1px solid var(--line);
    background: white;
}

.staff-form-section-heading {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--line);
}

.staff-form-section-heading > div {
    display: grid;
    gap: 4px;
}

.staff-form-section-heading h2,
.staff-form-section-heading h3 {
    margin: 0;
    font-size: 20px;
}

.staff-form-section-heading p,
.staff-section-intro {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.staff-section-intro a {
    color: var(--olive);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.staff-field {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.staff-conditional-panel {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.staff-conditional-panel {
    gap: 20px;
    padding: 22px;
    border: 1px solid var(--line);
    background: #f8f7f2;
}

.has-js .staff-conditional-panel.is-condition-disabled {
    display: none;
}

.staff-field-label,
.staff-field > legend {
    padding: 0;
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
}

.staff-field input:not([type="checkbox"]):not([type="radio"]),
.staff-field select,
.staff-field textarea {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid #aaa69b;
    border-radius: 0;
    color: var(--ink);
    background: white;
    font: inherit;
    font-size: 14px;
}

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

.staff-field input:focus-visible,
.staff-field select:focus-visible,
.staff-field textarea:focus-visible {
    border-color: var(--olive);
    outline: 3px solid rgb(85 102 58 / 18%);
    outline-offset: 1px;
}

.staff-field.has-error input,
.staff-field.has-error select,
.staff-field.has-error textarea,
.staff-field [aria-invalid="true"] {
    border-color: #a13a2b;
}

.staff-field-help {
    margin: 0;
    font-size: 12px;
    line-height: 1.55;
}

.staff-field-error {
    margin: 0;
    font-size: 12px;
    line-height: 1.55;
}

.staff-field-help {
    color: var(--muted);
}

.staff-field-error {
    color: #8f2f22;
    font-weight: 800;
}

.staff-compact-control {
    max-width: 620px;
}

.staff-input-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    min-width: 0;
}

.staff-input-action .button {
    min-height: 48px;
    white-space: nowrap;
}

.staff-field .input-suffix {
    display: flex;
    min-width: 0;
}

.staff-field .input-suffix input {
    min-width: 0;
    border-right: 0;
}

.staff-field .input-suffix span {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    padding: 0 14px;
    color: var(--muted);
    border: 1px solid #aaa69b;
    background: #ece9df;
    font-size: 12px;
    font-weight: 800;
}

.staff-switch {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    cursor: pointer;
}

.staff-switch > input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}

.staff-switch-control {
    position: relative;
    width: 44px;
    height: 24px;
    margin-top: 1px;
    border: 1px solid #918e85;
    border-radius: 999px;
    background: #d8d5cc;
    transition: border-color 160ms ease, background-color 160ms ease;
}

.staff-switch-control::after {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 1px 3px rgb(0 0 0 / 26%);
    content: '';
    transition: transform 160ms ease;
}

.staff-switch input:checked + .staff-switch-control {
    border-color: var(--olive);
    background: var(--olive);
}

.staff-switch input:checked + .staff-switch-control::after {
    transform: translateX(20px);
}

.staff-switch input:focus-visible + .staff-switch-control {
    outline: 3px solid rgb(85 102 58 / 24%);
    outline-offset: 2px;
}

.staff-switch-copy {
    display: grid;
    gap: 3px;
}

.staff-switch-copy strong {
    font-size: 14px;
}

.staff-switch-copy small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.staff-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.staff-choice {
    position: relative;
    display: block;
    cursor: pointer;
}

.staff-choice input {
    position: absolute;
    top: 16px;
    left: 15px;
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--olive);
}

.staff-choice > span {
    display: grid;
    min-height: 86px;
    gap: 5px;
    align-content: start;
    padding: 14px 14px 14px 44px;
    border: 1px solid #aaa69b;
    background: white;
}

.staff-choice input:checked + span {
    border-color: var(--olive);
    box-shadow: inset 3px 0 0 var(--olive);
    background: #f4f6ed;
}

.staff-choice input:focus-visible + span {
    outline: 3px solid rgb(85 102 58 / 20%);
    outline-offset: 2px;
}

.staff-choice strong {
    font-size: 13px;
}

.staff-choice small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}

.staff-confirmation {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 15px;
    border: 1px solid var(--line);
    background: #f8f7f2;
    font-size: 13px;
    line-height: 1.5;
}

.staff-confirmation input {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    margin: 1px 0 0;
    accent-color: var(--olive);
}

.staff-confirmation.has-error {
    border-color: #a13a2b;
}

.staff-divider {
    border-top: 1px solid var(--line);
}

.staff-form-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
}

.event-form.staff-settings-form {
    display: grid;
    width: 100%;
    max-width: 980px;
    gap: 22px;
}

.staff-settings-form .form-grid {
    gap: 18px;
}

/* A branding slot with nothing configured has no preview to show, so the panel
   states that in words instead of rendering an image. */

.staff-settings-form .branding-preview-empty {
    color: var(--muted);
    font-style: italic;
}

.staff-settings-form label:not(.terms-check) {
    display: grid;
    min-width: 0;
    gap: 8px;
    align-content: start;
}

.staff-settings-form label:not(.terms-check) > span:first-child {
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

.staff-settings-form input:not([type="checkbox"]):not([type="radio"]),
.staff-settings-form select,
.staff-settings-form textarea {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid #aaa69b;
    border-radius: 0;
    color: var(--ink);
    background: white;
    font: inherit;
    font-size: 14px;
}

.staff-settings-form textarea {
    min-height: 120px;
    resize: vertical;
}

.staff-settings-form input:focus-visible,
.staff-settings-form select:focus-visible,
.staff-settings-form textarea:focus-visible {
    border-color: var(--olive);
    outline: 3px solid rgb(85 102 58 / 18%);
    outline-offset: 1px;
}

.staff-settings-form .has-error input,
.staff-settings-form .has-error select,
.staff-settings-form .has-error textarea,
.staff-settings-form [aria-invalid="true"] {
    border-color: #a13a2b;
}

.staff-settings-form label > small,
.staff-settings-form .field-help,
.staff-settings-form .fieldset-note,
.staff-settings-form .conditional-reason {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

.staff-settings-form label.has-error > small:last-child,
.staff-settings-form .field-error {
    color: #8f2f22;
    font-size: 12px;
    font-weight: 800;
}

.staff-settings-form .terms-check {
    min-height: 50px;
    margin: 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: #f8f7f2;
    font-size: 13px;
    line-height: 1.5;
}

.staff-settings-form .terms-check input {
    accent-color: var(--olive);
}

.staff-settings-form .terms-check small {
    color: var(--muted);
    font-size: 12px;
}

.staff-settings-form .ticket-policy-notice {
    margin: 0;
}

.staff-settings-form fieldset {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 1rem;
    align-items: center;
}

.staff-settings-form fieldset legend {
    flex-basis: 100%;
}

.staff-settings-form fieldset label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    width: auto;
}

/* The design token editor.
   Every colour and typeface on this screen is one the public site is drawn in,
   so no rule here may read one. A control coloured by `var(--ink)` would change
   as the administrator edited ink, and would report the change as applied
   before it was saved; a legend set in `var(--display)` would put the public
   site's headline face on a staff screen. The staff application is
   product-owned and looks the same on every installation, so these rules carry
   literals. They are the values `site.css` declares for the core design, which
   is what an unconfigured installation renders in and what every staff page
   keeps once an installation configures something. */

.staff-settings-form .design-token {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 14px 16px;
    border: 1px solid rgb(8 11 8 / 20%);
    background: #f8f7f2;
}

.staff-settings-form .design-token.has-error {
    border-color: #a13a2b;
}

/* The public form's legend is a section rule — uppercase, underlined, set in
   the display face. A token here is a field label, and it names the custom
   property beside it, so it reads as one. `inherit` rather than a second font
   stack: the staff application's type is whatever the document is set in, which
   on a staff page is the core value and not the installation's. */

.staff-settings-form .design-token legend {
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    color: #080b08;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

.staff-settings-form .design-token legend code,
.staff-settings-form label.design-token-reset code {
    color: #5e6257;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

/* A colour picker is a swatch, not a text field, and the form's inputs are full
   width. One stretched to 980px reads as a banner rather than as the colour it
   is holding. The font select keeps a readable width for the same reason: the
   stacks it lists are long, and the choice is a short one. */

.staff-settings-form .design-token > label {
    max-width: 420px;
}

.staff-settings-form .design-token input[type="color"] {
    width: 96px;
    min-height: 44px;
    padding: 4px;
    cursor: pointer;
}

/* The reset box is a decision about the field above it, so it sits under that
   field as one line rather than as another stacked control. */

.staff-settings-form label.design-token-reset {
    display: flex;
    max-width: none;
    align-items: baseline;
    gap: 8px;
    color: #5e6257;
    font-size: 12px;
    line-height: 1.5;
}

.staff-settings-form label.design-token-reset input {
    flex: none;
    accent-color: #364a32;
}

.staff-settings-form .design-token > small {
    max-width: 640px;
    margin: 0;
    color: #5e6257;
    font-size: 12px;
    line-height: 1.55;
}

.branding-identity-toggle {
    display: grid !important;
    grid-template-columns: auto 1fr;
    align-items: center;
}

.branding-identity-toggle small {
    grid-column: 2;
}

.staff-settings-form > .event-form-actions {
    margin-top: 2px;
    padding-top: 22px;
}

.has-js .staff-settings-form [data-condition-target].is-condition-disabled {
    display: none;
}

.staff-settings-form .navigation-setting-card,
.staff-settings-form .payment-setting-card {
    border-color: var(--line);
    background: #f8f7f2;
}

.staff-settings-form .navigation-setting-card select {
    min-height: 48px;
    font-size: 14px;
}

.staff-settings-form .payment-setting-card label > small,
.staff-settings-form .navigation-setting-card > div small,
.staff-settings-form .payment-report-defaults small {
    font-size: 12px;
    line-height: 1.5;
}

.staff-settings-form .rule-section-editor {
    margin: 0 0 16px;
    background: white;
}

.staff-settings-form .rule-section-header {
    font-size: 20px;
}

.staff-settings-form .rule-section-header > span {
    font-size: 11px;
}

.staff-settings-related {
    margin-top: 64px;
    padding-top: 42px;
    border-top: 2px solid var(--line);
}

.settings-hub .staff-settings-nav {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.settings-hub .staff-settings-nav a {
    display: grid;
    min-height: 108px;
    gap: 6px;
    align-content: start;
    padding: 20px;
    border-color: var(--line);
    background: white;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.settings-hub .staff-settings-nav a:hover,
.settings-hub .staff-settings-nav a:focus-visible {
    border-color: var(--olive);
    box-shadow: 0 8px 20px rgb(22 29 20 / 8%);
    transform: translateY(-2px);
}

.settings-hub .staff-settings-nav strong {
    font-size: 14px;
}

.settings-hub .staff-settings-nav span {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
}

.agreement-active-card {
    display: grid;
    gap: 18px;
    padding: 24px;
    border: 1px solid var(--line);
    background: white;
}

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

.agreement-active-card dl div {
    min-width: 0;
}

.agreement-active-card dt {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.agreement-active-card dd {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
}

.agreement-active-card code,
.waiver-version-history code,
.waiver-hash {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.staff-table td > .waiver-hash {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    line-height: 1.45;
}

.staff-disclosure {
    border-top: 1px solid var(--line);
}

.staff-disclosure > summary {
    padding: 15px 0;
    color: var(--olive);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}

.agreement-version-editor > summary {
    width: fit-content;
    list-style: none;
    cursor: pointer;
}

.agreement-version-editor > summary::-webkit-details-marker {
    display: none;
}

.agreement-version-editor[open] > summary {
    display: none;
}

.waiver-agreement-form {
    min-width: 0;
    margin-top: 20px;
}

.waiver-agreement-form textarea {
    width: 100%;
    line-height: 1.55;
}

.legal-drafting-guidance {
    display: grid;
    gap: 8px;
    padding: 18px;
    border: 1px solid #a97831;
    background: #fff8e8;
    color: #56380f;
}

.legal-drafting-guidance > strong,
.legal-editor-heading span,
.legal-editor-preview > span {
    font-family: var(--display);
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.legal-drafting-guidance p {
    margin: 0;
    font-size: 12px;
    line-height: 1.65;
}

.legal-drafting-guidance > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
}

.legal-drafting-guidance a {
    color: inherit;
    font-size: 12px;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-document-editor {
    display: grid;
    gap: 0;
    min-width: 0;
    border: 1px solid var(--line);
    background: #f7f5ef;
}

.legal-document-editor.has-error {
    border-color: #a13a2b;
}

.legal-editor-heading {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    padding: 18px;
    border-bottom: 1px solid var(--line);
    background: white;
}

.legal-editor-heading div {
    display: grid;
    gap: 4px;
}

.legal-editor-heading small {
    max-width: 680px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.legal-editor-heading .button {
    flex: 0 0 auto;
}

.legal-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
    padding: 10px 18px;
    border-bottom: 1px solid var(--line);
    background: #e8e5dc;
}

.legal-editor-toolbar button {
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid #aaa69b;
    color: var(--ink);
    background: white;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 750;
}

.legal-editor-toolbar button:hover,
.legal-editor-toolbar button:focus-visible {
    border-color: var(--olive);
    background: #f7f8f1;
}

.legal-editor-toolbar > span {
    margin-left: auto;
    color: var(--muted);
    font-size: 11px;
}

.legal-editor-workspace {
    display: grid;
    gap: 18px;
    padding: 18px;
}

.legal-editor-workspace > label,
.legal-editor-preview {
    display: grid;
    min-width: 0;
    gap: 8px;
}

.legal-editor-workspace textarea {
    min-height: 560px;
    padding: 18px;
    resize: vertical;
    border-color: #aaa69b;
    background: white;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 13px;
    line-height: 1.7;
    tab-size: 4;
}

.legal-editor-preview {
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.legal-editor-preview .waiver-agreement {
    max-height: 640px;
    margin: 0;
    padding: clamp(20px, 4vw, 42px);
    background: white;
}

.legal-document-editor > .field-error {
    padding: 0 18px 18px;
}

.waiver-version-history {
    margin-top: 18px;
    border: 1px solid var(--line);
    background: white;
}

.waiver-version-history summary {
    padding: 16px 18px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.filter-bar--waivers {
    grid-template-columns: minmax(220px, 1.5fr) minmax(220px, 1fr) minmax(170px, 0.8fr) auto;
    margin-bottom: 24px;
}

.waiver-status-signed {
    color: #294322;
    background: #e4eee0;
}

.waiver-status-manual {
    color: #56380f;
    background: #fff4d8;
}

.waiver-status-outstanding {
    color: #782f25;
    background: #f0ddd8;
}

.waiver-no-document {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.waiver-event-use + .waiver-event-use {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.waiver-event-use > strong,
.waiver-event-use > small {
    display: block;
}

.waiver-event-use > small {
    margin-top: 3px;
    color: var(--muted);
}

.waiver-records-table {
    min-width: 1200px;
}

.waiver-record-actions {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
}

.attendance-actions button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.offline-settlement {
    display: grid;
    flex: 1 0 130px;
    gap: 4px;
}

.offline-settlement span {
    color: var(--muted);
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.offline-settlement select {
    min-height: 30px;
    padding: 5px 7px;
    border: 1px solid var(--line);
    background: white;
    font-size: 9px;
}

.attendance-actions .attendance-settle {
    border-color: #4d6540;
    color: white;
    background: var(--olive);
}

.attendance-actions button,
.table-danger-button {
    min-height: 30px;
    padding: 6px 8px;
    border: 1px solid var(--line);
    cursor: pointer;
    background: var(--paper-2);
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.attendance-actions button:first-of-type {
    color: white;
    background: var(--olive);
}

.attendance-actions button:nth-of-type(2),
.table-danger-button {
    color: #782f25;
    background: #f0ddd8;
}

.game-day-shell .game-day-register .waiver-email-action button,
.game-day-shell .game-day-records .waiver-email-action button,
.game-day-shell .game-day-register .attendance-actions button,
.game-day-shell .game-day-records .attendance-actions button,
.game-day-shell .game-day-register .offline-settlement select,
.game-day-shell .game-day-records .offline-settlement select {
    min-width: 44px;
    min-height: 44px;
}

.game-day-shell .game-day-fire-item button,
.game-day-shell .game-day-fire-item select {
    min-width: 44px;
    min-height: 44px;
}

.staff-toolbar .game-day-back-link,
.staff-toolbar .game-day-back-link:hover,
.staff-toolbar .game-day-back-link:focus-visible {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.game-day-shell .game-day-pagination .pagination span[aria-disabled="true"] {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    color: var(--ink);
    background: var(--paper);
    opacity: 1;
}

.attendance-status-attended {
    color: #244325;
    background: #d8e8d4;
}

.attendance-status-not_attended {
    color: #782f25;
    background: #f0ddd8;
}

.status-form select {
    min-width: 112px;
    min-height: 34px;
    padding: 5px 8px;
    font-size: 10px;
}

.status-form button {
    border: 0;
    color: white;
    cursor: pointer;
    background: var(--ink);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.team-table {
    display: inline-flex;
    gap: 7px;
    align-items: center;
}

.staff-empty {
    padding: 42px;
    border: 1px solid var(--line);
    color: var(--muted);
    background: white;
}

.staff-empty h3 {
    margin: 0 0 8px;
    font-family: var(--display);
    font-size: 26px;
    text-transform: uppercase;
}

.recovery-shell {
    max-width: 900px;
}

.recovery-code-panel {
    padding: 30px;
    border: 2px solid var(--olive);
    background: white;
}

.recovery-code-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.recovery-code-grid code {
    padding: 12px;
    color: white;
    background: var(--ink);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-align: center;
}

.recovery-code-panel > p {
    margin: 22px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.recovery-code-actions {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
}

.recovery-code-actions span {
    max-width: 410px;
    color: var(--muted);
    font-size: 10px;
}

.recovery-confirmation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 24px;
    padding: 24px;
    border: 1px solid var(--line);
    background: white;
}

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

.staff-action-card {
    display: flex;
    min-height: 300px;
    padding: 28px;
    border: 1px solid var(--line);
    flex-direction: column;
    justify-content: space-between;
    background: white;
}

.staff-action-card h3 {
    margin: 22px 0 10px;
    font-family: var(--display);
    font-size: 28px;
    text-transform: uppercase;
}

.staff-action-card p {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.staff-action-card small {
    color: var(--muted);
}

.staff-action-card-links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.empty-actions {
    display: flex;
    gap: 10px;
    margin-top: 22px;
}

.event-form {
    max-width: 980px;
}

.captured-mail-list {
    display: grid;
    gap: 18px;
}

.captured-mail-list article {
    padding: 24px;
    color: white;
    background: var(--ink);
}

.captured-mail-list pre {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.captured-mail-action {
    margin-bottom: 20px;
}

.fieldset-note {
    margin: -10px 0 22px;
    color: var(--muted);
    font-size: 12px;
}

.event-form fieldset {
    margin-bottom: 60px;
}

.file-field input {
    padding: 14px;
    border: 1px dashed #b6b3a9;
    background: var(--paper-2);
}

.team-builder {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.team-builder-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.event-form fieldset.team-builder-card {
    margin: 0;
    padding: 24px;
    border: 1px solid var(--line);
}

/* The two branches of the capacity step. Both are a <fieldset> rather than a
   <div> so that `disabled` cascades natively to every control inside: the generic
   data-condition machinery disables a target's controls one at a time, and the
   nested targets these two contain -- a team's dress-code replacement, the
   capacity number beside its mode -- would otherwise re-enable their own contents
   inside a branch the club has switched off, and submit them. The margin is
   removed because `.event-form fieldset` carries the 60px gap that separates the
   numbered steps, and these are inside a step rather than one of them. */

/* `.event-capacity-field` joined these when it stopped being a div. `disabled`
   on a div is inert, so that wrapper hid the capacity number without barring
   it and a hidden-but-enabled input still submits -- but a fieldset inherits
   `.event-form fieldset`'s 60px bottom margin, which a div never had. Resetting
   it here keeps the conversion invisible, which is the point: the element
   changed to make the attribute work, not to move anything. */

.event-form fieldset.event-capacity-settings,
.event-form fieldset.event-team-settings,
.event-form fieldset.event-capacity-field {
    margin: 0;
    padding: 0;
    border: 0;
}

.team-builder-card > legend {
    grid-column: 1 / -1;
    font-family: var(--display);
    font-size: 16px;
    text-transform: uppercase;
}

.team-builder-card label:first-of-type {
    grid-column: 1 / -1;
}

.team-builder-card .team-camo-field {
    grid-column: 1 / -1;
}

.team-capacity-note {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.team-builder-card textarea {
    min-height: 100px;
    padding: 11px 13px;
    border: 1px solid #cbc8bf;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
    resize: vertical;
}

.commander-editor-list {
    display: grid;
    gap: 18px;
    margin-bottom: 18px;
}

.commander-editor-card {
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.commander-editor-card > header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.commander-editor-card > header > strong {
    font-family: var(--display);
    font-size: 17px;
    text-transform: uppercase;
}

.commander-editor-card > header > div {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.commander-current-image {
    display: flex;
    gap: 18px;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--line);
    background: white;
}

.commander-current-image img {
    width: 88px;
    height: 88px;
    object-fit: cover;
}

.commander-current-image > div > strong {
    display: block;
    margin-bottom: 9px;
    font-size: 11px;
    text-transform: uppercase;
}

.commander-remove {
    margin-top: 4px;
    color: #721a12;
}

.event-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 26px;
    border-top: 1px solid var(--line);
}

.api-token-reveal {
    margin-bottom: 40px;
    padding: 22px;
    border: 2px solid var(--signal-dark);
    background: #eee9d1;
}

.api-token-reveal code {
    display: block;
    margin: 12px 0;
    padding: 13px;
    overflow-wrap: anywhere;
    color: white;
    background: var(--ink);
}

.staff-user-form,
.bulk-email-form {
    padding: 28px;
    border: 1px solid var(--line);
    background: white;
}

.ban-review-list {
    display: grid;
    gap: 14px;
    margin-top: 24px;
}

.ban-review-card {
    border: 1px solid var(--line);
    background: white;
}

.ban-review-card > summary {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) minmax(180px, 1fr) auto auto;
    gap: 18px;
    align-items: center;
    padding: 20px 22px;
    cursor: pointer;
    list-style: none;
}

.ban-review-card > summary::-webkit-details-marker {
    display: none;
}

.ban-review-card > summary:hover {
    background: var(--paper-2);
}

.ban-review-card > summary:focus-visible {
    outline: 3px solid var(--signal-dark);
    outline-offset: 2px;
}

.ban-review-summary-event,
.ban-review-summary-link,
.ban-review-summary-score {
    display: grid;
    gap: 4px;
}

.ban-review-summary-event strong,
.ban-review-summary-link strong {
    font-size: 13px;
}

.ban-review-summary-event small,
.ban-review-summary-link span,
.ban-review-summary-score span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ban-review-summary-score strong {
    font-size: 16px;
}

.ban-review-expand {
    color: var(--olive);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ban-review-expand::after {
    content: " +";
}

.ban-review-card[open] .ban-review-expand::after {
    content: " −";
}

.ban-review-body {
    padding: 24px;
    border-top: 1px solid var(--line);
    background: var(--paper-2);
}

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

.ban-review-context-grid article {
    padding: 20px;
    border: 1px solid var(--line);
    background: white;
}

.ban-review-context-grid h3,
.ban-review-form-heading h3 {
    margin: 5px 0 16px;
    font-family: var(--display);
    font-size: 22px;
    text-transform: uppercase;
}

.ban-review-context-grid dl {
    margin: 0 0 14px;
}

.ban-review-context-grid dl > div {
    padding: 9px 0;
    border-top: 1px solid var(--line);
}

.ban-review-context-grid dt,
.ban-review-context-grid dd {
    margin: 0;
}

.ban-review-context-grid dt {
    color: var(--muted);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ban-review-context-grid dd {
    margin-top: 3px;
    overflow-wrap: anywhere;
    font-size: 11px;
    font-weight: 750;
}

.ban-review-context-grid article > p {
    font-size: 11px;
    line-height: 1.55;
}

.ban-review-provenance {
    color: var(--muted);
}

.ban-review-form {
    display: grid;
    grid-template-columns: minmax(190px, 0.7fr) minmax(280px, 1.3fr) auto;
    gap: 16px;
    align-items: end;
    margin-top: 18px;
    padding: 20px;
    border: 1px solid var(--line);
    background: white;
}

.ban-review-form-heading {
    grid-column: 1 / -1;
}

.ban-review-form-heading h3 {
    margin-bottom: 0;
}

.ban-review-form label {
    display: grid;
    gap: 7px;
}

.ban-review-form label > span {
    color: var(--ink-soft);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.ban-review-form label > small {
    color: var(--muted);
    font-size: 9px;
    line-height: 1.4;
}

.ban-review-form .button {
    min-height: 44px;
}

@media (max-width: 900px) {
    .event-form.staff-settings-form > .staff-form-section {
        padding: 24px;
    }

    .staff-settings-form .form-grid.three-column {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ban-review-card > summary {
        grid-template-columns: 1fr 1fr;
    }

    .ban-review-expand {
        justify-self: end;
    }

    .ban-review-context-grid,
    .ban-review-form {
        grid-template-columns: 1fr;
    }

    .ban-review-form-heading {
        grid-column: 1;
    }
}

@media (max-width: 620px) {
    .staff-input-action {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .event-form.staff-settings-form > .staff-form-section {
        padding: 20px;
    }

    .staff-settings-form .form-grid,
    .staff-settings-form .form-grid.three-column {
        grid-template-columns: 1fr;
    }

    .staff-settings-form .span-full {
        grid-column: auto;
    }

    .staff-settings-form > .event-form-actions {
        flex-direction: column;
    }

    .staff-settings-form > .event-form-actions .button {
        width: 100%;
    }

    .filter-date-range {
        grid-template-rows: var(--filter-label-height) auto;
    }

    .filter-date-controls {
        grid-template-columns: 1fr;
        height: auto;
    }

    .ban-review-card > summary {
        grid-template-columns: 1fr;
    }

    .ban-review-expand {
        justify-self: start;
    }

    .ban-review-body {
        padding: 16px;
    }
}

.conduct-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.conduct-ban-panel {
    grid-column: 1 / -1;
}

.player-booking-workspace-layout {
    display: grid;
    grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1.45fr);
    gap: 18px;
}

.player-booking-workspace-layout--single {
    grid-template-columns: minmax(0, 1fr);
}

.player-booking-rail {
    display: grid;
    align-content: start;
    border-right: 1px solid var(--line);
}

.player-booking-rail-link {
    display: grid;
    gap: 4px;
    padding: 14px;
    border-bottom: 1px solid var(--line);
}

.player-booking-rail-link.is-selected {
    border-left: 4px solid var(--signal);
    background: var(--paper);
}

.player-booking-compact-selector {
    display: none;
}

.player-booking-detail {
    display: grid;
    gap: 18px;
}

.player-booking-detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.booking-history-current {
    box-shadow: inset 4px 0 0 var(--signal);
    background: var(--paper);
}

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

.player-information-grid article,
.player-booking-detail-grid article {
    padding: 24px;
    border: 1px solid var(--line);
    background: white;
}

.player-information-grid h3,
.player-booking-detail-grid h3 {
    margin: 5px 0 18px;
    font-family: var(--display);
    font-size: 24px;
    text-transform: uppercase;
}

.player-information-grid dl,
.player-booking-detail-grid dl {
    margin: 0;
}

.player-information-grid dl > div,
.player-booking-detail-grid dl > div {
    padding: 10px 0;
    border-top: 1px solid var(--line);
}

.player-information-grid dt,
.player-information-grid dd,
.player-booking-detail-grid dt,
.player-booking-detail-grid dd {
    margin: 0;
}

.player-information-grid dt,
.player-booking-detail-grid dt {
    color: var(--muted);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.player-information-grid dd,
.player-booking-detail-grid dd {
    margin-top: 3px;
    overflow-wrap: anywhere;
    font-size: 12px;
    font-weight: 750;
}

.player-information-empty {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

.player-loyalty-card progress {
    width: 100%;
    height: 12px;
    margin-bottom: 10px;
    accent-color: var(--olive);
}

.loyalty-adjustment-history {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    font-size: 11px;
}

.loyalty-adjustment-history summary {
    cursor: pointer;
    font-weight: 800;
}

.loyalty-adjustment-history ul {
    display: grid;
    gap: 10px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.loyalty-adjustment-history li span,
.loyalty-adjustment-history li p {
    display: block;
    margin: 2px 0 0;
    color: var(--muted);
}

.loyalty-point-form {
    display: grid;
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.loyalty-point-form label {
    display: grid;
    gap: 6px;
}

.loyalty-point-form label > span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.loyalty-point-form select,
.loyalty-point-form textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: var(--paper);
}

.player-balance-adjustment {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.player-balance-adjustment summary {
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
}

.player-balance-adjustment > p {
    margin: 14px 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.player-balance-adjustment > p strong {
    color: var(--ink);
}

.player-balance-adjustment form,
.player-balance-adjustment label:not(.terms-check) {
    display: grid;
    gap: 8px;
}

.player-balance-adjustment form {
    gap: 14px;
}

.player-balance-adjustment label:not(.terms-check) > span:first-child {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.player-balance-adjustment textarea,
.player-balance-adjustment .currency-input {
    width: 100%;
}

.player-balance-adjustment textarea {
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: var(--paper);
}

.player-balance-adjustment label > small {
    color: var(--muted);
    font-size: 9px;
    line-height: 1.45;
}

.player-balance-adjustment .button {
    justify-self: start;
}

.conduct-panel {
    padding: 26px;
    border: 1px solid var(--line);
    background: white;
}

.conduct-panel h2 {
    margin: 5px 0 22px;
    font-family: var(--display);
    font-size: 30px;
    text-transform: uppercase;
}

.conduct-retention-help {
    margin: -10px 0 20px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.65;
}

.conduct-panel form {
    display: grid;
    gap: 16px;
}

.conduct-panel .conduct-retention-option,
.conduct-note-editor .conduct-retention-option {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
}

.conduct-panel .conduct-retention-option input,
.conduct-note-editor .conduct-retention-option input {
    margin-top: 2px;
    accent-color: var(--olive);
}

.conduct-panel .conduct-retention-option > span,
.conduct-note-editor .conduct-retention-option > span {
    color: var(--ink-soft);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.45;
    text-transform: none;
}

.conduct-ban-panel {
    color: white;
    background: var(--ink);
}

.conduct-ban-panel .eyebrow,
.conduct-ban-panel label > span {
    color: var(--signal);
}

.conduct-ban-panel textarea {
    color: var(--ink);
}

.conduct-ban-panel .button-outline {
    color: white;
    border-color: rgb(255 255 255 / 48%);
    background: rgb(255 255 255 / 8%);
}

.conduct-ban-panel .button-outline:hover {
    color: var(--ink);
    border-color: var(--signal);
    background: var(--signal);
}

.conduct-lift-ban-form {
    margin-top: 18px;
}

.conduct-admin-override-notice {
    padding: 14px 16px;
    border-left: 4px solid var(--signal-dark);
    background: var(--sand);
}

.conduct-admin-override-notice p {
    margin: 4px 0 0;
}

.conduct-notes {
    display: grid;
    gap: 12px;
}

.conduct-note {
    padding: 22px;
    border-left: 4px solid var(--olive);
    background: white;
}

.conduct-note-warning {
    border-left-color: var(--signal-dark);
}

.conduct-note-infraction {
    border-left-color: #782f25;
}

.conduct-note > div {
    display: flex;
    justify-content: space-between;
}

.conduct-note time,
.conduct-note small {
    color: var(--muted);
    font-size: 9px;
}

.conduct-note > small {
    display: block;
    margin-top: 5px;
}

.conduct-note-editor {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid var(--line);
}

.conduct-note-editor summary {
    cursor: pointer;
    color: var(--olive);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.conduct-note-editor form {
    display: grid;
    gap: 12px;
    margin-top: 16px;
}

.conduct-note-editor label {
    display: grid;
    gap: 7px;
}

.conduct-note-editor label > span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.conduct-note-editor select,
.conduct-note-editor textarea {
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 0;
    background: var(--paper-2);
}

.conduct-note-editor .table-danger-button {
    justify-self: start;
}

.has-js .staff-toolbar,
.has-js .message-section > .shell > * {
    animation: interface-enter 420ms cubic-bezier(.2, .7, .2, 1) both;
}

.has-js .staff-shell > .shell > .staff-section,
.has-js .staff-shell > .shell > .dashboard-revenue,
.has-js .staff-shell > .shell > .filter-bar {
    animation: interface-enter 420ms cubic-bezier(.2, .7, .2, 1) both;
}

.has-js .staff-shell > .shell > :nth-child(2) {
    animation-delay: 45ms;
}

.has-js .staff-shell > .shell > :nth-child(3) {
    animation-delay: 90ms;
}

.waiver-agreement {
    max-height: 320px;
    margin: 18px 0;
    padding: 18px;
    overflow: auto;
    border: 1px solid var(--line);
    background: #f4f1e8;
    color: var(--ink);
    font-size: 13px;
    line-height: 1.65;
}

.legal-document {
    display: grid;
    gap: 12px;
}

.legal-document h3,
.legal-document h4,
.legal-document h5,
.legal-document p,
.legal-document ul,
.legal-document ol {
    margin: 0;
}

.legal-document h3,
.legal-document h4,
.legal-document h5 {
    color: var(--ink);
    font-family: var(--display);
    line-height: 1.18;
}

.legal-document h3 {
    margin-top: 8px;
    font-size: clamp(22px, 3vw, 34px);
    letter-spacing: -0.02em;
    text-transform: uppercase;
}

.legal-document h4 {
    margin-top: 12px;
    font-size: 18px;
}

.legal-document h5 {
    font-size: 14px;
}

.legal-document p,
.legal-document li {
    font-size: 13px;
    line-height: 1.72;
}

.legal-document ul,
.legal-document ol {
    display: grid;
    gap: 7px;
    padding-left: 24px;
}

.legal-document hr {
    width: 100%;
    margin: 10px 0;
    border: 0;
    border-top: 1px solid var(--line);
}

@media (max-width: 760px) {
    .game-day-mode-switch {
        grid-template-columns: 1fr;
    }

    .legal-editor-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .legal-editor-heading .button {
        width: 100%;
    }

    .legal-editor-toolbar > span {
        width: 100%;
        margin: 4px 0 0;
    }

    .legal-editor-workspace {
        padding: 12px;
    }

    .legal-editor-workspace textarea {
        min-height: 440px;
        padding: 13px;
    }
}

.terms-check a {
    color: var(--olive);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ticket-policy-notice {
    margin-bottom: 22px;
    padding: 18px;
    border-left: 3px solid var(--signal);
    background: #eee9d1;
}

.template-notice {
    margin-bottom: 22px;
    padding: 18px;
    border-left: 3px solid var(--signal);
    background: #eee9d1;
}

.ticket-policy-notice strong {
    display: block;
    color: var(--ink);
    font-family: var(--display);
    font-size: 17px;
    text-transform: uppercase;
}

.template-notice strong {
    display: block;
    color: var(--ink);
    font-family: var(--display);
    font-size: 17px;
    text-transform: uppercase;
}

.ticket-policy-notice p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.template-notice p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.ticket-builder {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.ticket-builder-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--paper-2);
    transition: opacity 160ms ease;
}

.ticket-builder-card.is-disabled {
    opacity: 0.55;
}

.ticket-builder-card > strong,
.ticket-builder-card .ticket-enable,
.ticket-builder-card .span-full {
    grid-column: 1 / -1;
}

.ticket-builder-card > label:not(.terms-check) {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.ticket-builder-card label > span {
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ticket-builder-card input,
.ticket-builder-card select {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #cbc8bf;
    border-radius: 0;
    background: #f9f7f1;
}

.ticket-builder-card label small {
    color: var(--muted);
    font-size: 10px;
}

.ticket-builder-card label.has-error small:last-child {
    color: #9b3424;
}

.promotion-form {
    max-width: none;
    padding: 28px;
    border: 1px solid var(--line);
    background: white;
}

.promotion-scope {
    margin-top: 28px !important;
}

.promotion-event-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px 20px;
    margin-top: 16px;
}

[data-condition-target].is-condition-disabled {
    opacity: 0.58;
}

[data-condition-target].is-condition-disabled input,
[data-condition-target].is-condition-disabled select,
[data-condition-target].is-condition-disabled textarea {
    cursor: not-allowed;
}

.conditional-reason {
    color: var(--muted) !important;
    font-size: 10px !important;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.45;
    text-transform: none;
}

.promotion-event-grid > .conditional-reason {
    grid-column: 1 / -1;
}

.promotion-list {
    display: grid;
    gap: 16px;
}

.promotion-list article {
    padding: 24px;
    border: 1px solid var(--line);
    background: white;
}

.promotion-list article > header {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.promotion-list code,
.promotion-list header strong,
.promotion-list header small {
    display: block;
}

.promotion-list code {
    color: var(--signal-dark);
    font-size: 19px;
    font-weight: 900;
}

.promotion-list header small,
.promotion-list article > p {
    color: var(--muted);
    font-size: 10px;
}

.promotion-list dl {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 12px;
    margin: 22px 0;
}

.promotion-list dl div {
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.promotion-list dt,
.promotion-list dd {
    margin: 0;
}

.promotion-list dt {
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
}

.promotion-list dd {
    margin-top: 4px;
    font-weight: 800;
}

.promotion-management-details {
    margin-top: 18px;
    border-top: 1px solid var(--line);
}

.promotion-management-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0 0;
    color: var(--signal-dark);
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.08em;
    list-style: none;
    text-transform: uppercase;
}

.promotion-management-details > summary::-webkit-details-marker {
    display: none;
}

.promotion-management-details > summary::after {
    content: "+";
    font-size: 18px;
    line-height: 1;
}

.promotion-management-details[open] > summary::after {
    content: "−";
}

.promotion-management-body {
    display: grid;
    gap: 16px;
    padding-top: 18px;
}

.promotion-usage {
    display: grid;
    gap: 5px;
    margin: 12px 0 18px;
    color: var(--muted);
    font-size: 10px;
}

.player-search-field {
    position: relative;
}

.filter-bar--player-search {
    position: relative;
    z-index: 30;
}

.player-suggestions {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    left: 0;
    z-index: 20;
    box-shadow: 0 16px 34px rgb(8 11 8 / 18%);
}

.player-suggestion-list {
    margin: 0;
    padding: 0;
    border: 1px solid var(--line);
    list-style: none;
    background: white;
}

.player-suggestion-list button {
    display: block;
    width: 100%;
    padding: 11px 13px;
    border: 0;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
    text-align: left;
    background: white;
}

.player-suggestion-list button:hover,
.player-suggestion-list button:focus-visible {
    background: var(--paper-2);
}

.player-suggestion-list strong,
.player-suggestion-list span {
    display: block;
}

.player-suggestion-list span {
    margin-top: 2px;
    color: var(--muted);
    font-size: 9px;
}

.pagination {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 22px;
    font-size: 10px;
    text-transform: uppercase;
}

.pagination a,
.pagination span {
    padding: 9px 11px;
    border: 1px solid currentColor;
}

.pagination span {
    opacity: 0.35;
}

@media (max-width: 1000px) {
    .filter-bar--tokens {
        grid-template-columns: 1fr 1fr;
    }

    .filter-bar--transactions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-bar--transactions .filter-date-range {
        grid-column: 1 / -1;
    }

    .filter-bar--transactions .filter-actions {
        grid-column: 1 / -1;
        padding-top: 0;
    }

    .player-information-grid {
        grid-template-columns: 1fr 1fr;
    }

    .player-information-grid article:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .staff-login-security-warning .shell {
        align-items: flex-start;
        flex-direction: column;
    }

    .staff-login {
        background: var(--ink);
    }

    .staff-login-grid {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .staff-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .staff-nav-session > span {
        display: none;
    }

    .conduct-grid,
    .player-information-grid,
    .staff-card-grid {
        grid-template-columns: 1fr;
    }

    .player-booking-workspace-layout,
    .player-booking-detail-grid {
        grid-template-columns: 1fr;
    }

    .player-booking-rail {
        display: none;
    }

    .player-booking-compact-selector {
        display: grid;
        gap: 12px;
    }

    .player-booking-compact-selector select,
    .player-booking-compact-selector .button {
        width: 100%;
    }

    .recovery-code-grid {
        grid-template-columns: 1fr;
    }

    .player-information-grid article:last-child {
        grid-column: auto;
    }

    .filter-bar--game-day {
        grid-template-columns: 1fr;
    }

    .filter-bar--game-day .filter-actions {
        width: 44px;
        justify-self: end;
    }

    .filter-bar--game-day .game-day-search-submit {
        flex: 0 0 44px;
        width: 44px;
    }
}

@media (max-width: 600px) {
    .section {
        padding-block: 78px;
    }

    .brand-logo {
        width: 170px;
    }

    /* The header gives the brand around 210px here once the navigation has
       taken its share, and a wordmark cannot be scaled down the way an image
       is. Set it in type instead, so a normal public name fits rather than
       arriving ellipsised on every phone. */

    .brand-logo-wordmark {
        font-size: 16px;
        letter-spacing: 0.04em;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .team-builder,
    .ticket-builder {
        grid-template-columns: 1fr;
    }

    .ticket-scan-notice,
    .staff-toolbar-actions,
    .recovery-code-actions,
    .recovery-confirmation {
        align-items: stretch;
        flex-direction: column;
    }

    .login-panel {
        padding: 28px 22px;
    }

    .team-builder-card {
        grid-template-columns: 1fr;
    }

    .ticket-builder-card,
    .promotion-event-grid,
    .promotion-list dl {
        grid-template-columns: 1fr;
    }

    .team-builder-card > legend,
    .team-builder-card label:first-of-type {
        grid-column: auto;
    }

    .balance-grid,
    .filter-bar--tokens,
    .filter-bar--search {
        grid-template-columns: 1fr;
    }

    .balance-grid dl {
        grid-template-columns: repeat(3, 1fr);
    }

    .pagination {
        justify-content: space-between;
    }
}

.field-requirements {
    display: block;
    margin-top: 7px;
    color: var(--muted);
    font-size: 0.75rem;
}

.staff-settings-nav {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin: 0 0 28px;
}

.rule-section-editor {
    position: relative;
    padding: 24px !important;
    border: 1px solid var(--line) !important;
    background: var(--paper-2);
}

.rule-section-editor > .rule-section-accessible-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    border: 0;
    white-space: nowrap;
}

.rule-section-header {
    display: flex;
    gap: 14px;
    align-items: baseline;
    width: 100%;
    margin-bottom: 22px;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--line);
    font-family: var(--display);
    font-size: 18px;
    font-weight: 850;
    text-transform: uppercase;
}

.rule-section-header > span {
    color: var(--signal);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
}

.rule-section-controls {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin: -10px 0 20px;
}

.rule-section-controls button,
.two-factor-skip button {
    border: 0;
    cursor: pointer;
    color: var(--olive);
    background: transparent;
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: underline;
}

.rule-section-controls button:disabled {
    cursor: not-allowed;
    opacity: 0.35;
}

.rule-section-controls [data-remove-rule-section] {
    color: #782f25;
}

.rule-section-add {
    margin-bottom: 24px;
}

.two-factor-skip {
    margin-top: 14px;
    text-align: center;
}

.staff-alert-stack {
    position: relative;
    z-index: 45;
    margin-top: 0;
}

@media (max-width: 1280px) {
    .staff-alert-stack {
        margin-top: 0;
    }

    .staff-shell,
    .has-staff-alerts .staff-shell {
        padding-top: 40px;
    }
}

.two-factor-grace-warning {
    border-bottom: 1px solid #9a7041;
    color: #2f281e;
    background: #ead9b9;
}

.two-factor-grace-warning .shell {
    display: flex;
    gap: 12px;
    align-items: center;
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 0.82rem;
}

.two-factor-grace-warning a {
    margin-left: auto;
    color: inherit;
    font-weight: 850;
}

.staff-login-security-warning {
    border-bottom: 1px solid #8f382e;
    color: #fff5ed;
    background: #742f29;
}

.staff-login-security-warning .shell {
    display: flex;
    gap: 12px 24px;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 0.82rem;
}

.staff-login-security-warning strong,
.staff-login-security-warning span {
    display: block;
}

.staff-login-security-warning span {
    margin-top: 3px;
    color: #f0cfc8;
}

.staff-login-security-warning a {
    color: inherit;
    font-weight: 850;
    white-space: nowrap;
}

.staff-settings-nav a,
.payment-setting-card {
    border: 1px solid rgba(64, 79, 55, 0.18);
    background: var(--paper);
    color: var(--ink);
    padding: 18px;
}

.staff-settings-nav a {
    text-decoration: none;
}

.staff-settings-nav span,
.payment-setting-card small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 0.78rem;
}

.settings-group + .settings-group {
    margin-top: 54px;
}

.settings-group .staff-settings-nav {
    margin-bottom: 0;
}

.documentation-library {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.documentation-library a {
    min-height: 150px;
    padding: 28px;
}

.documentation-library strong {
    font-family: var(--display);
    font-size: 25px;
    text-transform: uppercase;
}

.staff-documentation {
    max-width: 980px;
}

.documentation-section {
    padding: clamp(24px, 4vw, 38px);
    border: 1px solid var(--line);
    background: white;
}

.documentation-section h2 {
    margin: 6px 0 20px;
    font-family: var(--display);
    font-size: clamp(29px, 4vw, 42px);
    text-transform: uppercase;
}

.documentation-section li {
    margin: 9px 0;
    color: var(--ink-soft);
    line-height: 1.65;
}

.technical-document-index {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-bottom: 24px;
    border: 1px solid var(--line);
    background: var(--line);
}

.technical-document-index a {
    padding: 13px 15px;
    color: var(--muted);
    background: var(--paper-2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.technical-document-index a:hover {
    color: var(--ink);
    background: white;
}

.documentation-section h3 {
    margin: 24px 0 8px;
    font-family: var(--display);
    font-size: 21px;
    text-transform: uppercase;
}

.documentation-section code {
    padding: 2px 5px;
    color: #eceddc;
    background: var(--ink-2);
    font-size: 0.88em;
    overflow-wrap: anywhere;
}

.technical-flow {
    counter-reset: technical-step;
    padding-left: 0;
    list-style: none;
}

.technical-flow li {
    position: relative;
    min-height: 44px;
    padding-left: 52px;
}

.technical-flow li::before {
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    color: white;
    background: var(--olive);
    content: counter(technical-step, decimal-leading-zero);
    counter-increment: technical-step;
    font-size: 9px;
    font-weight: 850;
}

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

.technical-reference-grid article {
    padding: 18px;
    border-left: 3px solid var(--olive);
    background: var(--paper);
}

.technical-reference-grid h3 {
    margin-top: 0;
}

.technical-reference-grid p {
    margin-bottom: 0;
}

.technical-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
}

.technical-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    font-size: 11px;
}

.technical-table th,
.technical-table td {
    padding: 13px 15px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.technical-table th {
    color: var(--muted);
    background: var(--paper-2);
    font-size: 8px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.technical-table tr:last-child td {
    border-bottom: 0;
}

@media (max-width: 760px) {
    .technical-document-index,
    .technical-reference-grid {
        grid-template-columns: 1fr;
    }
}

.military-term {
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-color: rgba(184, 169, 126, 0.72);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
    text-transform: inherit;
    cursor: help;
}

.military-term:focus-visible {
    border-radius: 2px;
    outline: 2px solid var(--khaki);
    outline-offset: 3px;
}

.military-term-tooltip {
    position: fixed;
    z-index: 120;
    width: max-content;
    max-width: min(320px, calc(100vw - 24px));
    padding: 10px 12px;
    border: 1px solid rgba(184, 169, 126, 0.5);
    background: #0d120e;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.38);
    color: #eef0e8;
    font-family: var(--font-body);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.45;
    opacity: 0;
    pointer-events: none;
    transform: translateY(3px);
    transition: opacity 140ms ease, transform 140ms ease;
}

.military-term-tooltip.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.seo-page-editor {
    padding: 20px 0;
    border-top: 1px solid rgba(15, 20, 16, 0.14);
}

.seo-page-editor:first-of-type {
    margin-top: 20px;
}

.seo-page-editor h3 {
    margin: 0 0 14px;
    font-size: 1rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.payment-settings-list {
    display: grid;
    gap: 14px;
}

.payment-report-defaults {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.payment-report-defaults > label {
    padding: 16px;
    border: 1px solid var(--line);
    background: white;
}

.payment-report-defaults small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
}

.refund-operations {
    margin-top: 56px;
}

.gateway-refund-capability {
    display: grid;
    gap: 5px;
    padding: 12px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.gateway-refund-capability strong,
.gateway-refund-capability small {
    display: block;
}

.gateway-refund-manual {
    border-color: #b98579;
    background: #fff8f5;
}

.refund-manual-flag {
    display: block;
    width: fit-content;
    margin-top: 7px;
    padding: 5px 7px;
    border: 1px solid #9a3d31;
    background: #fff0ed;
    color: #6e241b;
    font-size: 9px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.refund-resolution {
    min-width: 250px;
}

.refund-resolution summary {
    color: var(--signal);
    font-weight: 850;
    cursor: pointer;
}

.refund-resolution form {
    display: grid;
    gap: 10px;
    margin-top: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    background: white;
}

.refund-resolution form > label:not(.terms-check) {
    display: grid;
    gap: 5px;
}

.refund-resolution input,
.refund-resolution select,
.refund-resolution textarea {
    width: 100%;
    padding: 9px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.navigation-settings-list {
    display: grid;
    gap: 12px;
    margin-top: 22px;
}

.navigation-setting-card {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 110px;
    gap: 18px;
    align-items: center;
    padding: 18px;
    border: 1px solid rgba(64, 79, 55, 0.18);
    background: var(--paper);
}

.navigation-setting-card > div small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
}

.navigation-setting-card > label:not(.terms-check) {
    display: flex;
    flex-direction: column;
    gap: 7px;
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.navigation-setting-card select {
    min-height: 42px;
    padding: 8px 11px;
    border: 1px solid #cbc8bf;
    background: #f9f7f1;
}

.payment-setting-card {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, 2fr) auto auto;
    gap: 18px;
    align-items: center;
}

.payment-setting-card label > small {
    display: block;
    max-width: 180px;
    margin-top: 5px;
    color: var(--muted);
    font-size: 9px;
    line-height: 1.4;
}

.test-booking-flag {
    display: block;
    width: fit-content;
    margin-top: 8px;
    padding: 5px 8px;
    border: 2px solid #b42d20;
    background: #ffe3de;
    color: #721a12;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
}

.game-day-table tr.has-player-alert td:first-child {
    border-left: 5px solid #a5231a;
    background: #fff2ef;
}

.player-conduct-alert {
    display: flex;
    width: fit-content;
    max-width: 280px;
    margin-top: 8px;
    padding: 7px 9px;
    align-items: center;
    gap: 7px;
    border: 2px solid #a5231a;
    background: #ffe0da;
    color: #68150f;
    font-size: 0.72rem;
    line-height: 1.25;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.player-conduct-alert > span {
    display: grid;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    place-items: center;
    border-radius: 50%;
    background: #a5231a;
    color: white;
    font-size: 12px;
}

.player-conduct-alert-serious,
.player-conduct-alert-ban {
    background: #a5231a;
    color: white;
}

.player-conduct-alert-serious > span,
.player-conduct-alert-ban > span {
    background: #28100e;
}

.player-conduct-alert-ban {
    border-color: #28100e;
    box-shadow: 0 0 0 2px #a5231a;
}

.game-day-player-actions {
    display: flex;
    margin-top: 12px;
    align-items: center;
    gap: 8px;
}

.game-day-player-actions .table-action-link {
    margin-bottom: 0;
}

.payment-methods {
    display: grid;
    gap: 16px;
    margin: 22px 0;
}

.event-form .payment-methods-label {
    margin: 0;
}

.payment-standalone-section {
    margin-bottom: 64px;
}

.payment-balance-section {
    margin-top: 0;
    padding-top: 34px;
    border-top: 3px solid rgba(64, 79, 55, 0.2);
}

.payment-customer-lookup {
    margin-bottom: 26px;
    padding-bottom: 26px;
    border-bottom: 1px solid var(--line);
}

.standalone-customer-results {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.standalone-customer-results > a {
    display: grid;
    gap: 4px;
    padding: 13px;
    border: 1px solid var(--line);
    background: white;
    color: var(--ink);
    text-decoration: none;
}

.standalone-customer-results > a:hover,
.standalone-customer-results > a:focus-visible {
    border-color: var(--signal);
}

.standalone-customer-results span,
.standalone-customer-results small,
.standalone-customer-results > p {
    color: var(--muted);
    font-size: 11px;
}

.payment-customer-selected {
    display: grid;
    gap: 4px;
    margin-top: 14px;
    padding: 14px;
    border-left: 4px solid var(--signal);
    background: #eef3ea;
}

.payment-customer-selected span,
[data-payment-send-reason],
.payment-request-email-unavailable {
    color: var(--muted);
    font-size: 11px;
}

.payment-standalone-form .event-form-actions {
    margin-bottom: 0;
    padding-bottom: 6px;
}

.gift-card-action-form {
    margin-bottom: 30px;
    padding: 22px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.gift-card-action-form fieldset {
    margin-bottom: 0;
}

.gift-card-action-form > label,
.gift-card-action-form fieldset > label:not(.terms-check) {
    display: grid;
    gap: 7px;
    margin-bottom: 18px;
}

.gift-card-action-form > label > span,
.gift-card-action-form fieldset > label > span:first-child {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.gift-card-action-form textarea,
.gift-card-action-form input,
.gift-card-action-form select {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: white;
}

.gift-card-action-form small {
    color: var(--muted);
    font-size: 10px;
}

.gift-card-admin-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.gift-card-admin-actions form {
    padding: 20px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.gift-card-secret-panel {
    margin-top: 18px;
    padding: clamp(24px, 4vw, 38px);
    border: 2px solid var(--signal);
    background: #eef0e5;
}

.gift-card-secret-panel h3 {
    margin: 8px 0 22px;
    font-family: var(--display);
    font-size: 32px;
    text-transform: uppercase;
}

.gift-card-secret-panel dl {
    display: grid;
    gap: 1px;
    margin: 0 0 22px;
    background: var(--line);
}

.gift-card-secret-panel dl div {
    display: grid;
    grid-template-columns: minmax(150px, 0.35fr) 1fr;
    gap: 16px;
    padding: 14px;
    background: white;
}

.gift-card-secret-panel dt {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.gift-card-secret-panel dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.gift-card-secret-panel code {
    font-size: 15px;
    font-weight: 800;
}

.danger-panel {
    padding-left: clamp(18px, 2vw, 28px);
    border-left: 4px solid #7b281b;
}

.payment-customer-results label {
    display: grid;
    gap: 7px;
}

.payment-customer-results label > span:first-child {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.payment-customer-results input {
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.payment-customer-results {
    display: grid;
    gap: 14px;
}

.payment-customer-results article {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 0.7fr) minmax(280px, 1fr);
    gap: 24px;
    align-items: center;
    padding: 22px;
    border: 1px solid var(--line);
    background: white;
}

.payment-customer-results article > div > span,
.payment-customer-results article > div > small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
}

.payment-customer-results dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 0;
}

.payment-customer-results dt,
.payment-customer-results dd {
    margin: 0;
}

.payment-customer-results dt {
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
}

.payment-customer-results dd {
    margin-top: 4px;
    font-weight: 850;
}

.payment-customer-results form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: end;
}

.currency-input {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.currency-input b {
    padding-left: 12px;
}

.currency-input input {
    border: 0;
}

.payment-request-detail {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
    gap: 1px;
    padding: 0;
    overflow: hidden;
    background: var(--line);
}

.payment-request-summary,
.payment-request-share {
    padding: 30px;
    background: white;
}

.payment-request-summary h2 {
    margin: 18px 0 26px;
    font-family: var(--display);
    font-size: 52px;
}

.payment-request-summary dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 0;
}

.payment-request-summary dl div {
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.payment-request-summary dt,
.payment-request-summary dd {
    margin: 0;
}

.payment-request-summary dt {
    color: var(--muted);
    font-size: 9px;
    text-transform: uppercase;
}

.payment-request-summary dd {
    margin-top: 5px;
    font-weight: 750;
}

.payment-request-share {
    text-align: center;
}

.payment-request-share img {
    display: block;
    width: min(240px, 100%);
    height: auto;
    margin: 0 auto 20px;
}

.payment-request-share h3 {
    font-family: var(--display);
    font-size: 24px;
    text-transform: uppercase;
}

.payment-request-share p {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.payment-request-share form {
    margin-top: 12px;
}

.payment-request-share form .button {
    width: 100%;
}

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

.booking-management-actions > form {
    display: flex;
    min-height: 420px;
    padding: 26px;
    border: 1px solid var(--line);
    flex-direction: column;
    gap: 22px;
    background: white;
}

.booking-management-actions h3 {
    margin: 20px 0 10px;
    font-family: var(--display);
    font-size: 28px;
    text-transform: uppercase;
}

.booking-management-actions p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.booking-management-actions .button {
    width: 100%;
    margin-top: auto;
}

.booking-management-actions .ticket-policy-notice {
    margin-top: auto;
}

.booking-management-actions .booking-cancel-action {
    border-color: #dfc4bf;
}

.booking-refund-workspace .staff-section-intro {
    margin: 0 0 24px;
}

.booking-refund-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin: 0 0 18px;
    padding: 1px;
    background: var(--line);
}

.booking-refund-summary > div {
    min-width: 0;
    padding: 20px;
    background: white;
}

.booking-refund-summary > div[data-refund-finance-metric="remaining"] {
    box-shadow: inset 0 3px 0 var(--signal);
    background: #fffaf4;
}

.booking-refund-summary dt,
.booking-refund-summary dd {
    margin: 0;
}

.booking-refund-summary dt,
.booking-refund-summary small {
    color: var(--muted);
    font-size: 9px;
    line-height: 1.45;
}

.booking-refund-summary dt {
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.booking-refund-summary dd {
    margin: 8px 0 6px;
    font-family: var(--display);
    font-size: clamp(24px, 2.6vw, 34px);
    font-weight: 900;
    line-height: 1;
}

.booking-refund-summary small {
    display: block;
}

.booking-refund-action {
    display: grid;
    max-width: none;
    gap: 28px;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid var(--line);
    background: white;
}

.booking-refund-action-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.42fr);
    gap: 28px;
    align-items: center;
}

.booking-refund-action h3,
.booking-cancellation-heading h3 {
    margin: 8px 0;
    font-family: var(--display);
    font-size: clamp(25px, 3vw, 34px);
    text-transform: uppercase;
}

.booking-refund-action p,
.booking-cancellation-heading p,
.booking-cancellation-actions p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.booking-refund-outcome {
    padding: 18px;
    border-left: 3px solid var(--signal);
    color: white;
    background: var(--olive);
}

.booking-refund-outcome span,
.booking-refund-outcome strong {
    display: block;
}

.booking-refund-outcome span {
    margin-bottom: 7px;
    color: rgb(255 255 255 / 62%);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.booking-refund-outcome strong {
    font-family: var(--display);
    font-size: 18px;
    text-transform: uppercase;
}

.booking-refund-form-grid {
    display: grid;
    grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr);
    gap: 30px;
    align-items: start;
}

.booking-refund-form-grid > label {
    display: grid;
    gap: 8px;
}

.booking-refund-form-grid > label > span:first-child,
.booking-refund-action legend,
.booking-cancellation-actions legend {
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.booking-refund-form-grid > label > small {
    color: var(--muted);
    font-size: 11px;
}

.booking-refund-action fieldset,
.booking-cancellation-actions fieldset {
    display: grid;
    gap: 9px;
    margin: 0;
}

.booking-refund-action fieldset > label,
.booking-cancellation-actions fieldset > label {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 11px;
    align-items: start;
    padding: 13px;
    border: 1px solid var(--line);
    cursor: pointer;
    background: var(--paper-2);
}

.booking-refund-action fieldset input[type="radio"],
.booking-cancellation-actions fieldset input[type="radio"] {
    width: 18px;
    height: 18px;
    min-height: 0;
    margin: 1px 0 0;
    accent-color: var(--signal);
}

.booking-refund-action fieldset strong,
.booking-refund-action fieldset small,
.booking-cancellation-actions fieldset strong,
.booking-cancellation-actions fieldset small {
    display: block;
}

.booking-refund-action fieldset small,
.booking-cancellation-actions fieldset small {
    margin-top: 5px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.5;
}

.booking-refund-submit-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
}

.booking-refund-submit-row .terms-check {
    max-width: 460px;
    margin: 0;
}

.booking-cancellation-panel {
    margin-top: 30px;
    padding: clamp(24px, 3vw, 34px);
    background: #fff8f5;
}

.booking-cancellation-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.6fr);
    gap: 30px;
    align-items: end;
    margin-bottom: 24px;
}

.booking-cancellation-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.booking-cancellation-actions > form {
    display: flex;
    max-width: none;
    min-width: 0;
    padding: 22px;
    border: 1px solid #dfc4bf;
    flex-direction: column;
    gap: 20px;
    background: white;
}

.booking-cancellation-actions h4 {
    margin: 8px 0;
    font-family: var(--display);
    font-size: 22px;
    text-transform: uppercase;
}

.booking-cancellation-actions .staff-partial-refund {
    grid-template-columns: 1fr;
    margin-left: 31px;
    cursor: default;
    background: white;
}

.booking-cancellation-actions .button {
    width: 100%;
    margin-top: auto;
}

.booking-cancel-without-refund {
    border-color: #b98579 !important;
}

.refund-history-list {
    display: grid;
    gap: 12px;
}

.refund-history-list > article {
    max-width: none;
    padding: 22px 24px;
    border: 1px solid var(--line);
    background: white;
}

.refund-history-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.refund-history-header > div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.refund-history-header .section-index {
    margin: 0;
}

.refund-history-amount {
    flex: 0 0 auto;
    font-family: var(--display);
    font-size: 30px;
}

.refund-history-status {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 5px 8px;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.refund-history-status-complete {
    color: #31502a;
    background: #dcebd6;
}

.refund-history-status-attention {
    color: #782f25;
    background: #f0ddd8;
}

.refund-history-status-pending {
    color: #625b3e;
    background: #eee9d1;
}

.refund-history-status-neutral {
    color: var(--muted);
    background: var(--paper-2);
}

.refund-history-details {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 18px 0 0;
}

.refund-history-details > div {
    min-width: 0;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.refund-history-details dt,
.refund-history-details dd {
    margin: 0;
}

.refund-history-details dt {
    color: var(--muted);
    font-size: 8px;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.refund-history-details dd {
    margin-top: 5px;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.45;
}

.staff-table-actions {
    min-width: 130px;
}

.staff-table-actions .table-action-link {
    display: block;
    width: max-content;
    margin-bottom: 5px;
}

.staff-table-actions > form {
    width: max-content;
    margin-top: 8px;
}

.staff-table-actions > form + form {
    margin-top: 10px;
}

.event-control-actions {
    min-width: 230px;
    vertical-align: top;
}

.staff-action-cluster {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    flex-wrap: wrap;
    width: max-content;
    max-width: 260px;
}

.staff-action-cluster > form {
    margin: 0;
}

.staff-action-button,
.staff-action-menu > summary {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;
    border: 1px solid var(--olive);
    color: var(--olive);
    background: white;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.staff-action-button-primary {
    color: white;
    background: var(--olive);
}

.staff-action-button:hover,
.staff-action-button:focus-visible,
.staff-action-menu > summary:hover,
.staff-action-menu > summary:focus-visible {
    color: white;
    background: var(--ink);
}

.staff-action-menu {
    width: 36px;
}

.staff-action-menu[open] {
    width: 100%;
    flex-basis: 100%;
}

.staff-action-menu > summary {
    width: 36px;
    padding: 0;
    color: white;
    border-color: var(--ink);
    background: var(--ink);
    cursor: pointer;
    font-size: 17px;
    letter-spacing: 0;
    list-style: none;
}

.staff-action-menu > summary::-webkit-details-marker {
    display: none;
}

.staff-action-menu[open] > summary {
    margin-left: auto;
}

.staff-action-menu-panel {
    display: grid;
    width: 100%;
    margin-top: 6px;
    border: 1px solid var(--line);
    background: white;
}

.staff-action-menu.is-portalled[open] {
    width: 36px;
    flex-basis: auto;
}

.staff-action-menu.is-portalled[open] > summary {
    margin-left: 0;
}

.staff-action-menu-panel.is-floating {
    position: fixed;
    z-index: 120;
    top: var(--staff-action-menu-top);
    left: var(--staff-action-menu-left);
    display: grid;
    width: var(--staff-action-menu-width);
    max-height: var(--staff-action-menu-max-height);
    margin: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    visibility: hidden;
    opacity: 0;
    box-shadow: 0 18px 44px rgb(8 11 8 / 22%);
    transform: translateY(-3px) scale(0.98);
    transform-origin: top right;
    transition:
        opacity 160ms ease-out,
        transform 160ms ease-out,
        visibility 0s linear 160ms;
}

.staff-action-menu-panel.is-floating[data-placement="above"] {
    transform: translateY(3px) scale(0.98);
    transform-origin: bottom right;
}

.staff-action-menu-panel.is-floating.is-visible {
    visibility: visible;
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 0s;
}

.staff-action-menu-panel.is-floating.is-closing {
    transition-duration: 120ms, 120ms, 0s;
    transition-delay: 0s, 0s, 120ms;
}

.staff-action-menu-backdrop {
    display: none;
}

.staff-action-menu-panel > a,
.staff-action-menu-button {
    display: block;
    width: 100%;
    padding: 10px 12px;
    color: var(--ink);
    border: 0;
    border-bottom: 1px solid var(--line);
    background: white;
    font: inherit;
    font-size: 10px;
    font-weight: 800;
    text-align: left;
}

.staff-action-menu-panel > a:hover,
.staff-action-menu-panel > a:focus-visible,
.staff-action-menu-button:hover,
.staff-action-menu-button:focus-visible {
    color: white;
    background: var(--olive);
}

/* Duplicating an event needs one value from the operator, so the action carries
   its own field rather than sending them to a page to supply it. The label stays
   visible above the control, and the submit reuses the menu's own button. */

.staff-action-menu-date {
    display: grid;
    gap: 4px;
    margin: 0;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    background: white;
}

.staff-action-menu-date label {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.staff-action-menu-date input[type="date"] {
    width: 100%;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--line);
    background: white;
    font: inherit;
    font-size: 11px;
}

.staff-action-menu-date .staff-action-menu-button {
    margin: 4px 0 0;
    padding: 8px 10px;
    border: 1px solid var(--line);
    text-align: center;
}

.staff-action-menu-state {
    border-top: 4px solid var(--paper-2);
}

.staff-action-menu-state form {
    margin: 0;
}

.staff-action-menu-danger {
    color: #8f3024;
}

.staff-action-menu-danger:hover,
.staff-action-menu-danger:focus-visible {
    color: white;
    background: #8f3024;
}

.staff-event-toolbar .staff-action-cluster {
    justify-content: flex-end;
}

.event-management-nav {
    margin-bottom: 18px;
}

.event-management-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin-bottom: 18px;
    border: 1px solid var(--line);
    background: var(--line);
}

.event-management-metrics article {
    padding: 20px;
    background: white;
}

.event-management-metrics span,
.event-management-metrics strong,
.event-management-metrics small {
    display: block;
}

.event-management-metrics span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.event-management-metrics strong {
    margin-top: 8px;
    color: var(--ink);
    font-family: var(--display);
    font-size: 32px;
}

.event-management-metrics small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 10px;
}

.event-management-metrics .needs-attention {
    box-shadow: inset 4px 0 0 var(--signal);
}

.event-management-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, 0.7fr);
    gap: 18px;
}

.event-management-panel {
    margin: 0 0 18px;
}

.team-booking-balance-intro {
    max-width: 760px;
    color: var(--muted);
}

.team-booking-balance-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    margin-top: 18px;
}

.team-booking-balance-card {
    padding: 18px;
    border: 1px solid var(--line);
    background: var(--paper-2);
}

.team-booking-balance-card.is-paused {
    box-shadow: inset 4px 0 0 var(--signal);
}

.team-booking-balance-card > header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.team-booking-balance-card h3 {
    margin: 0 0 6px;
}

.team-booking-colour {
    width: 12px;
    height: 42px;
    flex: 0 0 auto;
    background: var(--team-colour);
}

.team-booking-balance-card dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin: 16px 0;
    background: var(--line);
}

.team-booking-balance-card dl div {
    padding: 10px;
    background: white;
}

.team-booking-balance-card dt {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
}

.team-booking-balance-card dd {
    margin: 4px 0 0;
    font-family: var(--display);
    font-size: 20px;
}

.team-booking-balance-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.team-booking-balance-form > fieldset,
.team-booking-balance-form > .staff-switch,
.team-booking-balance-form > .staff-field-error,
.team-booking-balance-form > .staff-form-actions {
    grid-column: 1 / -1;
}

.team-booking-reopen-form {
    margin-top: 8px;
}

.event-management-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.event-management-details div {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}

.event-management-details dt {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
}

.event-management-details dd {
    margin: 5px 0 0;
    color: var(--ink);
    font-weight: 800;
}

.event-management-workflows {
    display: grid;
    gap: 8px;
}

.event-management-workflows a {
    display: grid;
    gap: 3px;
    padding: 14px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: var(--paper-2);
}

.event-management-workflows a:hover,
.event-management-workflows a:focus-visible {
    border-color: var(--olive);
    background: white;
}

.event-management-workflows span,
.event-management-panel p {
    color: var(--muted);
    font-size: 11px;
}

.event-management-capacity {
    display: block;
    margin-bottom: 10px;
    font-family: var(--display);
    font-size: 28px;
}

.event-management-panel meter {
    width: 100%;
    height: 12px;
    accent-color: var(--olive);
}

.event-management-attention p {
    display: grid;
    gap: 3px;
    margin: 0;
    padding: 12px;
    border-left: 3px solid var(--signal);
    color: var(--ink);
    background: #f5eadd;
}

.event-management-attention p + p {
    margin-top: 8px;
}

@media (max-width: 900px) {
    .event-management-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .event-management-grid {
        grid-template-columns: 1fr;
    }

    .team-booking-balance-grid {
        grid-template-columns: 1fr;
    }

    .staff-event-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .staff-event-toolbar .staff-action-cluster {
        justify-content: flex-start;
    }
}

@media (max-width: 620px) {
    .event-management-metrics,
    .event-management-details,
    .team-booking-balance-card dl {
        grid-template-columns: 1fr;
    }

    .event-management-nav {
        width: 100%;
        overflow-x: auto;
    }

    .staff-local-nav.event-management-nav a {
        flex: 0 0 auto;
    }

    .staff-event-toolbar .staff-action-cluster,
    .staff-event-toolbar .staff-action-button {
        width: 100%;
        max-width: none;
    }

    .staff-event-toolbar .staff-action-cluster > form {
        width: 100%;
    }

    .staff-event-toolbar .staff-action-menu {
        width: 100%;
    }

    .staff-action-menu-panel.is-floating.is-sheet {
        top: auto;
        right: 12px;
        bottom: 12px;
        left: 12px;
        width: auto;
        max-height: calc(100dvh - 24px);
        transform: translateY(12px);
        transform-origin: bottom center;
        border-color: var(--ink);
        box-shadow: 0 20px 60px rgb(8 11 8 / 36%);
    }

    .staff-action-menu-panel.is-floating.is-sheet.is-visible {
        transform: translateY(0);
    }

    .staff-action-menu-backdrop.is-visible {
        position: fixed;
        z-index: 119;
        inset: 0;
        display: block;
        border: 0;
        background: rgb(8 11 8 / 42%);
        animation: staff-action-menu-backdrop-in 160ms ease-out both;
    }
}

.payment-request-finished {
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: white;
    background: var(--olive);
}

.payment-request-finished .eyebrow {
    color: var(--signal);
}

.payment-request-finished p {
    color: #e3e6dc;
}

.payment-request-status-completed {
    color: #31502a;
    background: #dcebd6;
}

.payment-request-status-expired {
    color: #782f25;
    background: #f0ddd8;
}

.payment-request-status-starting,
.payment-request-status-checkout_created,
.payment-request-status-capturing {
    color: #625b3e;
    background: #eee9d1;
}

.player-booking-default-note {
    margin: 0 0 18px;
    color: var(--muted);
    font-size: 11px;
}

.refund-attention-row td {
    background: #fff8f5;
}

.refund-attention-row td:first-child {
    border-left: 4px solid #9a3d31;
}

.transaction-table td small,
.transaction-table td .table-action-link {
    display: block;
    margin-top: 5px;
}

.staff-booking-release {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(360px, 1.3fr);
    gap: 28px;
    margin-top: 24px;
    padding: 24px;
    border: 1px solid #b98579;
    background: #fff8f5;
}

.staff-booking-release h3 {
    margin: 8px 0;
    font-family: var(--display);
    font-size: 25px;
    text-transform: uppercase;
}

.staff-booking-release p,
.staff-booking-release small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.staff-booking-release fieldset {
    display: grid;
    gap: 10px;
    margin: 0 0 16px;
    padding: 0;
    border: 0;
}

.staff-booking-release legend {
    margin-bottom: 8px;
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
}

.staff-booking-release fieldset > label {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--line);
    background: white;
}

.staff-booking-release fieldset > label small,
.staff-booking-release fieldset > label strong {
    display: block;
}

.staff-booking-release .staff-partial-refund {
    display: grid;
    grid-template-columns: 110px minmax(130px, 1fr);
    align-items: center;
    margin-left: 34px;
}

.staff-booking-release .staff-partial-refund > small {
    grid-column: 2;
}

.staff-booking-release .is-condition-disabled {
    opacity: 0.52;
}

.payment-gateway-option {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    min-height: 64px;
    padding: 14px;
    border: 1px solid var(--line);
    cursor: pointer;
    background: var(--paper-2);
}

.payment-gateway-option input {
    width: 18px;
    height: 18px;
    min-height: 0;
    margin: 2px 0 0;
    padding: 0;
    accent-color: var(--signal);
}

.form-grid .payment-gateway-option-copy {
    color: var(--ink);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}

.payment-gateway-option-copy strong {
    display: block;
}

.payment-gateway-option-copy small {
    display: inline-block;
    margin-top: 7px;
    padding: 4px 7px;
    border: 1px solid #a13b2e;
    color: #721a12 !important;
    background: #ffe3de;
    font-size: 9px !important;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.check-in-schedule-editor {
    margin-top: 28px;
    padding: 0 24px 24px;
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 24%);
}

.check-in-schedule-editor summary {
    margin: 0 -24px;
    padding: 18px 24px;
    cursor: pointer;
    font-family: var(--display);
    font-size: 16px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.check-in-schedule-editor[open] summary {
    margin-bottom: 24px;
    border-bottom: 1px solid var(--line);
}

.check-in-schedule-editor > label,
.check-in-schedule-item label {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.check-in-schedule-editor label > span {
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.check-in-schedule-editor label > span em {
    margin-left: 6px;
    color: #96998f;
    font-style: normal;
    font-weight: 600;
}

.check-in-schedule-editor input,
.check-in-schedule-editor textarea {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #cbc8bf;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
}

.check-in-schedule-editor textarea {
    min-height: 110px;
    resize: vertical;
}

.check-in-schedule-editor .has-error input,
.check-in-schedule-editor .has-error textarea {
    border-color: #a64028;
}

.check-in-schedule-editor label small {
    color: #9b3424;
    font-size: 10px;
}

.check-in-schedule-builder {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.check-in-timings-toggle,
.check-in-schedule-item .check-in-timing-toggle {
    display: grid;
    grid-template-columns: auto 1fr;
    flex-direction: initial;
    gap: 10px;
    align-items: center;
}

.check-in-timings-toggle input,
.check-in-timing-toggle input {
    width: 18px;
    min-height: 18px;
    padding: 0;
    accent-color: var(--olive);
}

.check-in-schedule-builder > .fieldset-note {
    margin: 10px 0 0;
}

.check-in-schedule-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
}

.check-in-schedule-item {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    background: var(--paper-2);
    transition: opacity 180ms ease, background-color 180ms ease;
}

.check-in-schedule-item[hidden] {
    display: none;
}

.check-in-schedule-item.is-disabled {
    opacity: 0.62;
    background: #e8e5dd;
}

.check-in-schedule-item > strong,
.check-in-schedule-item > .check-in-timing-toggle,
.check-in-schedule-item .span-full {
    grid-column: 1 / -1;
}

.check-in-schedule-item > strong {
    font-family: var(--display);
    font-size: 14px;
    text-transform: uppercase;
}

.check-in-add-timing {
    margin-top: 14px;
}

.self-check-in-ready-mark {
    display: grid;
    width: 82px;
    height: 82px;
    margin: 0 auto 14px;
    place-items: center;
    border: 3px solid #d9f0c7;
    border-radius: 50%;
    color: #d9f0c7;
    font-size: 48px;
    font-weight: 850;
    line-height: 1;
}

@media (max-width: 900px) {
    .staff-settings-nav,
    .payment-setting-card,
    .navigation-setting-card {
        grid-template-columns: 1fr 1fr;
    }

    .payment-customer-results article,
    .payment-request-detail,
    .booking-management-actions,
    .staff-booking-release {
        grid-template-columns: 1fr;
    }

    .booking-refund-summary,
    .booking-cancellation-actions,
    .refund-history-details {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .booking-refund-action-heading,
    .booking-refund-form-grid,
    .booking-cancellation-heading {
        grid-template-columns: 1fr;
    }

    .event-list-controls {
        grid-template-columns: 1fr;
    }

    .filter-bar {
        grid-template-columns: 1fr;
    }

    .filter-actions {
        width: 100%;
        flex-wrap: wrap;
        padding-top: 0;
    }

    .filter-actions .button {
        width: auto;
        flex: 1 1 140px;
    }

    .staff-context-card {
        grid-template-columns: 1fr;
    }

    .staff-context-card > div + div {
        padding-top: 18px;
        padding-left: 0;
        border-top: 1px solid var(--line);
        border-left: 0;
    }

    .agreement-active-card dl {
        grid-template-columns: 1fr;
    }

    .check-in-schedule-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .staff-local-nav {
        width: 100%;
    }

    .staff-local-nav a {
        flex: 1 1 0;
        text-align: center;
    }

    .staff-form-section,
    .agreement-active-card {
        padding: 20px;
    }

    .staff-conditional-panel {
        padding: 18px;
    }

    .staff-choice-grid {
        grid-template-columns: 1fr;
    }

    .event-booking-export-actions {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .event-booking-export-actions > span {
        width: 100%;
    }

    .event-booking-export-actions .button {
        flex: 1 1 120px;
    }

    .staff-form-actions .button {
        width: 100%;
    }

    .staff-settings-nav,
    .payment-setting-card,
    .navigation-setting-card {
        grid-template-columns: 1fr;
    }

    .payment-customer-results form,
    .payment-request-summary dl {
        grid-template-columns: 1fr;
    }

    .booking-refund-summary,
    .refund-history-details {
        grid-template-columns: 1fr;
    }

    .booking-refund-submit-row,
    .refund-history-header {
        align-items: stretch;
        flex-direction: column;
    }

    .booking-refund-submit-row .button {
        width: 100%;
    }

    .refund-history-amount {
        font-size: 26px;
    }

    .check-in-schedule-item,
    .walk-on-payment-options {
        grid-template-columns: 1fr;
    }

    .waiver-metrics {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .game-day-safety-summary {
        width: 100%;
    }

    .game-day-attendance-counts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .game-day-fire-item {
        grid-template-columns: 1fr;
        grid-template-areas:
            "group"
            "identity"
            "presence"
            "team"
            "overnight"
            "checkout"
            "details";
    }

    .game-day-fire-identity { grid-area: identity; }
    .game-day-fire-presence { grid-area: presence; }
    .game-day-fire-checkout { grid-area: checkout; }

    .game-day-fire-overnight .attendance-actions,
    .game-day-player-details-grid,
    .game-day-site-closure-body {
        grid-template-columns: 1fr;
    }

    .game-day-register,
    .game-day-records {
        min-width: 0;
    }

    .game-day-register thead,
    .game-day-records thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .game-day-register tbody,
    .game-day-register tr,
    .game-day-register td,
    .game-day-register th,
    .game-day-records tbody,
    .game-day-records tr,
    .game-day-records td,
    .game-day-records th {
        display: block;
        width: 100%;
    }

    .game-day-register tr,
    .game-day-records tr {
        display: grid;
        margin-bottom: 14px;
        border: 1px solid var(--line);
        background: white;
    }

    .game-day-register td,
    .game-day-records td {
        display: grid;
        grid-template-columns: minmax(104px, 0.38fr) minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        padding: 14px;
        overflow-wrap: anywhere;
    }

    .game-day-register td::before,
    .game-day-records td::before {
        color: #41483d;
        content: attr(data-label);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .game-day-register td > *,
    .game-day-records td > * {
        grid-column: 2;
    }

    .game-day-register .game-day-group-heading,
    .game-day-records .game-day-group-heading {
        border: 0;
    }

    .game-day-register .game-day-group-heading th,
    .game-day-records .game-day-group-heading th {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .game-day-register .attendance-actions,
    .game-day-register .attendance-actions form,
    .game-day-register .attendance-actions button,
    .game-day-register .attendance-actions label,
    .game-day-register .attendance-actions select,
    .game-day-records .attendance-actions,
    .game-day-records .attendance-actions form,
    .game-day-records .attendance-actions button,
    .game-day-records .attendance-actions label,
    .game-day-records .attendance-actions select {
        width: 100%;
    }

    .game-day-page .game-day-workspace:has(.game-day-check-in-presentation) { display: block; }
    .has-js .game-day-player-panel {
        position: fixed;
        z-index: 80;
        inset: 0;
        width: 100%;
        max-width: none;
        height: 100dvh;
        padding: 16px;
        overflow-y: auto;
        visibility: hidden;
        opacity: 0;
        transform: translateY(24px);
        transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
    }
    .has-js .game-day-player-panel.is-open {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
    .has-js .game-day-player-panel[aria-hidden="true"] { pointer-events: none; }
    .has-js .game-day-player-close {
        display: inline-flex;
        position: sticky;
        z-index: 1;
        top: 0;
        align-items: center;
        justify-content: center;
        justify-self: end;
    }
    .game-day-more-actions-panel {
        position: fixed;
        top: auto;
        right: 12px;
        bottom: 12px;
        left: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .game-day-player-panel,
    .game-day-player-panel.is-open { transition: none; }

    .staff-action-menu-panel.is-floating,
    .staff-action-menu-panel.is-floating.is-closing,
    .staff-action-menu-backdrop.is-visible {
        animation: none;
        transition: none;
    }
}

@media print {
    .flash {
        display: none !important;
    }

    .game-day-page .staff-toolbar,
    .game-day-page .filter-bar,
    .game-day-page .site-header,
    .game-day-page .site-footer,
    .game-day-page .game-day-player-details,
    .game-day-page .game-day-site-closure,
    .game-day-page .game-day-fire-actions {
        display: none !important;
    }

    .game-day-page .staff-shell {
        min-height: auto;
        padding: 0;
    }

    .game-day-page .staff-section {
        margin-top: 20px;
    }

    .game-day-page .staff-table-wrap {
        overflow: visible;
        border: 0;
    }

    .game-day-page .staff-table {
        min-width: 0;
        font-size: 9px;
    }

    .game-day-page .attendance-actions {
        display: none;
    }

    .game-day-page .balance-grid {
        grid-template-columns: 1fr 1fr;
    }

    .print-gift-card-secret .site-header,
    .print-gift-card-secret .site-footer,
    .print-gift-card-secret .staff-shell > .shell > *:not(#manage),
    .print-gift-card-secret #manage > *:not(.gift-card-secret-panel),
    .print-gift-card-secret .gift-card-secret-panel .button {
        display: none !important;
    }

    .print-gift-card-secret .staff-shell,
    .print-gift-card-secret #manage,
    .print-gift-card-secret .gift-card-secret-panel {
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        background: white;
        box-shadow: none;
    }
}

@media (max-width: 760px) {
    .gift-card-admin-actions {
        grid-template-columns: 1fr;
    }

    .gift-card-secret-panel dl div {
        grid-template-columns: 1fr;
    }
}

.rich-text-editor { grid-column: 1 / -1; margin-top: 1.25rem; }

.rich-text-editor-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; margin-bottom: .65rem; }

.rich-text-editor-heading label span { color: var(--ink); font-weight: 700; }

.rich-text-editor-heading small { color: var(--muted); max-width: 42rem; }

.rich-text-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; padding: .45rem; border: 1px solid var(--line); background: rgb(255 255 255 / 28%); }

.rich-text-toolbar button, .rich-text-style select { min-height: 2.25rem; border: 1px solid transparent; border-radius: .2rem; background: transparent; color: var(--ink); font: inherit; font-size: .82rem; padding: .35rem .55rem; }

.rich-text-toolbar button { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; }

.rich-text-toolbar button:hover, .rich-text-toolbar button:focus-visible, .rich-text-style select:focus-visible { border-color: var(--olive); background: var(--paper); outline: none; }

.rich-text-toolbar button strong, .rich-text-toolbar button em { font-size: 1rem; }

.rich-text-toolbar-divider { width: 1px; height: 1.5rem; background: var(--line); margin: 0 .2rem; }

.rich-text-toolbar-spacer { flex: 1 1 auto; }

.rich-text-toolbar .rich-text-toolbar-quiet { color: var(--muted); font-size: .75rem; }

.rich-text-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .75rem; margin-top: .75rem; }

.rich-text-source-pane, .rich-text-preview { min-width: 0; border: 1px solid var(--line); background: rgb(255 255 255 / 24%); }

.rich-text-source-pane { display: flex; flex-direction: column; }

.rich-text-pane-label { display: block; padding: .75rem .9rem .55rem; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.rich-text-workspace textarea { display: block; width: 100%; flex: 1 1 auto; height: 100%; min-height: 15rem; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; padding: .9rem; resize: none; line-height: 1.55; }

.rich-text-workspace textarea:focus-visible { outline: 2px solid var(--olive); outline-offset: -2px; }

.rich-text-preview { min-height: 15rem; }

.rich-text-preview > div { min-height: calc(15rem - 2.4rem); border-top: 1px solid var(--line); padding: .9rem; }

.rich-text-preview .rich-text-empty { color: var(--muted); font-style: italic; }

[data-waiver-agreement-editor] .rich-text-editor { margin-top: 0; padding: 0 18px 18px; }

[data-waiver-agreement-editor] .rich-text-preview > div { padding: 0; overflow: auto; }

[data-waiver-agreement-editor] .rich-text-preview > div > .waiver-agreement { max-height: none; min-height: 100%; margin: 0; padding: clamp(20px, 4vw, 42px); overflow: visible; border: 0; }

.rule-editor-note { align-self: end; margin: 0; color: var(--muted); font-size: .82rem; }

@media (max-width: 760px) { .rich-text-workspace { grid-template-columns: 1fr; } .rich-text-toolbar-spacer { display: none; } .rich-text-editor-heading { display: block; } .rich-text-editor-heading small { display: block; margin-top: .25rem; } [data-waiver-agreement-editor] .rich-text-editor { padding: 0 12px 12px; } }

.event-uniform-visibility { margin-bottom: 24px; }

.event-team-uniforms { grid-column: 1 / -1; display: grid; gap: 12px; }

.event-team-uniform-card { padding: 18px; border: 1px solid var(--line); background: rgb(255 255 255 / 32%); }

.event-team-uniform-card h3 { margin: 0 0 8px; font-family: var(--display); font-size: 17px; text-transform: uppercase; }

.event-team-uniform-inherited { margin: 0; color: var(--ink); font-size: 13px; line-height: 1.6; }

.event-team-uniform-recommended { margin: 7px 0 12px; color: var(--muted); font-size: 11px; }

.event-team-uniform-replacement { margin-top: 12px; }

.promotion-code-status { min-height: 1.4em; margin: 0; color: var(--muted); font-size: 13px; }

.affiliate-admin { display: grid; gap: 28px; }

.affiliate-rule-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }

.affiliate-rule-grid > div { display: grid; gap: 14px; align-content: start; }

.affiliate-member-list { display: grid; gap: 10px; }

.affiliate-rewards { display: grid; gap: 10px; }

.affiliate-member-list > a { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.5fr) auto; gap: 14px; align-items: center; padding: 15px 17px; border: 1px solid var(--line); color: var(--ink); text-decoration: none; }

.affiliate-rewards > article { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.5fr) auto; gap: 14px; align-items: center; padding: 15px 17px; border: 1px solid var(--line); color: var(--ink); text-decoration: none; }

.affiliate-member-list strong { display: grid; gap: 4px; }

.affiliate-member-list strong small { color: #8a4c14; font-size: 11px; text-transform: uppercase; }

.affiliate-member-list > a.affiliate-member-attention { border-color: #c88a3d; background: #fff8e8; }

.affiliate-identity-card { align-items: center; }

.affiliate-identity-card > div:last-child { align-content: center; justify-items: end; }

.affiliate-identity-card .status-pill { width: fit-content; margin-bottom: 5px; }

.affiliate-evidence dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.affiliate-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.affiliate-evidence dl > div { padding: 14px; background: rgb(255 255 255 / 45%); }

.affiliate-metrics > div { padding: 14px; background: rgb(255 255 255 / 45%); }

.affiliate-evidence dt { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

.affiliate-metrics dt { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

.affiliate-evidence dd { margin: 5px 0 0; overflow-wrap: anywhere; }

.affiliate-metrics dd { margin: 5px 0 0; overflow-wrap: anywhere; }

.affiliate-actions { display: grid; gap: 18px; }

.affiliate-actions form { display: grid; gap: 12px; padding: 18px; border: 1px solid var(--line); }

.affiliate-offer-custom-controls { display: grid; gap: 18px; }

@media (max-width: 760px) {
    .affiliate-rule-grid,
    .affiliate-evidence dl { grid-template-columns: 1fr; }

    .affiliate-metrics { grid-template-columns: 1fr; }

    .affiliate-member-list > a { grid-template-columns: 1fr; }

    .affiliate-rewards > article { grid-template-columns: 1fr; }

    .affiliate-identity-card { grid-template-columns: 1fr; }

    .affiliate-identity-card > div + div { padding: 16px 0 0; border-top: 1px solid var(--line); border-left: 0; }

    .affiliate-identity-card > div:last-child { justify-items: start; }
}

.promotion-recipient-options {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px !important;
}

.promotion-recipient-options > legend,
.promotion-recipient-options > .staff-field-error {
    grid-column: 1 / -1;
}

.promotion-recipient-options > .terms-check {
    width: 100% !important;
}

.promotion-player-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.promotion-player-search > .staff-field,
.promotion-player-search > .promotion-player-selection,
.promotion-player-search > .promotion-player-results {
    grid-column: 1 / -1;
}

.promotion-player-results {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.promotion-player-results button,
.promotion-player-results .terms-check {
    display: grid;
    width: 100%;
    gap: 3px;
    padding: 13px 15px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: white;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.promotion-player-results button:focus-visible {
    border-color: var(--olive);
    outline: 3px solid rgb(85 102 58 / 24%);
    outline-offset: 1px;
}

.promotion-player-results span,
.promotion-player-results small {
    overflow-wrap: anywhere;
}

.promotion-player-selection {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #f8f7f2;
}

.promotion-player-selection > span {
    display: grid;
    min-width: 0;
    gap: 3px;
    overflow-wrap: anywhere;
}

.promotion-immutable-summary { padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-top: 4px solid var(--olive); background: rgb(255 255 255 / 38%); }

.promotion-immutable-code { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; color: #fff; background: var(--ink); }

.promotion-immutable-code > span { color: rgb(255 255 255 / 68%); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.promotion-immutable-code code { color: #fff; font-size: clamp(20px, 3vw, 28px); font-weight: 900; letter-spacing: .05em; overflow-wrap: anywhere; }

.promotion-immutable-identity { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr) minmax(0, 1.6fr); gap: 1px; margin: 1px 0 0; background: var(--line); }

.promotion-immutable-identity > div { min-width: 0; padding: 16px 18px; background: var(--paper); }

.promotion-immutable-identity dt,
.promotion-immutable-metrics dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }

.promotion-immutable-identity dd { display: grid; gap: 3px; margin: 6px 0 0; overflow-wrap: anywhere; }

.promotion-immutable-identity dd strong { font-size: 14px; }

.promotion-immutable-identity dd span { color: var(--muted); font-size: 12px; line-height: 1.45; }

.promotion-immutable-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; }

.promotion-immutable-metrics > div { padding: 16px 18px; border: 1px solid var(--line); background: rgb(255 255 255 / 55%); }

.promotion-immutable-metrics dd { margin: 6px 0 0; font-family: var(--display); font-size: 25px; font-weight: 900; overflow-wrap: anywhere; }

.promotion-immutable-note { display: grid; gap: 4px; margin: 20px 0 0; padding: 14px 16px; border-left: 4px solid var(--olive); color: var(--muted); background: rgb(80 84 67 / 8%); font-size: 13px; line-height: 1.5; }

.promotion-immutable-note strong { color: var(--ink); font-size: 12px; text-transform: uppercase; }

@media (max-width: 620px) {
    .promotion-recipient-options,
    .promotion-player-search {
        grid-template-columns: 1fr;
    }

    .promotion-recipient-options > legend,
    .promotion-recipient-options > .staff-field-error,
    .promotion-player-search > .staff-field,
    .promotion-player-search > .promotion-player-selection,
    .promotion-player-search > .promotion-player-results {
        grid-column: auto;
    }

    .promotion-player-selection .button {
        width: 100%;
    }

    .promotion-immutable-summary .staff-section-heading { align-items: start; }
    .promotion-immutable-code { display: grid; }
    .promotion-immutable-identity,
    .promotion-immutable-metrics { grid-template-columns: 1fr; }
}

/* Event editor progressive disclosure */

.event-section-navigation {
    display: grid;
    gap: 10px;
    margin: 0 0 28px;
    padding: 18px;
    border: 1px solid #807d73;
    background: #e8e4d8;
}

.event-section-navigation h2 {
    margin: 0;
    color: var(--ink);
    font-family: var(--display);
    font-size: 14px;
    text-transform: uppercase;
}

.event-section-navigation ol {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.event-section-navigation a {
    display: flex;
    min-height: 44px;
    padding: 9px 11px;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #969287;
    color: var(--ink);
    background: #f8f5ed;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
}

.event-section-navigation a:hover {
    border-color: var(--ink);
    background: #d7d1c2;
}

.event-section-navigation a:focus-visible {
    outline: 3px solid #5f552f;
    outline-offset: 2px;
}

.event-section-navigation [data-event-section-status] {
    color: #334d2f;
    font-size: 9px;
    letter-spacing: .05em;
    text-align: right;
    text-transform: uppercase;
}

.event-section-navigation [data-event-section-state="attention"] {
    border-color: #8d2d20;
    background: #f0d9d2;
}

.event-section-navigation [data-event-section-state="attention"] [data-event-section-status] {
    color: #6f2117;
}

.event-section-navigation [data-event-section-state="optional"] [data-event-section-status] {
    color: #575a52;
}

.form-errors ul {
    display: grid;
    gap: 7px;
    margin: 12px 0 0;
    padding-left: 20px;
}

.form-errors li,
.form-errors a {
    color: #6f2117;
    font-size: 12px;
    line-height: 1.45;
}

.form-errors a {
    display: flex;
    min-height: 44px;
    align-items: center;
}

.form-errors a:focus-visible {
    outline: 3px solid #5f552f;
    outline-offset: 2px;
}

.event-form > fieldset:focus-visible {
    outline: 3px solid #5f552f;
    outline-offset: 8px;
}

.event-form [aria-invalid="true"] {
    border: 2px solid #8d2d20;
    background: #fff0eb;
    box-shadow: inset 4px 0 0 #8d2d20;
}

.event-form .field-error::before,
.event-form .staff-field-error::before,
.event-form .has-error > small:last-child::before {
    content: "!";
    display: inline-grid;
    width: 16px;
    height: 16px;
    margin-right: 5px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #812719;
    font-size: 10px;
    font-weight: 900;
}

.field-with-help,
.field-with-help-heading,
.attendance-config-heading {
    display: flex;
}

.field-with-help {
    flex-direction: column;
    gap: 7px;
}

.event-form [hidden] {
    display: none !important;
}

.field-with-help-heading,
.attendance-config-heading {
    gap: 10px;
    align-items: center;
    justify-content: space-between;
}

.field-with-help label > span {
    color: #575a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.field-with-help input,
.field-with-help textarea {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #8c897f;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
}

.field-with-help textarea {
    min-height: 110px;
    resize: vertical;
}

.field-with-help > small {
    color: var(--muted);
    font-size: 10px;
}

.field-with-help.has-error input,
.field-with-help.has-error textarea {
    border-color: #8d2d20;
}

.field-with-help.has-error > small {
    color: #812719;
}

.rich-text-with-help {
    position: relative;
}

.rich-text-with-help > .field-help {
    position: absolute;
    z-index: 2;
    top: 10px;
    right: 0;
}

.rich-text-with-help .rich-text-editor-heading {
    display: grid;
    padding-right: 60px;
    justify-items: start;
}

.rich-text-with-help .rich-text-editor-heading small {
    margin-top: 4px;
}

.field-help {
    position: relative;
    width: fit-content;
}

.field-help[open] {
    flex-basis: 100%;
    width: 100%;
}

.field-help[open] > summary {
    margin-left: auto;
}

.field-help > summary {
    display: inline-grid;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    place-items: center;
    border: 1px solid #68745e;
    border-radius: 50%;
    color: #1f3020;
    background: #e8e4d8;
    font-size: 16px;
    font-weight: 900;
    cursor: pointer;
    list-style: none;
}

.field-help > summary::-webkit-details-marker {
    display: none;
}

.field-help > summary:hover {
    background: #c3cbb9;
}

.field-help > summary:focus-visible {
    outline: 3px solid #5f552f;
    outline-offset: 3px;
}

.field-help[open] > summary {
    border-color: var(--ink);
    color: #fff;
    background: var(--ink-2);
}

.field-help > p {
    position: static;
    width: 100%;
    margin: 8px 0 0;
    padding: 14px 16px;
    border: 1px solid #70756b;
    color: var(--ink);
    background: #f4f0e5;
    font-size: 12px;
    line-height: 1.55;
}

.rich-text-with-help > .field-help[open] {
    position: relative;
    top: auto;
    right: auto;
    margin-left: auto;
}

.field-with-help-heading,
.attendance-config-heading {
    flex-wrap: wrap;
}

.event-form-control-group {
    margin-bottom: 24px;
}

.event-date-time-pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 0.45fr);
    gap: 0.75rem;
}

.event-date-time-pair input {
    width: 100%;
}

.inherited-terrain-panel {
    padding: 16px 18px;
    border-left: 4px solid var(--olive);
    color: var(--ink);
    background: #e8e4d8;
}

.inherited-terrain-panel strong {
    display: block;
    font-family: var(--display);
    font-size: 14px;
    text-transform: uppercase;
}

.inherited-terrain-panel p {
    margin: 5px 0 0;
    color: #444a40;
    font-size: 12px;
}

.event-advanced-panel {
    border: 1px solid #827f73;
    background: rgb(255 255 255 / 28%);
}

.event-advanced-panel > summary {
    display: flex;
    min-height: 44px;
    padding: 12px 16px;
    align-items: center;
    color: var(--ink);
    background: #d2cab7;
    font-family: var(--display);
    font-size: 14px;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
    cursor: pointer;
}

.event-advanced-panel > summary:hover {
    background: #bdb49e;
}

.event-advanced-panel > summary:focus-visible {
    outline: 3px solid #5f552f;
    outline-offset: 2px;
}

.event-advanced-panel[open] > summary {
    color: #fff;
    background: var(--ink-3);
}

.event-advanced-panel.has-error {
    border: 2px solid #8d2d20;
}

.event-advanced-panel.has-error > summary {
    color: #fff;
    background: #812719;
}

.event-uniform-visibility {
    margin: 0 0 24px;
}

.event-uniform-visibility > .staff-form-section {
    padding: 20px;
}

.team-advanced-settings {
    grid-column: 1 / -1;
    margin-top: 4px;
}

.team-advanced-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 18px;
}

.team-advanced-settings > .event-team-uniforms,
.team-advanced-settings > .team-capacity-note {
    margin: 0 18px 18px;
}

.event-form .event-team-uniform-replacement {
    margin: 12px 0 0;
    padding: 0;
    border: 0;
}

.attendance-config-panel {
    margin-top: 16px;
    padding: 20px;
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 28%);
}

.attendance-config-panel h2 {
    margin: 0 0 14px;
    color: var(--ink);
    font-family: var(--display);
    font-size: 17px;
    text-transform: uppercase;
}

.attendance-config-heading h2 {
    margin-bottom: 0;
}

.attendance-readiness {
    margin: 16px 0;
    padding: 13px 15px;
    border-left: 4px solid #8d2d20;
    color: #6f2117;
    background: #f0d9d2;
}

.attendance-readiness.is-ready {
    border-left-color: #365d35;
    color: #193819;
    background: #dce8d7;
}

.attendance-config-panel > p {
    margin: 0 0 16px;
    color: #444a40;
    font-size: 12px;
}

.attendance-config-panel .terms-check {
    min-height: 44px;
    align-items: center;
}

.attendance-day-status {
    display: block;
    margin-bottom: 6px;
    color: var(--ink);
    font-size: 11px;
    text-transform: uppercase;
}

.attendance-config-panel th:last-child {
    min-width: 230px;
}

.attendance-config-panel th:last-child > .field-help {
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
}

.event-form [disabled] {
    color: #555950;
    background: #ded9cd;
    cursor: not-allowed;
    opacity: 1;
}

@media (max-width: 760px) {
    .event-section-navigation ol {
        grid-template-columns: 1fr;
    }

    .team-advanced-settings-grid {
        grid-template-columns: 1fr;
    }

    .rich-text-with-help > .field-help {
        position: relative;
        top: auto;
        right: auto;
        margin-left: auto;
    }

    .rich-text-with-help .rich-text-editor-heading {
        padding-right: 0;
    }
}

@media (max-width: 42rem) {
    .event-date-time-pair {
        grid-template-columns: 1fr;
    }
}

.staff-evidence-review {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
    gap: 22px;
    align-items: start;
}

.staff-evidence-review > *,
.staff-evidence-review__main,
.staff-evidence-review__aside,
.staff-evidence-review__panel,
.staff-evidence-review__record,
.staff-evidence-review__identity > div,
.staff-evidence-review__delivery > div {
    min-width: 0;
}

.staff-evidence-review__aside {
    display: grid;
    gap: 18px;
}

.staff-evidence-review__panel {
    border: 1px solid var(--line);
    background: white;
}

.staff-evidence-review__heading,
.staff-evidence-review__side-heading {
    margin: 0;
    padding: 19px 22px;
    border-bottom: 1px solid var(--line);
}

.staff-evidence-review__heading p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.staff-evidence-review__side-heading h2,
.staff-evidence-review__record h2,
.staff-evidence-review__resolved h2,
.staff-evidence-review__email h2 {
    margin: 0;
    font-family: var(--display);
    font-size: 22px;
    font-weight: 900;
    text-transform: uppercase;
}

.staff-evidence-review__body {
    padding: 22px;
}

.staff-evidence-review__danger {
    margin-bottom: 20px;
    padding: 16px 18px;
    border: 1px solid #a64028;
    border-left-width: 5px;
    color: #772a1d;
    background: #eddbd3;
}

.staff-evidence-review__danger strong,
.staff-evidence-review__delivery strong {
    display: block;
}

.staff-evidence-review__danger p,
.staff-evidence-review__email p {
    margin: 3px 0 0;
}

.staff-evidence-review__identity {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 0 18px;
    border: 1px solid var(--line);
}

.staff-evidence-review__comparison,
.staff-evidence-review__source {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 18px;
    border: 1px solid var(--line);
}

.staff-evidence-review__comparison > div,
.staff-evidence-review__source > div {
    min-width: 0;
    padding: 15px 17px;
    border-right: 1px solid var(--line);
}

.staff-evidence-review__comparison dd,
.staff-evidence-review__source dd {
    min-width: 0;
    overflow-wrap: anywhere;
}

.staff-evidence-review__comparison dt,
.staff-evidence-review__source dt {
    display: block;
    margin-bottom: 6px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.35;
    text-transform: uppercase;
}

.staff-evidence-review__comparison dd,
.staff-evidence-review__source dd {
    color: var(--ink);
    font-size: 15px;
    font-weight: 750;
    line-height: 1.4;
}

.staff-evidence-review__comparison > div:last-child,
.staff-evidence-review__source > div:nth-child(3n) {
    border-right: 0;
}

.staff-evidence-review__source > div:nth-child(-n + 3) {
    border-bottom: 1px solid var(--line);
}

.staff-evidence-review__comparison small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
}

.staff-evidence-review__readiness {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 18px 0 0;
    border: 1px solid rgba(255, 255, 255, 0.45);
}

.staff-evidence-review__readiness > div {
    min-width: 0;
    padding: 12px 14px;
}

.staff-evidence-review__readiness > div + div {
    border-left: 1px solid rgba(255, 255, 255, 0.45);
}

.staff-evidence-review__readiness span,
.staff-evidence-review__readiness strong {
    display: block;
    color: inherit;
}

.staff-evidence-review__findings {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
}

.staff-evidence-review__finding,
.staff-evidence-review__instruction {
    padding: 15px 17px;
    border-left: 5px solid #976824;
    color: #56380f;
    background: #fff4d8;
}

.staff-evidence-review__finding--warning {
    color: #56380f;
    background: #fff4d8;
}

.staff-evidence-review__finding--danger,
.staff-evidence-review__resolved--rejected {
    border-left-color: #a64028;
    color: #772a1d;
    background: #eddbd3;
}

.staff-evidence-review__finding strong,
.staff-evidence-review__finding span,
.staff-evidence-review__instruction strong,
.staff-evidence-review__instruction p {
    display: block;
    overflow-wrap: anywhere;
}

.staff-evidence-review__finding span,
.staff-evidence-review__instruction p {
    margin: 3px 0 0;
}

.staff-evidence-review__identity > div {
    padding: 15px 17px;
    border-bottom: 1px solid var(--line);
}

.staff-evidence-review__identity > div:nth-child(odd) {
    border-right: 1px solid var(--line);
}

.staff-evidence-review__identity > div:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.staff-evidence-review dt {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.staff-evidence-review dd {
    margin: 4px 0 0;
    overflow-wrap: anywhere;
    font-weight: 750;
}

.staff-evidence-review .report-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 24px;
}

.staff-evidence-review form fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.staff-evidence-review form legend {
    margin-bottom: 16px;
    font-family: var(--display);
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
}

.staff-evidence-review .field {
    display: grid;
    gap: 7px;
    margin-bottom: 20px;
}

.staff-evidence-review .field > label {
    color: var(--ink);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.staff-evidence-review .field > label strong {
    color: #772a1d;
}

.staff-evidence-review .field > label em {
    color: var(--muted);
    font-style: normal;
    font-weight: 700;
}

.staff-evidence-review .field select,
.staff-evidence-review .field textarea {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #8c897f;
    border-radius: 0;
    color: var(--ink);
    background: #f9f7f1;
}

.staff-evidence-review .field textarea {
    min-height: 120px;
    resize: vertical;
}

.staff-evidence-review .field > small {
    color: var(--muted);
    font-size: 10px;
}

.staff-evidence-review .field [aria-invalid="true"],
.staff-evidence-review__confirmation [aria-invalid="true"] {
    border: 2px solid #8d2d20;
    background: #fff0eb;
}

.staff-evidence-review .field .field-error,
.staff-evidence-review__confirmation .field-error {
    color: #812719;
}

.staff-evidence-review__confirmation {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 15px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: var(--paper);
    font-weight: 750;
}

.staff-evidence-review__confirmation .field-error {
    grid-column: 2;
}

.staff-evidence-review__confirmation input {
    accent-color: #7b281b;
}

.staff-evidence-review__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 22px;
}

.staff-evidence-review__decision-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: stretch;
    justify-content: flex-end;
    margin-top: 22px;
}

.staff-evidence-review__decision-actions form {
    margin: 0;
}

.staff-evidence-review__decision-actions .button {
    background: #f9f7f1;
}

.staff-evidence-review__decision-actions .button-primary {
    background: var(--olive);
}

.staff-evidence-review__decision-actions .button-danger {
    background: #8d2d20;
}

.staff-evidence-review__record {
    padding: 19px;
    border: 1px solid var(--ink);
    color: white;
    background: var(--ink);
}

.staff-evidence-review__record .status-pill {
    margin-bottom: 14px;
}

.staff-evidence-review__record dl {
    margin: 12px 0 0;
}

.staff-evidence-review__record dl > div + div {
    margin-top: 11px;
}

.staff-evidence-review__record dt {
    color: rgb(255 255 255 / 62%);
}

.staff-evidence-review__record dd {
    color: white;
}

.staff-evidence-review__record a {
    display: inline-block;
    margin-top: 16px;
    color: var(--signal);
    font-weight: 800;
}

.staff-evidence-review__impact {
    margin: 0;
    padding: 0;
    list-style: none;
}

.staff-evidence-review__impact li {
    position: relative;
    padding: 11px 0 11px 26px;
    border-bottom: 1px solid var(--line);
}

.staff-evidence-review__impact li:last-child {
    border-bottom: 0;
}

.staff-evidence-review__impact li::before {
    position: absolute;
    left: 0;
    color: var(--signal-dark);
    content: "→";
    font-weight: 900;
}

.staff-evidence-review__email {
    border: 1px solid var(--line);
    background: white;
}

.staff-evidence-review__email h2 {
    padding: 13px 15px;
    color: white;
    background: var(--olive);
}

.staff-evidence-review__email > div {
    padding: 16px;
    overflow-wrap: anywhere;
    font-size: 13px;
}

.staff-evidence-review__resolved {
    padding: 28px;
    border-top: 5px solid var(--signal);
    color: white;
    background: var(--olive);
}

.staff-evidence-review__resolved .status-pill {
    margin-bottom: 15px;
}

.staff-evidence-review__resolved h2 {
    font-size: 30px;
}

.staff-evidence-review__resolved p {
    max-width: 600px;
    margin: 7px 0 0;
    color: rgb(255 255 255 / 75%);
}

.staff-evidence-review__resolved--rejected h2,
.staff-evidence-review__resolved--rejected p {
    color: #772a1d;
}

.staff-evidence-review__permanent-record {
    margin: 22px 0;
    padding: 18px;
    border: 1px solid var(--line);
    background: var(--paper);
}

.staff-evidence-review__permanent-record h3 {
    margin: 4px 0 14px;
}

.staff-evidence-review__permanent-record dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.staff-evidence-review__permanent-record dl > div {
    min-width: 0;
}

.staff-evidence-review__result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.staff-evidence-review__delivery {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    border-left: 4px solid var(--olive);
    background: #e4eee0;
}

.staff-evidence-review__delivery--failed,
.staff-evidence-review__delivery--unavailable {
    border-left-color: #a64028;
    background: #eddbd3;
}

.staff-evidence-review__delivery span:not(.status-pill) {
    display: block;
    overflow-wrap: anywhere;
    color: var(--muted);
    font-size: 11px;
}

.staff-evidence-review__delivery form {
    flex: 0 0 auto;
}

.staff-evidence-review__timeline {
    margin: 0;
    padding: 0;
    list-style: none;
}

.staff-evidence-review__timeline li {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
}

.staff-evidence-review__timeline time {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.staff-evidence-review__timeline strong,
.staff-evidence-review__timeline span {
    display: block;
    overflow-wrap: anywhere;
}

.staff-evidence-review a:focus-visible,
.staff-evidence-review button:focus-visible,
.staff-evidence-review input:focus-visible,
.staff-evidence-review select:focus-visible,
.staff-evidence-review textarea:focus-visible {
    outline: 3px solid var(--olive);
    outline-offset: 2px;
}

.staff-evidence-review__record a:focus-visible {
    outline-color: var(--signal);
}

.staff-evidence-review__decision-actions .button:focus-visible {
    outline: 3px solid #273021;
    outline-offset: 2px;
}

@media (max-width: 900px) {
    .staff-evidence-review {
        grid-template-columns: minmax(0, 1fr);
    }

    .staff-evidence-review__aside {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .staff-evidence-review__aside > :last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .staff-evidence-review__aside,
    .staff-evidence-review__identity,
    .staff-evidence-review__comparison,
    .staff-evidence-review__source,
    .staff-evidence-review__readiness,
    .staff-evidence-review .report-metrics {
        grid-template-columns: 1fr;
    }

    .staff-evidence-review__readiness > div + div {
        border-top: 1px solid rgba(255, 255, 255, 0.45);
        border-left: 0;
    }

    .staff-evidence-review__permanent-record dl {
        grid-template-columns: 1fr;
    }

    .staff-evidence-review__result-actions {
        flex-direction: column;
    }

    .staff-evidence-review__result-actions .button {
        width: 100%;
    }

    .staff-evidence-review__aside > :last-child:nth-child(odd) {
        grid-column: auto;
    }

    .staff-evidence-review__heading,
    .staff-evidence-review__side-heading,
    .staff-evidence-review__body,
    .staff-evidence-review__resolved {
        padding: 17px;
    }

    .staff-evidence-review__identity > div,
    .staff-evidence-review__identity > div:nth-child(odd),
    .staff-evidence-review__identity > div:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .staff-evidence-review__identity > div:last-child {
        border-bottom: 0;
    }

    .staff-evidence-review__comparison > div,
    .staff-evidence-review__source > div,
    .staff-evidence-review__source > div:nth-child(-n + 3) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .staff-evidence-review__comparison > div:last-child,
    .staff-evidence-review__source > div:last-child {
        border-bottom: 0;
    }

    .staff-evidence-review__delivery,
    .staff-evidence-review__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .staff-evidence-review__decision-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .staff-evidence-review__decision-actions form,
    .staff-evidence-review__decision-actions .button {
        width: 100%;
    }

    .staff-evidence-review__delivery .button,
    .staff-evidence-review__actions .button {
        width: 100%;
    }

    .staff-evidence-review__timeline li {
        grid-template-columns: minmax(0, 1fr);
        gap: 3px;
    }
}

/* Player profile editing and Game Day waiver delivery */

.player-profile-form fieldset {
    display: block;
}

.player-profile-form .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
}

.player-profile-form > .event-form-actions {
    justify-content: flex-end;
}

.player-profile-form .player-profile-field--full,
.player-profile-form .player-profile-field--phone,
.player-profile-form .player-profile-field--postcode {
    grid-column: 1 / -1;
}

.player-profile-form .player-profile-field--phone {
    max-width: 28rem;
}

.player-profile-form .player-profile-field--postcode {
    max-width: 14rem;
}

.player-profile-summary {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding: 20px;
    border: 1px solid var(--line);
    background: white;
}

.player-profile-summary dl {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 34px;
    margin: 0;
}

.player-profile-summary dt,
.player-profile-summary dd {
    margin: 0;
}

.player-profile-summary dt {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-profile-summary dd {
    margin-top: 4px;
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 750;
}

.player-profile-editor-section {
    margin-top: 18px;
    border: 1px solid var(--line);
    background: white;
}

.player-profile-editor-section > summary {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 16px;
    cursor: pointer;
    font-weight: 850;
    text-transform: uppercase;
}

.player-profile-editor-section > summary span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
}

.player-profile-editor-section > summary .player-profile-editor-section__summary-copy {
    display: grid;
    gap: 3px;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.player-profile-editor-section__summary-copy small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.player-profile-editor-section > fieldset {
    margin: 0;
    padding: 20px;
    border: 0;
    border-top: 1px solid var(--line);
}

.player-profile-editor-section > .player-email-change {
    margin: 0;
    padding: 20px;
    border: 0;
    border-top: 1px solid var(--line);
}

.player-profile-email-section {
    margin: 0 0 22px;
}

.player-account-card {
    margin: 0 0 22px;
    border: 1px solid var(--line);
    background: white;
}

.player-account-card__header {
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
}

.player-account-card__header h3 {
    margin: 0;
    font-family: var(--display);
    font-size: 18px;
    text-transform: uppercase;
}

.player-account-card__header p {
    margin: 3px 0 0;
    color: var(--muted);
}

.player-email-identity > summary {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 18px;
    cursor: pointer;
}

.player-account-feedback {
    margin: 0 18px 16px;
    padding: 10px 12px;
    font-weight: 800;
}

.player-email-change-form .player-email-change-new-email {
    display: grid;
    max-width: 32.5rem;
    gap: 6px;
}

.player-email-change-form .player-email-change-new-email > span {
    font-weight: 800;
}

.player-email-change-form .player-email-change-new-email small {
    color: #8c3020;
}

.player-email-identity-summary {
    margin-bottom: 20px;
}

.player-email-change-new-email {
    max-width: 32.5rem;
}

.player-email-change-mode {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    border: 0;
}

.player-email-change-mode legend {
    margin-bottom: 8px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-email-change-mode .terms-check small {
    display: block;
    margin-top: 3px;
}

.player-email-change-override {
    display: grid;
    gap: 14px;
}

.has-js .player-email-change-form > [data-condition-target].is-condition-disabled {
    display: none;
}

.game-day-action-feedback:empty {
    display: none;
}

.game-day-action-feedback:not(:empty) {
    position: sticky;
    z-index: 4;
    top: 12px;
    margin: 14px 0;
    padding: 13px 15px;
    border: 1px solid #527048;
    border-left: 5px solid var(--signal);
    color: #273021;
    background: #e4eee0;
    box-shadow: 0 6px 18px rgb(39 48 33 / 14%);
    font-size: 13px;
    font-weight: 800;
}

.waiver-email-actions {
    display: grid;
    gap: 9px;
}

.waiver-email-actions .waiver-email-action {
    margin: 0;
}

.waiver-alternate-email {
    border: 0;
    background: transparent;
}

.waiver-email-actions .waiver-email-action button,
.waiver-alternate-email > summary {
    display: flex;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 9px 12px;
    border: 1px solid #a97831;
    cursor: pointer;
    color: #56380f;
    background: #fff4d8;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.waiver-alternate-email > summary {
    list-style: none;
}

.waiver-alternate-email > summary::-webkit-details-marker {
    display: none;
}

.waiver-alternate-email > summary:focus-visible {
    outline: 3px solid var(--olive);
    outline-offset: 3px;
}

.waiver-alternate-email > form {
    padding: 12px;
    border: 1px solid var(--line);
    border-top: 0;
    background: white;
}

.waiver-alternate-email .event-form-actions {
    padding-top: 12px;
}

.waiver-email-feedback:empty {
    display: none;
}

.waiver-email-feedback:not(:empty) {
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #527048;
    color: #273021;
    background: #e4eee0;
    font-size: 12px;
    font-weight: 800;
}

.waiver-email-feedback[data-message-kind="error"] {
    border-color: #a84937;
    color: #6b2116;
    background: #f8e8e3;
}

/* Booking transfer.

   This screen is read aloud to a player standing at the desk, so the type scale
   is inverted from what the page used to do. The refusals the service writes are
   whole sentences carrying the constraint, the day and the numbers -- "Sunday 4
   October: Rental is full, 20 of 20 taken" -- and they were being set in the
   11px muted footnote of `.ticket-policy-notice` underneath a shouted uppercase
   rendering of the machine code. The code was the loudest thing on the screen
   and the sentence was the quietest. Here the sentence is the content and the
   code is not shown at all; it rides in `data-refusal` for the suite.

   The three refusal groups are coloured apart because their difference is the
   whole point of the triage: red is "this booking is going nowhere today",
   amber is "somebody has to finish something first", and the signal colour --
   the product's ordinary "read this" -- is "only THIS destination refuses, and
   the controls above change it". Colour is never the only carrier; each group
   states its heading and its remedy in words. */

.transfer-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px 24px;
    margin: 0 0 22px;
}

.transfer-facts > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    border-top: 1px solid var(--line);
    padding-top: 9px;
}

.transfer-facts dt {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.transfer-facts dd {
    margin: 0;
    color: var(--ink);
    font-size: 16px;
    overflow-wrap: anywhere;
}

.transfer-plain {
    margin: 0 0 18px;
    color: var(--muted);
    font-size: 14px;
}

.transfer-holds {
    margin: 0 0 22px;
    border-left: 3px solid var(--olive);
    padding: 16px 18px;
    background: #eef1e7;
}

.transfer-holds h3 {
    margin: 0 0 8px;
    font-family: var(--display);
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
}

.transfer-holds p {
    margin: 0 0 10px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
}

.transfer-holds ul {
    margin: 0;
    padding-left: 18px;
}

.transfer-holds li {
    margin: 0 0 6px;
    color: var(--ink);
    font-size: 14px;
    line-height: 1.5;
}

.transfer-holds li strong {
    font-weight: 800;
}

.transfer-refusal-group {
    margin: 0 0 18px;
    border-left: 3px solid var(--signal);
    padding: 16px 18px;
    background: var(--shell);
}

.transfer-refusal-group h3 {
    margin: 0;
    font-family: var(--display);
    font-size: 17px;
    font-weight: 900;
    text-transform: uppercase;
}

.transfer-refusal-remedy {
    margin: 5px 0 12px;
    color: var(--muted);
    font-size: 13px;
}

.transfer-refusal-group ul {
    margin: 0;
    padding-left: 18px;
}

.transfer-refusal {
    margin: 0 0 9px;
    color: var(--ink);
    font-size: 15px;
    line-height: 1.55;
}

.transfer-refusal-booking {
    border-left-color: #a84937;
    background: #f8e8e3;
}

.transfer-refusal-unsettled {
    border-left-color: #9a6b18;
    background: #f7efdd;
}

.transfer-refusal-destination {
    border-left-color: var(--signal);
    background: #eee9d1;
}

.transfer-outcome-line {
    margin: 0 0 20px;
    color: var(--ink);
    font-size: 19px;
    line-height: 1.45;
}

.transfer-outcome-line strong {
    font-family: var(--display);
    font-weight: 900;
    text-transform: uppercase;
}

.transfer-money {
    margin: 0 0 22px;
    border: 1px solid var(--line);
    padding: 18px;
    background: var(--paper);
}

.transfer-money h3 {
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.transfer-money p {
    margin: 0 0 6px;
    color: var(--ink);
    font-size: 14px;
    line-height: 1.5;
}

/* Two classes deep on purpose. `.transfer-money p` above is (0,1,1) and would
   otherwise win the font-size against a single class, which is how the figure a
   marshal reads aloud first came out set in body copy. */

.transfer-money .transfer-money-figure {
    margin: 2px 0 10px;
    font-family: var(--display);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.1;
}

.transfer-money-handoff {
    color: var(--muted);
}

.transfer-consequences {
    margin: 0;
}

.transfer-consequences h3 {
    margin: 0 0 8px;
    font-family: var(--display);
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
}

.transfer-consequences ul {
    margin: 0;
    padding-left: 18px;
}

.transfer-consequences li {
    margin: 0 0 7px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.5;
}

@media (max-width: 620px) {
    .player-profile-form .form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .player-profile-form .player-profile-field {
        grid-column: 1 / -1;
        width: 100%;
        max-width: none;
    }

    .player-profile-form > .event-form-actions,
    .player-profile-personal-card > .event-form-actions {
        flex-direction: column;
    }

    .player-profile-form > .event-form-actions .button,
    .player-profile-personal-card > .event-form-actions .button {
        width: 100%;
    }

    .player-email-change-new-email {
        width: 100%;
        max-width: none;
    }

    .player-email-identity > summary {
        align-items: stretch;
        flex-direction: column;
    }

    .player-email-identity > summary .button {
        width: 100%;
    }

    .player-profile-summary {
        align-items: stretch;
        flex-direction: column;
    }

    .player-profile-summary .button,
    .waiver-alternate-email .button {
        width: 100%;
    }

    .player-profile-editor-section > summary {
        align-items: start;
        flex-direction: column;
        gap: 4px;
    }
}

@keyframes staff-menu-open {
    from {
        opacity: 0;
        transform: translateY(-8px);
        transform-origin: top;
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes interface-enter {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes staff-action-menu-backdrop-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}