/* The race register: engraved brass, dark vellum, class colours. */
.race-page { --race-ink:#141b17; --race-paper:#1d251e; --race-gold:#e5c487; --race-line:#bda36b38; color:#e9e5d8; }
.race-page a,.race-teaser a { text-underline-offset:4px; }
.race-page a:focus-visible,.race-teaser a:focus-visible,.race-table-wrap:focus-visible { outline:2px solid #e5c487; outline-offset:5px; }
.race-hero { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr); border:1px solid var(--race-line); border-top:3px solid #aa8d56; background:linear-gradient(90deg,#121c16ed,#121c16a8),url('art/forever-dawn-display.webp') center 45%/cover; position:relative; }
.race-intro { padding:clamp(28px,4vw,64px); align-self:center; }
.race-intro h1 { font:400 clamp(3rem,6vw,6rem)/1.05 Georgia,serif; letter-spacing:-.045em; margin:22px 0; color:#f0e8d2; }
.race-intro h1>span { color:var(--race-gold); }
.race-deck { font:1.4rem/1.5 Georgia,serif; color:#d9c7a3; margin:0 0 16px; }
.race-description { max-width:560px; font-size:.94rem; line-height:1.9; color:#c5cabc; }
.race-jump { display:inline-flex; align-items:center; gap:28px; margin-top:26px; color:var(--race-gold); }
.race-front-runner { padding:28px 34px; margin:24px; margin-left:0; text-align:center; background:#111a15e8; border:1px solid #bda36b66; box-shadow:inset 0 0 0 5px #111a15,inset 0 0 0 6px #bda36b26; }
.race-emblem { display:grid; place-items:center; width:52px; height:52px; margin:0 auto 18px; color:var(--race-gold); border:1px solid #bda36b66; border-radius:50%; }
.race-emblem .ui-icon { width:25px; height:25px; }
.race-front-runner h2 { font:1.7rem/1.2 Georgia,serif; margin:0; overflow-wrap:anywhere; }
.race-front-runner h2 a { color:#f1e7d0; text-decoration:none; }
.race-front-runner h2 a:hover { text-decoration:underline; }
.race-featured-name { display:flex; align-items:center; justify-content:center; gap:14px; margin:20px 0 10px; }
.race-featured-name .race-portrait { width:56px; height:56px; }
.race-featured-meta { color:#b0bfae; font-size:.78rem; }
.race-featured-level { display:flex; justify-content:center; align-items:baseline; gap:12px; color:#b4aa93; margin:18px 0 14px; }
.race-featured-level strong { color:var(--race-gold); font:4rem/1 Georgia,serif; }
.race-featured-level span:first-child { font-size:.65rem; letter-spacing:.12em; }
.race-front-runner>.race-progress { max-width:260px; margin-inline:auto; }
.race-time { font-size:.7rem; line-height:1.7; color:#a9b4a5; margin-top:18px; }
.race-time time { color:#d5ccb8; }
.race-numbers { display:grid; grid-template-columns:repeat(3,1fr) 1.35fr; border:1px solid var(--race-line); border-top:0; background:var(--race-ink); margin:0 0 44px; }
.race-numbers>div { padding:22px 28px; border-right:1px solid var(--race-line); display:flex; flex-direction:column; justify-content:center; }
.race-numbers>div:last-child { border-right:0; }
.race-numbers dt { color:#adb8a8; font-size:.75rem; margin-bottom:9px; }
.race-numbers dd { font:2rem/1.15 Georgia,serif; color:var(--race-gold); font-variant-numeric:tabular-nums; }
.race-numbers dd small { font:.85rem/1.5 system-ui,sans-serif; color:#acb6a6; }
.race-numbers .race-update dd { font:.82rem/1.7 system-ui,sans-serif; color:#d7d7c8; }
.race-page .fv-section-title { gap:24px; margin-bottom:20px; align-items:flex-end; }
.race-page .fv-section-title h2 { margin:8px 0 0; font:1.8rem/1.25 Georgia,serif; color:#e9dfc8; }
.race-section-note { color:#b0bba9; font-size:.78rem; }
.race-class-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.race-class-card { display:block; padding:20px; border:1px solid var(--race-line); border-left:3px solid var(--class-color); background:var(--race-paper); text-decoration:none; color:inherit; }
.race-class-card:hover { background:#293228; border-color:#c4af7c; }
.race-class-heading { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.race-class-heading img { border:1px solid #a78c59; border-radius:2px; }
.race-class-heading h3 { font:1.1rem/1.3 Georgia,serif; color:var(--class-color); margin:0; }
.race-class-heading .ui-icon { margin-left:auto; color:var(--race-gold); }
.race-class-name { display:block; font-size:.93rem; font-weight:600; overflow-wrap:anywhere; }
.race-class-name.race-muted { font-weight:400; font-size:.8rem; color:#a8b2a2; }
.race-class-detail { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:10px 0; }
.race-class-detail>span { font-size:.68rem; color:#b7bcae; }
.race-class-detail>b { font:1.5rem/1 Georgia,serif; color:#eee0bc; white-space:nowrap; }
.race-class-detail small { font:.68rem/1 system-ui,sans-serif; color:#a8b2a2; margin-left:3px; }
.race-progress { height:3px; background:#8d9e7d29; overflow:hidden; }
.race-progress>span { display:block; height:100%; background:var(--class-color,var(--race-gold,#d8b77b)); }
.race-achieved { background:#282b1e; }
.race-standings { margin-top:44px; scroll-margin-top:110px; }
.race-refresh { font-size:.8rem; display:inline-flex; align-items:center; gap:8px; white-space:nowrap; color:var(--race-gold); }
.race-refresh .ui-icon { width:16px; height:16px; }
.race-filters { display:flex; align-items:flex-end; flex-wrap:wrap; gap:14px; padding:22px; background:var(--race-paper); border:1px solid var(--race-line); }
.race-filters label { flex:1 1 170px; display:grid; gap:8px; color:#c5cdbd; font-size:.78rem; }
.race-filters select { min-height:45px; width:100%; background:#101912; color:#efe6d1; border:1px solid #738269; border-radius:2px; padding:10px 14px; }
.race-filters button { min-height:45px; padding:10px 24px; }
.race-filters>a { font-size:.8rem; padding:12px 0; color:var(--race-gold); }
.race-table-note { color:#afb8a6; font-size:.75rem; line-height:1.6; padding:16px 0; margin:0; }
.race-table-wrap { overflow-x:auto; border:1px solid var(--race-line); background:#121b16; }
.race-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.race-table thead { background:#20291f; }
.race-table thead th { color:#c3ba9f; font-size:.68rem; letter-spacing:.05em; text-align:left; font-weight:500; padding:16px 20px; text-transform:uppercase; }
.race-table tbody th,.race-table tbody td { padding:15px 20px; border-top:1px solid #bda36b20; text-align:left; }
.race-table tbody tr:nth-child(even) { background:#d1daaa04; }
.race-table tbody tr:hover { background:#c4ba8220; }
.race-table tbody tr.race-finished { background:#c6a55e0d; }
.race-rank { color:#d0b581; font:1rem/1 Georgia,serif; font-variant-numeric:tabular-nums; }
.race-table .race-rank { width:70px; }
.race-rank .ui-icon { display:block; margin-top:7px; width:16px; height:16px; }
.race-player { display:flex; align-items:center; gap:14px; min-width:220px; }
.race-player strong { font-weight:600; display:block; color:var(--class-color); }
.race-player strong a { color:inherit; text-decoration:none; }
.race-player strong a:hover { text-decoration:underline; }
.race-player small { display:block; margin-top:6px; font-size:.7rem; color:#aab7a6; font-weight:400; }
.race-portrait { position:relative; width:46px; height:46px; flex:none; display:grid; place-items:center; border:1px solid var(--class-color,#a58b55); border-radius:3px; background:#14180f; overflow:hidden; color:#dbc79c; font:1.2rem Georgia,serif; }
.race-portrait img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.race-region { border:1px solid #aab7a63d; padding:4px 7px; font-size:.7rem; color:#bcc8b7; }
.race-level { min-width:100px; font-variant-numeric:tabular-nums; }
.race-level>strong { font:1.6rem/1 Georgia,serif; color:var(--race-gold); }
.race-level>span { color:#a4ae9c; font-size:.7rem; padding-left:4px; }
.race-level .race-progress { max-width:85px; margin-top:9px; }
.race-observed { color:#c2c6b7; font-size:.72rem; white-space:nowrap; }
.race-observed small { display:block; color:var(--race-gold); margin-top:6px; }
.race-pagination { display:flex; justify-content:center; align-items:center; gap:28px; padding:22px 0; font-size:.83rem; }
.race-pagination span { color:#b4bdaa; }
.race-pagination a { padding:8px; color:var(--race-gold); }
.race-empty { text-align:center; padding:50px 24px; border:1px solid var(--race-line); background:var(--race-ink); }
.race-empty h3 { font:1.5rem/1.3 Georgia,serif; }.race-empty p { color:#b5bfae; margin:14px 0 22px; }
.race-method { display:flex; gap:20px; margin:28px 0 0; padding:26px; background:#bdae7710; border-top:1px solid var(--race-line); }
.race-method>span { color:var(--race-gold); padding-top:4px; }
.race-method h2 { font:1.2rem/1.4 Georgia,serif; color:#dfcfac; margin:0 0 12px; }
.race-method p { font-size:.78rem; line-height:1.85; color:#abb7a4; max-width:1000px; margin:8px 0; }
.race-teaser { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); border:1px solid #bda36b66; border-top:3px solid #aa8d56; background:#172019; margin:32px 0 42px; }
.race-teaser-intro { padding:clamp(24px,3vw,42px); background:linear-gradient(90deg,#121c16f2,#121c16c9),url('art/forever-dawn-display.webp') center/cover; }
.race-teaser-intro h2 { font:clamp(2.4rem,4vw,4rem)/1.15 Georgia,serif; margin:18px 0; color:#f0e8d2; }
.race-teaser-intro h2>span { color:#e5c487; }.race-teaser-intro>p { color:#c9d0bf; }
.race-teaser-intro>a { display:inline-block; color:#e5c487; margin:22px 0; }.race-teaser-intro>a>span { margin-left:20px; }
.race-teaser-intro>small { display:block; color:#a7b59f; font-size:.7rem; line-height:1.7; }
.race-teaser-list { list-style:none; padding:12px 26px; margin:0; }
.race-teaser-list>li { display:flex; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid #bda36b26; }.race-teaser-list>li:last-child { border:0; }
.race-teaser-list .race-rank { width:20px; }.race-teaser-list .race-portrait { width:40px; height:40px; }
.race-teaser-list strong { font:1rem/1.3 Georgia,serif; overflow-wrap:anywhere; }.race-teaser-list strong a { color:#ede2ca; text-decoration:none; }.race-teaser-list strong a:hover { text-decoration:underline; }
.race-teaser-list li>div { flex:1; min-width:0; }.race-teaser-list small { display:block; font:.7rem/1.5 system-ui,sans-serif; color:#b0bca8; margin-top:4px; }
.race-teaser-level { font:1.65rem/1 Georgia,serif; color:#e5c487; text-align:right; }
.race-teaser-level>small { display:inline; margin-left:4px; }
.race-teaser-empty { text-align:center; padding:36px; align-self:center; color:#b0bca8; }.race-teaser-empty .ui-icon { width:36px; height:36px; color:#d8b77b; }.race-teaser-empty h3 { font:1.5rem/1.5 Georgia,serif; color:#e8d9ba; margin:20px 0; }
@media (max-width:1000px) {
 .race-hero { grid-template-columns:minmax(0,1.2fr) minmax(250px,1fr); }.race-front-runner { padding:24px 20px; }
 .race-numbers>div { padding:20px; }.race-class-card { padding:16px; }.race-table thead th,.race-table tbody th,.race-table tbody td { padding:14px; }
}
@media (max-width:760px) {
 .race-hero,.race-teaser { grid-template-columns:1fr; }.race-front-runner { margin:0 20px 20px; }.race-intro { padding:30px 24px; }
 .race-class-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.race-numbers { grid-template-columns:repeat(2,1fr); }
 .race-numbers>div:nth-child(2) { border-right:0; }.race-numbers>div:nth-child(n+3) { border-top:1px solid var(--race-line); }
 .race-page .fv-section-title { align-items:flex-start; flex-direction:column; gap:12px; }.race-section-note { margin:0; }
 .race-numbers dd { font-size:1.75rem; }.race-page .fv-section-title h2 { font-size:1.65rem; }
 .race-teaser-intro>small { max-width:300px; }.race-teaser-list { padding:8px 20px; }.race-method { padding:22px 16px; gap:14px; }
}
@media (max-width:480px) {
 .race-intro h1 { font-size:3.2rem; }.race-deck { font-size:1.15rem; }.race-description { font-size:.85rem; }
 .race-class-grid { gap:8px; }.race-class-card { padding:14px 12px; }.race-class-heading { gap:8px; }.race-class-heading img { width:26px; height:26px; }.race-class-heading h3 { font-size:1rem; }
 .race-class-name { font-size:.8rem; }.race-class-detail { align-items:flex-end; }.race-class-detail>span { max-width:80px; line-height:1.6; }
 .race-numbers>div { padding:18px; }.race-numbers .race-update dd { font-size:.7rem; }.race-filters { padding:16px; }.race-filters label { flex-basis:100%; }
 .race-filters button { flex:1; }.race-pagination { gap:12px; font-size:.75rem; }.race-featured-name { flex-direction:column; }
}