:root {
    color-scheme: light;
    --ink: #211c18;
    --muted: #665d54;
    --line: #d7c9b8;
    --paper: #f8f2e8;
    --canvas: #e9e0d3;
    --cream: #f1e4c3;
    --gold: #a76b12;
    --gold-dark: #704609;
    --gold-soft: #f2dfb0;
    --pink: #a83f68;
    --pink-dark: #782545;
    --pink-soft: #ecd5dd;
    --gold-border: #b9964d;
    --pink-border: #be8198;
    --pink-ring: rgba(200,70,120,.14);
    --paper-glass: rgba(248,242,232,.94);
    --surface-alt: #f1e9dd;
    --surface-hover: #eee2d5;
    --saffron: var(--gold);
    --saffron-dark: var(--gold-dark);
    --teal: var(--pink-dark);
    --teal-soft: var(--pink-soft);
    --blue: var(--gold-dark);
    --blue-soft: var(--gold-soft);
    --rose: var(--pink);
    --rose-soft: var(--pink-soft);
    --amber-soft: var(--gold-soft);
    --danger: #b93845;
    --on-accent: #fff;
    --available-bg: #d9ebe2;
    --available-border: #34745f;
    --available-text: #173e32;
    --held-bg: #f2d785;
    --held-border: #9a6505;
    --held-text: #4f3402;
    --reserved-bg: #dfd0eb;
    --reserved-border: #75508f;
    --reserved-text: #3c2450;
    --booked-bg: #3d3b43;
    --booked-border: #27262c;
    --booked-text: #fff;
    --shadow: 0 18px 50px rgba(53,42,31,.14);
    --body-background:
        radial-gradient(circle at 94% -8%,rgba(167,107,18,.13),transparent 30rem),
        radial-gradient(circle at -5% 100%,rgba(99,83,65,.10),transparent 34rem),
        var(--canvas);
}
html[data-theme="dark"] {
    color-scheme: dark;
    --ink: #f5eee5;
    --muted: #bfb4a8;
    --line: #514a43;
    --paper: #24211f;
    --canvas: #141311;
    --cream: #3b311e;
    --gold: #ddb451;
    --gold-dark: #f3d27b;
    --gold-soft: #403419;
    --pink: #dc769d;
    --pink-dark: #f0a0bd;
    --pink-soft: #422631;
    --gold-border: #7b6532;
    --pink-border: #7b485b;
    --pink-ring: rgba(230,109,155,.18);
    --paper-glass: rgba(36,33,31,.94);
    --surface-alt: #2d2926;
    --surface-hover: #37312e;
    --danger: #ff8c91;
    --on-accent: #211812;
    --available-bg: #183c32;
    --available-border: #62c7a5;
    --available-text: #e0fff5;
    --held-bg: #4d3b13;
    --held-border: #e3b750;
    --held-text: #fff0b8;
    --reserved-bg: #3e2a4c;
    --reserved-border: #c18be0;
    --reserved-text: #f5e2ff;
    --booked-bg: #62616a;
    --booked-border: #918f9a;
    --booked-text: #fff;
    --shadow: 0 20px 60px rgba(0,0,0,.32);
    --body-background:
        radial-gradient(circle at 94% -8%,rgba(221,180,81,.11),transparent 30rem),
        radial-gradient(circle at -5% 100%,rgba(95,77,64,.13),transparent 34rem),
        var(--canvas);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 320px; min-height: 100%; overflow-x: hidden; overflow-y: auto; background: var(--canvas); color: var(--ink); }
body {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--body-background);
    color: var(--ink);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
body.dialog-open { overflow: hidden; }
button,input,select,textarea { font: inherit; }
button,a { -webkit-tap-highlight-color: transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
    outline: 3px solid rgba(200,70,120,.28);
    outline-offset: 2px;
}
a { color: inherit; text-decoration: none; }
.booking-shell,.admin-shell { min-height: 100vh; padding: 0 32px 40px; margin: auto; }
.booking-shell { max-width: 1540px; }
.admin-shell { max-width: 1660px; }
.topbar {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid var(--line);
}
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand > span:last-child { display: grid; gap: 1px; }
.brand strong { font-size: 16px; line-height: 1.1; letter-spacing: -.02em; }
.brand small { color: var(--muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.brand-mark {
    position: relative;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: linear-gradient(145deg,#4a2634,#24131a);
    overflow: hidden;
}
.brand-mark::before,.brand-mark::after,.brand-mark span {
    content: "";
    position: absolute;
    width: 8px;
    height: 17px;
    border-radius: 10px 10px 3px 3px;
    background: var(--pink);
    transform-origin: 50% 100%;
}
.brand-mark::before { transform: translate(-6px,5px) rotate(-28deg); }
.brand-mark::after { transform: translate(6px,5px) rotate(28deg); }
.brand-mark span { transform: translateY(3px); background: #e7bd59; }
.brand-mark--custom { width: 46px; height: 46px; flex: 0 0 auto; padding: 0; border-radius: 0; background: transparent; }
.brand-mark--custom::before,.brand-mark--custom::after,.brand-mark--custom span { display: none; }
.brand-mark img { width: 100%; height: 100%; display: block; object-fit: contain; }
.user-nav { display: flex; align-items: center; gap: 8px; min-width: 0; }
.user-nav form { margin: 0; }
.nav-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
    font-size: 13px;
    font-weight: 650;
}
.nav-link:hover { background: var(--pink-soft); }
.nav-link--muted { color: var(--muted); }
.user-chip {
    max-width: 230px;
    height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px 0 6px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--paper-glass);
    overflow: hidden;
    color: var(--ink);
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user-chip > span {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--teal-soft);
    color: var(--teal);
    font-size: 12px;
    font-weight: 800;
}
.booking-heading,.admin-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    padding: 34px 2px 26px;
}
.booking-heading h1,.admin-heading h1 {
    margin: 4px 0 7px;
    font-size: clamp(32px,4vw,52px);
    line-height: 1.02;
    letter-spacing: -.05em;
}
.booking-heading p,.admin-heading p {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.55;
}
.eyebrow,.auth-kicker {
    color: var(--saffron-dark);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.date-control { width: min(390px,100%); display: grid; gap: 7px; }
.date-control--important {
    padding: 12px 13px 11px;
    border: 1px solid var(--gold-border);
    border-radius: 14px;
    background: var(--gold-soft);
    box-shadow: 0 10px 28px rgba(76,53,17,.10);
}
.date-control--important label { color: var(--gold-dark); font-size: 12px; font-weight: 850; text-transform: uppercase; }
.date-control--important select { border: 2px solid var(--gold-border); background: var(--paper); font-size: 14px; }
.date-control--important > small { color: var(--gold-dark); font-size: 10px; font-weight: 700; }
.date-control label,.seat-search label,.booking-form label > span,.add-date-form label > span,
.auth-form label > span,.add-user-form label > span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 720;
    letter-spacing: .025em;
}
.date-control select,.seat-search input,.booking-form input,.booking-form select,.add-date-form input,
.toolbar-actions input,.auth-form input,.add-user-form input,.add-user-form select {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--paper);
    color: var(--ink);
    transition: border-color 150ms ease, box-shadow 150ms ease;
}
.date-control select { height: 48px; padding: 0 42px 0 14px; font-size: 13px; font-weight: 650; }
input:focus,select:focus {
    border-color: var(--saffron) !important;
    box-shadow: 0 0 0 4px rgba(200,70,120,.11);
    outline: none;
}
.booking-tools {
    min-height: 76px;
    display: grid;
    grid-template-columns: minmax(170px,260px) 1fr auto;
    align-items: center;
    gap: 28px;
    padding: 11px 16px;
    border: 1px solid var(--line);
    border-radius: 14px 14px 0 0;
    background: var(--paper-glass);
}
.seat-search { display: grid; gap: 5px; }
.seat-search > div { display: flex; }
.seat-search input {
    height: 36px;
    min-width: 0;
    padding: 0 11px;
    border-radius: 8px 0 0 8px;
    font-size: 12px;
    text-transform: uppercase;
}
.seat-search button {
    height: 36px;
    padding: 0 13px;
    border: 0;
    border-radius: 0 8px 8px 0;
    background: linear-gradient(135deg,var(--gold-dark),var(--pink-dark));
    color: var(--on-accent);
    cursor: pointer;
    font-size: 11px;
    font-weight: 750;
}
.live-summary { display: flex; align-items: center; justify-content: center; gap: 28px; }
.live-summary span {
    display: grid;
    color: var(--muted);
    font-size: 10px;
    letter-spacing: .03em;
    text-align: center;
    text-transform: uppercase;
}
.live-summary strong { color: var(--ink); font-size: 20px; letter-spacing: -.03em; }
.legend { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; color: var(--ink); font-size: 10px; }
.legend span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); font-weight: 750; }
.legend-dot { width: 14px; height: 14px; border: 2px solid; border-radius: 4px; }
.legend-dot--available { border-color: var(--available-border); background: var(--available-bg); }
.legend-dot--held { border-color: var(--held-border); background: var(--held-bg); }
.legend-dot--reserved { border-color: var(--reserved-border); background: var(--reserved-bg); }
.legend-dot--booked { border-color: var(--booked-border); background: var(--booked-bg); }
.legend-dot--restricted { border-style: dashed; border-color: var(--line-strong); background: var(--surface-alt); }
.seat-map-card {
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 16px 16px;
    background: var(--paper);
    box-shadow: var(--shadow);
    overflow: hidden;
    transition: opacity .15s ease;
}
.seat-map-card.is-loading { opacity: .58; }
.map-note {
    min-height: 37px;
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 0 16px;
    border-bottom: 1px solid #edf1ef;
    color: var(--muted);
    font-size: 10px;
}
.map-note strong { color: var(--teal); }
.booking-access { padding: 4px 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-alt); font-weight: 800; }
.booking-access--male { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.booking-access--female { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.booking-access--unassigned { border-color: var(--danger); color: var(--danger); }
.booking-access--admin-actions { border-color: var(--available-border); background: var(--available-bg); color: var(--available-text); }
.live-dot { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; color: var(--teal); font-weight: 700; }
.live-dot i,.held-badge i,.admin-badge i,.status-pill i {
    width: 7px;
    height: 7px;
    display: inline-block;
    border-radius: 50%;
    background: var(--pink);
    box-shadow: 0 0 0 4px var(--pink-ring);
}
.seat-map-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #becbc6 transparent;
}
.seat-map { width: max-content; min-width: 100%; display: flex; align-items: center; flex-direction: column; padding: 20px 22px 28px; box-sizing: border-box; }
.public-layout-header { width: 100%; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 12px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-alt); }
.public-layout-header > div:first-child { display: grid; gap: 3px; }
.public-layout-header strong { font-size: 11px; }
.public-layout-header span { color: var(--muted); font-size: 8.5px; }
.public-layout-sections { display: flex; gap: 7px; }
.public-layout-sections .public-section { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid; border-radius: 8px; font-weight: 750; }
.public-layout-sections .public-section--male { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.public-layout-sections .public-section--female { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.public-layout-sections b { color: inherit; }
.public-seat-layout {
    --layout-columns: 35;
    --public-seat-width: clamp(38px,2.2vw,44px);
    --public-pair-gap: clamp(10px,.7vw,14px);
    --public-main-aisle: clamp(22px,1.4vw,30px);
    --public-centre-aisle: clamp(52px,3vw,66px);
    width: max-content;
    min-height: 130px;
    display: grid;
    grid-template-columns: var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-main-aisle) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-centre-aisle) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-main-aisle) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width) var(--public-pair-gap) var(--public-seat-width) var(--public-seat-width);
    grid-template-rows: repeat(12,14px) 34px repeat(24,14px) 28px;
    grid-auto-rows: 12px;
    column-gap: 2px;
    row-gap: 3px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: linear-gradient(to bottom,var(--gold-soft) 0 29%,var(--paper) 29% 35%,var(--pink-soft) 35% 96%,var(--paper) 96%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.28);
    margin-inline: auto;
}
.public-seat-layout .seat { z-index: 2; width: 100%; height: 100%; min-height: 0; }
.public-layout-gender { z-index: 1; align-self: stretch; justify-self: stretch; display: flex; align-items: center; justify-content: center; border: 1px solid; border-radius: 999px; background: var(--paper); font-size: 8px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); pointer-events: none; }
.public-layout-gender--male { border-color: var(--gold-border); color: var(--gold-dark); }
.public-layout-gender--female { border-color: var(--pink-border); color: var(--pink-dark); }
.public-layout-aisle { z-index: 1; align-self: stretch; display: flex; align-items: center; justify-content: center; border-block: 1px solid var(--gold-border); background: repeating-linear-gradient(135deg,var(--paper),var(--paper) 8px,var(--gold-soft) 8px,var(--gold-soft) 16px); pointer-events: none; }
.public-layout-aisle span { padding: 3px 10px; border-radius: 999px; background: var(--paper); color: var(--muted); font-size: 7.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.public-layout-extension-label { z-index: 1; display: flex; align-items: center; justify-content: center; border-block: 1px solid var(--line); background: var(--surface-alt); color: var(--muted); font-size: 7.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.public-layout-empty { min-width: min(1160px,calc(100vw - 80px)); min-height: 280px; display: grid; place-items: center; border: 1px dashed var(--line); border-radius: 12px; background: var(--surface-alt); color: var(--muted); font-size: 11px; }
.seat-band { padding: 14px 15px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.seat-band--male { background: linear-gradient(90deg,var(--gold-soft),var(--paper) 45%,var(--gold-soft)); }
.seat-band--female { background: linear-gradient(90deg,var(--pink-soft),var(--paper) 45%,var(--pink-soft)); }
.band-title {
    min-height: 37px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding: 0 3px;
}
.band-title > div { display: flex; align-items: baseline; gap: 10px; }
.band-title strong { font-size: 12px; }
.band-title > span { color: var(--muted); font-size: 10px; font-weight: 600; }
.seat-layout { display: grid; grid-template-columns: max-content 1fr max-content; align-items: stretch; gap: 24px; }
.chair-zone,.floor-zone { display: flex; justify-content: center; gap: 12px; }
.chair-zone { align-items: stretch; }
.floor-zone { align-items: flex-start; gap: 11px; padding: 0 2px; }
.seat-group { display: grid; grid-template-columns: repeat(2,36px); gap: 4px; }
.chair-zone .seat-group { align-self: stretch; }
.seat-band--male .chair-zone .seat-group { grid-template-rows: repeat(3,minmax(0,1fr)); }
.seat-band--female .chair-zone .seat-group { grid-template-rows: repeat(5,minmax(0,1fr)); }
.chair-zone .seat { height: 100%; }
.seat {
    position: relative;
    width: 36px;
    height: 32px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: var(--paper);
    color: var(--ink);
    cursor: pointer;
    font-family: "Cascadia Mono",Consolas,monospace;
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: -.025em;
    transition: transform 90ms ease, border-color 90ms ease, background 90ms ease, box-shadow 90ms ease;
}
.seat--chair { border-color: var(--pink-border); color: var(--pink-dark); }
.seat--floor { border-color: var(--gold-border); color: var(--gold-dark); }
.seat--available { border-width: 2px; border-color: var(--available-border); background: var(--available-bg); color: var(--available-text); }
.seat--male { --seat-section-color: var(--gold-dark); }
.seat--female { --seat-section-color: var(--pink-dark); }
.seat--male::after,.seat--female::after { content: ""; position: absolute; top: 3px; right: 3px; width: 4px; height: 4px; border-radius: 50%; background: var(--seat-section-color); opacity: .8; }
.seat--available:hover,.seat--mine:hover {
    z-index: 1;
    border-color: var(--saffron);
    background: linear-gradient(135deg,var(--gold-soft),var(--pink-soft));
    box-shadow: 0 4px 10px rgba(44,62,57,.13);
    transform: translateY(-1px) scale(1.05);
}
.seat--held { border-width: 2px; border-color: var(--held-border); background: var(--held-bg); color: var(--held-text); cursor: not-allowed; }
.seat--restricted { border-style: dashed; border-color: var(--line-strong); background: var(--surface-alt); color: var(--muted); cursor: not-allowed; opacity: .52; }
.seat--reserved { border-width: 2px; border-color: var(--reserved-border); background: var(--reserved-bg); color: var(--reserved-text); cursor: help; }
.seat--mine { border-width: 2px; border-color: var(--pink); background: var(--pink-soft); color: var(--pink-dark); }
.seat--booked { border-width: 2px; border-color: var(--booked-border); background: var(--booked-bg); color: var(--booked-text); cursor: help; opacity: 1; }
.seat.is-admin-action { cursor: pointer; }
.seat.is-admin-action:hover,.seat.is-admin-action:focus-visible { z-index: 1; transform: translateY(-1px) scale(1.05); box-shadow: 0 0 0 3px rgba(200,70,120,.18),0 5px 13px rgba(44,62,57,.16); }
.seat.is-selected { border-color: var(--pink-dark); background: linear-gradient(135deg,var(--gold),var(--pink)); color: var(--on-accent); box-shadow: 0 0 0 3px rgba(200,70,120,.23); }
.seat.is-highlighted:not(:disabled) { border-color: var(--pink); box-shadow: 0 0 0 5px rgba(200,70,120,.16); }
.central-aisle {
    height: 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 7px 3px;
    color: #8a9692;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.central-aisle::before,.central-aisle::after { content: ""; height: 4px; flex: 1; border-radius: 4px; background: linear-gradient(90deg,var(--gold-soft),var(--pink-soft)); }
.sync-note { margin: 10px 4px 0; color: #7b8884; font-size: 10px; text-align: center; }
.seat-tooltip {
    position: fixed;
    z-index: 75;
    width: min(270px,calc(100vw - 24px));
    padding: 13px 14px;
    border: 1px solid var(--pink-border);
    border-radius: 12px;
    background: var(--paper);
    box-shadow: 0 18px 50px rgba(43,23,32,.22);
    color: var(--ink);
    opacity: 0;
    pointer-events: none;
    transform: translateY(7px) scale(.98);
    transform-origin: 50% 100%;
    transition: opacity .15s ease,transform .15s ease;
}
.seat-tooltip.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.seat-tooltip__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.seat-tooltip__heading > strong { font-family: Consolas,monospace; font-size: 12px; }
.seat-tooltip__badge { padding: 4px 7px; border-radius: 999px; font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.seat-tooltip__badge--booked { background: #604551; color: #fff; }
.seat-tooltip__badge--reserved { background: linear-gradient(135deg,var(--gold-soft),var(--pink-soft)); color: var(--pink-dark); }
.seat-tooltip__row { display: grid; grid-template-columns: 70px minmax(0,1fr); gap: 9px; padding: 6px 0; border-top: 1px solid var(--line); }
.seat-tooltip__row span { color: var(--muted); font-size: 9px; }
.seat-tooltip__row strong { min-width: 0; font-size: 10.5px; line-height: 1.35; overflow-wrap: anywhere; }
.seat-tooltip__hint { margin: 8px -2px -1px; padding: 8px 9px; border-radius: 7px; background: var(--gold-soft); color: var(--gold-dark); font-size: 9px; font-weight: 750; }
.dialog-backdrop {
    position: fixed;
    z-index: 30;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(13,25,23,.62);
    backdrop-filter: blur(4px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
.booking-dialog {
    width: min(690px,100%);
    max-height: calc(100vh - 44px);
    max-height: calc(100dvh - 44px);
    border-radius: 18px;
    background: var(--paper);
    box-shadow: 0 28px 90px rgba(9,17,16,.38);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
}
.dialog-header { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding: 24px 26px 17px; }
.dialog-header h2 { margin: 7px 0 4px; font-size: 25px; letter-spacing: -.035em; }
.dialog-header p { margin: 0; color: var(--muted); font-size: 12px; }
.held-badge { display: inline-flex; align-items: center; gap: 7px; color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.icon-button {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    padding: 0 0 2px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--paper);
    color: var(--muted);
    cursor: pointer;
    font-size: 23px;
}
.hold-message {
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 26px;
    padding: 0 13px;
    border: 1px solid var(--pink-border);
    border-radius: 9px;
    background: var(--teal-soft);
    color: var(--pink-dark);
    font-size: 11px;
    font-weight: 620;
}
.hold-message span { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; background: var(--pink); color: var(--on-accent); font-size: 10px; }
.hold-message b { font-weight: 620; }
.booking-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; padding: 20px 26px 25px; }
.booking-form label,.booking-field,.add-date-form label,.auth-form label,.add-user-form label { display: grid; gap: 6px; }
.booking-form > label,.booking-form > .booking-field { align-self: start; align-content: start; }
.booking-form input,.booking-form select,.add-date-form input,.auth-form input,.add-user-form input,.add-user-form select { height: 43px; padding: 0 12px; font-size: 13px; }
.booking-form small { color: #7d8985; font-size: 9px; line-height: 1.35; }
.required-marker { color: var(--danger); font-style: normal; }
.dob-field.is-invalid input { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(185,56,69,.12); }
.dob-field.is-invalid small { color: var(--danger); font-weight: 750; }
.whatsapp-input-wrap { position: relative; }
.whatsapp-input-wrap input { padding-right: 125px; }
.whatsapp-check {
    position: absolute;
    top: 8px;
    right: 7px;
    min-height: 27px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 7px;
    background: #18755b;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}
.whatsapp-input-wrap.is-valid input { border-color: #348a70; box-shadow: 0 0 0 3px rgba(52,138,112,.13); }
.whatsapp-input-wrap.is-invalid input { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(185,56,69,.12); }
.whatsapp-input-wrap.is-valid + small { color: #24705c; font-weight: 700; }
.whatsapp-input-wrap.is-invalid + small { color: var(--danger); font-weight: 700; }
.whatsapp-input-wrap.is-format-valid input { border-color: var(--gold-dark); box-shadow: 0 0 0 3px rgba(221,180,81,.14); }
.whatsapp-verification {
    display: grid;
    gap: 7px;
    padding: 10px;
    border: 1px solid var(--gold-border);
    border-radius: 9px;
    background: var(--gold-soft);
}
.whatsapp-verification strong { color: var(--ink); font-size: 10px; }
.whatsapp-verification > span { color: var(--muted); font-size: 9px; line-height: 1.35; }
.whatsapp-verification.is-verified { border-color: #78b8a3; background: rgba(52,138,112,.10); }
.whatsapp-verification.is-verified > span { color: #24705c; font-weight: 700; }
.whatsapp-verification.is-rejected { border-color: #efc2bd; background: rgba(185,56,69,.08); }
.whatsapp-verification.is-rejected > span { color: var(--danger); font-weight: 700; }
.whatsapp-verification__actions { display: flex; flex-wrap: wrap; gap: 7px; }
.whatsapp-result {
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--paper);
    color: var(--ink);
    cursor: pointer;
    font-size: 9px;
    font-weight: 780;
}
.whatsapp-result--yes { border-color: #78b8a3; color: #24705c; }
.whatsapp-result--no { border-color: #efc2bd; color: var(--danger); }
.full-field { grid-column: 1 / -1; }
.gender-value {
    min-height: 43px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
}
.gender-value i { width: 9px; height: 9px; border-radius: 50%; }
.gender-value small { margin-left: auto; }
.gender-value--male { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.gender-value--male i { background: var(--blue); }
.gender-value--female { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.gender-value--female i { background: var(--rose); }
.form-error { padding: 10px 12px; border: 1px solid #efc2bd; border-radius: 9px; background: #fff1ef; color: #983e38; font-size: 11px; line-height: 1.4; }
.dialog-actions { display: flex; justify-content: end; gap: 10px; padding-top: 4px; }
.primary-button,.secondary-button,.danger-button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 17px;
    border-radius: 9px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 760;
}
.primary-button { border: 1px solid var(--gold); background: linear-gradient(135deg,var(--gold),var(--pink)); color: var(--on-accent); box-shadow: 0 8px 20px rgba(200,70,120,.14); }
.primary-button:hover:not(:disabled) { border-color: var(--pink-dark); background: linear-gradient(135deg,var(--gold-dark),var(--pink-dark)); }
.secondary-button { border: 1px solid var(--line); background: var(--paper); color: var(--ink); }
.secondary-button:hover:not(:disabled) { background: var(--pink-soft); }
.danger-button { border: 1px solid #b94b54; background: transparent; color: var(--danger); }
.danger-button:hover:not(:disabled) { background: rgba(185,56,69,.10); }
.dialog-actions--split { align-items: center; justify-content: space-between; }
.dialog-actions--split > span { display: flex; gap: 10px; }
.important-date-card {
    display: grid;
    gap: 4px;
    margin: 0 26px 2px;
    padding: 12px 14px;
    border: 2px solid var(--gold-border);
    border-radius: 11px;
    background: var(--gold-soft);
    color: var(--gold-dark);
}
.important-date-card span { font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.important-date-card strong { font-size: 16px; line-height: 1.3; }
.booking-form .important-date-card { margin: 0; }
.important-date-card select { border-color: var(--gold-border); background: var(--paper); color: var(--ink); font-weight: 750; }
.destination-availability { min-height: 16px; padding: 5px 7px; border-radius: 6px; font-weight: 750; }
.destination-availability.is-checking { background: var(--surface-alt); color: var(--muted); }
.destination-availability.is-available { background: var(--available-bg); color: var(--available-text); }
.destination-availability.is-unavailable { background: rgba(185,56,69,.10); color: var(--danger); }
.multi-seat-selection { position: fixed; z-index: 25; top: max(14px, env(safe-area-inset-top)); left: 50%; display: flex; align-items: center; justify-content: space-between; gap: 14px; width: min(720px, calc(100vw - 28px)); margin: 0; padding: 12px 15px; border: 1px solid var(--gold-border); border-radius: 12px; background: var(--gold-soft); box-shadow: 0 14px 34px rgba(41,31,22,.20); transform: translateX(-50%); }
.multi-seat-selection > div:first-child { display: grid; gap: 3px; }
.multi-seat-selection strong { color: var(--gold-dark); font-size: 12px; }
.multi-seat-selection span { color: var(--muted); font-size: 10px; }
.multi-seat-selection__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.multi-seat-selection__actions button { min-height: 34px; padding: 6px 10px; font-size: 10px; }
.multi-devotee-fields { display: grid; gap: 12px; padding: 13px; border: 1px solid var(--pink-border); border-radius: 12px; background: var(--pink-soft); }
.multi-devotee-fields__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.multi-devotee-fields__heading strong { color: var(--pink-dark); font-size: 13px; }
.multi-devotee-fields__heading span { padding: 4px 8px; border: 1px solid var(--pink-border); border-radius: 999px; color: var(--pink-dark); font-family: Consolas,monospace; font-size: 9px; font-weight: 800; }
.multi-devotee-fields__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.destination-panel { display: grid; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-alt); }
.destination-panel__heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.destination-panel__heading > label,.destination-panel__heading > div:first-child { display: grid; flex: 1; gap: 5px; }
.destination-panel__heading span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.destination-panel__heading select { width: 100%; max-width: 360px; }
.destination-selection { display: grid; flex: 0 0 auto; gap: 2px; min-width: 105px; padding: 7px 10px; border: 1px solid var(--gold-border); border-radius: 9px; background: var(--gold-soft); text-align: right; }
.destination-selection strong { color: var(--gold-dark); font-size: 16px; }
.destination-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; color: var(--muted); font-size: 9px; font-weight: 700; }
.destination-legend span { display: inline-flex; align-items: center; gap: 5px; }
.destination-legend i { width: 10px; height: 10px; border: 1px solid var(--line); border-radius: 3px; background: var(--available-bg); }
.destination-legend .is-reserved { background: var(--gold-soft); border-color: var(--gold-border); }
.destination-legend .is-booked { background: var(--booked-bg); border-color: var(--booked-border); }
.destination-seat-map-scroll { max-height: 380px; overflow: auto; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); scrollbar-color: var(--line) transparent; }
.destination-seat-map { display: grid; grid-template-columns: repeat(35,minmax(21px,1fr)); grid-template-rows: repeat(59,5px); grid-auto-rows: 5px; gap: 1px; width: 820px; min-height: 353px; }
.destination-seat { z-index: 1; min-width: 0; padding: 0 1px; border: 1px solid var(--available-border); border-radius: 4px; background: var(--available-bg); color: var(--available-text); font-size: 7px; font-weight: 850; line-height: 1; cursor: pointer; }
.destination-seat:hover:not(:disabled),.destination-seat:focus-visible { z-index: 3; outline: 2px solid var(--gold); outline-offset: 1px; transform: scale(1.08); }
.destination-seat--chair { border-radius: 5px 5px 3px 3px; }
.destination-seat--booked { border-color: var(--booked-border); background: var(--booked-bg); color: var(--booked-text); }
.destination-seat--reserved { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.destination-seat--held { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.destination-seat:disabled { cursor: not-allowed; opacity: .62; }
.destination-seat.is-selected { z-index: 2; border: 2px solid var(--gold-dark); background: var(--gold); color: var(--on-accent); box-shadow: 0 0 0 2px var(--gold-soft); }
.admin-booking-dialog { width: min(680px,100%); }
.success-dialog { width: min(500px,100%); padding: 30px; text-align: center; }
.success-dialog h2 { margin: 7px 0 5px; font-size: 27px; }
.success-dialog > p { margin: 0 0 18px; color: var(--muted); font-size: 13px; }
.success-dialog .important-date-card { margin: 0 0 20px; text-align: left; }
.success-dialog > .success-whatsapp-note { margin-bottom: 12px; font-size: 10px; line-height: 1.5; }
.success-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.35fr); gap: 9px; }
.success-actions #bookingSuccessWhatsappLinks { display: grid; gap: 9px; }
.success-actions .primary-button,.success-actions .secondary-button { width: 100%; }
.success-mark { width: 52px; height: 52px; display: grid; place-items: center; margin: 0 auto 15px; border-radius: 50%; background: var(--available-bg); color: var(--available-text); font-size: 25px; font-weight: 900; box-shadow: 0 0 0 7px rgba(52,116,95,.12); }
button:disabled { cursor: not-allowed; opacity: .58; }
.toast {
    position: fixed;
    z-index: 60;
    right: 22px;
    bottom: 22px;
    max-width: min(390px,calc(100vw - 44px));
    padding: 13px 16px;
    border-radius: 11px;
    background: var(--ink);
    box-shadow: 0 16px 45px rgba(12,23,21,.24);
    color: white;
    font-size: 12px;
    font-weight: 650;
}
.empty-state {
    min-height: 430px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--paper);
    box-shadow: var(--shadow);
    text-align: center;
}
.empty-icon,.access-code {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    margin: 0 auto 15px;
    border-radius: 16px;
    background: var(--cream);
    color: var(--saffron-dark);
    font-family: Consolas,monospace;
    font-size: 16px;
    font-weight: 850;
}
.empty-state h2 { margin: 0 0 7px; font-size: 23px; }
.empty-state p { margin: 0 0 20px; color: var(--muted); font-size: 13px; }

/* Admin */
.admin-badge { display: inline-flex; align-items: center; gap: 9px; min-height: 39px; padding: 0 13px; border: 1px solid #cce4dc; border-radius: 999px; background: var(--teal-soft); color: var(--teal); font-size: 11px; font-weight: 750; }
.admin-grid { display: grid; grid-template-columns: 330px minmax(0,1fr); align-items: start; gap: 18px; }
.admin-panel { border: 1px solid var(--line); border-radius: 14px; background: var(--paper); box-shadow: 0 12px 36px rgba(27,45,40,.055); }
.date-panel { position: sticky; top: 16px; overflow: hidden; }
.panel-heading,.bookings-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 19px; border-bottom: 1px solid #e9eeeb; }
.panel-heading h2,.bookings-toolbar h2 { margin: 3px 0 0; font-size: 17px; letter-spacing: -.025em; }
.count-badge { min-width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: var(--canvas); color: var(--muted); font-size: 11px; font-weight: 750; }
.add-date-form { display: grid; gap: 11px; padding: 16px 18px; border-bottom: 1px solid var(--line); background: var(--surface-alt); }
.schedule-date-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.field-help { color: var(--muted); font-size: 9px; line-height: 1.45; }
.add-date-form .primary-button,.add-user-form .primary-button { width: 100%; }
.date-list { max-height: calc(100vh - 415px); min-height: 105px; overflow: auto; }
.date-row { border-bottom: 1px solid var(--line); background: var(--paper); }
.date-row.is-selected { box-shadow: inset 3px 0 0 var(--saffron); background: var(--gold-soft); }
.date-main { width: 100%; display: grid; justify-items: start; gap: 4px; padding: 13px 17px 9px; border: 0; background: transparent; color: var(--ink); cursor: pointer; text-align: left; }
.date-main strong { font-size: 13px; }
.date-main small { color: var(--muted); font-size: 10px; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.status-pill i { width: 5px; height: 5px; box-shadow: none; }
.status-pill--closed i { background: #9aa5a1; }
.date-actions { display: flex; gap: 15px; padding: 0 17px 11px; }
.date-actions button,.danger-link,.row-menu,.row-edit,.user-actions button { padding: 0; border: 0; background: transparent; color: var(--teal); cursor: pointer; font-size: 9px; font-weight: 720; }
.date-actions .danger-link,.row-menu,.user-actions .danger-link { color: var(--danger); }
.admin-content { min-width: 0; display: grid; gap: 18px; }
.metric-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.metric-grid article {
    position: relative;
    min-height: 104px;
    display: grid;
    align-content: center;
    gap: 7px;
    padding: 18px 19px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--paper);
    overflow: hidden;
}
.metric-grid article > span { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.metric-grid strong { font-size: 27px; letter-spacing: -.04em; }
.metric-grid strong small { margin-left: 4px; color: #98a39f; font-size: 11px; font-weight: 600; }
.metric-grid article > i { position: absolute; bottom: 0; left: 0; height: 3px; max-width: 100%; background: linear-gradient(90deg,var(--gold),var(--pink)); }
.metric-grid article:nth-child(2) > i { background: var(--gold); }
.metric-grid article:nth-child(3) > i { background: var(--rose); }
.booking-rules-panel { overflow: hidden; }
.settings-badge { padding: 6px 9px; border: 1px solid var(--pink-border); border-radius: 999px; background: var(--pink-soft); color: var(--pink-dark); font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.age-rule-form { display: grid; grid-template-columns: 180px minmax(0,1fr) auto; align-items: end; gap: 18px; padding: 19px; }
.age-rule-form label { display: grid; gap: 7px; }
.age-rule-form label > span { color: var(--muted); font-size: 9px; font-weight: 750; }
.age-rule-form input { width: 100%; height: 43px; padding: 0 12px; font-size: 14px; }
.age-rule-copy { display: grid; align-self: center; gap: 4px; }
.age-rule-copy strong { font-size: 12px; }
.age-rule-copy small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.age-rule-form .form-error { grid-column: 1 / -1; }
.whatsapp-template-form {
    display: grid;
    grid-template-columns: minmax(0,1.45fr) minmax(250px,.75fr);
    gap: 15px 18px;
    padding: 19px;
    border-top: 1px solid var(--line);
}
.whatsapp-template-editor { display: grid; gap: 8px; }
.whatsapp-template-editor label { display: grid; gap: 7px; }
.whatsapp-template-editor label > span,.whatsapp-template-preview > span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 750;
}
.whatsapp-template-editor textarea {
    width: 100%;
    min-height: 164px;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--paper);
    color: var(--ink);
    resize: vertical;
    font-size: 12px;
    line-height: 1.5;
}
.whatsapp-template-editor > small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.template-placeholders { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.template-placeholders > span { margin-right: 3px; color: var(--muted); font-size: 8px; font-weight: 750; text-transform: uppercase; }
.template-placeholders code { padding: 4px 6px; border: 1px solid var(--gold-border); border-radius: 6px; background: var(--gold-soft); color: var(--gold-dark); font-size: 9px; }
.whatsapp-template-preview { min-width: 0; display: grid; align-content: start; gap: 7px; }
.whatsapp-template-preview p { min-height: 164px; margin: 0; padding: 12px; border: 1px solid var(--pink-border); border-radius: 10px; background: var(--pink-soft); color: var(--ink); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.template-save-row { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.template-save-row > span { color: var(--muted); font-size: 9px; }
.whatsapp-template-form > .form-error { grid-column: 1 / -1; }
.bookings-panel { min-width: 0; overflow: hidden; }
.toolbar-actions { display: flex; align-items: center; gap: 9px; }
.toolbar-actions input { width: min(270px,28vw); height: 38px; padding: 0 11px; font-size: 11px; }
.toolbar-actions .secondary-button { min-height: 38px; }
.admin-error { margin: 12px 14px 0; }
.table-wrap { min-height: 340px; overflow-x: auto; }
table { width: 100%; min-width: 950px; border-collapse: collapse; font-size: 11px; }
th { padding: 10px 12px; border-bottom: 1px solid var(--line); background: var(--surface-alt); color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
td { padding: 12px; border-bottom: 1px solid var(--line); color: var(--ink); vertical-align: middle; }
tbody tr:hover { background: var(--surface-hover); }
td strong,td small,td > span { display: block; }
td strong { color: var(--ink); font-size: 11px; }
td small { margin-top: 3px; color: var(--muted); font-size: 8.5px; line-height: 1.45; }
td a { color: var(--teal); font-weight: 700; }
.table-seat { width: 35px; height: 28px; display: grid; place-items: center; border: 1px solid; border-radius: 6px; font-family: Consolas,monospace; font-size: 9px; font-weight: 800; }
.table-seat--chair { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.table-seat--floor { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.gender-tag { width: max-content; padding: 4px 7px; border-radius: 99px; font-size: 8px; font-weight: 750; }
.gender-tag--male { background: var(--gold-soft); color: var(--gold-dark); }
.gender-tag--female { background: var(--pink-soft); color: var(--pink-dark); }
.row-actions { display: flex; align-items: center; gap: 12px; }
.row-edit { color: var(--available-border); }
.table-empty,.small-empty { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: var(--muted); font-size: 11px; text-align: center; }
.small-empty { min-height: 120px; padding: 20px; }
.table-empty strong,.small-empty strong { color: var(--ink); font-size: 13px; }
.users-panel { overflow: hidden; }
.users-layout { display: grid; grid-template-columns: 280px 1fr; min-height: 210px; }
.add-user-form { display: grid; align-content: start; gap: 11px; padding: 18px; border-right: 1px solid var(--line); background: var(--surface-alt); }
.add-user-form h3 { margin: 0 0 3px; font-size: 14px; }
.user-list { max-height: 360px; overflow: auto; }
.user-row { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 11px; min-height: 67px; padding: 10px 16px; border-bottom: 1px solid #edf1ef; }
.user-row.is-inactive { opacity: .52; }
.user-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: var(--teal-soft); color: var(--teal); font-weight: 800; }
.user-identity { min-width: 0; display: grid; gap: 3px; }
.user-identity strong { font-size: 12px; }
.user-identity small { color: var(--muted); font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 9px 13px; }
.user-section-select { min-width: 112px; height: 31px; padding: 0 28px 0 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink); font-size: 10px; font-weight: 750; }
.user-actions .user-delete-action { padding: 4px 7px; border: 1px solid rgba(185,56,69,.35); border-radius: 7px; }
.user-actions .user-delete-action:hover { border-color: var(--danger); background: rgba(185,56,69,.08); }

.seat-layout-panel { min-width: 0; overflow: hidden; }
.seat-designer { display: grid; grid-template-columns: 285px minmax(0,1fr); min-height: 560px; }
.seat-designer-sidebar { border-right: 1px solid var(--line); background: var(--surface-alt); }
.seat-designer-form { display: grid; align-content: start; gap: 11px; padding: 17px 18px; border-bottom: 1px solid var(--line); }
.seat-designer-form h3 { margin: 3px 0 0; font-size: 14px; }
.seat-designer-form label { display: grid; gap: 6px; }
.seat-designer-form label > span { color: var(--muted); font-size: 10px; font-weight: 720; }
.seat-designer-form input,.seat-designer-form select { width: 100%; height: 39px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--ink); }
.seat-designer-form small { color: var(--muted); font-size: 8.5px; line-height: 1.5; }
.seat-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.seat-designer-selection { display: grid; gap: 5px; padding: 19px 18px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.seat-designer-selection strong { color: var(--ink); font-size: 12px; }
.seat-edit-form { border-bottom: 0; }
.seat-position-readout { padding: 8px 10px; border: 1px dashed var(--gold-border); border-radius: 8px; background: var(--gold-soft); color: var(--gold-dark); font-family: "Cascadia Mono",Consolas,monospace; font-size: 9px; font-weight: 750; }
.seat-designer-workspace { min-width: 0; display: grid; grid-template-rows: auto 1fr auto; background: var(--paper); }
.seat-designer-instructions { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.seat-designer-instructions > div:first-child { display: grid; gap: 4px; }
.seat-designer-instructions strong { font-size: 11px; }
.seat-designer-instructions span { color: var(--muted); font-size: 8.5px; }
.layout-kind-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px 10px; }
.layout-kind-legend span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.layout-kind-legend b { width: 17px; height: 17px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 4px; background: var(--surface-alt); color: var(--ink); font-family: Consolas,monospace; font-size: 7px; }
.layout-key { width: 10px; height: 10px; border: 1px solid; border-radius: 3px; }
.layout-key--male { border-color: var(--gold-border); background: var(--gold-soft); }
.layout-key--female { border-color: var(--pink-border); background: var(--pink-soft); }
.seat-layout-grid-scroll { min-width: 0; overflow: auto; padding: 14px; background: var(--surface-alt); scrollbar-color: var(--gold-border) transparent; }
.seat-layout-grid {
    --layout-columns: 35;
    width: 100%;
    min-width: 680px;
    box-sizing: border-box;
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(12px,.58fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(21px,1fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(12px,.58fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr) minmax(6px,.28fr) minmax(21px,1fr) minmax(21px,1fr);
    grid-template-rows: repeat(12,10px) 18px repeat(24,9px) 18px;
    grid-auto-rows: 9px;
    column-gap: 2px;
    row-gap: 2px;
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: linear-gradient(to bottom,var(--gold-soft) 0 142px,var(--paper) 142px 164px,var(--pink-soft) 164px 403px,var(--paper) 403px);
    box-shadow: 0 10px 30px rgba(27,45,40,.07);
}
.layout-grid-cell { z-index: 1; width: 100%; height: 100%; min-height: 0; padding: 0; border: 1px dashed var(--line); border-radius: 4px; background: rgba(255,255,255,.16); cursor: crosshair; }
.layout-grid-cell:hover { border-color: var(--available-border); background: var(--available-bg); }
.layout-grid-cell--extension { background: var(--surface-alt); }
.layout-grid-aisle { z-index: 1; display: flex; align-items: center; justify-content: center; border-block: 1px solid var(--gold-border); background: repeating-linear-gradient(135deg,var(--paper),var(--paper) 7px,var(--gold-soft) 7px,var(--gold-soft) 14px); pointer-events: none; }
.layout-grid-aisle span { padding: 2px 8px; border-radius: 999px; background: var(--paper); color: var(--muted); font-size: 6.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.layout-grid-extension-label { z-index: 1; display: flex; align-items: center; justify-content: center; border-block: 1px solid var(--line); background: var(--surface-alt); color: var(--muted); font-size: 6.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.layout-seat { z-index: 2; width: 100%; height: 100%; min-height: 0; display: grid; place-items: center; padding: 0 2px; border: 1.5px solid; border-radius: 5px; cursor: grab; font-family: "Cascadia Mono",Consolas,monospace; font-size: 7.5px; font-weight: 850; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layout-seat:active { cursor: grabbing; }
.layout-seat--male { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
.layout-seat--female { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
.layout-seat--floor { border-radius: 4px; }
.layout-seat--chair { border-radius: 8px 8px 4px 4px; }
.layout-seat.is-selected { border-color: var(--teal); background: var(--teal-soft); color: var(--teal); box-shadow: 0 0 0 3px rgba(40,116,94,.18); transform: scale(1.06); }
.layout-seat.is-dragging { opacity: .45; }
.seat-layout-status { min-height: 38px; display: flex; align-items: center; padding: 8px 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 8.5px; }

@media (max-width: 1500px) {
    .seat-designer { grid-template-columns: 1fr; }
    .seat-designer-sidebar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-right: 0; border-bottom: 1px solid var(--line); }
    .seat-designer-form { border-bottom: 0; border-right: 1px solid var(--line); }
    .seat-edit-form { border-right: 0; }
}

@media (max-width: 1100px) {
    .admin-grid { grid-template-columns: 1fr; }
    .date-panel { position: static; }
    .date-list { max-height: 315px; }
}

.reservations-panel { overflow: hidden; }
.reservation-layout { display: grid; grid-template-columns: minmax(0,2fr) minmax(280px,1fr); min-height: 150px; }
.reserve-seat-form { display: grid; align-content: start; gap: 11px; padding: 17px 18px; border-right: 1px solid var(--line); background: var(--surface-alt); }
.reserve-seat-form label { display: grid; gap: 6px; }
.reserve-seat-form label > span { color: var(--muted); font-size: 11px; font-weight: 720; letter-spacing: .025em; }
.reserve-seat-form input,.reserve-seat-form select { width: 100%; height: 41px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); }
.reservation-controls { display: grid; grid-template-columns: minmax(230px,1.15fr) minmax(180px,.85fr); gap: 10px; }
.reservation-seat-picker { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--paper); }
.reservation-seat-picker legend { padding: 0 7px; color: var(--ink); font-size: 11px; font-weight: 800; }
.reservation-picker-legend { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 11px; color: var(--muted); font-size: 8px; font-weight: 700; }
.reservation-picker-legend span { display: inline-flex; align-items: center; gap: 4px; }
.reservation-key { width: 10px; height: 10px; border: 1px solid; border-radius: 3px; }
.reservation-key--available { border-color: var(--available-border); background: var(--available-bg); }
.reservation-key--selected { border-color: var(--pink); background: linear-gradient(135deg,var(--gold),var(--pink)); }
.reservation-key--held { border-color: var(--held-border); background: var(--held-bg); }
.reservation-key--reserved { border-color: var(--reserved-border); background: var(--reserved-bg); }
.reservation-key--booked { border-color: var(--booked-border); background: var(--booked-bg); }
.reservation-picker-scroll { overflow-x: auto; padding-bottom: 3px; scrollbar-color: var(--gold-border) transparent; }
.reservation-picker-groups { min-width: 650px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.reservation-picker-group { min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-alt); }
.reservation-picker-group > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.reservation-picker-group > div:first-child strong { font-size: 10px; }
.reservation-picker-group > div:first-child small { color: var(--muted); font-size: 8px; }
.reservation-picker-grid { display: grid; grid-template-columns: repeat(12,minmax(25px,1fr)); gap: 3px; }
.reservation-pick-seat { min-width: 25px; height: 25px; display: grid; place-items: center; padding: 0; border: 1.5px solid; border-radius: 4px; cursor: pointer; font-family: "Cascadia Mono",Consolas,monospace; font-size: 7.5px; font-weight: 850; }
.reservation-pick-seat--available { border-color: var(--available-border); background: var(--available-bg); color: var(--available-text); }
.reservation-pick-seat--selected { border-color: var(--pink); background: linear-gradient(135deg,var(--gold),var(--pink)); color: var(--on-accent); box-shadow: 0 0 0 2px var(--pink-ring); }
.reservation-pick-seat--held { border-color: var(--held-border); background: var(--held-bg); color: var(--held-text); }
.reservation-pick-seat--reserved { border-color: var(--reserved-border); background: var(--reserved-bg); color: var(--reserved-text); }
.reservation-pick-seat--booked { border-color: var(--booked-border); background: var(--booked-bg); color: var(--booked-text); }
.reservation-pick-seat--available:hover { z-index: 1; border-color: var(--pink); transform: translateY(-1px) scale(1.08); }
.reservation-pick-seat:disabled { opacity: 1; }
.selected-reservation-seats { min-height: 44px; display: grid; gap: 3px; margin-top: 10px; padding: 8px 10px; border: 1px dashed var(--gold-border); border-radius: 8px; background: var(--gold-soft); }
.selected-reservation-seats strong { color: var(--gold-dark); font-size: 10px; }
.selected-reservation-seats span { color: var(--gold-dark); font-family: "Cascadia Mono",Consolas,monospace; font-size: 8px; line-height: 1.45; overflow-wrap: anywhere; }
.reservation-picker-empty { min-height: 120px; }
.reserve-seat-form .primary-button { width: 100%; }
.reserve-seat-form > small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.reservation-list-column { min-width: 0; background: var(--paper); }
.reservation-list-toolbar { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 13px; border-bottom: 1px solid var(--line); background: var(--surface-alt); }
.reservation-select-all { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); cursor: pointer; font-size: 9px; font-weight: 750; }
.reservation-select-all input,.reservation-selector input { width: 15px; height: 15px; accent-color: var(--pink); cursor: pointer; }
.reservation-bulk-release { min-height: 32px; padding-inline: 10px; font-size: 9px; }
.reservation-list { max-height: 640px; overflow: auto; }
.reservation-row { min-height: 67px; display: grid; grid-template-columns: 20px 42px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 10px 13px; border-bottom: 1px solid var(--line); }
.reservation-selector { display: grid; place-items: center; }
.reservation-seat { width: 38px; height: 32px; display: grid; place-items: center; border: 1px solid var(--pink-border); border-radius: 7px; background: repeating-linear-gradient(135deg,var(--pink-soft),var(--pink-soft) 4px,var(--gold-soft) 4px,var(--gold-soft) 8px); color: var(--pink-dark); font-family: Consolas,monospace; font-size: 9px; font-weight: 850; }
.reservation-details { min-width: 0; display: grid; gap: 4px; }
.reservation-details strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.reservation-details small { color: var(--muted); font-size: 8.5px; line-height: 1.4; }
.reservation-release { padding: 6px 8px; border: 0; border-radius: 7px; background: transparent; color: var(--danger); cursor: pointer; font-size: 9px; font-weight: 760; }
.reservation-release:hover { background: var(--pink-soft); }
.reservation-empty { min-height: 150px; }

@media (max-width: 1500px) {
    .reservation-layout { grid-template-columns: 1fr; }
    .reserve-seat-form { border-right: 0; border-bottom: 1px solid var(--line); }
}

/* Authentication */
.auth-page {
    display: grid;
    place-items: center;
    padding: 28px;
    background: var(--body-background);
}
.auth-shell { width: min(440px,100%); }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: 11px; margin-bottom: 18px; }
.auth-brand > div { display: grid; }
.auth-brand strong { font-size: 17px; }
.auth-brand small { color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.auth-card { padding: 30px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: var(--shadow); }
.auth-card h1 { margin: 7px 0 8px; font-size: 28px; line-height: 1.1; letter-spacing: -.035em; }
.auth-card > p { margin: 0 0 21px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.auth-form { display: grid; gap: 14px; }
.auth-submit { width: 100%; margin-top: 3px; }
.local-badge,.setup-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 19px; color: var(--muted); font-size: 9px; }
.local-badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--pink); box-shadow: 0 0 0 4px var(--pink-ring); }
.setup-note { flex-direction: column; gap: 3px; padding: 11px; border-radius: 9px; background: var(--canvas); }
.setup-note strong { color: var(--ink); font-size: 10px; }
.center-card { text-align: center; }

/* Gold and pink light/dark theme */
.theme-toggle {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--paper);
    box-shadow: 0 7px 20px rgba(98,45,66,.08);
    color: var(--ink);
    cursor: pointer;
    transition: background-color .18s ease,border-color .18s ease,transform .18s ease;
}
.theme-toggle:hover { border-color: var(--pink); background: var(--pink-soft); transform: translateY(-1px); }
.theme-toggle__icon { position: relative; width: 19px; height: 19px; display: grid; place-items: center; font-size: 16px; line-height: 1; }
.theme-toggle__sun,.theme-toggle__moon { position: absolute; transition: opacity .18s ease,transform .18s ease; }
.theme-toggle__sun { color: var(--gold); opacity: 1; transform: scale(1) rotate(0); }
.theme-toggle__moon { color: var(--pink); opacity: 0; transform: scale(.65) rotate(-22deg); }
html[data-theme="dark"] .theme-toggle__sun { opacity: 0; transform: scale(.65) rotate(22deg); }
html[data-theme="dark"] .theme-toggle__moon { opacity: 1; transform: scale(1) rotate(0); }
.theme-toggle--floating { position: fixed; z-index: 80; top: 18px; right: 18px; }

html[data-theme="dark"] .booking-tools,
html[data-theme="dark"] .user-chip { background: var(--paper-glass); }
html[data-theme="dark"] .legend-dot--booked { border-color: var(--booked-border); background: var(--booked-bg); }
html[data-theme="dark"] .seat-map-scroll { scrollbar-color: #735160 transparent; }
html[data-theme="dark"] .map-note,
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .bookings-toolbar,
html[data-theme="dark"] .add-date-form,
html[data-theme="dark"] .date-row,
html[data-theme="dark"] th,
html[data-theme="dark"] td,
html[data-theme="dark"] .user-row,
html[data-theme="dark"] .add-user-form { border-color: var(--line); }
html[data-theme="dark"] .central-aisle,
html[data-theme="dark"] .sync-note,
html[data-theme="dark"] .booking-form small,
html[data-theme="dark"] .metric-grid strong small,
html[data-theme="dark"] th,
html[data-theme="dark"] td,
html[data-theme="dark"] .date-control label,
html[data-theme="dark"] .seat-search label,
html[data-theme="dark"] .booking-form label > span,
html[data-theme="dark"] .add-date-form label > span,
html[data-theme="dark"] .auth-form label > span,
html[data-theme="dark"] .add-user-form label > span { color: var(--muted); }
html[data-theme="dark"] .seat--booked { border-color: var(--booked-border); background: var(--booked-bg); color: var(--booked-text); }
html[data-theme="dark"] .seat--available:hover,
html[data-theme="dark"] .seat--mine:hover { box-shadow: 0 5px 16px rgba(0,0,0,.34); }
html[data-theme="dark"] .central-aisle::before,
html[data-theme="dark"] .central-aisle::after { opacity: .7; }
html[data-theme="dark"] .dialog-backdrop { background: rgba(12,5,9,.78); }
html[data-theme="dark"] .hold-message,
html[data-theme="dark"] .admin-badge { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
html[data-theme="dark"] .gender-value--male { border-color: var(--gold-border); background: var(--gold-soft); color: var(--gold-dark); }
html[data-theme="dark"] .gender-value--female { border-color: var(--pink-border); background: var(--pink-soft); color: var(--pink-dark); }
html[data-theme="dark"] .form-error { border-color: #7f3d49; background: #3c1b24; color: #ffafb4; }
html[data-theme="dark"] .toast { background: linear-gradient(135deg,var(--gold),var(--pink)); color: var(--on-accent); }
html[data-theme="dark"] .add-date-form,
html[data-theme="dark"] .add-user-form,
html[data-theme="dark"] th { background: var(--surface-alt); }
html[data-theme="dark"] .date-row { background: var(--paper); }
html[data-theme="dark"] .date-row.is-selected { background: var(--gold-soft); }
html[data-theme="dark"] tbody tr:hover { background: var(--surface-hover); }
html[data-theme="dark"] td { color: var(--ink); }
html[data-theme="dark"] .table-seat--chair { border-color: var(--pink); background: var(--pink-soft); color: var(--pink-dark); }
html[data-theme="dark"] .table-seat--floor { border-color: var(--gold); background: var(--gold-soft); color: var(--gold-dark); }

body,.seat-map-card,.seat-band,.booking-dialog,.admin-panel,.metric-grid article,.auth-card,
input,select,.secondary-button,.theme-toggle,.user-chip { transition: background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease; }

/* Single-screen desktop booking view */
@media (min-width: 821px) {
    .booking-shell { height: auto; min-height: 100vh; padding: 0 24px 32px; overflow: visible; }
    .booking-shell .topbar { min-height: 54px; }
    .booking-shell .brand-mark { width: 30px; height: 30px; }
    .booking-shell .brand-mark--custom { width: 40px; height: 40px; }
    .booking-shell .brand strong { font-size: 14px; }
    .booking-shell .brand small { font-size: 9px; }
    .booking-shell .nav-link { min-height: 32px; font-size: 11px; }
    .booking-shell .user-chip { height: 32px; font-size: 10px; }
    .booking-shell .user-chip > span { width: 22px; height: 22px; flex-basis: 22px; font-size: 10px; }
    .booking-heading { align-items: center; padding: 12px 2px 10px; }
    .booking-heading h1 { margin: 2px 0 4px; font-size: clamp(32px,3vw,40px); }
    .booking-heading p { font-size: 12px; line-height: 1.35; }
    .booking-heading .eyebrow { font-size: 8px; }
    .booking-heading .date-control { width: min(350px,100%); gap: 3px; }
    .booking-heading .date-control--important { padding: 7px 9px 6px; border-radius: 10px; }
    .booking-heading .date-control--important label { font-size: 9px; }
    .booking-heading .date-control--important select { height: 36px; padding-inline: 11px 34px; border-width: 1px; font-size: 11px; }
    .booking-heading .date-control--important > small { font-size: 8px; }
    .booking-tools { min-height: 56px; gap: 20px; padding: 6px 14px; border-radius: 11px 11px 0 0; }
    .seat-search { gap: 3px; }
    .seat-search label { font-size: 8px; }
    .seat-search input,.seat-search button { height: 30px; font-size: 9px; }
    .live-summary { gap: 22px; }
    .live-summary span { font-size: 7.5px; }
    .live-summary strong { font-size: 17px; }
    .legend { gap: 5px; font-size: 8px; }
    .legend span { gap: 4px; padding: 3px 5px; border-radius: 6px; }
    .legend-dot { width: 11px; height: 11px; }
    .map-note { min-height: 27px; gap: 18px; padding-inline: 14px; font-size: 8px; }
    .live-dot i { width: 6px; height: 6px; }
    .seat-map { padding: 8px 12px 8px; }
    .public-layout-header { min-height: 34px; margin-bottom: 6px; padding: 5px 9px; border-radius: 8px; }
    .public-layout-header strong { font-size: 9px; }
    .public-layout-header span { font-size: 7px; }
    .public-layout-sections .public-section { padding: 4px 6px; border-radius: 6px; }
    .public-seat-layout {
        grid-template-rows: repeat(12,11px) 26px repeat(24,12px) 22px;
        grid-auto-rows: 11px;
        row-gap: 2px;
        padding: 16px;
        border-radius: 12px;
        background: linear-gradient(to bottom,var(--gold-soft) 0 29%,var(--paper) 29% 35%,var(--pink-soft) 35% 96%,var(--paper) 96%);
    }
    .public-seat-layout .seat { border-radius: 6px; font-size: 10px; }
    .public-seat-layout .seat--chair { border-radius: 6px 6px 4px 4px; }
    .public-layout-aisle span,.public-layout-extension-label { font-size: 6px; }
    .sync-note { display: none; }
}

@media (max-width: 1050px) {
    .booking-tools { grid-template-columns: minmax(170px,230px) 1fr; }
    .legend { grid-column: 1 / -1; justify-content: center; }
    .admin-grid { grid-template-columns: 1fr; }
    .date-panel { position: static; }
    .date-list { max-height: 315px; }
    .bookings-toolbar { align-items: start; flex-direction: column; }
    .toolbar-actions,.toolbar-actions input { width: 100%; }
    .users-layout { grid-template-columns: 240px 1fr; }
    .seat-designer { grid-template-columns: 1fr; }
    .seat-designer-sidebar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-right: 0; border-bottom: 1px solid var(--line); }
    .seat-designer-form { border-bottom: 0; border-right: 1px solid var(--line); }
    .seat-edit-form { border-right: 0; }
    .reservation-layout { grid-template-columns: 1fr; }
    .reserve-seat-form { border-right: 0; border-bottom: 1px solid var(--line); }
}
@media (max-width: 820px) {
    .booking-shell,.admin-shell { padding: 0 16px 28px; }
    .topbar { min-height: 68px; }
    .user-chip,.nav-link--muted { display: none; }
    .booking-heading,.admin-heading { align-items: stretch; flex-direction: column; padding: 25px 0 20px; }
    .booking-heading h1,.admin-heading h1 { font-size: 36px; }
    .date-control { width: 100%; }
    .booking-tools { grid-template-columns: 1fr; gap: 14px; }
    .live-summary { justify-content: space-around; }
    .admin-grid { grid-template-columns: 1fr; }
    .date-panel { position: static; }
    .date-list { max-height: 315px; }
    .users-layout { grid-template-columns: 1fr; }
    .add-user-form { border-right: 0; border-bottom: 1px solid #e9eeeb; }
    .reservation-layout { grid-template-columns: 1fr; }
    .reserve-seat-form { border-right: 0; border-bottom: 1px solid var(--line); }
    .reservation-picker-grid { grid-template-columns: repeat(12,minmax(22px,1fr)); }
    .reservation-pick-seat { min-width: 0; }
    .age-rule-form { grid-template-columns: 150px minmax(0,1fr); }
    .age-rule-form .primary-button { grid-column: 1 / -1; }
    .whatsapp-template-form { grid-template-columns: 1fr; }
    .template-save-row,.whatsapp-template-form > .form-error { grid-column: auto; }
    .seat-map-card { overflow: visible; }
    .seat-map-scroll { overscroll-behavior-y: auto; touch-action: pan-x pan-y; }
}
@media (max-width: 560px) {
    .booking-shell,.admin-shell { padding-inline: 11px; }
    .brand small { display: none; }
    .booking-heading p,.admin-heading p { font-size: 13px; }
    .map-note > span:nth-child(1),.map-note > span:nth-child(2) { display: none; }
    .dialog-backdrop { align-items: end; padding: 0; }
    .booking-dialog { max-height: 94vh; max-height: 96dvh; border-radius: 18px 18px 0 0; overflow-y: scroll; }
    .dialog-header { padding: 20px 18px 14px; }
    .hold-message { margin-inline: 18px; }
    .booking-form { grid-template-columns: 1fr; padding: 17px 18px 20px; }
    .multi-seat-selection { align-items: stretch; flex-direction: column; }
    .multi-seat-selection__actions { justify-content: stretch; }
    .multi-seat-selection__actions button { flex: 1; }
    .multi-devotee-fields__grid { grid-template-columns: 1fr; }
    .destination-panel__heading { align-items: stretch; flex-direction: column; }
    .destination-selection { width: 100%; text-align: left; }
    .full-field { grid-column: auto; }
    .dialog-actions { flex-direction: column-reverse; }
    .dialog-actions button { width: 100%; }
    .dialog-actions--split { align-items: stretch; }
    .dialog-actions--split > span { display: grid; gap: 8px; }
    .whatsapp-input-wrap input { padding-right: 12px; }
    .whatsapp-check { position: static; width: max-content; margin-top: 7px; }
    .whatsapp-verification__actions { display: grid; grid-template-columns: 1fr; }
    .success-actions { grid-template-columns: 1fr; }
    .metric-grid { gap: 7px; }
    .metric-grid article { min-height: 87px; padding: 13px; }
    .metric-grid article > span { font-size: 8px; }
    .metric-grid strong { font-size: 21px; }
    .metric-grid strong small { display: block; margin: 2px 0 0; font-size: 8px; }
    .age-rule-form { grid-template-columns: 1fr; gap: 13px; padding: 17px; }
    .age-rule-form .primary-button { grid-column: auto; width: 100%; }
    .template-save-row { align-items: stretch; flex-direction: column; }
    .template-save-row .primary-button { width: 100%; }
    .toolbar-actions { align-items: stretch; flex-direction: column; }
    .reservation-controls { grid-template-columns: 1fr; }
    .reservation-seat-picker { padding-inline: 9px; }
    .reservation-picker-groups { min-width: 0; grid-template-columns: 1fr; }
    .reservation-picker-grid { grid-template-columns: repeat(8,minmax(30px,1fr)); }
    .reservation-list-toolbar { align-items: stretch; flex-direction: column; }
    .reservation-bulk-release { width: 100%; }
    .reservation-row { grid-template-columns: 20px 42px minmax(0,1fr); }
    .reservation-release { grid-column: 2 / -1; justify-self: start; }
    .seat-designer-sidebar { grid-template-columns: 1fr; }
    .seat-designer-form { border-right: 0; border-bottom: 1px solid var(--line); }
    .seat-designer-instructions { align-items: flex-start; flex-direction: column; }
    .layout-kind-legend { justify-content: flex-start; }
    .user-row { grid-template-columns: 34px 1fr; }
    .user-actions { grid-column: 2; }
    .auth-page { padding: 16px; }
    .auth-card { padding: 24px 20px; }
    .toast { right: 12px; bottom: 12px; max-width: calc(100vw - 24px); }
}
@media (max-width: 360px) {
    .reservation-picker-grid { grid-template-columns: repeat(6,minmax(30px,1fr)); }
}
@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}