/* Task-first race discovery. All controls remain native, keyboard-accessible
   controls; the same event row supports both list and card presentation. */
.race-workflow { --race-surface: #121820; --race-border: #2a323e; --race-muted: #a7b3c2; }
.gu-ui-system .race-browser-toolbar, .gu-ui-system .race-results-meta, .gu-ui-system .race-filter-status { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.gu-ui-system .race-browser-toolbar { margin-bottom:18px; }
.gu-ui-system .race-category-tabs, .gu-ui-system .race-view-toggle { display:flex; gap:4px; padding:4px; background:#0d1219; border:1px solid var(--race-border); border-radius:12px; }
.gu-ui-system .race-category-tabs button, .gu-ui-system .race-view-toggle button { min-height:42px; border:1px solid transparent; background:transparent; color:var(--race-muted); border-radius:8px; padding:8px 13px; font-family:inherit; font-size:14px; font-weight:600; line-height:1.3; cursor:pointer; }
.gu-ui-system .race-category-tabs button[aria-pressed="true"], .gu-ui-system .race-view-toggle button[aria-pressed="true"] { color:#fff; background:#262232; border-color:#645075; box-shadow:none; }
.gu-ui-system .race-category-tabs button span { margin-left:6px; font-size:12px; opacity:.8; font-variant-numeric:tabular-nums; }
.gu-ui-system .race-browser-filters { border:1px solid var(--race-border); border-radius:12px; padding:18px; background:var(--race-surface); }
.gu-ui-system .race-filter-primary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.gu-ui-system .race-filter-primary label { display:flex; flex-direction:column; gap:7px; min-width:0; font-size:13px; font-weight:600; color:#d8dee7; }
.gu-ui-system .race-filter-primary select { width:100%; min-width:0; min-height:43px; margin:0; padding:9px 30px 9px 10px; border:1px solid #394353; border-radius:7px; background:#0d131b; color:#edf1f6; font-size:14px; }
.gu-ui-system .race-filter-primary small { font-size:12px; line-height:1.5; color:var(--race-muted); font-weight:400; }
.gu-ui-system .race-advanced-filters { margin:14px 0 0; border:0; border-top:1px solid var(--race-border); padding-top:4px; }
.gu-ui-system .race-advanced-filters summary { padding:11px 0; cursor:pointer; color:#dce3ed; font-size:13px; }
.gu-ui-system .race-advanced-filters summary span { color:var(--race-muted); margin-left:10px; font-weight:400; }
.gu-ui-system .race-advanced-filters .race-filter-primary { grid-template-columns:repeat(3,minmax(0,1fr)); padding-top:4px; }
.gu-ui-system .race-filter-status { gap:8px; }
.gu-ui-system .race-filter-status:has([data-race-active-filters]:empty) { min-height:0; }
.gu-ui-system [data-race-active-filters] { display:flex; flex-wrap:wrap; gap:6px; }
.gu-ui-system .race-filter-chip { margin-top:10px; border:1px solid #56506e; color:#e4d8f6; background:#252031; padding:7px 10px; border-radius:7px; font-size:12px; cursor:pointer; min-height:36px; }
.gu-ui-system .race-filter-status .clear-filter { font-size:13px; min-height:38px; margin-top:8px; }
.gu-ui-system .race-results-meta { font-size:13px; color:var(--race-muted); margin:18px 0 10px; gap:8px; }
.gu-ui-system .race-results-meta p { margin:0; }
.gu-ui-system .race-results-meta strong { color:#dce3ed; font-weight:600; }
.gu-ui-system .race-results { display:grid; gap:9px; }
.gu-ui-system .race-result { display:grid; grid-template-columns:156px minmax(200px,1fr) minmax(195px,.55fr) 145px; gap:20px; align-items:center; padding:18px; border:1px solid var(--race-border); border-radius:12px; background:var(--race-surface); box-shadow:none; transition:border-color .15s; }
.gu-ui-system .race-result:hover { border-color:#626a7c; }
.gu-ui-system .race-result-art { position:relative;display:grid;place-items:center;min-width:0;height:106px;background:#0c1119;border-radius:8px;overflow:hidden; }
.gu-ui-system .race-result-photo { position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover; }
.gu-ui-system .race-result-track-mark { position:relative;display:flex;align-items:center;justify-content:center;width:96px;height:56px;padding:6px;background:#10161ee8;border:1px solid #ffffff24;border-radius:6px; }
.gu-ui-system .race-result-track-mark.needs-light-logo { background:#eceff3ed; }
.gu-ui-system .race-result-track-mark img { display:block;width:100%;height:100%;object-fit:contain; }
.gu-ui-system .has-track-photo .race-result-track-mark { align-self:end;justify-self:start;margin:8px;width:76px;height:42px; }
.gu-ui-system .race-result-main { min-width:0; }
.gu-ui-system .race-result-sim { color:#aab5c7; font-size:11px; line-height:1.4; font-weight:650; }
.gu-ui-system .race-result-main h2 { font-family:inherit; font-style:normal; font-weight:650; text-transform:none; letter-spacing:-.025em; font-size:18px; line-height:1.25; margin:4px 0 5px; }
.gu-ui-system .race-result-main h2 a { color:#f1f4f9; text-decoration:none; }
.gu-ui-system .race-result-main h2 a:hover { text-decoration:underline; text-underline-offset:4px; }
.gu-ui-system .race-result-main p { font-size:13px; line-height:1.4; color:#bcc7d4; margin:0; }
.gu-ui-system .race-result-main p span { color:#97a5b8; }
.gu-ui-system .race-result-classes { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.gu-ui-system .race-result-classes span { font-size:10px; padding:3px 6px; border-radius:4px; background:#202936; color:#ccd5e2; font-weight:550; }
.gu-ui-system .race-result-start, .gu-ui-system .race-result-duration { min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.gu-ui-system .race-result-label { font-size:11px; color:#9aa8bb; }
.gu-ui-system .race-result-start strong, .gu-ui-system .race-result-duration strong { font-size:14px; color:#e6ebf3; font-weight:600; font-variant-numeric:tabular-nums; }
.gu-ui-system .race-start-state { font-size:11px; color:#9ab6ab; line-height:1.4; }
.gu-ui-system .race-start-state.is-pending { color:#c7b58a; }
.gu-ui-system .race-result-action { font-size:13px; font-weight:600; color:#d2bcf4; margin-top:9px; display:inline-flex; align-items:center; gap:10px; min-height:32px; }
.gu-ui-system .race-result-slots { width:100%; font-size:12px; }
.gu-ui-system .race-result-slots summary { color:#c6b1e9; cursor:pointer; min-height:30px; padding:6px 0; }
.gu-ui-system .race-result-slots > div { display:grid; gap:10px; padding:8px 0; }
.gu-ui-system .race-result-slots time { color:#b7c3d3; }
.gu-ui-system [data-race-view="cards"] .race-results { grid-template-columns:repeat(3,minmax(0,1fr)); }
.gu-ui-system [data-race-view="cards"] .race-result { grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.gu-ui-system [data-race-view="cards"] .race-result-art { grid-column:1/-1;height:148px; }
.gu-ui-system [data-race-view="cards"] .race-result-main { grid-column:1/-1; }
.gu-ui-system .race-empty { padding:36px 20px; border:1px dashed #424d5e; background:#10161e; text-align:center; border-radius:12px; }
.gu-ui-system .race-empty h2 { font-family:inherit; font-weight:600; font-size:21px; line-height:1.3; margin:0 0 9px; }
.gu-ui-system .race-empty p { color:#aab6c6; font-size:14px; }
.gu-ui-system .race-empty > a { display:block; margin-top:15px; font-size:13px; }
.gu-ui-system .race-flow-breadcrumb { display:flex; gap:10px; padding-top:22px; font-size:13px; color:#aab6c6; }
.gu-ui-system .race-flow-breadcrumb a { color:#bec9d8; }
.gu-ui-system .event-plan-note { font-size:12px; color:#b3bfce; line-height:1.5; margin:0; max-width:330px; }
.gu-ui-system .event-start-context { padding:9px 14px; margin-top:6px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid #30394a; border-radius:8px; background:#121923; font-size:12px; }
.gu-ui-system .event-start-context p { margin:3px 0; color:#aebccd; }
.gu-ui-system .event-start-context strong { font-size:12px; color:#e1e7ef; }
.gu-ui-system .event-start-context.is-exact > div { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.gu-ui-system .event-start-context.is-pending { border-color:#65573d; }
.gu-ui-system.event-page .event-hero.visual-event-hero { position:relative;isolation:isolate;overflow:hidden;border:1px solid #354052;border-radius:12px;min-height:0;height:auto;margin-top:18px;margin-bottom:18px;padding:28px; }
.gu-ui-system.event-page .event-hero-track-photo { position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center; }
.gu-ui-system.event-page .event-hero.has-track-photo::before { content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b1017ee 0%,#0b1017c9 44%,#0b101777 70%,#0b1017df 100%),linear-gradient(0deg,#0b1017b8,transparent 55%);pointer-events:none; }
.gu-ui-system.event-page .event-hero-main { min-width:0; }
.gu-ui-system.event-page .event-hero h1 { margin-block:14px 12px; }
.gu-ui-system .event-planning-steps { display:flex; flex-wrap:wrap; gap:8px 20px; padding:14px 0; margin:0; list-style:none; }
.gu-ui-system .event-planning-steps li { display:flex; align-items:center; gap:8px; color:#aebccd; font-size:12px; }
.gu-ui-system .event-planning-steps li b { border:1px solid #60516d; border-radius:50%; width:23px; height:23px; display:grid; place-items:center; color:#ddc5f5; font-size:11px; }
.gu-ui-system .event-planning-summary { color:#aab7c8; font-size:13px; line-height:1.5; margin:6px 0 16px; max-width:850px; }
.gu-ui-system .event-prerequisite-note { border-left:2px solid #ae76d0; padding:8px 13px; color:#bec7d5; font-size:13px; margin:14px 0; }
.gu-ui-system .race-start-editor { max-width:900px; }
.gu-ui-system .race-start-editor .page-intro-card { background:none; border:none; box-shadow:none; padding:0 0 20px; }
.gu-ui-system .race-start-editor h1 { font-size:clamp(26px,4vw,40px); line-height:1.12; }
.gu-ui-system .race-start-editor .notice { padding:18px; border:1px solid #354052; border-radius:12px; background:#131b25; box-shadow:none; }
.gu-ui-system .race-start-editor .notice p { font-size:13px; color:#b8c4d4; line-height:1.6; }
.gu-ui-system .race-start-editor fieldset { margin:20px 0; padding:16px; border:1px solid #354052; border-radius:10px; }
.gu-ui-system .race-start-option { display:flex; gap:12px; align-items:center; min-height:48px; border:1px solid #344051; border-radius:8px; padding:12px; margin-top:8px; cursor:pointer; }
.gu-ui-system .race-start-option:has(input:checked) { border-color:#a278c4; background:#262033; }
.gu-ui-system .race-start-option input { flex:0 0 auto; }
.gu-ui-system .race-workflow [hidden], .gu-ui-system [data-race-browser] [hidden] { display:none!important; }
.gu-ui-system.race-workflow :is(a,button,summary,input,select):focus-visible { outline:2px solid #ca9def; outline-offset:4px; }
@media(min-width:1000px) {
  .gu-ui-system.event-page .event-hero { gap:40px; }
  .gu-ui-system.event-page .event-hero h1 { font-size:clamp(32px,3.6vw,52px); max-width:850px; }
  .gu-ui-system.event-page .event-hero-actions { min-width:280px; max-width:310px; }
}
@media(max-width:1050px) {
  .gu-ui-system .race-result { grid-template-columns:116px minmax(160px,1fr) minmax(180px,.7fr) 115px; gap:14px; padding:15px; }
  .gu-ui-system [data-race-view="cards"] .race-results { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
  .gu-ui-system.race-workflow [data-race-browser] button { min-height:44px; }
  .gu-ui-system.race-workflow .race-category-tabs button, .gu-ui-system.race-workflow .race-view-toggle button, .gu-ui-system.race-workflow .race-filter-primary select, .gu-ui-system.race-workflow .race-result-slots summary { min-height:44px; }
  .gu-ui-system .race-filter-primary, .gu-ui-system .race-advanced-filters .race-filter-primary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gu-ui-system .race-result { grid-template-columns:88px minmax(0,1fr);gap:12px; }
  .gu-ui-system .race-result-art { height:100px;align-self:start; }
  .gu-ui-system .has-track-photo .race-result-track-mark { margin:5px;width:68px;height:36px; }
  .gu-ui-system .race-result .gu-sim-identity { flex-wrap:wrap;gap:4px 6px; }
  .gu-ui-system.event-page .event-hero.visual-event-hero { padding:20px; }
  .gu-ui-system.event-page .event-hero.has-track-photo::before { background:linear-gradient(90deg,#0b1017e6,#0b1017a6),linear-gradient(0deg,#0b1017e0,transparent 75%); }
  .gu-ui-system .race-result-start { grid-column:2; }
  .gu-ui-system .race-result-duration { grid-column:2; flex-direction:row; align-items:center; flex-wrap:wrap; gap:6px 10px; }
  .gu-ui-system .race-result-action { margin:0 0 0 auto; min-height:42px; }
  .gu-ui-system [data-race-view="cards"] .race-result-start, .gu-ui-system [data-race-view="cards"] .race-result-duration { grid-column:1/-1; }
  .gu-ui-system .race-results-meta { font-size:12px; align-items:flex-start; }
  .gu-ui-system .race-results-meta p:last-child { max-width:100%; }
  .gu-ui-system .race-results-meta p span { display:block; margin-top:4px; }
  .gu-ui-system .event-start-context { flex-direction:column; align-items:flex-start; gap:8px; }
}
@media(max-width:480px) {
  .gu-ui-system .race-browser-toolbar { gap:9px; }
  .gu-ui-system .race-category-tabs { width:100%; }
  .gu-ui-system .race-category-tabs button { flex:1; font-size:12px; padding:8px; }
  .gu-ui-system .race-category-tabs button span { margin-left:3px; }
  .gu-ui-system .race-browser-filters { padding:12px; }
  .gu-ui-system .race-advanced-filters summary span { display:block; margin:5px 0 0 15px; font-size:11px; }
  .gu-ui-system [data-race-view="cards"] .race-results { grid-template-columns:1fr; }
  .gu-ui-system .race-result-main h2 { font-size:17px; }
  .gu-ui-system .race-result-main p { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { .gu-ui-system .race-result { transition:none; } }