:root {
  --bg: #0b1017;
  --panel: #101721;
  --panel-2: #141d29;
  --panel-3: #182331;
  --line: #253142;
  --line-soft: #1b2634;
  --text: #e8edf3;
  --muted: #8e9bac;
  --accent: #4c8dff;
  --accent-soft: rgba(76,141,255,.14);
  --danger: #f0656b;
  --warning: #e4a84d;
  --success: #46b981;
  --info: #54a6d8;
  --row-h: 48px;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 14px; overflow: hidden; }
button, input, select { font-size: 14px; }
.app-shell { height: 100vh; display: grid; grid-template-columns: 220px minmax(0,1fr); background: var(--bg); }
.app-sidebar { background: #0d141d; border-right: 1px solid var(--line); padding: 14px 10px 12px; display:flex; flex-direction:column; min-width:0; }
.brand-row { height: 48px; display:flex; align-items:center; gap:10px; padding:0 8px 10px; border-bottom:1px solid var(--line-soft); }
.brand-mark { width:30px; height:30px; border-radius:8px; display:grid; place-items:center; background:linear-gradient(145deg,#5b9cff,#2f6fde); color:white; font-weight:800; }
.brand-copy { display:flex; flex-direction:column; line-height:1.15; }
.brand-copy strong { font-size:14px; }
.brand-copy span { color:var(--muted); font-size:11px; margin-top:3px; }
.side-nav { display:flex; flex-direction:column; gap:3px; padding:12px 0; }
.nav-item { width:100%; border:0; background:transparent; color:#b7c1ce; height:40px; padding:0 10px; border-radius:7px; display:grid; grid-template-columns:26px 1fr auto; align-items:center; text-align:left; gap:4px; }
.nav-item:hover { background:#151f2b; color:white; }
.nav-item.active { background:var(--accent-soft); color:#dbe8ff; box-shadow:inset 2px 0 0 var(--accent); }
.nav-icon { width:22px; height:22px; display:grid; place-items:center; font-weight:700; color:#8da1b8; }
.nav-item.active .nav-icon { color:#8db7ff; }
.nav-count { min-width:23px; height:20px; padding:0 6px; border-radius:10px; background:#1e2a38; color:#aeb9c7; display:grid; place-items:center; font-size:11px; }
.nav-count.danger { background:rgba(240,101,107,.14); color:#ff969a; }
.sidebar-label { color:#657487; font-size:10px; font-weight:700; letter-spacing:.1em; padding:8px 10px 0; }
.side-nav.muted { padding-top:7px; }
.sidebar-footer { margin-top:auto; border-top:1px solid var(--line-soft); padding:12px 8px 2px; display:grid; grid-template-columns:12px 1fr; gap:8px; align-items:center; }
.sidebar-footer strong, .sidebar-footer span { display:block; }
.sidebar-footer strong { font-size:12px; font-weight:600; }
.sidebar-footer span { color:var(--muted); font-size:11px; margin-top:2px; }
.sync-dot { width:8px; height:8px; border-radius:50%; background:var(--success); box-shadow:0 0 0 3px rgba(70,185,129,.12); }
.app-main { min-width:0; display:grid; grid-template-rows:58px minmax(0,1fr); }
.topbar { border-bottom:1px solid var(--line); background:#0f1620; display:flex; align-items:center; justify-content:space-between; padding:0 18px; gap:18px; }
.topbar-title { display:flex; flex-direction:column; line-height:1.1; min-width:150px; }
.eyebrow, .panel-kicker { font-size:9px; letter-spacing:.13em; color:#657487; font-weight:700; }
.topbar-title strong { font-size:16px; margin-top:3px; }
.topbar-actions { display:flex; align-items:center; gap:8px; min-width:0; }
.global-search { width:min(470px,43vw); height:34px; border:1px solid var(--line); background:#0b1119; border-radius:7px; display:flex; align-items:center; gap:8px; padding:0 9px; color:var(--muted); }
.global-search input { flex:1; min-width:0; border:0; outline:0; background:transparent; color:var(--text); }
.global-search kbd { background:#1c2735; border:1px solid #2b394a; color:#8491a0; box-shadow:none; font-size:10px; padding:2px 5px; }
.workspace { min-height:0; display:grid; grid-template-columns:272px minmax(0,1fr); }
.event-browser { min-height:0; background:#0e151e; border-right:1px solid var(--line); display:flex; flex-direction:column; }
.panel-heading { height:62px; padding:12px 13px 9px; display:flex; align-items:center; justify-content:space-between; }
.panel-heading h2 { font-size:15px; margin:2px 0 0; }
.icon-button { width:30px; height:30px; border:1px solid var(--line); border-radius:6px; background:#141d28; color:#aab6c4; display:grid; place-items:center; }
.event-search-wrap { padding:0 10px 10px; border-bottom:1px solid var(--line-soft); }
.form-control, .form-select { background-color:#0d141d; border-color:#2a3748; color:#dce4ed; }
.form-control:focus, .form-select:focus { background-color:#0f1823; border-color:#4c8dff; color:white; box-shadow:0 0 0 2px rgba(76,141,255,.12); }
.event-groups { overflow:auto; padding:7px 6px 14px; }
.event-group { border-bottom:1px solid var(--line-soft); padding-bottom:5px; margin-bottom:5px; }
.event-group-title { width:100%; border:0; background:transparent; color:#dce4ed; display:grid; grid-template-columns:18px 1fr auto; align-items:center; gap:5px; padding:9px 7px; border-radius:6px; text-align:left; }
.event-group-title:hover, .event-group-title.selected-title { background:#141e2a; }
.caret { color:#6f7f91; }
.event-title-copy { min-width:0; }
.event-title-copy strong { display:block; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-title-copy small { display:block; color:var(--muted); font-size:11px; margin-top:3px; }
.status-pill { font-size:10px; padding:3px 6px; border-radius:9px; white-space:nowrap; }
.warning-soft { background:rgba(228,168,77,.14); color:#f0c06f; }
.success-soft { background:rgba(70,185,129,.12); color:#78d2a6; }
.performance-list { margin:2px 0 3px 23px; border-left:1px solid #273443; padding-left:5px; }
.performance-item { width:100%; border:0; background:transparent; color:#aeb9c7; min-height:42px; padding:6px 8px; border-radius:5px; display:flex; align-items:center; justify-content:space-between; gap:8px; text-align:left; }
.performance-item:hover { background:#131d28; }
.performance-item.active { background:#17263a; color:#e8f0fb; box-shadow:inset 2px 0 0 var(--accent); }
.performance-item strong { display:block; font-size:12px; font-weight:600; }
.performance-item small { display:block; font-size:10px; color:#728094; margin-top:2px; }
.mini-status { background:rgba(228,168,77,.13); color:#f1bd66; min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; font-size:10px; }
.dot-status { font-size:10px; white-space:nowrap; }
.dot-status::before { content:""; width:6px; height:6px; border-radius:50%; display:inline-block; margin-right:4px; vertical-align:1px; }
.dot-status.dealing { color:#8ab2ff; }.dot-status.dealing::before { background:var(--accent); }
.dot-status.alert { color:#f0bd6c; }.dot-status.alert::before { background:var(--warning); }
.inventory-panel { min-width:0; min-height:0; display:grid; grid-template-rows:auto auto auto minmax(0,1fr) auto; background:#0b1119; }
.inventory-header { padding:14px 16px 8px; }
.breadcrumb-line { display:flex; align-items:center; gap:7px; color:#6f7e90; font-size:11px; margin-bottom:6px; }
.breadcrumb-line strong { color:#9eabba; }
.page-title-row { display:flex; justify-content:space-between; align-items:flex-end; gap:14px; }
.page-title-row h1 { font-size:21px; margin:0; letter-spacing:-.02em; }
.page-title-row p { margin:3px 0 0; color:var(--muted); font-size:12px; }
.header-actions { display:flex; gap:7px; }
.metric-strip { min-height:66px; margin:0 16px 10px; border:1px solid var(--line); border-radius:7px; background:#101821; display:flex; align-items:stretch; overflow:hidden; }
.metric { min-width:102px; border:0; border-right:1px solid var(--line); background:transparent; color:#a9b5c3; padding:9px 13px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.metric:hover { background:#141e2a; }.metric.active { background:#142136; box-shadow:inset 0 -2px 0 var(--accent); }
.metric span { font-size:11px; color:#7f8c9d; }.metric strong { font-size:20px; line-height:1.1; margin-top:3px; color:#edf2f7; }
.metric.attention { margin-left:auto; min-width:190px; border-right:0; border-left:1px solid #4b3823; background:linear-gradient(90deg,rgba(228,168,77,.07),rgba(228,168,77,.02)); }
.metric.attention strong { color:#f2bd67; }.metric.attention small { color:#9f8b6c; font-size:10px; margin-top:2px; }
.toolbar-row { min-height:46px; margin:0 16px; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.toolbar-left, .toolbar-right { display:flex; align-items:center; gap:7px; min-width:0; }
.segmented { background:#0f1721; border:1px solid var(--line); border-radius:6px; padding:2px; display:flex; }
.segmented button { border:0; background:transparent; color:#8795a7; height:28px; padding:0 10px; border-radius:4px; font-size:12px; }
.segmented button.active { background:#263447; color:#eef3f8; }
.compact-select { width:auto; min-width:150px; height:32px; padding-top:4px; padding-bottom:4px; font-size:12px; }
.selection-info { color:#7f8d9f; font-size:11px; }
.table-shell { min-height:0; margin:8px 16px 0; border:1px solid var(--line); border-radius:7px; overflow:hidden; background:#0f1620; }
#ticketTable { height:100%; min-height:320px; }
.table-legend { height:34px; margin:0 16px; display:flex; align-items:center; gap:14px; color:#7f8d9f; font-size:10px; }
.legend-dot { width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:5px; }.legend-dot.unlisted{background:var(--warning)}.legend-dot.listed{background:var(--info)}.legend-dot.dealing{background:var(--accent)}.legend-dot.keep{background:#a38ad3}.legend-dot.sold{background:var(--success)}
.legend-note { margin-left:auto; }
.detail-drawer { position:fixed; top:0; right:0; height:100vh; width:min(430px,100vw); background:#101821; border-left:1px solid var(--line); transform:translateX(100%); transition:transform .2s ease; z-index:1100; box-shadow:-18px 0 45px rgba(0,0,0,.28); display:flex; flex-direction:column; }
.detail-drawer.open { transform:translateX(0); }
.drawer-head { height:62px; padding:11px 14px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
.drawer-head h3 { font-size:16px; margin:2px 0 0; }.drawer-body { overflow:auto; padding:14px; }
.detail-section { border-bottom:1px solid var(--line-soft); padding-bottom:13px; margin-bottom:13px; }
.detail-section:last-child { border-bottom:0; }
.detail-section h4 { font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#6f7e90; margin:0 0 9px; }
.detail-grid { display:grid; grid-template-columns:116px 1fr; gap:7px 10px; font-size:12px; }.detail-grid dt { color:#748295; font-weight:500; }.detail-grid dd { margin:0; color:#e1e8ef; }
.detail-actions { display:flex; gap:7px; position:sticky; bottom:0; padding-top:12px; background:linear-gradient(transparent,#101821 16px); }
.registration-modal { background:#101821; border:1px solid #2a3748; }.modal-header,.modal-footer { border-color:var(--line); }
.form-section-title { height:30px; display:flex; align-items:center; gap:8px; margin:3px 0 8px; color:#dce5ee; }.form-section-title>span { width:20px; height:20px; border-radius:50%; background:#1b3c6d; color:#99bdff; display:grid; place-items:center; font-size:10px; }.form-section-title strong { font-size:12px; }
.seat-entry-grid { border:1px solid var(--line); border-radius:7px; overflow:hidden; }.seat-entry-head,.seat-entry-row { display:grid; grid-template-columns:1fr 130px 110px; gap:8px; align-items:center; }.seat-entry-head { background:#151f2b; color:#7f8d9f; padding:6px 9px; font-size:10px; }.seat-entry-row { padding:7px 8px; border-top:1px solid var(--line-soft); }
/* Tabulator integration */
.tabulator { border:0 !important; background:#0f1620 !important; color:#dfe6ee !important; font-size:12px !important; }
.tabulator .tabulator-header { background:#151f2a !important; border-bottom:1px solid #2b3746 !important; color:#8f9caf !important; font-size:10px !important; font-weight:700 !important; text-transform:uppercase; letter-spacing:.03em; }
.tabulator .tabulator-header .tabulator-col { background:transparent !important; border-right:1px solid #24303f !important; }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { background:#1a2634 !important; }
.tabulator .tabulator-tableholder { background:#0f1620 !important; }
.tabulator .tabulator-row { background:#101821 !important; border-bottom:1px solid #1c2734 !important; min-height:var(--row-h) !important; }
.tabulator .tabulator-row:nth-child(even) { background:#0f1720 !important; }
.tabulator .tabulator-row:hover { background:#172231 !important; }
.tabulator .tabulator-row.tabulator-selected { background:#192a43 !important; }
.tabulator .tabulator-cell { border-right:1px solid #1c2734 !important; padding:7px 8px !important; vertical-align:middle; }
.tabulator .tabulator-cell:first-child { border-left:3px solid transparent !important; }
.tabulator .tabulator-row[data-status="unlisted"] .tabulator-cell:first-child { border-left-color:var(--warning) !important; }
.tabulator .tabulator-row[data-status="listed"] .tabulator-cell:first-child { border-left-color:var(--info) !important; }
.tabulator .tabulator-row[data-status="dealing"] .tabulator-cell:first-child { border-left-color:var(--accent) !important; }
.tabulator .tabulator-row[data-status="keep"] .tabulator-cell:first-child { border-left-color:#a38ad3 !important; }
.tabulator .tabulator-row[data-status="sold"] .tabulator-cell:first-child { border-left-color:var(--success) !important; }
.tabulator .tabulator-footer { background:#131c27 !important; border-top:1px solid #283444 !important; color:#7f8d9f !important; }
.cell-main { min-width:0; }.cell-main strong { display:block; font-size:12px; color:#e5ebf1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.cell-main small { display:block; font-size:10px; color:#77869a; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.status-badge { display:inline-flex; align-items:center; gap:5px; min-height:22px; padding:2px 7px; border-radius:5px; font-size:10px; font-weight:700; white-space:nowrap; }.status-badge::before { content:""; width:6px; height:6px; border-radius:50%; }.status-unlisted{background:rgba(228,168,77,.11);color:#efbd6c}.status-unlisted::before{background:var(--warning)}.status-listed{background:rgba(84,166,216,.11);color:#7cc5ed}.status-listed::before{background:var(--info)}.status-dealing{background:rgba(76,141,255,.13);color:#91b7ff}.status-dealing::before{background:var(--accent)}.status-keep{background:rgba(163,138,211,.13);color:#c4acee}.status-keep::before{background:#a38ad3}.status-sold{background:rgba(70,185,129,.11);color:#79d3a7}.status-sold::before{background:var(--success)}
.site-stack { display:flex; flex-direction:column; gap:2px; min-width:0; }.site-stack strong { font-size:11px; }.site-stack small { font-size:10px; color:#77869a; }
.money { width:100%; text-align:right; font-variant-numeric:tabular-nums; }.money strong { display:block; font-size:12px; }.money small { display:block; font-size:10px; color:#748295; margin-top:2px; }.money .profit { color:#76d3a6; }
.multi-flag { color:#efbd6c; font-size:10px; margin-left:4px; }
.action-btn { border:0; background:transparent; color:#7f8d9f; font-size:18px; line-height:1; padding:0 4px; }
@media (max-width: 1100px) { .app-shell{grid-template-columns:64px minmax(0,1fr)} .brand-copy,.nav-item span:not(.nav-icon),.sidebar-label,.sidebar-footer div{display:none}.brand-row{justify-content:center;padding-left:0;padding-right:0}.nav-item{grid-template-columns:1fr;padding:0}.nav-icon{margin:auto}.workspace{grid-template-columns:238px minmax(0,1fr)} .metric{min-width:84px;padding:8px 9px}.metric.attention{display:none}.compact-select:nth-of-type(2){display:none} }
@media (max-width: 820px) { body{overflow:auto}.app-shell{height:auto;min-height:100vh;display:block}.app-sidebar{display:none}.app-main{display:block}.topbar{position:sticky;top:0;z-index:20;height:56px;padding:0 10px}.topbar-title .eyebrow{display:none}.global-search{width:42vw}.global-search kbd{display:none}.workspace{display:block}.event-browser{border-right:0;border-bottom:1px solid var(--line);max-height:245px}.event-groups{max-height:170px}.inventory-panel{display:block}.inventory-header{padding:12px 10px 7px}.page-title-row{align-items:flex-start}.page-title-row h1{font-size:18px}.page-title-row p{display:none}.header-actions .btn-outline-secondary{display:none}.metric-strip{margin:0 10px 8px;overflow-x:auto}.metric{min-width:88px}.toolbar-row{margin:0 10px;height:auto;min-height:46px;overflow-x:auto}.toolbar-right{display:none}.table-shell{margin:8px 10px 0;height:56vh}.table-legend{margin:0 10px;overflow-x:auto;white-space:nowrap}.legend-note{display:none}.seat-entry-head,.seat-entry-row{grid-template-columns:1fr}.seat-entry-head{display:none}.modal-dialog{margin:0}.registration-modal{min-height:100vh;border-radius:0}.global-search input::placeholder{color:transparent} }


/* Phase 6: authentication and real-data states */
.hidden { display: none !important; }
.app-hidden { display: none !important; }
body.auth-mode { overflow: hidden; }
.auth-screen { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 50% 20%,#17253a 0,#0c121a 36%,#080d13 100%); }
.auth-card { width:min(420px,100%); background:#101821; border:1px solid #2b3746; border-radius:12px; box-shadow:0 28px 80px rgba(0,0,0,.38); padding:28px; }
.auth-brand { display:flex; align-items:center; gap:14px; padding-bottom:22px; border-bottom:1px solid var(--line-soft); }
.auth-brand-mark { width:42px; height:42px; font-size:18px; flex:0 0 auto; }
.auth-brand h1 { margin:2px 0 0; font-size:23px; letter-spacing:-.02em; }
.auth-brand p { margin:3px 0 0; color:var(--muted); font-size:12px; }
.auth-form { padding-top:22px; }
.auth-error { min-height:30px; padding:7px 0 4px; color:#ef8e8e; font-size:12px; }
.auth-status { margin-top:15px; text-align:center; color:#6f7e90; font-size:11px; }
.event-empty { margin:16px; padding:22px 14px; border:1px dashed #2a3748; border-radius:7px; text-align:center; color:#8391a3; }
.event-empty strong,.event-empty span { display:block; }
.event-empty strong { color:#c9d3de; margin-bottom:4px; }
.event-empty span { font-size:11px; }
.sync-dot[data-state="loading"] { background:#e4a84d; box-shadow:0 0 0 3px rgba(228,168,77,.1); }
.sync-dot[data-state="ok"] { background:#46b981; box-shadow:0 0 0 3px rgba(70,185,129,.1); }
.sync-dot[data-state="error"] { background:#e26464; box-shadow:0 0 0 3px rgba(226,100,100,.1); }
.app-toast-container { z-index:1300; }
.nav-item:disabled { opacity:.52; cursor:not-allowed; }
.metric:focus-visible,.performance-item:focus-visible,.event-group-title:focus-visible { outline:2px solid #4c8dff; outline-offset:-2px; }
@media (max-width: 820px) {
  .auth-screen { padding:0; align-items:stretch; }
  .auth-card { width:100%; border:0; border-radius:0; display:flex; flex-direction:column; justify-content:center; padding:28px 20px; }
  #logoutButton { display:none; }
}


/* Phase 7: write-side registration */
.registration-grid { display:grid; gap:16px; }
.registration-section { padding:14px; border:1px solid var(--line); border-radius:8px; background:#0e151e; }
.inline-create-panel { margin-top:10px; padding:12px; border:1px dashed #334155; border-radius:7px; background:#111b27; }
.label-action-row { min-height:25px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.form-error { padding:10px 12px; border:1px solid rgba(226,100,100,.35); border-radius:7px; background:rgba(226,100,100,.09); color:#f0a2a2; font-size:12px; }
.modal-footer-note { margin-right:auto; color:#77869a; font-size:11px; }
.seat-row-label { color:#718096; font-size:11px; text-align:center; }
.registration-modal .form-label { color:#98a6b8; font-size:11px; font-weight:600; margin-bottom:5px; }
.registration-modal .form-control,
.registration-modal .form-select,
.registration-modal .input-group-text { background:#0d141d; border-color:#2a3748; color:#dfe6ee; }
.registration-modal .form-control:focus,
.registration-modal .form-select:focus { border-color:#4c8dff; box-shadow:0 0 0 .15rem rgba(76,141,255,.13); }
.registration-modal .input-group-text { color:#77869a; }
.registration-modal .btn-link { color:#7eabff; text-decoration:none; }
.registration-modal .btn-link:hover { color:#a7c4ff; }
@media (max-width: 820px) {
  .registration-section { padding:11px; border-left:0; border-right:0; border-radius:0; }
  .seat-entry-row { grid-template-columns:1fr; }
  .seat-row-label { text-align:left; }
  .modal-footer-note { display:none; }
}


/* Phase 8 */
.detail-actions-stack {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.detail-actions-stack .btn:last-child {
  grid-column: 1 / -1;
}

.form-hint {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.status-pill:not(.warning-soft) {
  background: rgba(148, 163, 184, 0.12);
  color: #cbd5e1;
  border: 1px solid rgba(148, 163, 184, 0.18);
}

@media (max-width: 720px) {
  .detail-actions-stack {
    grid-template-columns: 1fr;
  }

  .detail-actions-stack .btn:last-child {
    grid-column: auto;
  }
}