/* Design polish pass: hierarchy of actions, auth screen, floating timer, compact lists. Loaded last. */
/* logged-out header: no empty pill */
#user-badge:empty{display:none}
/* auth screen: segmented control reads as a selected tab, smaller logo tile, room around the trial button */
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--field);border:1px solid var(--line);border-radius:16px;margin:20px 0}
.auth-tabs button{min-height:46px;border:0;border-radius:12px;font-weight:700;box-shadow:none}
.auth-tabs button.primary{background:var(--action);color:var(--ink)}
.auth-tabs button.secondary{background:transparent;color:var(--muted)}
.auth-tabs button.secondary:hover{color:var(--text)}
.auth .auth-art{width:52px;height:52px;border-radius:16px;font-size:28px;margin-bottom:4px}
.auth .ld-try{margin:20px 0 0}
/* dashboard: one primary action in the hero, the second is quiet */
.hero .hero-program-action .secondary{background:transparent;border:1.5px solid #f1f4ed59;color:#f1f4ed}
.hero .hero-program-action .secondary:hover{border-color:#d2f56a}
/* floating "return to workout" bar must not sit on the sidebar and should stay slim */
@media(min-width:761px){.mini{left:auto;right:24px;bottom:22px}}
@media(max-width:760px){.mini{padding:6px 10px;gap:8px;font-size:13px}.mini strong{font-size:15px}.mini button{min-height:40px;padding:0 12px}}
/* news entry: a quiet one-line link, not a second hero */
@media(max-width:760px){
  .news-entry{padding:12px 16px;margin-bottom:14px;border-radius:16px}
  .news-entry>span>span{display:none}
  .news-entry strong{font-size:17px}
}
/* programs: search is one compact block */
.program-search{display:grid;grid-template-columns:1fr auto;gap:10px 10px;align-items:end;margin:6px 0 4px}
.program-search label:first-child{grid-column:1/-1}
.program-search button{min-height:48px;padding:0 22px}
@media(min-width:761px){.program-search{grid-template-columns:2fr 1fr auto}.program-search label:first-child{grid-column:auto}}
/* charts: no dead space under the line */
.chart-card .chart{height:150px}
@media(prefers-reduced-motion:no-preference){
  .card{transition:border-color .18s,transform .18s}
  .program-card:hover,.news-entry:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}
}
/* programs: "create your own" is secondary to the programs themselves */
.page-heading~.button-row>button.primary[data-action="create-program"],.page-heading+.button-row .primary{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
/* charts: soft area under the line and a highlighted last value */
.chart .area{fill:color-mix(in srgb,var(--accent) 14%,transparent);stroke:none}
.chart .chart-last{fill:var(--text);font-weight:700;font-size:12px}
.chart circle:last-of-type{r:4.5}
/* loading skeleton: calm shimmer instead of a bare text line */
.skeleton{min-height:220px;border-radius:24px;color:transparent;background:linear-gradient(100deg,var(--panel) 30%,var(--panel2) 50%,var(--panel) 70%);background-size:200% 100%;border:1px solid var(--line)}
@media(prefers-reduced-motion:no-preference){.skeleton{animation:fb-shimmer 1.4s linear infinite}}
@keyframes fb-shimmer{to{background-position:-200% 0}}
/* one consistent keyboard focus ring and tactile press feedback */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:inherit}
@media(prefers-reduced-motion:no-preference){button:not(:disabled):active{transform:scale(.98)}}
/* numbers line up in stats and timers */
.metric strong,.demo-target strong,.mini strong,[data-timer-face]{font-variant-numeric:tabular-nums}
/* settings: sections breathe on phones */
@media(max-width:760px){#settings-form .grid{gap:12px}.theme-switch-row{margin-bottom:6px}}
/* install hint */
.install-hint{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 20px;margin:0 0 18px;border-radius:20px}
.install-hint strong{display:block}.install-hint p{margin:4px 0 0;color:var(--muted);line-height:1.45}
.install-actions{display:flex;gap:8px;flex-wrap:wrap}