@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800;900&display=swap');

:root {
  --forest: #035d86;
  --forest-2: #0480b6;
  --mint: #dceff7;
  --mint-soft: #f0f8fb;
  --cream: #f8f5ed;
  --paper: #fffefa;
  --coral: #e56b46;
  --coral-dark: #c95231;
  --sun: #f5c85b;
  --ink: #17241f;
  --muted: #6f7b75;
  --line: #dfe6e1;
  --danger: #b83c36;
  --blue: #3478a5;
  --shadow: 0 18px 50px rgba(4, 128, 182, .11);
  --shadow-soft: 0 8px 24px rgba(4, 128, 182, .07);
  --radius: 20px;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body {
  min-height: 100%;
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.app-shell { background: #e7f1f5; }
.page { min-height: calc(100vh - 76px); padding: 22px 0 52px; background: #e7f1f5; }
.page > .container { min-height: calc(100vh - 150px); border: 1px solid rgba(3,93,134,.10); border-radius: 28px; background: var(--cream); box-shadow: 0 18px 54px rgba(3,93,134,.08); }
.page-space { padding: 40px 30px 64px; }
.stack { display: grid; gap: 14px; }
.stack-lg { display: grid; gap: 22px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.topbar { position: sticky; top: 0; z-index: 50; height: 76px; border-bottom: 1px solid rgba(22,58,46,.1); background: rgba(255,254,250,.94); backdrop-filter: blur(16px); }
.topbar-inner { width: min(1240px, calc(100% - 40px)); height: 100%; margin: auto; display: flex; align-items: center; gap: 42px; }
.brand img { display: block; width: 188px; height: auto; }
.desktop-nav { align-self: stretch; display: flex; align-items: stretch; gap: 4px; }
.desktop-nav a { position: relative; display: grid; place-items: center; padding: 0 14px; color: #51615a; font-size: 13px; font-weight: 700; text-decoration: none; }
.desktop-nav a::after { position: absolute; right: 12px; bottom: -1px; left: 12px; height: 3px; border-radius: 4px 4px 0 0; background: var(--coral); content: ""; transform: scaleX(0); transition: transform .2s ease; }
.desktop-nav a:hover, .desktop-nav a.is-active { color: var(--forest); }
.desktop-nav a.is-active::after { transform: scaleX(1); }
.user-menu { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.user-copy { display: grid; min-width: 120px; }
.user-copy strong { font-size: 12px; }
.user-copy small { color: var(--muted); font-size: 11px; }
.user-avatar { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--forest); background: var(--mint); font-size: 11px; font-weight: 850; letter-spacing: .04em; }
.user-avatar-lg { width: 48px; height: 48px; font-size: 13px; }
.icon-button { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: var(--paper); cursor: pointer; }
.icon-button svg { width: 18px; }
.icon-button:hover { color: var(--danger); border-color: #e8c1be; }
.mobile-nav { display: none; }
.impersonation-bar { position: relative; z-index: 45; min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 8px max(20px, calc((100vw - 1240px)/2)); color: #694c10; border-bottom: 1px solid #e7cb88; background: #fff2c9; box-shadow: 0 6px 18px rgba(87,62,9,.08); }
.impersonation-bar > div { min-width: 0; display: flex; align-items: center; gap: 10px; }
.impersonation-bar > div > span { width: 26px; height: 26px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: white; background: #b47b08; font-size: 11px; font-weight: 900; }
.impersonation-bar p { margin: 0; font-size: 11px; }

.page-heading { margin-bottom: 30px; }
.page-heading h1 { max-width: 780px; margin: 5px 0 5px; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: clamp(36px, 5vw, 54px); font-weight: 700; line-height: 1.05; letter-spacing: -.035em; }
.page-heading p { max-width: 680px; margin: 0; color: var(--muted); }
.heading-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.overline { display: block; color: var(--coral-dark); font-size: 11px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.overline-light { color: #ffd0be; }
.lead-copy { color: var(--muted); }
.back-link { display: inline-flex; margin-bottom: 22px; color: var(--muted); font-size: 13px; font-weight: 700; text-decoration: none; }
.back-link:hover { color: var(--forest); }
.detail-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.detail-toolbar .back-link { margin: 0; }

.button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border: 1px solid transparent; border-radius: 999px; font-size: 13px; font-weight: 800; line-height: 1; text-decoration: none; cursor: pointer; transition: transform .15s ease, background .15s ease, box-shadow .15s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: white; background: var(--coral); box-shadow: 0 8px 20px rgba(229,107,70,.22); }
.button-primary:hover { background: var(--coral-dark); }
.button-secondary { color: var(--forest); border-color: var(--line); background: var(--paper); }
.button-secondary:hover { border-color: #bdcbc4; background: white; }
.button-light { color: white; border-color: rgba(255,255,255,.26); background: rgba(255,255,255,.12); backdrop-filter: blur(8px); }
.button-light:hover { background: rgba(255,255,255,.2); }
.button-danger { color: white; background: var(--danger); }
.button-sm { min-height: 36px; padding: 8px 14px; font-size: 12px; }
.button-lg { min-height: 52px; font-size: 14px; }
.button-block { width: 100%; }
.text-link { color: var(--forest); font-size: 13px; font-weight: 800; text-decoration: none; }
.text-link span { color: var(--coral); }

.alert { max-height: 160px; overflow: hidden; margin-bottom: 22px; padding: 13px 16px; border: 1px solid; border-radius: 14px; font-size: 13px; font-weight: 650; opacity: 1; transform: translateY(0); transition: opacity .3s ease, transform .3s ease, max-height .4s ease, margin .4s ease, padding .4s ease, border-width .4s ease; }
.alert.is-dismissing { max-height: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; border-width: 0; opacity: 0; transform: translateY(-7px); }
.alert-success { color: #1b6047; border-color: #b8d9ca; background: #eaf5ef; }
.alert-danger { color: #8e2d28; border-color: #ebc3c0; background: #fcedec; }
.alert-warning { color: #805a15; border-color: #ead49f; background: #fff7df; }
.alert-info { color: #245c7e; border-color: #c3dae7; background: #edf6fb; }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-bottom: 44px; }
.stat-card { min-height: 112px; display: flex; align-items: center; gap: 15px; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: var(--shadow-soft); }
.stat-icon { width: 44px; height: 44px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; padding: 0 0 1px; border-radius: 50%; color: var(--forest); background: var(--mint-soft); font-size: 18px; font-weight: 800; line-height: 2.2; text-align: center; }
.stat-card strong, .stat-card span { display: block; }
.stat-card strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 30px; line-height: 1; }
.stat-card div > span { margin-top: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }
.stat-green .stat-icon { color: #237054; background: #e7f3ed; }
.stat-amber .stat-icon { color: #98701d; background: #fff4d7; }
.stat-blue .stat-icon { color: #2f6f96; background: #eaf3f8; }
.stat-red .stat-icon { color: #a3483f; background: #faece9; }
.stats-compact { margin: 20px 0; }
.stats-compact .stat-card { min-height: 88px; padding: 15px; box-shadow: none; }
.stats-compact .stat-icon { width: 38px; height: 38px; }
.stats-compact .stat-card strong { font-size: 25px; }
.event-analytics { margin-bottom: 20px; overflow: hidden; }
.event-analytics .panel-heading { align-items: center; }
.analytics-grid { display: grid; grid-template-columns: .9fr 1.35fr; gap: 0; }
.confirmation-chart { min-width: 0; display: flex; align-items: center; gap: 22px; padding: 26px; border-right: 1px solid var(--line); background: linear-gradient(145deg, rgba(220,239,247,.72), rgba(255,254,250,.42)); }
.confirmation-chart > div:last-child { min-width: 0; }
.donut-chart { --chart-value: 0; position: relative; width: 126px; height: 126px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--forest-2) calc(var(--chart-value) * 1%), #dce7eb 0); }
.donut-chart::before { position: absolute; inset: 12px; border-radius: 50%; background: var(--paper); box-shadow: inset 0 0 0 1px rgba(3,93,134,.08); content: ""; }
.donut-chart > div { position: relative; z-index: 1; display: flex; align-items: baseline; justify-content: center; color: var(--forest); }
.donut-chart strong { font-family: Montserrat, Arial, sans-serif; font-size: 32px; line-height: 1; }
.donut-chart span { font-size: 12px; font-weight: 800; }
.chart-label { color: var(--coral-dark); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.confirmation-chart h3 { margin: 5px 0 3px; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 21px; }
.confirmation-chart p { margin: 0; color: var(--muted); font-size: 10px; }
.progress-charts { display: grid; align-content: center; gap: 20px; padding: 25px 28px; }
.progress-chart { --progress-color: var(--coral); }
.progress-chart-blue { --progress-color: var(--forest-2); }
.progress-chart-gold { --progress-color: #d49a19; }
.progress-chart-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 8px; }
.progress-chart-heading > div { min-width: 0; display: grid; }
.progress-chart-heading span { color: var(--forest); font-size: 11px; font-weight: 800; }
.progress-chart-heading small { margin-top: 1px; color: var(--muted); font-size: 9px; }
.progress-chart-heading strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 18px; line-height: 1; }
.progress-track { height: 9px; overflow: hidden; border-radius: 999px; background: #e7ece9; }
.progress-track span { display: block; height: 100%; border-radius: inherit; background: var(--progress-color); box-shadow: 0 2px 8px color-mix(in srgb, var(--progress-color) 30%, transparent); }
.dashboard-analytics { overflow: hidden; margin: -18px 0 42px; }
.dashboard-chart-grid { display: grid; grid-template-columns: 1.1fr .9fr; }
.dashboard-performance { padding: 25px 28px 28px; border-right: 1px solid var(--line); background: linear-gradient(145deg, rgba(220,239,247,.62), rgba(255,254,250,.42)); }
.dashboard-confirmation { display: flex; align-items: center; gap: 22px; }
.dashboard-confirmation h3, .event-distribution-heading h3 { margin: 4px 0 2px; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 20px; }
.dashboard-confirmation p { margin: 0; color: var(--muted); font-size: 10px; }
.dashboard-progress { display: grid; gap: 18px; margin-top: 24px; padding-top: 22px; border-top: 1px solid rgba(3,93,134,.11); }
.event-distribution { min-width: 0; padding: 27px 28px; }
.event-distribution-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.event-distribution-heading > small { color: var(--muted); font-size: 9px; }
.event-bars { display: grid; gap: 15px; }
.event-bar-row { min-width: 0; display: grid; grid-template-columns: minmax(110px, .9fr) minmax(90px, 1.2fr) 24px; align-items: center; gap: 12px; text-decoration: none; }
.event-bar-label { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.event-bar-label strong { overflow: hidden; color: var(--forest); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.event-bar-label small { flex: 0 0 auto; color: var(--muted); font-size: 8px; }
.event-bar-track { height: 9px; overflow: hidden; border-radius: 999px; background: #e7ece9; }
.event-bar-track span { display: block; height: 100%; min-width: 3px; border-radius: inherit; background: linear-gradient(90deg, var(--forest), var(--forest-2)); transition: width .25s ease; }
.event-bar-row > strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 11px; text-align: right; }
.event-bar-row:hover .event-bar-track span { background: var(--coral); }
.empty-chart { min-height: 190px; display: grid; place-items: center; padding: 25px; border: 1px dashed var(--line); border-radius: 15px; color: var(--muted); background: var(--mint-soft); font-size: 10px; text-align: center; }
.dashboard-revenue { padding: 25px 28px 28px; border-top: 1px solid var(--line); background: #fffdf8; }
.revenue-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; }
.revenue-heading h3 { margin: 4px 0 0; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 18px; }
.revenue-progress-copy { flex: 0 0 auto; display: flex; align-items: baseline; gap: 6px; color: var(--muted); }
.revenue-progress-copy strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 23px; line-height: 1; }
.revenue-progress-copy span { font-size: 9px; }
.revenue-track { height: 11px; overflow: hidden; margin: 18px 0 20px; border-radius: 999px; background: #e8ecea; }
.revenue-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0480b6, #39a778); box-shadow: 0 3px 12px rgba(4,128,182,.22); }
.revenue-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.revenue-metric { min-width: 0; display: grid; gap: 4px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.revenue-metric span { color: var(--muted); font-size: 9px; font-weight: 750; }
.revenue-metric strong { overflow: hidden; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.revenue-metric-collected { border-color: #b9ddd0; background: #f0f8f4; }
.revenue-metric-collected strong { color: #237054; }
.revenue-metric-outstanding { border-color: #ead6a8; background: #fff9e9; }
.revenue-metric-outstanding strong { color: #966c13; }

.section-block { margin-top: 10px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 18px; }
.section-heading h2 { margin: 2px 0 0; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 28px; font-weight: 700; }
.event-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.event-card { min-width: 0; display: flex; align-items: center; gap: 16px; padding: 17px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); text-decoration: none; box-shadow: var(--shadow-soft); transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.event-card:hover { transform: translateY(-2px); border-color: #bccbc3; box-shadow: var(--shadow); }
.date-tile { width: 58px; height: 66px; flex: 0 0 auto; display: grid; place-content: center; border-radius: 15px; color: var(--forest); background: var(--mint); text-align: center; }
.date-tile strong { font-family: Montserrat, Arial, sans-serif; font-size: 26px; line-height: 1; }
.date-tile span { margin-top: 5px; font-size: 9px; font-weight: 850; letter-spacing: .12em; }
.event-card-body, .event-list-main { min-width: 0; flex: 1; }
.event-card-top { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.event-card h3 { margin: 8px 0 4px; overflow: hidden; color: var(--forest); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.event-card p { margin: 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.card-arrow { color: var(--coral); font-size: 21px; }
.category { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.badge { display: inline-flex; align-items: center; width: max-content; padding: 5px 8px; border-radius: 999px; font-size: 9px; font-weight: 850; letter-spacing: .035em; line-height: 1; text-transform: uppercase; }
.badge-open, .badge-success { color: #1d684b; background: #dff2e8; }
.badge-scheduled, .badge-info { color: #2c6282; background: #e4f1f7; }
.badge-closed, .badge-warning { color: #845d14; background: #fff0c9; }
.badge-done, .badge-muted { color: #68726d; background: #eef1ef; }
.badge-cancelled, .badge-danger { color: #973a33; background: #fae7e4; }
.quick-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 34px; }
.quick-card { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,254,250,.62); text-decoration: none; }
.quick-card:hover { background: var(--paper); }
.quick-card > div { flex: 1; display: grid; }
.quick-card strong { color: var(--forest); font-size: 13px; }
.quick-card small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.quick-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: var(--coral); background: #fcece7; }
.empty-card { min-height: 260px; display: grid; place-content: center; justify-items: center; padding: 34px; border: 1px dashed #c7d2cc; border-radius: var(--radius); color: var(--muted); background: rgba(255,254,250,.45); text-align: center; }
.empty-card h3 { margin: 10px 0 2px; color: var(--forest); }
.empty-card p { max-width: 420px; margin: 0; font-size: 13px; }
.empty-icon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; color: var(--coral); background: #fbe8e2; font-size: 23px; }
.empty-inline { min-height: 220px; border: 0; border-top: 1px solid var(--line); border-radius: 0; }

.filter-bar { display: grid; grid-template-columns: minmax(240px, 1fr) 220px auto; gap: 10px; margin-bottom: 18px; padding: 12px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); }
.filter-simple { grid-template-columns: minmax(240px, 1fr) auto; }
.search-field { position: relative; }
.search-field > span { position: absolute; top: 50%; left: 15px; color: var(--muted); font-size: 20px; transform: translateY(-53%); }
.search-field input { padding-left: 42px; }
.list-panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow-soft); }
.event-list-row { min-height: 104px; display: flex; align-items: center; gap: 18px; padding: 17px 20px; border-bottom: 1px solid var(--line); text-decoration: none; transition: background .15s ease; }
.event-list-row:last-child { border-bottom: 0; }
.event-list-row:hover { background: var(--mint-soft); }
.event-list-main h2 { margin: 7px 0 3px; overflow: hidden; color: var(--forest); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.event-list-main p { margin: 0; color: var(--muted); font-size: 12px; }
.event-list-metric { width: 70px; display: grid; color: var(--muted); text-align: center; }
.event-list-metric strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 24px; line-height: 1; }
.event-list-metric span { margin-top: 5px; font-size: 9px; font-weight: 800; text-transform: uppercase; }

.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow-soft); }
.panel-heading { display: flex; align-items: flex-start; gap: 13px; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.panel-heading h2 { margin: 0; color: var(--forest); font-size: 16px; }
.panel-heading p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.panel-heading-actions { align-items: center; justify-content: space-between; }
.panel-body { padding: 22px; }
.step-number { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--coral-dark); background: #fbe9e3; font-size: 12px; font-weight: 850; }
.form-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 22px; align-items: start; }
.form-main { min-width: 0; }
.form-aside { min-width: 0; }
.sticky-panel { position: sticky; top: 98px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.field { min-width: 0; display: grid; gap: 7px; }
.field-wide { grid-column: 1 / -1; }
.field > span, .compact-field > span { color: #47564f; font-size: 11px; font-weight: 800; }
.field small { color: var(--muted); font-size: 10px; }
input, select, textarea { width: 100%; border: 1px solid #d6dfda; border-radius: 12px; outline: none; color: var(--ink); background: white; transition: border .15s ease, box-shadow .15s ease; }
input, select { min-height: 46px; padding: 10px 12px; }
textarea { resize: vertical; padding: 12px; }
input:focus, select:focus, textarea:focus { border-color: #71a38f; box-shadow: 0 0 0 4px rgba(66,129,103,.1); }
input::placeholder, textarea::placeholder { color: #a7b0ab; }
.check-field { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--mint-soft); cursor: pointer; }
.check-field input { width: 18px; height: 18px; min-height: 0; margin-top: 2px; accent-color: var(--forest); }
.check-field span { display: grid; }
.check-field strong { color: var(--forest); font-size: 12px; }
.check-field small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.aside-note, .info-banner { display: flex; align-items: flex-start; gap: 10px; padding: 13px; border-radius: 13px; color: #3d6858; background: var(--mint-soft); }
.aside-note > span, .info-banner > span { width: 21px; height: 21px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--forest-2); font-size: 11px; font-weight: 850; }
.aside-note p, .info-banner p { margin: 0; font-size: 11px; }
.info-banner { margin-bottom: 20px; padding: 15px 17px; }

.event-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 24px; min-height: 260px; padding: 36px; border-radius: 26px; color: white; background: radial-gradient(circle at 90% 10%, rgba(245,200,91,.27), transparent 35%), linear-gradient(135deg, #035d86, #0480b6); box-shadow: 0 22px 54px rgba(4,128,182,.22); }
.event-hero::after { position: absolute; right: -55px; bottom: -100px; width: 280px; height: 280px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; }
.event-hero.is-cancelled { background: linear-gradient(135deg, #5c302e, #7d413d); }
.event-hero-date { width: 86px; height: 110px; display: grid; place-content: center; justify-items: center; border: 1px solid rgba(255,255,255,.26); border-radius: 20px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.event-hero-date strong { font-family: Montserrat, Arial, sans-serif; font-size: 42px; line-height: .9; }
.event-hero-date span { margin-top: 8px; font-size: 11px; font-weight: 850; letter-spacing: .12em; }
.event-hero-date small { margin-top: 2px; color: rgba(255,255,255,.7); font-size: 10px; }
.event-hero-copy { position: relative; z-index: 2; min-width: 0; }
.event-hero-copy .category { margin-left: 8px; color: rgba(255,255,255,.62); }
.event-hero-copy h1 { margin: 10px 0 6px; font-family: Montserrat, Arial, sans-serif; font-size: clamp(34px, 5vw, 52px); font-weight: 700; line-height: 1; letter-spacing: -.035em; }
.event-hero-copy > p { margin: 0; color: rgba(255,255,255,.72); }
.event-description { max-width: 650px; margin-top: 15px; color: rgba(255,255,255,.78); font-size: 12px; }
.event-hero-actions { position: relative; z-index: 2; display: grid; gap: 8px; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.detail-aside { min-width: 0; }
.summary-list { margin: 0; padding: 4px 20px 14px; }
.summary-list > div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 2px; border-bottom: 1px solid var(--line); }
.summary-list > div:last-child { border-bottom: 0; }
.summary-list dt { color: var(--muted); font-size: 11px; }
.summary-list dd { margin: 0; color: var(--forest); font-size: 11px; font-weight: 800; text-align: right; }
.summary-list dd small { color: var(--muted); font-weight: 600; }
.action-popover { position: relative; }
.action-popover > summary { list-style: none; }
.action-popover > summary::-webkit-details-marker { display: none; }
.popover-card { position: absolute; top: calc(100% + 10px); right: 0; z-index: 20; width: 330px; padding: 18px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); box-shadow: var(--shadow); }
.popover-wide { width: 520px; }
.participant-list { border-radius: 0 0 var(--radius) var(--radius); }
.participant-row { display: grid; grid-template-columns: minmax(190px, 1.35fr) 130px auto 90px auto auto; align-items: end; gap: 11px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.participant-row:last-child { border-bottom: 0; }
.participant-person { min-width: 0; display: flex; align-items: center; gap: 10px; }
.participant-person > div { min-width: 0; display: grid; justify-items: start; }
.participant-person strong { max-width: 100%; overflow: hidden; color: var(--forest); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.participant-person small { max-width: 100%; margin: 2px 0 5px; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.compact-field { min-width: 0; display: grid; gap: 5px; }
.compact-field input, .compact-field select { min-height: 36px; padding: 7px 8px; border-radius: 9px; font-size: 11px; }
.toggle-field { align-self: center; display: grid; grid-template-columns: auto; justify-items: center; gap: 4px; cursor: pointer; }
.toggle-field input { position: absolute; opacity: 0; pointer-events: none; }
.toggle-field span { position: relative; width: 36px; height: 20px; border-radius: 999px; background: #ccd5d0; transition: background .2s ease; }
.toggle-field span::after { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: white; box-shadow: 0 1px 4px rgba(0,0,0,.18); content: ""; transition: transform .2s ease; }
.toggle-field input:checked + span { background: var(--forest-2); }
.toggle-field input:checked + span::after { transform: translateX(16px); }
.toggle-field em { color: var(--muted); font-size: 9px; font-style: normal; font-weight: 750; }
.participant-actions { display: grid; justify-items: center; gap: 4px; }
.receipt-link { color: var(--coral-dark); font-size: 9px; font-weight: 800; }
.panel-summary { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; color: var(--forest); font-size: 12px; font-weight: 800; cursor: pointer; list-style: none; }
.panel-summary::-webkit-details-marker { display: none; }
.danger-panel { border-color: #e7cac7; background: #fffbfa; }
.small-copy { margin: 0; color: var(--muted); font-size: 11px; }
.cancellation-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 18px; }
.cancellation-card > div { min-width: 0; display: grid; gap: 3px; }
.cancellation-card strong { color: var(--forest); font-size: 12px; }
.cancellation-card p { margin: 0; color: var(--muted); font-size: 10px; }
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px; }
.modal[hidden] { display: none; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(11, 29, 37, .58); backdrop-filter: blur(5px); }
.modal-card { position: relative; z-index: 1; width: min(100%, 560px); max-height: calc(100vh - 44px); overflow-y: auto; border: 1px solid rgba(255,255,255,.55); border-radius: 22px; background: var(--paper); box-shadow: 0 28px 80px rgba(3, 43, 62, .28); }
.modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 24px 18px; border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 3px 0 0; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 28px; font-weight: 700; line-height: 1.1; }
.modal-close { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; padding: 0 0 3px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: white; font-size: 25px; line-height: 1; cursor: pointer; }
.modal-close:hover { color: var(--danger); border-color: #e7cac7; }
.modal-body { padding: 22px 24px 24px; }
.modal-notice { display: grid; gap: 2px; padding: 14px 16px; border-radius: 14px; color: var(--forest); background: var(--mint-soft); }
.modal-notice strong { font-size: 13px; }
.modal-notice span { color: var(--muted); font-size: 10px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 5px; padding-top: 18px; border-top: 1px solid var(--line); }
body.modal-open { overflow: hidden; }

.people-list .person-row { min-height: 82px; display: grid; grid-template-columns: auto minmax(0,1fr) 85px 180px; align-items: center; gap: 15px; padding: 15px 20px; border-bottom: 1px solid var(--line); }
.people-list .person-row:last-child { border-bottom: 0; }
.person-main { min-width: 0; display: grid; }
.person-main strong { overflow: hidden; color: var(--forest); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.person-main small { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.person-meta { display: grid; color: var(--muted); text-align: center; }
.person-meta strong { color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 22px; line-height: 1; }
.person-meta span { margin-top: 4px; font-size: 9px; text-transform: uppercase; }
.person-card-id { justify-self: end; }
.mobile-create { display: none; margin-bottom: 18px; }
.operator-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.operator-card { padding: 20px; }
.operator-top { display: flex; align-items: flex-start; justify-content: space-between; }
.operator-card h2 { margin: 14px 0 2px; color: var(--forest); font-size: 15px; }
.operator-card > p { margin: 0; color: var(--muted); font-size: 11px; }
.operator-stats { display: grid; grid-template-columns: .8fr 1.2fr; gap: 10px; margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); }
.operator-stats > div { min-width: 0; display: grid; }
.operator-stats strong { overflow: hidden; color: var(--forest); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.operator-stats span { margin-top: 3px; color: var(--muted); font-size: 9px; }
.operator-actions { display: grid; gap: 8px; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); }
.operator-actions form { margin: 0; }
.operator-actions .button:disabled { color: #98a29d; border-color: var(--line); background: #f0f2f1; cursor: not-allowed; transform: none; }
.modal-card-wide { width: min(100%, 720px); }
.assignment-list { max-height: min(52vh, 480px); overflow-y: auto; display: grid; gap: 8px; padding: 2px 4px 2px 2px; }
.assignment-option { min-width: 0; display: grid; grid-template-columns: auto auto minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: white; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.assignment-option:hover { border-color: #aacbd9; background: var(--mint-soft); }
.assignment-option input { position: absolute; opacity: 0; pointer-events: none; }
.assignment-check { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid #cdd8d3; border-radius: 8px; color: transparent; background: white; font-size: 12px; font-weight: 900; }
.assignment-option input:checked + .assignment-check { color: white; border-color: var(--forest-2); background: var(--forest-2); }
.assignment-event { min-width: 0; display: grid; }
.assignment-event strong { overflow: hidden; color: var(--forest); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.assignment-event small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.assignment-owner { max-width: 145px; overflow: hidden; padding: 5px 8px; border-radius: 999px; color: var(--muted); background: #edf1ef; font-size: 8px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.assignment-option.is-assigned .assignment-owner { color: #1d684b; background: #dff2e8; }
.empty-assignment { padding: 24px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); background: var(--mint-soft); font-size: 11px; text-align: center; }

.login-page { min-height: 100vh; display: grid; grid-template-columns: 1.08fr .92fr; }
.login-brand-panel { position: relative; overflow: hidden; min-height: 720px; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(38px, 6vw, 80px); color: white; background: radial-gradient(circle at 15% 15%, rgba(245,200,91,.24), transparent 30%), linear-gradient(145deg, #035d86, #0480b6); }
.login-brand-panel::after { position: absolute; right: -150px; bottom: -140px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; content: ""; box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.02); }
.login-brand-panel > img { position: relative; z-index: 2; width: 245px; padding: 9px 12px; border-radius: 12px; background: white; }
.login-brand-panel > div { position: relative; z-index: 2; }
.login-brand-panel h1 { margin: 12px 0 16px; font-family: Montserrat, Arial, sans-serif; font-size: clamp(48px, 6vw, 78px); font-weight: 700; line-height: .95; letter-spacing: -.045em; }
.login-brand-panel p { max-width: 520px; margin: 0; color: rgba(255,255,255,.7); font-size: 16px; }
.login-feature { display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.75); font-size: 12px; }
.login-feature span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: var(--forest); background: var(--sun); font-weight: 900; }
.login-form-panel { display: grid; place-items: center; padding: 40px; background: var(--paper); }
.login-form { width: min(100%, 410px); }
.login-form h2 { margin: 8px 0 4px; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 48px; font-weight: 700; letter-spacing: -.035em; }
.login-form .lead-copy { margin: 0 0 30px; }
.password-field { position: relative; display: block; }
.password-field input { padding-right: 75px; }
.password-field button { position: absolute; top: 50%; right: 8px; border: 0; color: var(--forest-2); background: transparent; font-size: 10px; font-weight: 800; transform: translateY(-50%); cursor: pointer; }
.login-help { margin: 28px 0 0; color: var(--muted); font-size: 10px; text-align: center; }
.centered-message { min-height: 100vh; display: grid; place-content: center; justify-items: center; padding: 30px; text-align: center; }
.centered-message img { width: 220px; margin-bottom: 35px; }
.centered-message h1 { max-width: 600px; margin: 8px 0; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 45px; }
.centered-message p { max-width: 540px; margin: 0 0 24px; color: var(--muted); }

.public-shell { background: var(--cream); }
.public-header { height: 78px; display: flex; align-items: center; padding: 0 max(24px, calc((100vw - 1120px)/2)); border-bottom: 1px solid var(--line); background: var(--paper); }
.public-header img { display: block; width: 190px; }
.public-page { width: min(1120px, calc(100% - 40px)); margin: 40px auto 70px; display: grid; grid-template-columns: .85fr 1.15fr; gap: 22px; align-items: start; }
.public-event-card { position: sticky; top: 22px; overflow: hidden; min-height: 520px; padding: 38px; border-radius: 25px; color: white; background: radial-gradient(circle at 90% 10%, rgba(245,200,91,.28), transparent 34%), linear-gradient(145deg, #035d86, #0480b6); box-shadow: var(--shadow); }
.public-event-date { display: flex; align-items: baseline; gap: 8px; margin-bottom: 25px; }
.public-event-date strong { font-family: Montserrat, Arial, sans-serif; font-size: 56px; line-height: 1; }
.public-event-date span { color: rgba(255,255,255,.7); font-size: 12px; font-weight: 850; letter-spacing: .1em; }
.public-event-card > .badge { margin-bottom: 24px; }
.public-event-card .overline { color: #ffd0be; }
.public-event-card h1 { margin: 9px 0 8px; font-family: Montserrat, Arial, sans-serif; font-size: clamp(36px, 5vw, 52px); font-weight: 700; line-height: 1; letter-spacing: -.035em; }
.public-event-place { margin: 0; color: rgba(255,255,255,.72); font-size: 12px; }
.public-event-description { margin-top: 20px; color: rgba(255,255,255,.74); font-size: 12px; }
.public-event-facts { margin: 30px 0 0; padding: 16px 0 0; border-top: 1px solid rgba(255,255,255,.18); }
.public-event-facts div { display: flex; justify-content: space-between; gap: 18px; padding: 9px 0; }
.public-event-facts dt { color: rgba(255,255,255,.6); font-size: 10px; }
.public-event-facts dd { margin: 0; font-size: 10px; font-weight: 800; text-align: right; }
.public-form-card { padding: 38px; border: 1px solid var(--line); border-radius: 25px; background: var(--paper); box-shadow: var(--shadow-soft); }
.public-form-card h2 { margin: 7px 0 5px; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 42px; font-weight: 700; line-height: 1.05; }
.public-form-card fieldset { margin: 0; padding: 0; border: 0; }
.public-form-card legend { width: 100%; margin: 0 0 15px; padding: 0 0 8px; border-bottom: 1px solid var(--line); color: var(--forest); font-size: 12px; font-weight: 850; }
.privacy-check { background: white; }
.registration-closed { min-height: 400px; display: grid; place-content: center; justify-items: center; text-align: center; }
.registration-closed h2 { margin: 14px 0 5px; font-size: 34px; }
.registration-closed p { max-width: 420px; margin: 0; color: var(--muted); }

.receipt-shell { min-height: 100vh; padding: 30px; background: #e7e7e7; }
.receipt-actions { width: min(100%, 420px); display: flex; justify-content: space-between; gap: 10px; margin: 0 auto 20px; }
.thermal-receipt { width: 55mm; min-height: 100mm; margin: 0 auto; padding: 4mm 3mm 8mm; color: #000; background: #fff; box-shadow: 0 10px 35px rgba(0,0,0,.18); font-family: "Courier New", Courier, monospace; font-size: 8.5pt; line-height: 1.25; }
.receipt-header { display: grid; justify-items: center; text-align: center; }
.receipt-mark { width: 9mm; height: 9mm; display: grid; place-items: center; margin-bottom: 2mm; border: 1.2pt solid #000; border-radius: 50%; font-family: Arial, sans-serif; font-size: 14pt; font-weight: 900; }
.receipt-header strong { font-size: 10pt; }
.receipt-header span { margin-top: 1mm; font-size: 7pt; }
.receipt-rule { margin: 3mm 0; border-top: .7pt dashed #000; }
.receipt-rule-double { border-top-style: double; border-top-width: 2.2pt; }
.receipt-lines { margin: 0; }
.receipt-lines div { display: flex; justify-content: space-between; gap: 3mm; margin: 1mm 0; }
.receipt-lines dt { min-width: 0; }
.receipt-lines dd { margin: 0; text-align: right; }
.receipt-section { margin: 3mm 0; }
.receipt-section > span { display: block; margin-bottom: 1mm; font-size: 6.8pt; }
.receipt-section > strong { display: block; font-size: 9pt; }
.receipt-section p { margin: 1mm 0 0; }
.receipt-items div:first-child { font-weight: 700; }
.receipt-total { display: flex; justify-content: space-between; align-items: baseline; gap: 2mm; font-weight: 900; }
.receipt-total strong { font-size: 11pt; }
.receipt-footer { display: grid; justify-items: center; gap: 1.5mm; text-align: center; }
.receipt-footer p { margin: 1mm 0; font-weight: 700; }
.receipt-footer span { font-size: 6.7pt; }
.receipt-footer small { font-size: 6pt; }

.poster-shell { min-height: 100vh; padding: 26px; background: #dfe8ec; }
.poster-toolbar { width: min(100%, 210mm); display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 auto 18px; }
.poster-toolbar > div { display: flex; align-items: center; gap: 12px; }
.poster-toolbar span { color: var(--muted); font-size: 11px; }
.event-poster { page: poster; position: relative; overflow: hidden; width: 210mm; min-height: 297mm; margin: 0 auto; padding: 17mm; display: flex; flex-direction: column; color: var(--ink); background:
  radial-gradient(circle at 93% 7%, rgba(245,200,91,.55), transparent 18%),
  linear-gradient(150deg, #f7fbfd 0%, #fffefa 48%, #eef8fc 100%);
  box-shadow: 0 18px 55px rgba(3,93,134,.18);
}
.event-poster::before { position: absolute; top: -48mm; right: -42mm; width: 130mm; height: 130mm; border: 1px solid rgba(4,128,182,.13); border-radius: 50%; content: ""; box-shadow: 0 0 0 18mm rgba(4,128,182,.035), 0 0 0 36mm rgba(4,128,182,.025); }
.poster-header { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; }
.poster-header img { width: 58mm; height: auto; }
.poster-header > span { padding: 2.2mm 4mm; border-radius: 999px; color: #fff; background: var(--coral); font-size: 8pt; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.poster-main { position: relative; z-index: 2; display: grid; grid-template-columns: 34mm minmax(0,1fr); align-items: center; gap: 10mm; margin-top: 19mm; }
.poster-date { width: 34mm; height: 42mm; display: grid; place-content: center; justify-items: center; border-radius: 8mm; color: #fff; background: linear-gradient(145deg, #035d86, #0480b6); box-shadow: 0 5mm 12mm rgba(4,128,182,.22); }
.poster-date strong { font-family: Montserrat, Arial, sans-serif; font-size: 33pt; font-weight: 700; line-height: .82; }
.poster-date span { margin-top: 3mm; font-size: 10pt; font-weight: 900; letter-spacing: .12em; }
.poster-date small { margin-top: 1mm; color: rgba(255,255,255,.75); font-size: 8pt; }
.poster-title > span, .poster-kicker { color: var(--coral-dark); font-size: 8pt; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.poster-title h1 { max-width: 125mm; margin: 2mm 0 3mm; color: var(--forest); font-family: Montserrat, Arial, sans-serif; font-size: 37pt; font-weight: 700; line-height: .98; letter-spacing: -.035em; }
.poster-title p { margin: 0; color: #4e6470; font-size: 12pt; font-weight: 700; }
.poster-description { position: relative; z-index: 2; max-height: 38mm; overflow: hidden; margin: 13mm 0 0 44mm; padding-top: 6mm; border-top: .5mm solid rgba(4,128,182,.16); color: #52656d; font-size: 10.5pt; line-height: 1.55; }
.poster-registration { position: relative; z-index: 2; margin-top: auto; display: grid; grid-template-columns: minmax(0,1fr) 55mm; align-items: center; gap: 12mm; padding: 12mm; border-radius: 9mm; color: #fff; background: linear-gradient(140deg, #035d86, #0480b6); box-shadow: 0 7mm 18mm rgba(4,128,182,.2); }
.poster-registration h2 { margin: 2mm 0; font-family: Montserrat, Arial, sans-serif; font-size: 25pt; font-weight: 700; line-height: 1; }
.poster-registration-copy > p { max-width: 92mm; margin: 0; color: rgba(255,255,255,.76); font-size: 9.5pt; }
.poster-registration .poster-kicker { color: #ffd7c9; }
.poster-registration dl { margin: 7mm 0 0; }
.poster-registration dl div { display: flex; justify-content: space-between; gap: 6mm; padding: 2.5mm 0; border-bottom: .3mm solid rgba(255,255,255,.18); }
.poster-registration dt { color: rgba(255,255,255,.68); font-size: 8pt; }
.poster-registration dd { margin: 0; font-size: 8pt; font-weight: 850; text-align: right; }
.poster-qr { min-width: 0; display: grid; justify-items: center; padding: 4mm; border-radius: 5mm; color: var(--forest); background: #fff; text-align: center; }
.poster-qr img { display: block; width: 45mm; height: 45mm; image-rendering: crisp-edges; }
.poster-qr strong { margin-top: 2mm; font-size: 7.5pt; letter-spacing: .08em; }
.poster-qr small { display: block; width: 46mm; margin-top: 1.2mm; overflow: hidden; color: var(--muted); font-size: 5.5pt; text-overflow: ellipsis; white-space: nowrap; }
.poster-footer { position: relative; z-index: 2; display: flex; justify-content: space-between; gap: 10mm; padding: 8mm 2mm 0; color: #68808b; font-size: 8pt; }
.poster-footer strong { color: var(--forest); }

@media (max-width: 1050px) {
  .desktop-nav { gap: 0; }
  .desktop-nav a { padding: 0 9px; }
  .user-copy { display: none; }
  .participant-row { grid-template-columns: minmax(180px,1.4fr) 120px auto 80px auto; }
  .participant-actions { grid-column: 2 / -1; grid-row: 2; display: flex; justify-content: flex-end; }
}

@media (max-width: 820px) {
  body.app-shell { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  .topbar { height: 64px; }
  .topbar-inner { width: calc(100% - 30px); }
  .brand img { width: 165px; }
  .desktop-nav, .user-menu .user-avatar, .user-menu .user-copy { display: none; }
  .user-menu { display: flex; }
  .mobile-nav { position: fixed; right: 0; bottom: 0; left: 0; z-index: 60; min-height: 70px; display: flex; align-items: center; justify-content: space-around; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255,254,250,.97); backdrop-filter: blur(18px); box-shadow: 0 -10px 30px rgba(22,58,46,.08); }
  .mobile-nav a { min-width: 58px; display: grid; justify-items: center; gap: 4px; color: #7f8a84; font-size: 9px; font-weight: 750; text-decoration: none; }
  .mobile-nav svg { width: 21px; height: 21px; }
  .mobile-nav a.is-active { color: var(--forest); }
  .mobile-nav-main { margin-top: -25px; color: var(--coral) !important; }
  .mobile-nav-main svg { width: 48px; height: 48px; padding: 13px; border-radius: 50%; color: white; background: var(--coral); box-shadow: 0 8px 20px rgba(229,107,70,.3); }
  .page { min-height: calc(100vh - 64px); padding: 14px 0 34px; }
  .page > .container { min-height: calc(100vh - 112px); border-radius: 22px; }
  .page-space { padding: 28px 22px 48px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .analytics-grid { grid-template-columns: 1fr; }
  .confirmation-chart { border-right: 0; border-bottom: 1px solid var(--line); }
  .dashboard-chart-grid { grid-template-columns: 1fr; }
  .dashboard-performance { border-right: 0; border-bottom: 1px solid var(--line); }
  .revenue-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .event-grid { grid-template-columns: 1fr; }
  .form-layout, .detail-grid { grid-template-columns: 1fr; }
  .sticky-panel { position: static; }
  .event-hero { grid-template-columns: auto minmax(0,1fr); }
  .event-hero-actions { grid-column: 1 / -1; grid-template-columns: repeat(2, 1fr); }
  .participant-row { grid-template-columns: 1.3fr .9fr auto; align-items: end; }
  .participant-person { grid-column: 1 / -1; }
  .participant-actions { grid-column: 1 / -1; grid-row: auto; }
  .amount-field { grid-column: 1 / 2; }
  .people-list .person-row { grid-template-columns: auto minmax(0,1fr) 70px; }
  .person-card-id { grid-column: 2 / -1; justify-self: start; }
  .operator-grid { grid-template-columns: repeat(2, 1fr); }
  .login-page { grid-template-columns: 1fr; }
  .login-brand-panel { min-height: 310px; padding: 34px; }
  .login-brand-panel > img { width: 190px; }
  .login-brand-panel h1 { font-size: 48px; }
  .login-feature { display: none; }
  .login-form-panel { padding: 45px 24px; }
  .public-page { grid-template-columns: 1fr; }
  .public-event-card { position: static; min-height: 0; }
}

@media (max-width: 580px) {
  .container { width: calc(100% - 16px); }
  .page { padding-top: 8px; }
  .page > .container { border-radius: 18px; }
  .page-space { padding: 23px 15px 38px; }
  .page-heading h1 { font-size: 39px; }
  .heading-actions { align-items: flex-start; }
  .desktop-action { display: none; }
  .stats-grid { gap: 9px; margin-bottom: 34px; }
  .stat-card { min-height: 94px; gap: 10px; padding: 13px; border-radius: 15px; }
  .stat-icon { width: 35px; height: 35px; border-radius: 11px; font-size: 15px; }
  .stat-card strong { font-size: 24px; }
  .stat-card div > span { font-size: 9px; }
  .quick-grid { grid-template-columns: 1fr; }
  .filter-bar, .filter-simple { grid-template-columns: 1fr; }
  .event-list-row { min-height: 100px; gap: 11px; padding: 14px; }
  .event-list-row .date-tile { width: 48px; height: 58px; border-radius: 12px; }
  .event-list-row .date-tile strong { font-size: 22px; }
  .event-list-metric { display: none; }
  .panel-heading, .panel-body { padding: 17px; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .field-wide { grid-column: auto; }
  .form-layout { gap: 16px; }
  .event-hero { grid-template-columns: 1fr; gap: 18px; padding: 25px; }
  .event-hero-date { width: 68px; height: 82px; }
  .event-hero-date strong { font-size: 32px; }
  .event-hero-copy h1 { font-size: 36px; }
  .event-hero-actions { grid-column: auto; grid-template-columns: 1fr; }
  .stats-compact { grid-template-columns: repeat(2, 1fr); }
  .confirmation-chart { gap: 16px; padding: 20px 17px; }
  .donut-chart { width: 104px; height: 104px; }
  .donut-chart strong { font-size: 27px; }
  .progress-charts { gap: 18px; padding: 21px 17px 23px; }
  .dashboard-analytics { margin-top: -8px; margin-bottom: 34px; }
  .dashboard-performance, .event-distribution { padding: 21px 17px 24px; }
  .dashboard-confirmation { gap: 16px; }
  .event-bar-row { grid-template-columns: minmax(95px, .9fr) minmax(70px, 1fr) 22px; gap: 8px; }
  .dashboard-revenue { padding: 21px 17px 24px; }
  .revenue-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .revenue-metric { padding: 12px; }
  .revenue-metric strong { font-size: 14px; }
  .panel-heading-actions { align-items: flex-start; }
  .popover-card, .popover-wide { position: fixed; top: auto; right: 12px; bottom: calc(82px + env(safe-area-inset-bottom)); left: 12px; width: auto; max-height: calc(100vh - 120px); overflow-y: auto; }
  .participant-row { grid-template-columns: 1fr auto; padding: 16px; }
  .participant-person { grid-column: 1 / -1; }
  .compact-field { grid-column: 1 / 2; }
  .toggle-field { grid-column: 2 / 3; }
  .participant-actions { grid-column: 1 / -1; justify-content: stretch; }
  .participant-actions .button { flex: 1; }
  .people-list .person-row { grid-template-columns: auto minmax(0,1fr); gap: 10px; padding: 14px; }
  .person-meta { grid-column: 1; grid-row: 2; }
  .person-card-id { grid-column: 2; }
  .mobile-create { display: block; }
  .operator-grid { grid-template-columns: 1fr; }
  .impersonation-bar { align-items: stretch; flex-direction: column; gap: 7px; padding: 10px 14px; }
  .impersonation-bar form, .impersonation-bar .button { width: 100%; }
  .login-brand-panel { min-height: 270px; padding: 28px; }
  .login-brand-panel h1 { font-size: 39px; }
  .login-brand-panel p { font-size: 13px; }
  .login-form-panel { place-items: start center; padding-top: 38px; }
  .login-form h2 { font-size: 40px; }
  .public-header { height: 66px; padding: 0 18px; }
  .public-header img { width: 165px; }
  .public-page { width: calc(100% - 22px); margin: 12px auto 30px; gap: 12px; }
  .public-event-card, .public-form-card { padding: 25px 20px; border-radius: 19px; }
  .public-event-date strong { font-size: 44px; }
  .public-form-card h2 { font-size: 36px; }
  .modal { place-items: end center; padding: 0; }
  .modal-card { width: 100%; max-height: calc(100vh - 20px); border-width: 1px 0 0; border-radius: 22px 22px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .modal-header { padding: 19px 18px 15px; }
  .modal-header h2 { font-size: 25px; }
  .modal-body { padding: 18px; }
  .modal-actions { display: grid; grid-template-columns: 1fr; }
  .modal-actions .button { width: 100%; }
  .modal-actions .button-secondary { order: 2; }
  .assignment-option { grid-template-columns: auto minmax(0,1fr); }
  .assignment-owner { grid-column: 2; justify-self: start; max-width: 100%; }
  .receipt-shell { padding: 12px; }
  .receipt-actions { flex-direction: column; }
  .poster-shell { padding: 12px; overflow-x: auto; }
  .poster-toolbar { width: 100%; min-width: 0; align-items: stretch; flex-direction: column; }
  .poster-toolbar > div { align-items: stretch; flex-direction: column; }
  .event-poster { transform-origin: top left; }
}

@page receipt { size: 55mm auto; margin: 0; }
@page poster { size: A4 portrait; margin: 0; }

@media print {
  html, body { margin: 0; padding: 0; background: #fff; }
  body.receipt-shell { width: 55mm; min-width: 55mm; }
  .receipt-actions { display: none !important; }
  .thermal-receipt { page: receipt; width: 55mm; min-height: 0; margin: 0; padding: 3mm 3mm 6mm; box-shadow: none; break-inside: avoid; }
  .poster-toolbar { display: none !important; }
  .event-poster { page: poster; width: 210mm; min-height: 297mm; margin: 0; box-shadow: none; break-inside: avoid; }
}