:root {
  --navy: #10203a;
  --navy-2: #1a3154;
  --ink: #172033;
  --muted: #6f7d91;
  --line: #e0e7f0;
  --page: #f4f7fb;
  --surface: #fff;
  --blue: #236fdf;
  --green: #138465;
  --violet: #7557d5;
  --orange: #e67f22;
  --cyan: #168ca1;
  --rose: #d84f70;
  --yellow: #b88312;
  --slate: #64748b;
  --danger: #c83d54;
  --shadow: 0 8px 22px rgba(27, 44, 67, .055);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--page);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--page); }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; display: flex; width: 226px; flex-direction: column; padding: 16px 14px; color: #fff; background: var(--navy); }
.brand { display: block; padding: 0 5px 14px; border-bottom: 1px solid rgba(255,255,255,.09); text-decoration: none; }
.brand img { display: block; width: 100%; height: auto; border-radius: 11px; box-shadow: 0 10px 28px rgba(0,0,0,.2); }
.brand-mark { display: none; }
.brand strong, .brand small { display: block; }
.nav-list { display: grid; gap: 3px; margin-top: 10px; overflow-y: auto; scrollbar-color: rgba(255,255,255,.18) transparent; scrollbar-width: thin; }
.nav-section { padding: 11px 10px 4px; color: #7489a7; font-size: 8px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.nav-item { display: flex; min-height: 37px; align-items: center; gap: 10px; padding: 0 10px; border-radius: 9px; color: #bdc9d9; font-size: 12px; font-weight: 720; text-decoration: none; transition: .16s ease; }
.nav-item > span { display: grid; width: 24px; height: 24px; flex: 0 0 auto; place-items: center; border-radius: 7px; color: #8397b3; background: rgba(255,255,255,.045); font-size: 13px; font-weight: 500; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.06); }
.nav-item.is-active { color: #fff; background: rgba(65,132,229,.24); box-shadow: inset 3px 0 0 #75b0ff; }
.nav-item.is-active > span { color: #9bc8ff; background: rgba(69,140,239,.16); }
.sidebar-footer { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 14px 10px 2px; border-top: 1px solid rgba(255,255,255,.1); }
.sidebar-footer i { width: 8px; height: 8px; border-radius: 50%; background: #38cf99; box-shadow: 0 0 0 5px rgba(56,207,153,.12); }
.sidebar-footer strong, .sidebar-footer small { display: block; }
.sidebar-footer strong { font-size: 10.5px; }
.sidebar-footer small { margin-top: 2px; color: #94a4ba; font-size: 9px; }

.main-content { min-height: 100vh; margin-left: 226px; padding: 0 26px 24px; }
.topbar { display: flex; min-height: 70px; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); }
.topbar-context { display: grid; gap: 2px; min-width: 145px; }
.topbar-context span { color: #8a97a8; font-size: 8px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.topbar-context strong { font-size: 12px; font-weight: 800; }
.topbar-date { color: #7b899c; font-size: 11px; font-weight: 750; text-transform: capitalize; }
.menu-button { display: none; border: 0; color: var(--ink); background: transparent; font-size: 23px; }
.profile { display: flex; align-items: center; gap: 9px; margin-left: auto; }
.profile-avatar { display: grid; width: 37px; height: 37px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); font-size: 12px; font-weight: 850; }
.profile-copy strong, .profile-copy small { display: block; }
.profile-copy strong { max-width: 180px; overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy small { margin-top: 2px; color: var(--muted); font-size: 9.5px; }
.logout { margin-left: 6px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 9px; color: #506077; background: #fff; font-size: 10px; font-weight: 780; text-decoration: none; }
.notice { margin: 15px 0 -2px; padding: 12px 14px; border-radius: 10px; font-size: 11px; font-weight: 700; }
.notice-ok { color: #086b50; border: 1px solid #bce9d9; background: #eaf9f3; }
.notice-error { color: #a22e42; border: 1px solid #f1c5cd; background: #fff0f3; }
.section-history-link { display: flex; justify-content: flex-end; margin: 14px 0 -12px; }
.section-history-link a { display: inline-flex; min-height: 34px; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid #d5dfeb; border-radius: 9px; color: #48617e; background: #fff; font-size: 9.5px; font-weight: 800; text-decoration: none; }
.section-history-link a:hover { border-color: #9dbce4; color: var(--blue); }
.eyebrow { margin: 0; color: #8592a5; font-size: 9.5px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }

.welcome-row, .page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 27px 0 20px; }
.welcome-row h1, .page-heading h1 { margin: 6px 0 7px; font-size: clamp(25px, 3.1vw, 36px); letter-spacing: -.045em; }
.welcome-row p:not(.eyebrow), .page-heading p:not(.eyebrow) { max-width: 710px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.live-chip { display: flex; flex: 0 0 auto; align-items: center; gap: 7px; padding: 9px 12px; border: 1px solid #d4e3f5; border-radius: 999px; color: #385876; background: #edf5ff; font-size: 9.5px; font-weight: 800; }
.live-chip i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.inline-form { display: inline-flex; margin: 0; }
.primary-button, .secondary-button, .small-button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; border-radius: 9px; font-size: 10.5px; font-weight: 800; text-decoration: none; cursor: pointer; }
.primary-button { padding: 0 15px; border: 1px solid var(--blue); color: #fff; background: var(--blue); }
.primary-button:hover { background: #1d55cc; }
.secondary-button { padding: 0 14px; border: 1px solid #d8e0ea; color: #46566e; background: #fff; }
.small-button { min-height: 34px; padding: 0 11px; border: 1px solid #cdd8e5; color: #40516a; background: #fff; }
.wide { width: 100%; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.kpi-card { position: relative; min-height: 134px; overflow: hidden; padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.kpi-card::after { position: absolute; top: 15px; right: 15px; display: grid; width: 29px; height: 29px; place-items: center; border-radius: 9px; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, white); content: "↗"; font-size: 13px; }
.kpi-card:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(27,44,67,.1); }
.kpi-card span { color: #4d5b70; font-size: 10.5px; font-weight: 800; }
.kpi-card strong { display: block; margin: 17px 0 9px; font-size: 33px; line-height: 1; letter-spacing: -.06em; }
.kpi-card small { color: var(--muted); font-size: 9.5px; }
.blue { --accent: var(--blue); }.green { --accent: var(--green); }.violet { --accent: var(--violet); }.orange { --accent: var(--orange); }.cyan { --accent: var(--cyan); }.rose { --accent: var(--rose); }.yellow { --accent: var(--yellow); }.slate { --accent: var(--slate); }

.dashboard-grid, .detail-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(330px, .8fr); gap: 13px; margin-top: 13px; }
.athlete-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 13px; }
.panel { border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.dashboard-grid > .panel, .institutions-panel, .list-panel, .attendance-today, .assignment-panel, .detail-card, .metric-card { padding: 19px; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.panel-heading h2 { margin: 5px 0 0; font-size: 16px; letter-spacing: -.025em; }
.panel-heading > a, .panel-heading > div > a { color: var(--blue); font-size: 9.5px; font-weight: 800; text-decoration: none; }
.panel-heading p:not(.eyebrow) { margin: 7px 0 0; color: var(--muted); font-size: 10.5px; line-height: 1.45; }
.empty-state { display: flex; min-height: 120px; align-items: center; justify-content: center; gap: 12px; padding: 18px; }
.empty-state > b { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 50%; color: #087858; background: #e8f7f1; }
.empty-state strong, .empty-state small { display: block; }
.empty-state strong { font-size: 11.5px; }.empty-state small { margin-top: 4px; color: var(--muted); font-size: 9.5px; }
.focus-list, .event-list { display: grid; margin-top: 13px; }
.focus-list > a, .event-list > a { display: flex; align-items: center; gap: 11px; padding: 11px 2px; border-top: 1px solid var(--line); text-decoration: none; }
.focus-list strong, .focus-list small, .event-list strong, .event-list small { display: block; }
.focus-list strong, .event-list strong { font-size: 10.5px; }.focus-list small, .event-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.focus-list time { margin-left: auto; color: #7e8c9f; font-size: 9px; }
.priority-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #98a5b5; }.priority-dot.high, .priority-dot.critical { background: var(--danger); }.priority-dot.normal { background: var(--orange); }
.event-list time { display: grid; width: 43px; height: 46px; flex: 0 0 auto; place-items: center; border: 1px solid #d6e0ec; border-radius: 9px; color: var(--blue); background: #f8fbff; }
.event-list time b { font-size: 15px; }.event-list time small { margin: -7px 0 0; font-size: 7px; }

.section-block { padding-top: 27px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 13px; }
.section-heading h2 { margin: 5px 0 0; font-size: 21px; letter-spacing: -.035em; }
.section-heading > p { max-width: 390px; margin: 0; color: var(--muted); font-size: 10px; text-align: right; }
.module-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.module-card { position: relative; display: flex; min-height: 158px; flex-direction: column; overflow: hidden; padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); text-decoration: none; transition: transform .15s ease, border-color .15s ease; }
.module-card::before { position: absolute; inset: 0 0 auto; height: 3px; content: ""; background: var(--accent); }
.module-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 38%, white); }
.module-card > span { align-self: flex-start; padding: 4px 6px; border-radius: 6px; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, white); font-size: 8px; font-weight: 900; }
.module-card h3 { margin: 14px 0 7px; font-size: 15px; letter-spacing: -.025em; }
.module-card p { margin: 0; color: var(--muted); font-size: 9.5px; line-height: 1.5; }
.module-card b { margin-top: auto; padding-top: 13px; color: var(--accent); font-size: 9px; }
.institutions-panel { margin-top: 13px; }

.mini-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 13px; }
.mini-stats article { min-width: 145px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.mini-stats span { color: var(--muted); font-size: 9px; }.mini-stats strong { display: block; margin-top: 5px; font-size: 21px; }
.athlete-rank-panel { margin-bottom: 13px; padding: 19px; }.athlete-rank-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 9px; margin-top: 15px; }.athlete-rank-card { position: relative; min-height: 114px; overflow: hidden; padding: 14px; border: 1px solid #dbe4ef; border-radius: 12px; color: var(--ink); background: linear-gradient(145deg, #fff, #f8fbff); text-decoration: none; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }.athlete-rank-card::before { position: absolute; inset: 0 0 auto; height: 3px; content: ""; background: var(--blue); }.athlete-rank-card:hover { transform: translateY(-2px); border-color: #9dbde9; box-shadow: 0 12px 28px rgba(26,73,133,.1); }.athlete-rank-card span, .athlete-rank-card small { display: block; }.athlete-rank-card span { min-height: 26px; color: #506077; font-size: 9px; font-weight: 800; line-height: 1.35; }.athlete-rank-card strong { display: block; margin: 7px 0 6px; font-size: 27px; letter-spacing: -.05em; }.athlete-rank-card small { color: #8794a5; font-size: 8px; }.athlete-rank-card.is-empty::before { background: #a4afbd; }.athlete-rank-card.is-empty strong { color: #68768a; }.athlete-rank-card.is-active { border-color: #6c9fe4; background: #edf5ff; box-shadow: 0 0 0 2px rgba(37,99,235,.08); }.athlete-rank-card.is-active::after { position: absolute; top: 11px; right: 11px; display: grid; width: 20px; height: 20px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); content: "✓"; font-size: 9px; font-weight: 900; }.athlete-register-panel { scroll-margin-top: 14px; }.list-tools > span b { color: var(--ink); }.list-tools > span a { color: var(--blue); font-weight: 800; text-decoration: none; }
.rank-period-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 15px; }.rank-period-heading strong { color: var(--ink); font-size: 11px; }.rank-period-heading span { color: var(--muted); font-size: 8px; }.result-period-grid.rank-period-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 9px; }.result-period-card.rank-period-card { min-height: 88px; }.rank-period-card.is-undated::before { position: absolute; inset: 0 0 auto; height: 3px; content: ""; background: #a4afbd; }.rank-period-card.is-undated strong { color: #68768a; }
.athlete-team-block { align-items: center; background: linear-gradient(135deg, #0b3f91, #176bdd); border-radius: 15px; color: #fff; display: flex; gap: 20px; justify-content: space-between; margin-top: 16px; padding: 17px 19px; }.athlete-team-block h3 { color: #fff; font-size: 18px; margin: 3px 0 6px; }.athlete-team-block p { color: rgba(255,255,255,.76); margin: 0; }.athlete-team-block .eyebrow { color: #9fc8ff; }.athlete-team-card { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.32); border-radius: 12px; color: #fff; display: grid; flex: 0 0 170px; padding: 12px 15px; text-decoration: none; transition: transform .18s ease, background .18s ease; }.athlete-team-card:hover, .athlete-team-card.is-active { background: rgba(255,255,255,.22); transform: translateY(-2px); }.athlete-team-card strong { font-size: 29px; line-height: 1.1; margin: 4px 0; }.athlete-team-card small, .athlete-team-card span { color: rgba(255,255,255,.82); }
.athlete-results-panel { margin-bottom: 13px; padding: 19px; scroll-margin-top: 14px; }.result-period-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 15px; }.result-period-card, .result-medal-card { position: relative; display: grid; min-height: 96px; padding: 13px 14px; overflow: hidden; border: 1px solid #dbe4ef; border-radius: 12px; color: var(--ink); background: #fff; text-decoration: none; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }.result-period-card:hover, .result-medal-card:hover { transform: translateY(-2px); border-color: #9dbde9; box-shadow: 0 10px 24px rgba(26,73,133,.09); }.result-period-card span, .result-medal-card span { color: #536277; font-size: 9px; font-weight: 850; }.result-period-card strong, .result-medal-card strong { margin: 5px 0 4px; font-size: 25px; line-height: 1; }.result-period-card small, .result-medal-card small { align-self: end; color: #8794a5; font-size: 8px; }.result-period-card.is-active { border-color: #5e98e9; background: #edf5ff; box-shadow: 0 0 0 2px rgba(37,99,235,.08); }.result-custom-filter { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 9px; margin: 12px 0; padding: 12px; border-radius: 11px; background: #f5f8fc; }.result-custom-filter label { display: grid; gap: 5px; }.result-custom-filter label span { color: #65748a; font-size: 8.5px; font-weight: 800; }.result-custom-filter input { min-height: 36px; padding: 0 10px; border: 1px solid #d7e0eb; border-radius: 8px; color: var(--ink); background: #fff; }.result-summary-strip { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 1px; margin: 12px 0; overflow: hidden; border: 1px solid #dbe4ef; border-radius: 11px; background: #dbe4ef; }.result-summary-strip > div { padding: 11px 13px; background: #fff; }.result-summary-strip span { display: block; color: #7c899a; font-size: 8px; }.result-summary-strip strong { display: block; margin-top: 4px; font-size: 16px; }.result-medal-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-bottom: 15px; }.result-medal-card::before { position: absolute; inset: 0 0 auto; height: 3px; content: ""; background: #4f86cf; }.result-medal-card.is-gold::before { background: #e7ad20; }.result-medal-card.is-silver::before { background: #9ca9b8; }.result-medal-card.is-bronze::before { background: #bc743c; }.result-medal-card.is-active { border-color: #6c9fe4; background: #f0f6ff; box-shadow: 0 0 0 2px rgba(37,99,235,.08); }.result-medal-card.is-gold.is-active { background: #fff8e6; border-color: #e7b646; }.result-medal-card.is-silver.is-active { background: #f3f6f8; border-color: #aab5c1; }.result-medal-card.is-bronze.is-active { background: #fff3eb; border-color: #c78654; }.result-table-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0 9px; }.result-table-heading > div { display: flex; align-items: baseline; gap: 6px; }.result-table-heading span { color: var(--muted); font-size: 9px; }.result-history-table { min-width: 1520px; }.result-history-table td small { display: block; margin-top: 3px; color: #8290a3; font-size: 8px; }.medal-place { display: inline-flex; padding: 4px 7px; border-radius: 999px; font-size: 8px; font-weight: 850; white-space: nowrap; }.medal-place.place-1 { color: #765300; background: #fff0bd; }.medal-place.place-2 { color: #536170; background: #e9eef2; }.medal-place.place-3 { color: #7f4421; background: #fbe2d1; }
.list-tools { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.list-tools > span { color: var(--muted); font-size: 9.5px; }
.table-search { width: min(280px, 48vw); min-height: 34px; padding: 0 11px; border: 1px solid #d8e0ea; border-radius: 8px; color: var(--ink); background: #fff; font-size: 10px; outline: none; }
.table-search:focus { border-color: #8eb7f3; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }
.table-shell { overflow-x: auto; border: 1px solid var(--line); border-radius: 11px; }
table { width: 100%; min-width: 690px; border-collapse: collapse; }
.athletes-table { min-width: 1260px; }
th { padding: 11px 12px; color: #78869a; background: #f7f9fc; font-size: 8px; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
td { padding: 12px; border-top: 1px solid var(--line); color: #46556a; font-size: 9.8px; }
td a { color: var(--ink); font-weight: 800; text-decoration: none; }
.clickable-row { cursor: pointer; }.clickable-row:hover { background: #f8fbff; }
.table-empty { padding: 28px 16px; color: var(--muted); font-size: 10px; text-align: center; }
.status-pill { display: inline-flex; padding: 5px 8px; border-radius: 999px; color: #30614f; background: #eaf7f2; font-size: 8px; font-weight: 850; }
.sync-panel { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 13px; padding: 14px 16px; }
.sync-panel.has-error { border-color: #f1c5cd; }
.sync-state { display: flex; align-items: center; gap: 12px; }
.sync-state i { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(11,156,112,.11); }
.sync-panel.has-error .sync-state i { background: var(--danger); box-shadow: 0 0 0 5px rgba(200,61,84,.11); }
.sync-state strong, .sync-state small { display: block; }
.sync-state strong { font-size: 10.5px; }
.sync-state small { margin-top: 4px; color: var(--muted); font-size: 8.8px; }
.readonly-chip { display: inline-flex; flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; color: #385876; background: #edf5ff; font-size: 8px; font-weight: 850; }
.source-note { margin-top: 13px; padding: 17px 19px; border-color: #d4e3f5; background: #f7fbff; }
.source-note strong { font-size: 11px; }
.source-note p { margin: 6px 0 0; color: var(--muted); font-size: 9.5px; line-height: 1.55; }
.source-note .primary-button { margin-top: 12px; }

.ekp-filter-panel { margin-bottom: 13px; padding: 16px 18px; }
.ekp-date-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 11px; }
.ekp-filter-copy { min-width: 250px; flex: 1 1 320px; }
.ekp-filter-copy strong, .ekp-filter-copy small { display: block; }
.ekp-filter-copy strong { margin-top: 5px; font-size: 13px; }
.ekp-filter-copy small { max-width: 520px; margin-top: 4px; color: var(--muted); font-size: 8.8px; line-height: 1.45; }
.filter-field { display: grid; width: 158px; flex: 0 0 158px; gap: 6px; }
.filter-field span { color: #536177; font-size: 9px; font-weight: 800; }
.filter-field input { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid #d7e0ea; border-radius: 9px; color: var(--ink); background: #fff; font-size: 10px; outline: none; }
.filter-field input:focus { border-color: #79a9ee; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }
.filter-actions { display: flex; flex: 0 0 auto; gap: 8px; }
.filter-message { margin: 12px 0 0; padding-top: 11px; border-top: 1px solid var(--line); color: #3e5877; font-size: 9px; font-weight: 750; }
.filter-message.is-error { color: var(--danger); }

.dashboard-staff-strip { display: grid; grid-template-columns: minmax(230px, 1fr) minmax(360px, 1.5fr) auto; align-items: center; gap: 22px; margin: 13px 0; padding: 17px 19px; border-color: #d7e4f4; background: linear-gradient(120deg, #fff, #f7fbff); }
.dashboard-staff-strip h2 { margin: 4px 0 5px; font-size: 16px; }.dashboard-staff-strip p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 9px; }
.staff-strip-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.staff-strip-metrics span { padding: 10px 11px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: #fff; font-size: 8.5px; line-height: 1.35; }.staff-strip-metrics b { display: block; margin-bottom: 3px; color: var(--ink); font-size: 18px; }.staff-strip-metrics .current b { color: #0b8f68; }.staff-strip-metrics .upcoming b { color: #c87613; }

.dashboard-income { margin: 13px 0; padding: 19px; overflow: hidden; border-color: #d9e4f2; background: linear-gradient(145deg, #fff, #f8fbff); }
.income-heading { align-items: flex-start; }.income-heading h2 { margin-bottom: 5px; }.income-heading p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 9px; }
.income-overview { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 2fr); gap: 11px; margin-top: 17px; }
.income-total-card { display: flex; min-height: 165px; flex-direction: column; justify-content: center; padding: 20px; border-radius: 14px; color: #fff; background: linear-gradient(145deg, #12396d, #1d66bd); box-shadow: 0 14px 32px rgba(24,83,153,.2); }
.income-total-card span { color: #dceaff; font-size: 9px; font-weight: 800; }.income-total-card strong { margin: 13px 0 8px; font-size: clamp(24px, 3vw, 39px); line-height: 1; letter-spacing: -.055em; }.income-total-card small { color: #c7dcf7; font-size: 8px; }
.income-institution-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.income-institution-grid > article { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.income-institution-grid > article > span { display: block; overflow: hidden; color: #56657a; font-size: 8.5px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.income-institution-grid > article > strong { display: block; margin: 8px 0 10px; color: #112c53; font-size: 18px; letter-spacing: -.04em; }
.income-institution-grid dl { display: grid; gap: 5px; margin: 0; padding-top: 8px; border-top: 1px solid #edf1f6; }.income-institution-grid dl > div { display: flex; justify-content: space-between; gap: 8px; }.income-institution-grid dt { color: #8793a3; font-size: 7px; }.income-institution-grid dd { margin: 0; color: #46576d; font-size: 7px; font-weight: 800; text-align: right; }
.income-table-shell { margin-top: 13px; }.income-table { min-width: 940px; }.income-table th:not(:first-child), .income-table td:not(:first-child) { text-align: right; }.income-table tbody td:last-child { color: #164e91; background: #f4f8fe; }
.income-source-state { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 11px; color: #6d7c90; font-size: 8px; }.income-source-state span { display: flex; align-items: center; gap: 7px; }.income-source-state i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(11,156,112,.1); }.income-source-state small { color: #8995a5; font-size: 8px; white-space: nowrap; }.income-empty { margin-top: 16px; }

.staff-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin-bottom: 13px; }.staff-kpis article { padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: var(--shadow); }.staff-kpis span, .staff-kpis small { display: block; }.staff-kpis span { color: var(--muted); font-size: 8.5px; font-weight: 750; }.staff-kpis strong { display: block; margin: 7px 0 5px; font-size: 27px; letter-spacing: -.05em; }.staff-kpis small { color: #8b98a9; font-size: 8px; }.staff-kpis .is-current { border-top: 3px solid #0b9c70; }.staff-kpis .is-current strong { color: #087858; }.staff-kpis .is-upcoming { border-top: 3px solid #e59a32; }.staff-kpis .is-upcoming strong { color: #bd7110; }
.staff-dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 13px; }.staff-leave-panel { min-width: 0; padding: 17px; }.staff-leave-panel .panel-heading { margin-bottom: 12px; }.staff-leave-panel .panel-heading > span, .staff-register .panel-heading > span { display: grid; min-width: 28px; height: 28px; place-items: center; border-radius: 8px; color: var(--blue); background: #edf5ff; font-size: 10px; font-weight: 900; }
.leave-table { min-width: 780px; }.leave-table td { vertical-align: top; }.leave-table td strong { color: var(--ink); }.cell-note { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; }
.leave-pill { display: inline-flex; padding: 5px 8px; border-radius: 999px; font-size: 8px; font-weight: 850; white-space: nowrap; }.leave-pill.current { color: #087858; background: #e7f7f0; }.leave-pill.upcoming { color: #986016; background: #fff4df; }.leave-pill.completed { color: #536177; background: #eef2f6; }.leave-pill.cancelled { color: #a3394c; background: #fdecef; }
.staff-register { margin-top: 13px; }.staff-register .panel-heading { margin-bottom: 12px; }.staff-table { min-width: 760px; }
.leave-history { margin-top: 13px; padding: 0; overflow: hidden; }.leave-history > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 19px; cursor: pointer; list-style: none; }.leave-history > summary::-webkit-details-marker { display: none; }.leave-history > summary span b, .leave-history > summary span small { display: block; }.leave-history > summary span b { font-size: 12px; }.leave-history > summary span small { margin-top: 4px; color: var(--muted); font-size: 8.5px; }.leave-history > summary > strong { display: grid; min-width: 30px; height: 30px; place-items: center; border-radius: 8px; color: var(--blue); background: #edf5ff; font-size: 10px; }.history-section { padding: 0 19px 19px; }.history-section + .history-section { padding-top: 17px; border-top: 1px solid var(--line); }.history-section h3 { margin: 0 0 11px; font-size: 11px; }

.record-form { max-width: 1040px; padding: 22px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.field { display: flex; min-width: 0; flex-direction: column; gap: 7px; }
.field > span, .schedule-row label span, .public-events form label { color: #536177; font-size: 9.5px; font-weight: 800; }
.field i { margin-left: 3px; color: var(--danger); font-style: normal; }
.field input, .field select, .field textarea, .schedule-row input, .result-list input, .attendance-list > div > input, .public-events form input { width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid #d7e0ea; border-radius: 9px; color: var(--ink); background: #fff; font-size: 10.5px; outline: none; }
.field textarea { resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus, .schedule-row input:focus, .result-list input:focus, .attendance-list > div > input:focus, .public-events form input:focus { border-color: #79a9ee; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }
.field small { color: #8794a5; font-size: 8.5px; line-height: 1.4; }
.field-wide { grid-column: 1 / -1; }
.checkbox-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.checkbox-fieldset legend { padding: 0; color: #536177; font-size: 9.5px; font-weight: 800; }
.checkbox-fieldset legend i { margin-left: 3px; color: var(--danger); font-style: normal; }
.checkbox-fieldset > small { display: block; margin-top: 7px; }
.checkbox-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 330px; margin-top: 10px; overflow-y: auto; }
.checkbox-options > label { display: flex; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; }
.checkbox-options > label:has(input:checked) { border-color: #9fc2f4; background: #f2f7ff; }
.checkbox-options input { width: 17px; height: 17px; flex: 0 0 auto; accent-color: var(--blue); }
.checkbox-options strong, .checkbox-options span small { display: block; }
.checkbox-options strong { color: var(--ink); font-size: 9.5px; }
.checkbox-options span small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.form-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 23px; padding-top: 18px; border-top: 1px solid var(--line); }
.form-section-title { margin: 25px 0 13px; padding-top: 20px; border-top: 1px solid var(--line); }
.form-section-title h2 { margin: 0; font-size: 16px; }.form-section-title p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.schedule-grid { display: grid; gap: 8px; }
.schedule-row { display: grid; grid-template-columns: 130px 130px 130px minmax(180px, 1fr); align-items: end; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: #fafbfd; }
.schedule-row > strong { align-self: center; font-size: 10.5px; }.schedule-row label { display: grid; gap: 5px; }
.group-member-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.group-member-tools .table-search { width: min(360px, 100%); }
.group-member-summary { margin-left: auto; color: #536177; font-size: 9.5px; font-weight: 800; }
.group-member-picker { margin-top: 12px; }
.group-member-picker label:has(input:checked) { border-color: #9fc2f4; background: #f2f7ff; }
.group-member-empty { margin-top: 12px; padding: 20px; border: 1px dashed #cbd7e5; border-radius: 10px; color: var(--muted); background: #fafbfd; font-size: 10px; text-align: center; }

.history-panel { padding: 19px; }
.history-list { display: grid; }
.history-entry { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 13px; padding: 15px 2px; border-top: 1px solid var(--line); }
.history-entry:first-child { border-top: 0; }
.history-marker { width: 9px; height: 9px; margin-top: 4px; border-radius: 50%; background: #8c99aa; box-shadow: 0 0 0 4px #eef2f6; }
.history-marker-create { background: var(--green); box-shadow: 0 0 0 4px #e6f7f0; }
.history-marker-update { background: var(--blue); box-shadow: 0 0 0 4px #e9f1ff; }
.history-marker-delete { background: var(--danger); box-shadow: 0 0 0 4px #fdecef; }
.history-marker-sync { background: var(--violet); box-shadow: 0 0 0 4px #f1ecff; }
.history-entry-top { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.history-entry-top strong { color: var(--ink); font-size: 10.5px; }
.history-entry-top time { flex: 0 0 auto; color: #7d8b9e; font-size: 9px; font-weight: 750; }
.history-entity { margin: 5px 0 0; color: #3f5169; font-size: 10px; font-weight: 780; }
.history-details { margin: 7px 0 0; padding: 9px 11px; border-radius: 8px; color: #536177; background: #f6f8fb; font-size: 9px; line-height: 1.55; }
.history-actor { margin: 7px 0 0; color: #8a96a6; font-size: 8.5px; }
.history-actor span { color: #52627a; font-weight: 800; }

.detail-card dl { display: grid; gap: 0; margin: 16px 0 0; }
.detail-card dl > div { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; border-top: 1px solid var(--line); }
.detail-card dt { color: var(--muted); font-size: 9.5px; }.detail-card dd { margin: 0; font-size: 10px; font-weight: 800; text-align: right; }
.metric-card { display: flex; min-height: 220px; flex-direction: column; justify-content: center; text-align: center; }
.metric-card > strong { margin: 14px 0 6px; font-size: 54px; letter-spacing: -.07em; }.metric-card > span { color: var(--muted); font-size: 10px; }.metric-card > a { align-self: center; margin-top: 20px; }
.detail-description { color: #43526a; font-size: 11px; line-height: 1.65; }
.detail-section { margin-top: 13px; }
.weekend-layout { display: grid; grid-template-columns: minmax(360px, .9fr) minmax(340px, 1.1fr); align-items: start; gap: 13px; margin-top: 13px; }
.weekend-info-stack { display: grid; gap: 13px; }
.poster-panel { padding: 19px; }
.poster-preview { display: block; margin-top: 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: #eef2f7; }
.poster-preview img { display: block; width: 100%; max-height: 680px; object-fit: contain; }
.poster-empty { display: grid; min-height: 280px; margin-top: 16px; place-content: center; gap: 7px; border: 1px dashed #c9d5e3; border-radius: 12px; color: var(--muted); background: #f7f9fc; text-align: center; }
.poster-empty b { color: var(--ink); font-size: 12px; }.poster-empty span { font-size: 9px; }
.poster-upload { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--line); }

.assignment-panel { margin-top: 2px; }
.athlete-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 390px; margin-top: 16px; overflow-y: auto; }
.athlete-picker label { display: flex; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.group-member-picker [data-group-member][hidden] { display: none !important; }
.athlete-picker input { width: 17px; height: 17px; accent-color: var(--blue); }.athlete-picker strong, .athlete-picker small { display: block; }.athlete-picker strong { font-size: 10px; }.athlete-picker small { margin-top: 3px; color: var(--muted); font-size: 8.5px; }
.result-list { display: grid; margin-top: 14px; }
.result-list > form { display: grid; grid-template-columns: minmax(160px, 1.4fr) 90px minmax(150px, 1fr) minmax(120px, .8fr) auto; align-items: end; gap: 9px; padding: 12px 0; border-top: 1px solid var(--line); }
.result-list form > a { align-self: center; text-decoration: none; }.result-list form > a strong, .result-list form > a small { display: block; }.result-list form > a strong { font-size: 10px; }.result-list form > a small { margin-top: 3px; color: var(--muted); font-size: 8.5px; }.result-list label { display: grid; gap: 5px; }.result-list label span { color: var(--muted); font-size: 8.5px; }

.today-grid { display: grid; gap: 8px; margin-top: 14px; }
.today-grid article { display: flex; align-items: center; gap: 13px; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafbfd; }
.today-grid time { color: var(--blue); font-size: 17px; font-weight: 900; }.today-grid article > div { flex: 1; }.today-grid strong, .today-grid small { display: block; }.today-grid strong { font-size: 10.5px; }.today-grid small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.attendance-form { padding: 20px; }
.text-button { border: 0; color: var(--blue); background: transparent; font-size: 9.5px; font-weight: 800; cursor: pointer; }
.attendance-list { display: grid; margin-top: 15px; }
.attendance-list > div { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr); align-items: center; gap: 14px; padding: 10px 0; border-top: 1px solid var(--line); }
.presence { display: flex; align-items: center; gap: 10px; cursor: pointer; }.presence input { position: absolute; opacity: 0; }.presence span { width: 20px; height: 20px; border: 1px solid #cbd6e3; border-radius: 6px; background: #fff; }.presence input:checked + span { border-color: var(--green); background: var(--green); box-shadow: inset 0 0 0 5px #fff; }.presence strong { font-size: 10.5px; }
.upload-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 20px; padding-top: 17px; border-top: 1px solid var(--line); }

.reports-layout { display: grid; grid-template-columns: minmax(260px, 340px) 1fr; align-items: start; gap: 13px; }
.compact-form { position: sticky; top: 14px; padding: 18px; }.form-stack { display: grid; gap: 13px; margin-top: 17px; }.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.report-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.report-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }.report-card > a { display: block; aspect-ratio: 16/10; overflow: hidden; background: #e9eef4; }.report-card img { width: 100%; height: 100%; object-fit: cover; }.report-card > div { padding: 14px; }.report-card h2 { margin: 9px 0 5px; font-size: 13px; }.report-card p { margin: 0; color: var(--muted); font-size: 8.5px; }.report-card dl { display: flex; gap: 22px; margin: 13px 0 0; padding-top: 11px; border-top: 1px solid var(--line); }.report-card dl > div { display: flex; gap: 5px; }.report-card dt { color: var(--muted); font-size: 8px; }.report-card dd { margin: 0; font-size: 9px; font-weight: 850; }
.report-card > .report-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 8px; background: #eef3f8; }.report-photo-grid.is-single { grid-template-columns: 1fr; }.report-photo-item { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dce4ed; border-radius: 9px; background: #fff; }.report-photo-item > a { display: block; aspect-ratio: 4/3; overflow: hidden; background: #e5ebf2; }.report-photo-item figcaption { display: grid; grid-template-columns: 1fr auto; gap: 3px 7px; align-items: center; padding: 7px; color: var(--muted); font-size: 7.5px; }.report-photo-item figcaption span { grid-column: 1/-1; }.report-photo-item figcaption strong { color: var(--navy); font-size: 8px; }.report-photo-item figcaption strong.is-error { color: #a75c36; }.report-photo-item figcaption a { color: var(--blue); font-weight: 800; text-decoration: none; }
.live-chip.is-muted { color: #68768a; background: #f1f4f8; border-color: #dfe5ed; }.live-chip.is-muted i { background: #98a4b3; }
.ai-count-note, .ai-result { padding: 11px 12px; border: 1px solid #d9e7f8; border-radius: 10px; background: #f4f8ff; }.ai-count-note strong, .ai-result strong { font-size: 9.5px; }.ai-count-note p, .ai-result p { margin: 5px 0 0; color: var(--muted); font-size: 8.5px; line-height: 1.45; }.ai-result { margin-top: 12px; }.ai-result small { display: block; margin-top: 6px; color: #8693a5; font-size: 7.5px; }
.ai-result.is-error { border-color: #f0d8ca; background: #fff7f2; }.ai-result .inline-link { display: inline-block; margin-top: 7px; color: var(--blue); font-size: 8px; font-weight: 800; }
.report-verify { display: grid; gap: 9px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); }.report-verify .field { gap: 4px; }.report-verify .field span { font-size: 7.5px; }.report-verify .field input { min-height: 32px; }.report-verify .small-button { justify-self: start; }.verified-chip { color: var(--green); font-size: 8px; font-weight: 850; }

.auth-page { display: grid; min-height: 100vh; place-items: center; padding: 22px; background: linear-gradient(145deg, #0b1c34, #163765); }
.auth-card { width: min(430px, 100%); padding: 28px; border: 1px solid rgba(255,255,255,.13); border-radius: 20px; background: #fff; box-shadow: 0 30px 90px rgba(0,0,0,.28); }
.auth-brand { display: block; width: min(270px, 82%); margin: 0 auto; padding-bottom: 20px; }.auth-brand img { display: block; width: 100%; height: auto; border-radius: 13px; box-shadow: 0 12px 30px rgba(5,29,67,.18); }
.auth-copy { padding: 25px 0 18px; }.auth-copy h1 { margin: 6px 0 8px; font-size: 28px; letter-spacing: -.04em; }.auth-copy > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 10px; }
.auth-form { display: grid; gap: 13px; }.auth-form label { display: grid; gap: 7px; color: #536177; font-size: 9.5px; font-weight: 800; }.auth-form input { min-height: 42px; padding: 9px 11px; border: 1px solid #d7e0ea; border-radius: 9px; outline: none; }.auth-note { margin: 18px 0 0; color: #8b97a7; font-size: 8.5px; line-height: 1.5; text-align: center; }

.public-page { background: #f2f6fb; }.public-header { display: flex; align-items: center; justify-content: space-between; padding: 11px max(22px, calc((100vw - 1120px)/2)); color: #fff; background: var(--navy); }.public-header > a:last-child { padding: 9px 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 9px; color: #d2dceb; font-size: 10px; text-decoration: none; }.public-brand { width: 118px; padding: 0; border: 0; }.public-brand img { border-radius: 8px; box-shadow: none; }.public-main { width: min(1120px, calc(100% - 28px)); margin: 0 auto; }.public-hero { padding: 50px 0 31px; }.public-hero h1 { margin: 7px 0 10px; font-size: clamp(34px, 6vw, 60px); letter-spacing: -.055em; }.public-hero > p:not(.eyebrow) { margin: 0; color: var(--muted); }
.public-events { display: grid; gap: 15px; padding-bottom: 50px; }.public-events > article { display: grid; grid-template-columns: 90px 1fr minmax(270px, 360px); align-items: center; gap: 24px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }.public-events > article.has-poster { grid-template-columns: minmax(190px, 260px) 78px minmax(210px, 1fr) minmax(270px, 340px); }.public-event-poster { display: block; overflow: hidden; border-radius: 13px; background: #eef2f7; }.public-event-poster img { display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; }.public-event-date { display: grid; width: 78px; height: 82px; place-items: center; border-radius: 14px; color: #fff; background: var(--blue); }.public-event-date b { font-size: 30px; }.public-event-date span { margin-top: -18px; font-size: 9px; }.public-event-copy h2 { margin: 9px 0 7px; font-size: 20px; }.public-event-copy p { margin: 0 0 9px; color: var(--muted); font-size: 10.5px; line-height: 1.5; }.public-event-copy > small { color: #40516a; font-size: 9.5px; font-weight: 800; }.public-events form { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.public-events form label { display: grid; gap: 5px; }.public-events form .wide { grid-column: 1/-1; }.public-footer { padding: 24px; color: #8b97a7; font-size: 9px; text-align: center; }

.page-footer { display: flex; justify-content: space-between; gap: 20px; padding: 24px 2px 2px; color: #8c98a7; font-size: 8.5px; }

@media (max-width: 1180px) {
  .kpi-grid, .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .staff-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }.staff-dashboard-grid { grid-template-columns: 1fr; }.dashboard-staff-strip { grid-template-columns: 1fr auto; }.staff-strip-metrics { grid-column: 1/-1; grid-row: 2; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .income-overview { grid-template-columns: 1fr; }.income-institution-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.income-total-card { min-height: 130px; }
  .result-list > form { grid-template-columns: 1fr 90px 1fr; }.result-list form > a { grid-column: 1/-1; }.result-list .small-button { grid-column: 3; }
  .public-events > article, .public-events > article.has-poster { grid-template-columns: 80px 1fr; }.public-event-poster { grid-column: 1/-1; max-height: 520px; }.public-event-poster img { max-height: 520px; object-fit: contain; }.public-events form { grid-column: 1/-1; }
}
@media (max-width: 860px) {
  .sidebar { transform: translateX(-105%); box-shadow: 18px 0 40px rgba(9,20,38,.24); transition: transform .2s ease; }.sidebar.is-open { transform: translateX(0); }
  .main-content { margin-left: 0; padding: 0 17px 21px; }.menu-button { display: block; }.topbar-date { display: none; }.profile { margin-left: auto; }
  .detail-grid, .athlete-summary-grid, .weekend-layout, .reports-layout { grid-template-columns: 1fr; }.compact-form { position: static; }.schedule-row { grid-template-columns: 110px 1fr 1fr; }.schedule-row .location-field { grid-column: 2/-1; }
  .athlete-picker, .report-gallery { grid-template-columns: 1fr; }
  .result-medal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.result-summary-strip { grid-template-columns: 1fr; }.result-table-heading { align-items: flex-start; flex-direction: column; }
  .income-institution-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 580px) {
  .main-content { padding-inline: 12px; }.topbar { min-height: 66px; gap: 10px; }.topbar-context span { display: none; }.topbar-context { min-width: 0; }.profile-copy { display: none; }.logout { padding-inline: 9px; }.welcome-row, .page-heading { align-items: flex-start; flex-direction: column; }.heading-actions { justify-content: flex-start; }.live-chip { align-self: flex-start; }
  .kpi-grid, .module-grid, .form-grid, .upload-grid, .checkbox-options { grid-template-columns: 1fr; }.field-wide { grid-column: auto; }.section-heading { align-items: flex-start; flex-direction: column; }.section-heading > p { text-align: left; }
  .athlete-rank-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.rank-period-heading { align-items: flex-start; flex-direction: column; }.athlete-team-block { align-items: stretch; flex-direction: column; }.athlete-team-card { flex-basis: auto; }.result-period-grid, .result-period-grid.rank-period-grid { grid-template-columns: 1fr; }.result-custom-filter { align-items: stretch; flex-direction: column; }.result-custom-filter label, .result-custom-filter input, .result-custom-filter .secondary-button { width: 100%; }
  .staff-kpis, .staff-strip-metrics { grid-template-columns: 1fr; }.dashboard-staff-strip { grid-template-columns: 1fr; }.dashboard-staff-strip .primary-button { width: 100%; }.staff-strip-metrics { grid-column: auto; grid-row: auto; }
  .income-institution-grid { grid-template-columns: 1fr; }.income-source-state { align-items: flex-start; flex-direction: column; }.income-source-state small { white-space: normal; }
  .list-tools { align-items: flex-start; flex-direction: column; }.table-search { width: 100%; }.sync-panel { align-items: flex-start; flex-direction: column; }.schedule-row { grid-template-columns: 1fr 1fr; }.schedule-row > strong { grid-column: 1/-1; }.schedule-row .location-field { grid-column: 1/-1; }
  .group-member-tools { align-items: stretch; flex-direction: column; }.group-member-tools .small-button { width: 100%; }.group-member-summary { margin-left: 0; }
  .section-history-link { justify-content: stretch; }.section-history-link a { width: 100%; justify-content: center; }.history-entry-top { align-items: flex-start; flex-direction: column; gap: 4px; }
  .ekp-date-filter { align-items: stretch; flex-direction: column; }.ekp-filter-copy, .filter-field { width: 100%; min-width: 0; flex: none; }.filter-actions { width: 100%; }.filter-actions .primary-button, .filter-actions .secondary-button { flex: 1; }
  .poster-upload { grid-template-columns: 1fr; }.poster-upload .primary-button { width: 100%; }.attendance-list > div { grid-template-columns: 1fr; }.today-grid article { align-items: flex-start; flex-wrap: wrap; }.today-grid article form { width: 100%; }.today-grid article .primary-button { width: 100%; }
  .result-list > form { grid-template-columns: 1fr; }.result-list form > a, .result-list .small-button { grid-column: auto; }.public-header { padding-inline: 12px; }.public-brand { width: 92px; }.public-header > a:last-child { padding: 8px 9px; }.public-main { width: min(100% - 20px, 1120px); }.public-hero { padding: 37px 3px 24px; }.public-events > article { grid-template-columns: 1fr; gap: 16px; }.public-events form { grid-column: auto; grid-template-columns: 1fr; }.public-events form .wide { grid-column: auto; }.page-footer { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }