:root {
  --ink: #17211b;
  --muted: #6c776f;
  --paper: #f6f8f4;
  --line: #dde5de;
  --brand: #217a52;
  --brand-dark: #145335;
  --accent: #e5f1df;
}

html { font-size: 16px; position: relative; min-height: 100%; }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--ink); background: var(--paper); font-family: Georgia, 'Times New Roman', serif; }
.site-header { background: rgba(246, 248, 244, .94); border-bottom: 1px solid var(--line); }
.navbar-brand { color: var(--ink); font-weight: 700; letter-spacing: .01em; }
.brand-mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; background: var(--brand); font-family: Arial, sans-serif; font-size: .9rem; }
.nav-link, .btn { font-family: Arial, sans-serif; }
.nav-link { color: var(--muted); font-size: .9rem; }
.nav-link:hover { color: var(--brand); }
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); }
.page-shell { min-height: calc(100vh - 130px); padding-top: clamp(2rem, 6vw, 5rem); padding-bottom: 4rem; }
.site-footer { display: flex; justify-content: space-between; gap: 1rem; max-width: 1140px; margin: 0 auto; padding: 1.25rem 1rem; border-top: 1px solid var(--line); font-family: Arial, sans-serif; font-size: .82rem; }
.site-footer a { color: var(--muted); }
.eyebrow, .hero-kicker { color: var(--brand); font: 700 .72rem/1 Arial, sans-serif; letter-spacing: .14em; }
.display-title { max-width: 720px; margin: .75rem 0 1rem; font-size: clamp(3rem, 8vw, 6.3rem); line-height: .95; letter-spacing: -.04em; }
.display-title span { color: var(--brand); }
.mw-copy { max-width: 520px; font-family: Arial, sans-serif; }
.hero-note { min-height: 300px; padding: 2rem; background: #fff; border: 1px solid var(--line); border-radius: 1rem; box-shadow: 12px 16px 0 var(--accent); }
.hero-dot { width: 10px; height: 10px; background: #d6a525; border-radius: 50%; }
.hero-note h2 { letter-spacing: -.02em; }
.card, .table-responsive { border-color: var(--line) !important; }
.dashboard-title { letter-spacing: -.03em; }
.stat-card { height: 100%; padding: 1.25rem; background: #fff; border: 1px solid var(--line); border-radius: .75rem; }
.stat-value { font-size: 2rem; line-height: 1; }
.section-label { color: var(--muted); font: 700 .72rem Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.auth-layout { display: grid; place-items: center; min-height: 65vh; }
.auth-panel { width: min(100%, 460px); padding: clamp(1.5rem, 5vw, 3rem); background: #fff; border: 1px solid var(--line); border-radius: 1rem; box-shadow: 10px 12px 0 var(--accent); }
.auth-panel .form-label, .auth-panel input, .auth-panel button { font-family: Arial, sans-serif; }
.status-icon { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: var(--brand); font: 700 1.4rem Arial, sans-serif; }
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus { box-shadow: 0 0 0 .15rem var(--accent), 0 0 0 .25rem var(--brand); }
.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder { color: var(--bs-secondary-color); text-align: end; }
.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder { text-align: start; }
.preserve-lines {    white-space: pre-line;}
.workout-label {
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: .01em;
     text-decoration: underline;
}
@media (max-width: 575.98px) {
  .page-shell { padding-top: 1.75rem; }
  .display-title { font-size: 3.2rem; }
  .hero-note { margin: .75rem .4rem 1rem 0; padding: 1.5rem; box-shadow: 7px 9px 0 var(--accent); }
  .site-footer { align-items: flex-start; flex-direction: column; }
  .table-responsive { font-size: .86rem; }
}