/* Selected header proposal: navigation and utility links above, training modes below. */
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;justify-content:initial;align-items:center;gap:10px 24px;padding:14px 20px 16px;min-height:0}
.header-primary{grid-column:1;grid-row:1;display:flex;align-items:center;gap:clamp(22px,3vw,46px);min-width:0}
.header-primary-links{display:flex;align-items:center;gap:clamp(18px,2.5vw,38px);min-width:0}
.header-primary-links .nav-link{white-space:nowrap;padding:8px 0}
.header-utility{grid-column:2;grid-row:1;display:flex;align-items:center;gap:12px;white-space:nowrap}
.header-utility .language-control{margin:0}
.header-utility .theme-switch{margin-inline-start:7px}
.header-exercises{grid-column:1/-1;grid-row:2;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-top:9px;border-top:1px solid #382c2a}
.header-exercises .nav-link{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:10px 23px;border:1px solid #493733;border-radius:5px;white-space:nowrap;line-height:1.2}
.header-exercises .nav-link[data-page-link="warmup"]{border-color:#ff825b;background:#ff825b;color:#17100e;font-weight:700}
.header-exercises .nav-link[data-page-link="practice"]{border-color:#a89489;background:#f1ece8;color:#171111;font-weight:700}
.header-exercises .nav-link[data-page-link="flashes"]{border-color:#ff825b;color:#ff825b;font-weight:700}
.header-exercises .nav-link[data-page-link="reaction"]{color:#ded5d1}
.header-exercises .nav-link:hover,.header-exercises .nav-link:focus-visible{transform:translateY(-1px);border-color:#ff825b;color:#ff9875}
.header-exercises .nav-link[data-page-link="warmup"]:hover,.header-exercises .nav-link[data-page-link="practice"]:hover{color:#171111}
@media(max-width:1050px){.topbar{grid-template-columns:1fr;gap:12px}.header-primary{grid-column:1;grid-row:1;justify-content:space-between}.header-utility{grid-column:1;grid-row:2;justify-content:flex-end}.header-exercises{grid-row:3;grid-column:1}.header-primary-links{gap:18px}}
@media(max-width:620px){.header-primary{flex-wrap:wrap;gap:10px}.header-primary-links{order:2;width:100%;justify-content:space-between;gap:10px}.header-primary-links .nav-link{font-size:12px}.header-utility{justify-content:flex-start;flex-wrap:wrap}.header-exercises{gap:8px}.header-exercises .nav-link{min-height:42px;padding:8px 12px;font-size:12px}}
