:root {
  font-family: "Inter", "Segoe UI", sans-serif;
  font-synthesis: none;
  color-scheme: light;
  color: var(--ink);
  background: var(--page);
  --ink: #122c44;
  --quiet: #435e74;
  --line: #cedfed;
  --card: #fff;
  --blue: #1556b1;
  --blue-dark: #104784;
  --blue-pale: #e4f2fd;
  --chart-line: #1662bc;
  --chart-fill: #1d60d43b;
  --page: #e4f3fd;
  --shell: #eaf5fd;
  --shell-glow: #c6edfc;
  --topbar: #fcfeff;
  --topbar-line: #bad8f0;
  --field-label: #354967;
  --field-border: #cbd6e8;
  --soft-card: #f8faff;
  --tinted-card: #f4f7fd;
  --field-placeholder: #5c6c83;
  --control-hover: #8aa1ce;
  --primary-hover: #104784;
  --selected-card: #f6f9ff;
  --selected-border: #8eaced;
  --focus-ring: #265bd9;
  --notice-bg: #eef4ff;
  --notice-line: #a1b8ec;
  --notice-ink: #243e77;
  --error-bg: #fdf0f2;
  --error-line: #efc8ce;
  --error-ink: #8d2435;
  --danger: #a22d3c;
  --banner-stripe: #ffffff32;
  --radius: 21px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #ebf5ff;
  --quiet: #b6cbe2;
  --line: #3b5571;
  --card: #162a3f;
  --blue: #205ba8;
  --blue-dark: #c0e1ff;
  --blue-pale: #24486c;
  --chart-line: #7abbff;
  --chart-fill: #66aaf847;
  --page: #0b1727;
  --shell: #0e1c2d;
  --shell-glow: #163650;
  --topbar: #101f31;
  --topbar-line: #365674;
  --field-label: #c2d5e9;
  --field-border: #607d9c;
  --soft-card: #132539;
  --tinted-card: #203851;
  --field-placeholder: #9fb7ce;
  --control-hover: #8eb5da;
  --primary-hover: #18477e;
  --selected-card: #1c3b59;
  --selected-border: #71a5db;
  --focus-ring: #8ecaFF;
  --notice-bg: #213c5e;
  --notice-line: #6b9bcc;
  --notice-ink: #d2e7ff;
  --error-bg: #45283a;
  --error-line: #a6627a;
  --error-ink: #ffced8;
  --danger: #ffabb9;
  --banner-stripe: #ffffff19;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
button, select, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .48; }
:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
[hidden] { display: none !important; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.04em; }
h1 { font-size: clamp(1.7rem, 3.6vw, 2.8rem); }
h2 { font-size: clamp(1.12rem, 2vw, 1.37rem); }
h3 { font-size: 1rem; }
.loading { margin: 2rem; color: var(--quiet); }
.muted { color: var(--quiet); }
.stack { display: grid; gap: 16px; }
.row, .actions, .toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.toolbar { justify-content: space-between; }

.shell {
  --banner-light: #fbfeff;
  --banner-color: #9adff9;
  --banner-edge: #b3daf5;
  --banner-mark: #146bc5;
  --art-first: 33.3333% 0%;
  --art-second: 100% 0%;
  min-height: 100dvh;
  background: radial-gradient(ellipse at 98% 0%, var(--shell-glow), transparent 580px), var(--shell);
}
.topbar { border-bottom: 1px solid var(--topbar-line); background: var(--topbar); }
.topbar-inner {
  min-height: 73px;
  max-width: 1320px;
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 52px);
  display: grid;
  grid-template-columns: minmax(max-content, 1fr) auto minmax(122px, 1fr);
  gap: 16px;
  align-items: center;
}
.brand { display: flex; align-items: center; width: clamp(148px, 20vw, 197px); max-width: 100%; min-width: 0; }
.brand-wordmark { display: block; width: 100%; min-width: 0; height: auto; }
.menu { display: flex; gap: 4px; }
button.nav-item {
  background: transparent;
  border-color: transparent;
  color: var(--quiet);
  white-space: nowrap;
  padding-inline: 14px;
}
button.nav-item[aria-current="page"] {
  color: #fff;
  background: linear-gradient(120deg, #1452a9, #1268ba);
  box-shadow: 0 2px 7px #175eae24;
}
.account { display: flex; align-items: center; gap: 14px; justify-self: end; min-width: 0; }
.topbar-user { display: grid; min-width: 0; line-height: 1.25; text-align: right; font-size: .87rem; overflow-wrap: anywhere; }
.topbar-user .muted { font-size: .78rem; }
.topbar > .notice { margin: 0 auto 10px; max-width: min(90%, 900px); }
.content { max-width: 1320px; margin: 0 auto; padding: 26px clamp(16px, 4vw, 52px) 40px; min-width: 0; }
.content > * + * { margin-top: 18px; }
.shell[data-coach-art][data-view="overview"] { --coach-art: url('/coach-art/overview.webp'); }
.shell[data-coach-art][data-view="workouts"] { --coach-art: url('/coach-art/workouts.webp'); }
.shell[data-coach-art][data-view="meets"] { --coach-art: url('/coach-art/meets.webp'); }
.shell[data-coach-art][data-view="team"] { --coach-art: url('/coach-art/team.webp'); }
.shell[data-coach-art][data-view="metrics"] { --coach-art: url('/coach-art/metrics.webp'); }
@media (width < 1440px), (height < 640px) {
  .shell[data-coach-art] .content { isolation: isolate; }
  .shell[data-coach-art] .content::before,
  .shell[data-coach-art] .content::after {
    content: "";
    position: fixed;
    inset-block-end: max(10px, env(safe-area-inset-bottom));
    width: min(37vw, 190px, 30vh);
    aspect-ratio: 400 / 840;
    background: var(--coach-art) left bottom / 200% 100% no-repeat;
    opacity: .23;
    pointer-events: none;
    z-index: -1;
  }
  .shell[data-coach-art] .content::before { inset-inline-start: 4px; }
  .shell[data-coach-art] .content::after { inset-inline-end: 4px; background-position: right bottom; }
  :root[data-theme="dark"] .shell[data-coach-art] .content::before,
  :root[data-theme="dark"] .shell[data-coach-art] .content::after { opacity: .16; }
}
@media (min-width: 1440px) and (min-height: 640px) {
  .shell[data-coach-art] .content { max-width: 1120px; }
  .shell[data-coach-art]::before,
  .shell[data-coach-art]::after {
    content: "";
    position: fixed;
    inset-block-end: clamp(12px, 2vh, 28px);
    width: min(288px, calc((100vw - 1120px) / 2 + 20px), 38vh);
    aspect-ratio: 400 / 840;
    background-image: var(--coach-art);
    background-repeat: no-repeat;
    background-size: 200% 100%;
    pointer-events: none;
  }
  .shell[data-coach-art]::before { inset-inline-start: 10px; background-position: left bottom; }
  .shell[data-coach-art]::after { inset-inline-end: 10px; background-position: right bottom; }
}
.hero {
  color: #fff;
  min-height: 126px;
  border-radius: var(--radius);
  padding: 22px clamp(15px, 3vw, 32px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: linear-gradient(115deg, #113c76, #166ba6 65%, #167a94);
}
.hero h1 { font-weight: 740; }
.hero-action { flex-shrink: 0; }
.hero .hero-action { color: #fff; background: #142959; border-color: #8399c8; }
.hero .hero-action:hover { background: #24417b; border-color: #bbcafa; }
.overview-filter { justify-content: flex-start; align-items: flex-end; }
.overview-filter .field { min-width: 135px; }
.overview-filter .field:first-child:not(:only-child) { min-width: 175px; }

.card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); padding: 20px; min-width: 0; box-shadow: 0 4px 10px #17405d09; }
.overview-tiles { display: grid; gap: 8px; min-width: 0; }
.tiles-header, .tile-actions, .tile-controls, .tile-positioning { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tiles-header, .tile-controls { justify-content: space-between; }
.tile-select { width: auto; max-width: min(100%, 23rem); }
.tiles-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.dashboard-tile { display: flex; flex-direction: column; gap: 6px; padding: 16px; min-height: 125px; }
.dashboard-tile h3 { font-size: .87rem; letter-spacing: -.015em; color: var(--quiet); overflow-wrap: anywhere; }
.stat-value { font-size: clamp(1.38rem, 3.5vw, 2.18rem); line-height: 1.02; font-weight: 760; letter-spacing: -.055em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.tile-selected { border-color: var(--selected-border); background: var(--selected-card); }
.tile-detail { font-size: .78rem; line-height: 1.25; }
.tile-controls { margin-top: auto; align-items: end; }
.tile-positioning { gap: 3px; margin-left: auto; }
.tile-controls .tile-chart, .tiles-edit {
  color: var(--blue-dark);
  background: var(--blue-pale);
  border-color: transparent;
  min-height: 34px;
  padding: 5px 9px;
  font-size: .82rem;
}
.tile-positioning button { padding: 5px 7px; min-height: 38px; min-width: 36px; }
.chart-card { gap: 9px; }
.chart-header { align-items: center; }
.chart-header label { display: flex; align-items: center; gap: 8px; }
.chart-header select { width: auto; max-width: min(100%, 260px); }
.chart { color: var(--quiet); min-width: 0; width: 100%; }
.chart canvas { display: block; max-width: 100%; }
.metric-summary { font-size: .89rem; font-variant-numeric: tabular-nums; }
.chart-data summary { padding: 7px 0 0; color: var(--blue-dark); font-size: .82rem; cursor: pointer; }

button, .button { min-height: 40px; border: 1px solid var(--line); border-radius: 10px; padding: 7px 11px; color: var(--ink); background: var(--card); font-weight: 640; }
button:hover, .button:hover { border-color: var(--control-hover); }
button.nav-item:not([aria-current]):hover { background: var(--tinted-card); }
.primary, .button.primary { background: var(--blue); border-color: var(--blue); color: #fff; }
.primary:hover, .button.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.danger { color: var(--danger); }
.download { display: inline-flex; align-items: center; text-decoration: none; }
label { display: grid; gap: 5px; min-width: 0; color: var(--field-label); font-size: .85rem; font-weight: 620; }
select, input, textarea.workout-notes { width: 100%; min-width: 0; min-height: 40px; padding: 8px 9px; border: 1px solid var(--field-border); border-radius: 10px; color: var(--ink); background: var(--card); }
textarea.workout-notes { font: inherit; resize: vertical; }
input::placeholder { color: var(--field-placeholder); }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.form-grid > .field:has(> textarea.workout-notes) { grid-column: 1 / -1; }
fieldset { padding: 12px; min-width: 0; border: 1px solid var(--line); border-radius: 12px; }
legend { padding-inline: 7px; font-weight: 700; }
.table-wrap { overflow-x: auto; max-width: 100%; }
.trial-filters { justify-content: flex-start; align-items: flex-end; }
.trial-filters label { min-width: min(9rem, 100%); }
.trial-splits { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 12px; }
.trial-split { display: grid; gap: 8px; margin: 0; }
.view-trials summary { cursor: pointer; }
table { border-collapse: collapse; width: 100%; text-align: left; white-space: nowrap; font-size: .86rem; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--line); }
th { color: var(--quiet); background: var(--tinted-card); font-weight: 675; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: var(--soft-card); }
.empty { border: 1px dashed var(--line); color: var(--quiet); background: var(--soft-card); padding: 18px; border-radius: 12px; }
.notice { border: 1px solid var(--notice-line); border-radius: 10px; background: var(--notice-bg); color: var(--notice-ink); padding: 10px 12px; }
.notice.error { background: var(--error-bg); border-color: var(--error-line); color: var(--error-ink); }
dialog { padding: 0; max-height: min(89dvh, 850px); width: min(560px, calc(100% - 24px)); color: var(--ink); background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 16px 65px #13244655; }
dialog::backdrop { background: #0c1d46a8; }
dialog form, dialog .card { padding: 22px; }

.auth {
  min-height: 100dvh;
  width: min(1240px, 100%);
  margin-inline: auto;
  padding: clamp(14px, 3vw, 42px);
  display: grid;
  grid-template-columns: minmax(260px, 1.32fr) minmax(285px, 1fr);
  align-items: center;
  gap: clamp(14px, 4vw, 45px);
}
.auth-art {
  min-height: clamp(400px, 72vh, 700px);
  display: flex;
  align-items: flex-end;
  padding: clamp(12px, 2.3vw, 30px);
  overflow: hidden;
  background:
    linear-gradient(0deg, #082b65b0, transparent 46%),
    #1599ca url('/after-touch-entry.webp') 11% center / cover no-repeat;
  border: 1px solid #9acaf0;
  border-radius: 32px;
  box-shadow: 0 24px 60px #0b57902b;
}
.auth-kit {
  width: min(100%, 520px);
  margin-inline: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(4px, 1vw, 13px);
  padding: 8px clamp(6px, 2vw, 20px);
  background: #082d59a6;
  border: 1px solid #ffffff79;
  border-radius: 24px;
}
.auth-panel {
  align-content: center;
  width: min(100%, 490px);
  padding: clamp(25px, 4vw, 48px);
  gap: 23px;
  margin-inline: auto;
  border: 1px solid var(--line);
  border-radius: 25px;
  background: var(--card);
  box-shadow: 0 16px 42px #194a7514;
}
.auth-panel .brand { width: min(100%, 260px); }
.auth-panel h1 { margin-top: 12px; }
.swim-gear {
  width: min(18%, 86px);
  flex: 0 1 auto;
  aspect-ratio: 1;
  background: url('/pool-kit.webp') var(--gear-cell) / 400% 200% no-repeat;
  filter: drop-shadow(0 3px 4px #092d5370);
}
.gear-paddles { --gear-cell: 0% 0%; transform: rotate(5deg); }
.gear-fins { --gear-cell: 33.3333% 0%; transform: rotate(-7deg); }
.gear-goggles { --gear-cell: 100% 0%; transform: rotate(-8deg); }
.gear-board { --gear-cell: 0% 100%; transform: rotate(8deg); }
.gear-stopwatch { --gear-cell: 66.6667% 100%; transform: rotate(5deg); }

.shell[data-view="workouts"] {
  --banner-light: #fffaf2;
  --banner-color: #ffd595;
  --banner-edge: #f2c684;
  --banner-mark: #ad5b1c;
  --art-first: 0% 0%;
  --art-second: 0% 100%;
}
.shell[data-view="meets"] {
  --banner-light: #fff8f7;
  --banner-color: #ffa895;
  --banner-edge: #f1b2a7;
  --banner-mark: #bf5147;
  --art-first: 66.6667% 100%;
  --art-second: 100% 100%;
}
.shell[data-view="metrics"] {
  --banner-light: #f8fffe;
  --banner-color: #84ddd4;
  --banner-edge: #a3ddd6;
  --banner-mark: #148a84;
  --art-first: 33.3333% 100%;
  --art-second: 66.6667% 0%;
}
.shell[data-view="team"] {
  --banner-light: #fbf9ff;
  --banner-color: #c6baf8;
  --banner-edge: #d7caf3;
  --banner-mark: #7254b7;
  --art-first: 100% 0%;
  --art-second: 33.3333% 100%;
}
:root[data-theme="dark"] .shell {
  --banner-light: #142c49;
  --banner-color: #195d85;
  --banner-edge: #497aa5;
  --banner-mark: #72baff;
}
:root[data-theme="dark"] .shell[data-view="workouts"] {
  --banner-light: #30283a;
  --banner-color: #754728;
  --banner-edge: #9b7452;
  --banner-mark: #ffba79;
}
:root[data-theme="dark"] .shell[data-view="meets"] {
  --banner-light: #352736;
  --banner-color: #783852;
  --banner-edge: #9b607a;
  --banner-mark: #ff9c97;
}
:root[data-theme="dark"] .shell[data-view="metrics"] {
  --banner-light: #112e3a;
  --banner-color: #1c625d;
  --banner-edge: #4c8f88;
  --banner-mark: #79e0d3;
}
:root[data-theme="dark"] .shell[data-view="team"] {
  --banner-light: #29283e;
  --banner-color: #51467d;
  --banner-edge: #7766a8;
  --banner-mark: #c9b6fb;
}

.content > .stack > h1,
.view-meets > .toolbar:first-child {
  --illustration: clamp(39px, 7.2vw, 96px);
  position: relative;
  isolation: isolate;
  padding: 16px calc(var(--illustration) * 2 + 10px) 16px clamp(14px, 3vw, 27px);
  min-height: clamp(78px, 10vw, 132px);
  align-content: center;
  background:
    repeating-linear-gradient(126deg, transparent 0 26px, var(--banner-stripe) 26px 30px, transparent 30px 58px),
    linear-gradient(109deg, var(--banner-light) 11%, var(--banner-color) 100%);
  border: 1px solid var(--banner-edge);
  border-inline-start: 4px solid var(--banner-mark);
  border-radius: var(--radius);
}
.content > .stack > h1::before,
.content > .stack > h1::after,
.view-meets > .toolbar:first-child::before,
.view-meets > .toolbar:first-child::after {
  content: "";
  position: absolute;
  top: 50%;
  width: var(--illustration);
  aspect-ratio: 1;
  background: url('/pool-kit.webp') var(--art-position) / 400% 200% no-repeat;
  pointer-events: none;
  z-index: -1;
  filter: drop-shadow(0 3px 3px #23445f24);
}
.content > .stack > h1::before,
.view-meets > .toolbar:first-child::before {
  --art-position: var(--art-first);
  right: calc(var(--illustration) + 12px);
  transform: translateY(-56%) rotate(-9deg);
}
.content > .stack > h1::after,
.view-meets > .toolbar:first-child::after {
  --art-position: var(--art-second);
  right: 8px;
  transform: translateY(-41%) rotate(8deg);
}
.shell[data-view="team"] .card,
.shell[data-view="metrics"] .card {
  background: linear-gradient(180deg, var(--banner-light) 0, var(--card) 100px);
}
.content :is(.workout-tile, .meet-card, .record-tile) {
  border-inline-start: 3px solid var(--banner-edge);
}
.auth-panel h1 { font-size: clamp(1.85rem, 3.5vw, 2.9rem); }
.auth-panel .form-grid { grid-template-columns: 1fr; gap: 16px; }
.auth-panel .primary { flex: 1 1 auto; }
.demo-actions { border-top: 1px solid var(--line); padding-top: 18px; }

@media (max-width: 870px) {
  .topbar-inner { min-height: auto; grid-template-columns: minmax(0,1fr) fit-content(46%); gap: 8px 10px; padding-block: 9px 6px; }
  .topbar-inner .brand { width: min(132px, 100%); }
  .topbar-inner .menu { grid-row: 2; grid-column: 1 / -1; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
  button.nav-item { padding-inline: 4px; font-size: .84rem; min-height: 38px; }
  .topbar-user { font-size: .8rem; }
  .topbar-user .muted { font-size: .72rem; }
  .account { gap: 7px; }
  .account .button { flex-shrink: 0; min-height: 36px; padding-inline: 8px; font-size: .79rem; }
  .topbar-user strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .topbar-user .muted { white-space: nowrap; }
  .content { padding-top: 13px; }
  .stack { gap: 12px; }
  .hero { min-height: 89px; gap: 8px; padding: 12px 14px; border-radius: 16px; }
  .hero h1 { font-size: clamp(1.28rem, 5.5vw, 1.9rem); }
  .hero-action { max-width: 50%; min-height: 36px; padding-inline: 7px; font-size: .76rem; }
  .overview-filter .field, .overview-filter .field:first-child:not(:only-child) { min-width: 0; flex: 1 1 100px; }
  .tiles-grid { gap: 5px; }
  .tiles-grid-editing { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .card { padding: 13px; border-radius: 15px; }
  .dashboard-tile { min-height: 94px; padding: 9px 7px; gap: 5px; }
  .dashboard-tile h3 { font-size: .75rem; }
  .dashboard-tile .stat-value { font-size: clamp(1.02rem, 4vw, 1.52rem); }
  .tile-detail { font-size: .7rem; }
  .tile-controls .tile-chart { min-height: 34px; padding-inline: 6px; font-size: .73rem; }
  .tile-positioning { margin-left: 0; }
  .tile-actions { display: grid; grid-template-columns: repeat(2,minmax(0, 1fr)); }
  .tile-select { width: 100%; max-width: 100%; }
  .chart-header label { display: grid; gap: 3px; max-width: 60%; }
  .chart-header select { max-width: 100%; }
  .auth { grid-template-columns: minmax(0, 1fr) minmax(285px, 1fr); }
}
@media (max-width: 420px) {
  .form-grid { grid-template-columns: 1fr; }
  .tile-positioning button { min-width: 26px; padding-inline: 4px; }
}

.appearance .field { max-width: 230px; }
.training-nav [aria-current] { color: var(--blue-dark); background: var(--blue-pale); border-color: var(--selected-border); }
.records-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); gap: 10px; }
.record-tile { display: grid; align-content: start; gap: 7px; text-align: left; min-width: 0; padding: 14px; overflow-wrap: anywhere; }
.record-tile[aria-pressed="true"] { color: var(--blue-dark); background: var(--blue-pale); border-color: var(--selected-border); }
.workout-tile.card { padding: 0; }
.workout-tile > summary { cursor: pointer; padding: 13px 17px; }
.workout-tile > summary h3 { display: inline; margin-left: 8px; }
.workout-caption { display: block; margin: 4px 0 0 16px; overflow-wrap: anywhere; }
.workout-detail { padding: 13px; border-top: 1px solid var(--line); }
p.workout-notes { white-space: pre-wrap; overflow-wrap: anywhere; }
.orthoprobe-entry { display: grid; gap: 4px; padding: 9px 0; }
.orthoprobe-entry + .orthoprobe-entry { border-top: 1px solid var(--line); }
.orthoprobe-entry-meta { justify-content: space-between; }
.orthoprobe-zone { display: inline-block; padding: 3px 8px; border-radius: 8px; font-weight: 620; }
.workout-block { background: var(--soft-card); box-shadow: none; }
.workout-block h3, .meet-card h2 { overflow-wrap: anywhere; }
.meet-results { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; margin: 0; }
.meet-results dd { font-weight: 680; margin: 0; font-variant-numeric: tabular-nums; }
.split-results { overflow-x: auto; }
.split-results table { min-width: 0; width: 100%; font-variant-numeric: tabular-nums; }
.split-results :is(th,td) { padding: 7px 5px; overflow-wrap: anywhere; }
.structure-editor { max-height: calc(100dvh - 24px); width: min(760px, calc(100% - 20px)); padding: 17px; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); }
.structure-editor::backdrop { background: #14244778; }
.structure-editor > h2 { margin-bottom: 13px; }
.editor-footer { position: sticky; bottom: -17px; padding-block: 10px; justify-content: flex-end; background: var(--card); border-top: 1px solid var(--line); }
.edit-split { display: grid; align-items: center; grid-template-columns: minmax(17px, .25fr) minmax(64px, 1fr) minmax(48px, .8fr) minmax(53px, .86fr); gap: 5px; }
.edit-split input { min-width: 0; padding-inline: 5px; }
.edit-split output { color: var(--blue-dark); font-size: .85rem; }
.edit-splits { display: grid; gap: 6px; }
.split-labels { font-size: .78rem; color: var(--quiet); }
.tile-preferences { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 7px; }
.tile-preferences input[type="checkbox"] { height: 19px; width: 19px; }
.reorder { flex-wrap: nowrap; }
.reorder button { min-width: 30px; padding-inline: 5px; }
@media (max-width: 630px) {
  .topbar-inner .menu { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0,1fr)); }
  .topbar-inner .menu:not(:has(.nav-item:nth-child(5))) { grid-template-columns: repeat(2, minmax(0,1fr)); }
  button.nav-item { padding-inline: 3px; font-size: .8rem; white-space: normal; }
  .auth { grid-template-columns: minmax(0,1fr); align-content: center; }
  .auth-art { width: min(100%, 490px); margin-inline: auto; min-height: clamp(157px, 48vw, 270px); padding: 9px; border-radius: 22px; background-position: center 19%; }
  .auth-kit { gap: 6px; padding: 5px 9px; border-radius: 15px; }
  .auth-art .swim-gear { width: min(17%, 54px); transform: none; }
  .view-meets > .toolbar:first-child { justify-content: flex-start; }
  .content > .stack > h1, .view-meets > .toolbar:first-child h1 { font-size: clamp(1.48rem, 4.5vw, 2.1rem); }
}
@media (max-width: 380px) {
  .topbar-user { font-size: .72rem; }
  .topbar-user .muted { font-size: .66rem; }
}
@media (max-width: 390px) {
  .structure-editor { padding: 9px; }
  .structure-editor .workout-block { padding: 8px; }
  .editor-footer { bottom: -9px; }
}