.workspace-active { --brand-link: #45652d; --brand-tint: #eef3e4; --brand-on-accent: #203326; --lime: #c4f35b; }
/* Light account workspace: the public site's paper, typography and brand continue here.
   Role hues are navigational context only; access still comes from capabilities. */
.workspace-active {
  --paper: #f6f5f1;
  --white: #fffefa;
  --ink: #272c2c;
  --muted: #626963;
  --line: #e0e2da;
  --surface-soft: #efefe9;
  --role-accent: var(--brand-link);
  --role-tint: var(--brand-tint);
  color-scheme: light;
  background: var(--paper);
  color: var(--ink);
}
.workspace-active[data-workspace-role='organizer'] { --role-accent: #89622e; --role-tint: #f5eee1; }
.workspace-active[data-workspace-role='owner'] { --role-accent: #526b50; --role-tint: #eaf0e6; }
.workspace-active[data-workspace-role='admin'] { --role-accent: #52667c; --role-tint: #eaf0f6; }
.workspace-active[data-workspace-role='tester'] { --role-accent: #726077; --role-tint: #f1ebf3; }
.workspace-active .shell { max-width: 1500px; padding-inline: 4%; }
.workspace-active .topbar {
  min-height: 82px;
  padding: 17px 4%;
  gap: 23px;
  background: var(--white);
  border-top: 3px solid var(--lime);
  border-bottom: 1px solid var(--line);
}
.workspace-active .topbar .brand { color: var(--ink); font-size: 25px; flex-shrink: 0; }
.workspace-active .topbar .brand svg { color: var(--brand-link); }
.workspace-active .topbar .button,
.workspace-active .topbar a { color: var(--ink); }
.workspace-active .topbar nav { font-size: 12px; gap: 20px; align-items: center; }
.workspace-active .topbar nav a { padding-block: 9px; }
.workspace-active .topbar nav a:hover { color: var(--brand-link); }
.workspace-active .topbar .auth-actions { gap: 7px; }
.workspace-active .topbar .auth-actions .button { padding: 9px 11px; font-size: 11px; min-height: 38px; }
.workspace-active #workspace-view { min-width: 0; }
.workspace-active .workspace-role { color: var(--muted); font-size: 11px; gap: 8px; }
.workspace-active .workspace-role select { min-width: 135px; font-size: 12px; padding: 9px 10px; }
.workspace-active .workspace-role-name {
  color: var(--role-accent);
  background: var(--role-tint);
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 12px;
}
.workspace-active .account-gate {
  background: transparent;
  border: 0;
  padding: 15px 0 0;
  gap: 12px;
}
.workspace-active .account-gate strong { color: var(--ink); font-size: 12px; font-weight: 600; }
.workspace-active .account-gate p { font-size: 11px; color: var(--muted); margin-top: 3px; }
.workspace-active .account-gate .state-dot { background: var(--role-accent); }
.workspace-active .account-gate .button { border: 0; color: var(--muted); background: transparent; }
.workspace-active .account-gate .button:hover { color: var(--brand-link); background: var(--surface-soft); }
.workspace-active #workspace-panels { grid-template-columns: 222px minmax(0,1fr); gap: 34px; padding: 26px 0 48px; }
.workspace-active .workspace-sidebar { top: 24px; min-width: 0; }
.workspace-active #workspace-menu-toggle {
  text-align: left;
  padding: 10px 12px;
  min-height: 42px;
  border-color: var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}
.workspace-active .workspace-sections { gap: 5px; margin: 0; padding: 8px 0; background: transparent; }
.workspace-active .workspace-nav-group { margin: 0; padding: 0; border: 0; min-width: 0; }
.workspace-active .workspace-nav-label {
  margin: 18px 12px 8px;
  color: var(--muted);
  font-family: inherit;
  font-size: 10px;
  line-height: 1.5;
  letter-spacing: .09em;
  text-transform: uppercase;
  font-weight: 700;
}
.workspace-active summary.workspace-nav-label {
  min-height: 36px;
  margin: 12px 0 3px;
  padding: 6px 12px;
  cursor: pointer;
}
.workspace-active summary.workspace-nav-label:before { content: '+'; color: var(--muted); font-size: 15px; margin-right: 4px; }
.workspace-active details[open]>summary.workspace-nav-label:before { content: '-'; }
.workspace-active .workspace-nav-links { display: grid; gap: 3px; }
.workspace-active .workspace-sections .button {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 8px;
  min-height: 42px;
  padding: 10px 12px;
  background: transparent;
  color: var(--ink);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
}
.workspace-active .workspace-sections .button:hover { background: var(--surface-soft); transform: none; filter: none; }
.workspace-active .workspace-sections [aria-current='page'] {
  background: var(--role-tint);
  border-color: transparent;
  color: var(--role-accent);
  font-weight: 700;
}
.workspace-active .workspace-nav-icon { display: block; width: 18px; height: 18px; flex: 0 0 18px; color: currentColor; opacity: .8; }
.workspace-active .workspace-brand-note { margin: 20px 12px 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.7; }
.workspace-active #workspace-panels.menu-collapsed { grid-template-columns: 94px minmax(0,1fr); }
.workspace-active .menu-collapsed .workspace-brand-note { display: none; }
.workspace-active .workspace-main { min-width: 0; }
.workspace-active .workspace-breadcrumb { margin: 0 0 9px; color: var(--role-accent); font-size: 11px; font-weight: 600; letter-spacing: .03em; line-height: 1.6; }
.workspace-active .workspace-heading { margin: 0 0 8px; color: var(--ink); font-size: clamp(30px,3vw,42px); line-height: 1.12; }
.workspace-active .workspace-status { color: var(--muted); margin: 0 0 14px; min-height: 0; font-size: 11px; }
.workspace-active .workspace-status:empty { display: none; }
.workspace-active .workspace-grid { max-width: none; gap: 22px; margin: 20px 0; }
.workspace-active .workspace-static { min-width: 0; }
.workspace-active .workspace-card,
.workspace-active .workspace-card>.workspace-list>.workspace-card,
.workspace-active .dashboard-row,
.workspace-active .group-card,
.workspace-active .best-card,
.workspace-active .route-copy {
  background: var(--white);
  border-color: var(--line);
  color: var(--ink);
  border-radius: 12px;
  box-shadow: 0 2px 5px #24342603;
}
.workspace-active .workspace-card { padding: 26px; }
.workspace-active .workspace-card h3 { font-size: 20px; line-height: 1.4; letter-spacing: -.025em; }
.workspace-active .workspace-row { border-color: var(--line); border-radius: 9px; background: transparent; }
.workspace-active .dashboard { gap: 22px; min-width: 0; }
.workspace-active .dashboard-intro h3 { margin: 0 0 10px; font-family: 'Barlow Condensed',Arial,sans-serif; font-size: clamp(28px,3vw,40px); line-height: 1.13; letter-spacing: -.015em; }
.workspace-active .dashboard-intro p { color: var(--muted); font-size: 13px; line-height: 1.7; max-width: 470px; margin: 0; }
.workspace-active .dashboard-welcome {
  display: grid;
  grid-template-columns: minmax(0,1.5fr) minmax(0,1fr);
  min-height: 220px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--white);
}
.workspace-active .dashboard-welcome-copy { padding: 30px; min-width: 0; align-self: center; }
.workspace-active .dashboard-welcome-copy .eyebrow { color: var(--brand-link); margin-bottom: 15px; font-size: 10px; }
.workspace-active .dashboard-welcome-image { display: block; width: 100%; height: 100%; min-height: 220px; max-height: 290px; object-fit: cover; object-position: 60% center; }
.workspace-active .dashboard-discover { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.workspace-active .dashboard-discover-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  color: var(--ink);
  text-decoration: none;
  transition: border-color .15s,background .15s;
}
.workspace-active .dashboard-discover-card:hover { border-color: var(--brand-link); background: var(--brand-tint); }
.workspace-active .dashboard-discover-card>span { color: var(--brand-link); font-size: 12px; font-weight: 700; }
.workspace-active .dashboard-discover-card>strong { font-size: 15px; line-height: 1.4; }
.workspace-active .dashboard-discover-card>small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.workspace-active .dashboard-metrics { grid-template-columns: repeat(auto-fit,minmax(min(100%,160px),1fr)); gap: 12px; }
.workspace-active .dashboard-metric { padding: 20px; background: var(--white); border: 1px solid var(--line); border-radius: 10px; }
.workspace-active .dashboard-metric strong { color: var(--ink); font-size: 36px; }
.workspace-active .dashboard-actions { gap: 9px; }
.workspace-active .dashboard-row { padding: 19px 22px; gap: 12px; }
.workspace-active .stats { gap: 0; border: 1px solid var(--line); background: var(--white); border-radius: 12px; margin: 18px 0 22px; }
.workspace-active .stat { padding: 20px; background: transparent; border-right: 1px solid var(--line); }
.workspace-active .stat:last-child { border-right: 0; }
.workspace-active .stat-value { color: var(--ink); font-size: 36px; }
.workspace-active .stat-label { color: var(--muted); font-size: 11px; }
.workspace-active .stat-note { color: var(--muted); font-size: 10px; }
.workspace-active .button { border-radius: 7px; min-height: 42px; white-space: normal; line-height: 1.5; }
.workspace-active .outline,
.workspace-active .light { background: transparent; color: var(--ink); border-color: #b9c1b6; }
.workspace-active .outline:hover,
.workspace-active .light:hover { background: var(--surface-soft); }
.workspace-active .lime,
.workspace-active .topbar .lime { background: var(--lime); color: var(--brand-on-accent); border-color: transparent; }
.workspace-active input,
.workspace-active select,
.workspace-active textarea {
  background: var(--white);
  border-color: #b9c1b6;
  border-radius: 6px;
  color: var(--ink);
  color-scheme: light;
  max-width: 100%;
}
.workspace-active input::placeholder,
.workspace-active textarea::placeholder { color: #747b73; opacity: 1; }
.workspace-active input[type='checkbox'] { accent-color: var(--brand-link); }
.workspace-active .workspace-form { gap: 19px; }
.workspace-active .workspace-form fieldset { border-radius: 8px; border-color: var(--line); min-width: 0; }
.workspace-active .workspace-form legend,
.workspace-active .workspace-form label { color: var(--ink); }
.workspace-active .workspace-form label { font-size: 12px; }
.workspace-active .filters,
.workspace-active th,
.workspace-active .event-list-row,
.workspace-active .event-create,
.workspace-active .event-setup-grid>details,
.workspace-active .event-map-card,
.workspace-active .event-score-card { background: var(--white); border-color: var(--line); color: var(--ink); }
.workspace-active th { background: var(--surface-soft); color: #535e52; }
.workspace-active td { border-color: var(--line); }
.workspace-active .pill { background: var(--role-tint); border-color: var(--line); color: var(--role-accent); }
.workspace-active .empty { background: var(--surface-soft); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; }
.workspace-active .empty p { color: var(--muted); }
.workspace-active .notice,
.workspace-active .event-demo { background: #f6f0e3; border-color: #dfcba5; color: #695025; }
.workspace-active .error { background: #fff0eb; border-color: #dbb5a5; color: #873d26; }
.workspace-active .event-secret { background: #fff6df; border-color: #decb99; color: #6f5421; }
.workspace-active .event-secret textarea { background: #fffdf5; color: #55441e; border-color: #c8b789; }
.workspace-active .event-stats { background: var(--surface-soft); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; }
.workspace-active .event-stat { border-color: var(--line); }
.workspace-active .event-stat strong { color: var(--ink); }
.workspace-active .event-stat span { color: var(--muted); }
.workspace-active .event-ranking .time { color: var(--brand-link); }
.workspace-active .event-ranking td:first-child { color: var(--muted); }
.workspace-active .race-details,
.workspace-active .race-schedule-row,
.workspace-active .race-notice { border-color: var(--line); }
.workspace-active .race-tabs [aria-current='true'] { background: var(--brand-tint); border-color: var(--brand-link); color: var(--brand-link); }
.workspace-active .community-panel { background: var(--white); border-radius: 12px; border-color: var(--line); }
.workspace-active .community-card { border-color: var(--line); }
.workspace-active .crew-card { border-color: var(--line); border-radius: 12px; background: var(--white); color: var(--ink); }
.workspace-active .crew-form input,
.workspace-active .crew-form textarea,
.workspace-active .crew-form select { background: var(--white); color: var(--ink); }
.workspace-active .attendance-proposal { background: var(--white); border-color: var(--line); border-left-color: var(--brand-link); }
.workspace-active summary:before { color: var(--brand-link); }
.workspace-active :focus-visible { outline: 3px solid var(--brand-link); outline-offset: 3px; }
.workspace-active .suggestions-toggle { background: var(--white); color: var(--ink); border-color: var(--line); box-shadow: 0 4px 16px #21312612; font-size: 13px; }
.workspace-active .suggestions-dialog { background: var(--white); border-color: var(--line); box-shadow: 0 12px 50px #20302026; }
.workspace-active footer { background: var(--white); color: var(--muted); border-top: 1px solid var(--line); padding: 28px 4%; }
.workspace-active footer .brand { color: var(--ink); }
.workspace-active footer p,
.workspace-active footer>a:last-child { color: var(--muted); }
.workspace-active footer a:hover { color: var(--brand-link); }
@media (max-width: 1150px) and (min-width: 701px) {
  .workspace-active .topbar { gap: 16px; }
  .workspace-active .topbar nav { gap: 13px; }
  .workspace-active .topbar .auth-actions { margin-left: auto; }
  .workspace-active #workspace-panels { grid-template-columns: 196px minmax(0,1fr); gap: 24px; }
  .workspace-active .dashboard-welcome-copy { padding: 24px; }
  .workspace-active .dashboard-discover-card { padding: 17px; }
}
@media (max-width: 850px) {
  .workspace-active .dashboard-welcome { grid-template-columns: minmax(0,1.7fr) minmax(0,1fr); }
  .workspace-active .dashboard-welcome-image { max-height: 300px; }
  .workspace-active .dashboard-discover { grid-template-columns: 1fr; gap: 10px; }
  .workspace-active .dashboard-discover-card { padding: 17px 20px; gap: 5px; }
  .workspace-active .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .workspace-active .stat:nth-child(2) { border-right: 0; }
  .workspace-active .stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 700px) {
  .workspace-active .shell { padding-inline: 5%; }
  .workspace-active .topbar { min-height: 68px; padding: 10px 5%; gap: 12px; }
  .workspace-active .topbar .brand { font-size: 23px; }
  .workspace-active .topbar .account-menu-toggle { background: var(--white); border-color: var(--line); }
  .workspace-active .account-menu-open .topbar-tools { background: var(--white); border-color: var(--line); box-shadow: 0 10px 35px #2031261a; }
  .workspace-active .account-menu-open .portal-explore { display: flex; flex-direction: column; gap: 0; align-items: stretch; margin: 0; }
  .workspace-active .account-menu-open .portal-explore a { min-height: 44px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
  .workspace-active .topbar-tools .workspace-role { display: flex; white-space: normal; align-items: center; }
  .workspace-active .topbar-tools .workspace-role select { min-width: 0; font-size: 16px; }
  .workspace-active .topbar-tools .auth-actions .button { min-height: 44px; font-size: 14px; }
  .workspace-active .account-gate { padding-top: 12px; align-items: center; flex-direction: row; }
  .workspace-active .account-gate .gate-actions { width: auto; flex-shrink: 0; }
  .workspace-active #workspace-panels,
  .workspace-active #workspace-panels.menu-collapsed { display: block; padding: 20px 0 36px; }
  .workspace-active .workspace-sidebar { position: static; display: block; margin-bottom: 22px; }
  .workspace-active #workspace-menu-toggle { width: auto; min-width: 100px; min-height: 44px; }
  .workspace-active .workspace-sidebar .workspace-sections:not([hidden]) { display: flex; max-height: 60dvh; overflow-y: auto; margin-top: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
  .workspace-active .workspace-nav-label { margin-top: 13px; }
  .workspace-active .workspace-sections .button { font-size: 13px; min-height: 44px; }
  .workspace-active .workspace-brand-note { display: none; }
  .workspace-active .workspace-breadcrumb { font-size: 10px; margin-bottom: 6px; }
  .workspace-active .workspace-heading { font-size: 32px; }
  .workspace-active .workspace-grid { margin-top: 16px; gap: 18px; }
  .workspace-active .workspace-card { padding: 20px; }
  .workspace-active .workspace-card h3 { font-size: 19px; }
  .workspace-active .dashboard { gap: 18px; }
  .workspace-active .dashboard-welcome { grid-template-columns: 1fr; min-height: 0; }
  .workspace-active .dashboard-welcome-copy { padding: 24px; }
  .workspace-active .dashboard-intro h3 { font-size: 32px; }
  .workspace-active .dashboard-welcome-image { min-height: 0; height: 145px; max-height: 145px; object-position: center 52%; }
  .workspace-active .dashboard-discover { gap: 10px; }
  .workspace-active .dashboard-actions .button { flex: 1 1 140px; }
  .workspace-active .dashboard-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .workspace-active .dashboard-metric { padding: 16px; }
  .workspace-active .dashboard-metric strong { font-size: 32px; }
  .workspace-active .stat { padding: 16px; }
  .workspace-active .stat-value { font-size: 32px; }
  .workspace-active .dashboard-row { padding: 18px; }
  .workspace-active .workspace-form,
  .workspace-active .event-form { grid-template-columns: minmax(0,1fr); }
  .workspace-active input,
  .workspace-active select,
  .workspace-active textarea { font-size: 16px; }
  .workspace-active .event-stat:nth-child(-n+2) { border-color: var(--line); }
  .workspace-active footer { padding: 26px 5%; gap: 18px; }
}
@media (max-width: 360px) {
  .workspace-active .topbar { grid-template-columns:minmax(0,1fr) auto;gap:8px; }
  .workspace-active .topbar .brand { font-size:20px;gap:7px;min-width:0; }
  .workspace-active .topbar .brand svg { width:28px;flex-shrink:0; }
  .workspace-active .dashboard-welcome-copy { padding: 20px; }
  .workspace-active .workspace-card { padding: 16px; }
  .workspace-active .workspace-form fieldset { grid-template-columns: minmax(0,1fr); }
  .workspace-active .account-gate .button { padding-inline: 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .workspace-active .dashboard-discover-card { transition: none; }
}

/* Community tools keep their live DOM while their collapsed entry points share a row. */
.workspace-active .portal-community-tools { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0 0; }
.workspace-active .portal-community-tools:has(> :not([hidden])) { min-width:0; }
.workspace-active .portal-community-tools > *,
.workspace-active .portal-community-tools > #community-panel > .workspace-card { margin:0;min-width:0; }
.workspace-active .portal-community-tools > .workspace-card,
.workspace-active .portal-community-tools > #community-panel > .workspace-card { padding:6px 14px;border-radius:9px; }
.workspace-active .portal-community-tools > #community-routes > details > summary,
.workspace-active .portal-community-tools > .crew-panel > details > summary,
.workspace-active .portal-community-tools > #community-panel > details > summary { font-family:inherit;font-size:12px;font-weight:600;min-height:44px;line-height:1.5; }
.workspace-active .portal-community-tools > :has(> details[open]) { grid-column:1/-1; }
.workspace-active .portal-community-tools > :has(> details[open]),
.workspace-active .portal-community-tools > #community-panel:has(> details[open]) > .workspace-card { padding:20px; }
.workspace-active .portal-community-tools > #community-panel { padding:0; }
.workspace-active .topbar .portal-explore { display:flex; }
.workspace-active .dashboard-welcome-image { aspect-ratio:3/2; }
.workspace-active .dashboard-intro h3 { overflow-wrap:anywhere; }
@media(max-width:700px) {
 .workspace-active .portal-community-tools { grid-template-columns:1fr;gap:5px;margin-top:14px; }
 .workspace-active .portal-community-tools > .workspace-card,
 .workspace-active .portal-community-tools > #community-panel > .workspace-card { padding:0 12px; }
 .workspace-active .topbar .portal-explore { display:none; }
 .workspace-active .account-menu-open .portal-explore { display:flex; }
}