:root {
  color-scheme:light;
  --bg:#f6f5fa;
  --surface:#fff;
  --ink:#262239;
  --muted:#79758b;
  --line:#eeedf3;
  --purple:#7952e8;
  --teal:#1c9f91;
  --lilac:#f1ecfd;
  --green:#e8f6ef;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-synthesis:none;
}
* {
  box-sizing:border-box;
}
body {
  margin:0;
  color:var(--ink);
  background:var(--bg);
  font-size:14px;
  line-height:1.5;
}
button,input,select {
  font:inherit;
}
button,a,summary,select {
  -webkit-tap-highlight-color:transparent;
}
button,summary,select {
  cursor:pointer;
}
button:disabled {
  cursor:wait;
  opacity:.6;
}
a {
  color:var(--purple);
}
[hidden] {
  display:none!important;
}
h1,h2,p {
  margin:0;
}
h1 {
  font-size:32px;
  line-height:1.2;
  letter-spacing:-1px;
  font-weight:700;
}
h2 {
  font-size:16px;
  letter-spacing:-.2px;
}
button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible {
  outline:3px solid #b49bf6;
  outline-offset:3px;
}
input,select {
  border:1px solid #e2dfeb;
  border-radius:9px;
  background:#fff;
  color:var(--ink);
  padding:10px 12px;
  min-height:42px;
}
label {
  display:grid;
  gap:7px;
  font-size:13px;
  font-weight:600;
}
input {
  min-width:0;
  width:100%;
}
.button {
  border:0;
  border-radius:9px;
  min-height:44px;
  padding:10px 20px;
  font-weight:600;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:7px;
}
.primary {
  background:var(--purple);
  color:white;
}
.secondary {
  background:white;
  border:1px solid #e6e2ee;
  color:#514a66;
}
.compact {
  padding:9px 13px;
  min-height:42px;
}
.text-button {
  border:0;
  background:transparent;
  color:var(--muted);
  padding:10px 3px;
  min-height:42px;
  font-size:13px;
}
.text-button:hover {
  color:var(--purple);
}
.muted,.subtitle {
  color:var(--muted);
}
.brand {
  display:flex;
  align-items:center;
  gap:9px;
  text-decoration:none;
  color:#302448;
  font-size:29px;
  letter-spacing:-1.5px;
  font-weight:750;
}
.brand img {
  width:35px;
  height:35px;
  border-radius:12px;
}
.brand-dot {
  color:var(--purple);
}
.eyebrow {
  color:#746a80;
  font-size:11px;
  font-weight:700;
  letter-spacing:1.8px;
  margin-bottom:8px;
}
.subtitle {
  margin-top:8px;
  font-size:13px;
}
.freshness {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#746a80;
  font-size:12px;
  margin:22px 0 18px;
  gap:12px;
}
.freshness>span:first-child {
  display:flex;
  align-items:center;
  gap:7px;
}
.status-dot,.private-badge i {
  height:6px;
  width:6px;
  display:inline-block;
  border-radius:50%;
  background:#44ac84;
}
.notice {
  padding:12px 16px;
  border-radius:10px;
  background:#fff4df;
  color:#746a80;
  margin-bottom:16px;
  font-size:13px;
}
.metrics {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.metric-card {
  background:white;
  border:1px solid var(--line);
  padding:20px 22px;
  border-radius:15px;
}
.metric-heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  color:#726c82;
  font-size:12px;
  font-weight:500;
  gap:6px;
}
.metric-icon {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:9px;
  font-size:18px;
  flex-shrink:0;
}
.metric-primary {
  color:var(--ink);
  text-decoration:none;
  background:linear-gradient(120deg,#f0eafa,#fff 90%);
  border-color:#e1d6f6;
}
.metric-primary:hover {
  border-color:#b49bf6;
}
.metric-link {
  color:var(--ink);
  text-decoration:none;
}
.metric-link:hover {
  border-color:#b49bf6;
}
.event-size-histogram {
  max-width:640px;
  margin-inline:auto;
}
#event-size-details, #retention-details {
  scroll-margin-top:24px;
}
#event-size-details:focus-visible, #retention-details:focus-visible {
  outline:3px solid #b49bf6;
  outline-offset:3px;
}
.metric-primary .metric-heading {
  font-size:14px;
  font-weight:600;
}
.metric-action {
  display:block;
  font-size:12px;
  color:#6840ce;
  margin-top:12px;
  font-weight:600;
}
.period-filter {
  font-size:11px;
  font-weight:500;
  color:var(--muted);
  gap:4px;
}
.chart-controls {
  display:grid;
  justify-items:end;
  gap:8px;
  flex-shrink:0;
}
.segmented-control {
  display:flex;
  padding:3px;
  border-radius:9px;
  background:#f5f2fa;
}
.segmented-control button {
  border:0;
  border-radius:7px;
  padding:7px 10px;
  min-height:36px;
  color:#746a80;
  background:transparent;
  font-size:12px;
}
.segmented-control button[aria-pressed="true"] {
  background:#fff;
  color:#6840ce;
  font-weight:600;
  box-shadow:0 1px 3px #30244812;
}
#attendance-panel {
  scroll-margin-top:24px;
}
#attendance-panel:focus-visible {
  outline:3px solid #b49bf6;
  outline-offset:3px;
}
.purple {
  background:#f0eafa;
  color:var(--purple);
}
.green {
  background:#e9f6ee;
  color:#409c6f;
}
.teal {
  background:#e5f5f2;
  color:var(--teal);
}
.metric-card>strong {
  display:block;
  font-size:36px;
  font-weight:650;
  letter-spacing:-1.5px;
  line-height:1.3;
  margin:10px 0 5px;
}
.metric-card>p {
  color:#746a80;
  font-size:12px;
}
.metric-primary>strong {
  font-size:36px;
  color:#6840ce;
}
.metric-card .active-total {
  font-size:14px;
  font-weight:600;
  color:#79758b;
}
.metric-card .metric-note {
  font-size:11px;
  margin-top:7px;
}
.metric-card>strong.positive {
  color:#237b5e;
}
.metric-card>strong.negative {
  color:#b14b5c;
}
.panel {
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:23px;
}
.charts {
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);
  gap:18px;
  margin-top:20px;
}
.panel-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}
.panel-heading p {
  font-size:12px;
  color:#746a80;
  margin-top:5px;
}
.legend {
  display:flex;
  gap:13px;
  color:#746a80;
  font-size:11px;
  white-space:nowrap;
  margin-top:5px;
}
.legend span {
  display:flex;
  align-items:center;
  gap:5px;
}
.legend i {
  width:7px;
  height:7px;
  border-radius:50%;
}
.start-key {
  background:var(--purple);
}
.finish-key {
  background:var(--teal);
}
.chart {
  position:relative;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:22px 0 5px;
}
.chart svg {
  display:block;
  width:100%;
  height:auto;
  overflow:visible;
  font-family:inherit;
}
.chart svg text {
  font-size:12px;
}
.histogram svg text {
  font-size:15px;
}
.chart svg [tabindex]:focus {
  outline:2px solid var(--purple);
  outline-offset:2px;
}
.chart-empty {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:8px;
  padding:20px;
}
.chart-empty strong {
  font-size:13px;
  font-weight:550;
  background:#ffffffdc;
  padding:0 12px;
}
.chart-empty p {
  font-size:12px;
  color:#746a80;
  max-width:250px;
  background:#ffffffdc;
}
.chart-caption {
  font-size:11px;
  color:#746a80;
  line-height:1.6;
}
.chart-data {
  font-size:12px;
  margin-top:12px;
}
.chart-data>summary {
  color:#746a80;
  list-style:none;
}
.chart-data>summary::before {
  content:"+ ";
  color:var(--purple);
}
.chart-data[open]>summary::before {
  content:"− ";
}
.distribution-stats {
  display:flex;
  gap:32px;
  margin-top:20px;
}
.distribution-stats>div {
  display:flex;
  align-items:baseline;
  gap:7px;
}
.distribution-stats strong {
  font-size:23px;
  font-weight:650;
  letter-spacing:-.5px;
}
.distribution-stats span {
  font-size:11px;
  color:#746a80;
}
.histogram {
  min-height:180px;
  margin-top:10px;
}
.journey {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  margin-top:20px;
  padding:20px 23px;
}
.journey-label {
  display:flex;
  align-items:center;
  gap:15px;
}
.journey-icon {
  background:var(--lilac);
  color:var(--purple);
  font-size:24px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:12px;
}
.journey h2 {
  font-size:13px;
}
.journey p {
  font-size:12px;
  color:#746a80;
  margin-top:4px;
}
.journey-progress {
  width:33%;
  min-width:180px;
}
.journey-numbers {
  display:flex;
  justify-content:space-between;
  gap:15px;
  font-size:12px;
  color:#746a80;
  margin-bottom:8px;
}
.journey-numbers strong {
  color:var(--purple);
  font-weight:600;
}
.progress-track {
  height:6px;
  border-radius:20px;
  background:#eee9f6;
  overflow:hidden;
}
.progress-track>span {
  display:block;
  height:100%;
  width:0;
  background:var(--purple);
  border-radius:20px;
  transition:width .3s;
}
.details-heading {
  display:flex;
  align-items:baseline;
  gap:15px;
  margin:31px 0 14px;
}
.details-heading h2 {
  font-size:14px;
}
.details-heading p {
  font-size:12px;
  color:#746a80;
}
.detail-panel {
  background:white;
  border:1px solid var(--line);
  border-radius:13px;
  margin-bottom:10px;
  scroll-margin-top:20px;
}
.detail-panel>summary {
  padding:17px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  list-style:none;
}
.detail-panel>summary::-webkit-details-marker {
  display:none;
}
.detail-panel>summary strong {
  font-size:12px;
  font-weight:600;
  display:block;
}
.detail-panel>summary small {
  display:block;
  color:#746a80;
  font-size:11px;
  margin-top:3px;
}
.detail-chevron {
  color:#746a80;
  font-size:20px;
  font-weight:300;
}
.detail-panel[open] .detail-chevron {
  transform:rotate(45deg);
}
.detail-content {
  border-top:1px solid var(--line);
  padding:18px 20px;
}
.table-scroll {
  overflow:auto;
  max-width:100%;
}
table {
  border-collapse:collapse;
  width:100%;
  text-align:left;
  font-size:12px;
  white-space:nowrap;
}
th {
  color:#746a80;
  font-weight:500;
  font-size:11px;
  padding:12px 13px 12px 0;
}
td {
  padding:13px 13px 13px 0;
  border-top:1px solid #f2eff6;
  color:#60566f;
}
td.event-title {
  color:var(--ink);
  max-width:260px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.table-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:12px;
}
.table-toolbar p,.detail-note {
  font-size:12px;
  color:#746a80;
  line-height:1.7;
}
.table-toolbar input {
  font-size:12px;
  min-height:36px;
  padding:7px 10px;
  max-width:220px;
}
.detail-note {
  margin-top:10px;
}
.badge {
  font-size:11px;
  background:#f2eef9;
  color:#746a80;
  border-radius:5px;
  padding:4px 7px;
}
.badge.late {
  background:#fff3dc;
  color:#746a80;
}
.supporting-stats {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  padding:4px 0 15px;
}
.supporting-stats dt {
  font-size:12px;
  color:#746a80;
}
.supporting-stats dd {
  margin:7px 0 0;
  font-size:22px;
  font-weight:600;
  letter-spacing:-.5px;
}
.definitions p {
  font-size:12px;
  color:#746a80;
  margin:0 0 13px;
  line-height:1.75;
}
.definitions strong {
  color:#62536e;
  font-weight:550;
}
.page-footer {
  display:flex;
  justify-content:space-between;
  color:#746a80;
  font-size:11px;
  padding:24px 0 0;
}
.auth-view {
  display:grid;
  place-items:center;
  min-height:100vh;
  padding:28px;
  background:radial-gradient(ellipse at 25% 20%,#eae1fa70,transparent 50%),var(--bg);
}
.auth-card {
  max-width:420px;
  width:100%;
  background:white;
  border:1px solid #ede7f2;
  border-radius:22px;
  padding:36px;
  box-shadow:0 18px 70px #39235709;
}
.admin-label {
  display:block;
  margin:30px 0 10px;
  font-size:11px;
  color:#746a80;
  text-transform:uppercase;
  letter-spacing:1.6px;
  font-weight:650;
}
.auth-card h1 {
  font-size:29px;
  margin-bottom:13px;
  letter-spacing:-.8px;
}
.auth-card .muted {
  font-size:13px;
  line-height:1.7;
}
.auth-card form {
  display:grid;
  gap:16px;
  margin-top:26px;
}
.auth-divider {
  position:relative;
  text-align:center;
  margin:22px 0 15px;
  font-size:11px;
  color:#746a80;
}
.auth-divider::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  background:var(--line);
}
.auth-divider span {
  position:relative;
  background:white;
  padding:0 12px;
}
.provider-buttons {
  display:flex;
  gap:10px;
}
.provider-buttons button {
  flex:1;
}
.auth-message {
  font-size:12px;
  color:#746a80;
  line-height:1.7;
  margin-top:17px;
}
.auth-message.error {
  color:#746a80;
}
.auth-footer {
  font-size:11px;
  color:#746a80;
  text-align:center;
  margin-top:22px;
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.skip-link {
  position:fixed;
  left:250px;
  top:-100px;
  z-index:100;
  background:var(--purple);
  color:white;
  padding:12px;
}
.skip-link:focus {
  top:10px;
}
@media(prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto!important;
    transition:none!important;
  }
}
