:root{
  --bg:#f5f6f8;
  --surface:#ffffff;
  --surface-2:#f0f2f5;
  --stroke:#dde2ea;
  --text:#1a2230;
  --muted:#6f7b8f;
  --accent:#4658ff;
  --accent-soft:#e9ecff;
  --success:#1f9d67;
  --success-soft:#eaf8f1;
  --warning:#b96e11;
  --warning-soft:#fff4e5;
  --danger:#c94949;
  --danger-soft:#fceceb;
  --shadow:0 18px 40px rgba(20,31,60,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,sans-serif;background:linear-gradient(180deg,#fafbfc 0%,#f3f5f8 100%);color:var(--text)}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
.app-shell{min-height:100vh;position:relative;overflow-x:hidden}
.site-frame{max-width:1180px;margin:0 auto;min-height:100vh;padding:32px 20px 120px;position:relative;z-index:2}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}
.topbar h1{margin:.2rem 0 0;font-size:clamp(1.7rem,2.5vw,2.4rem)}
.eyebrow{font-size:.77rem;letter-spacing:.12em;text-transform:uppercase;color:#6f7cff;font-weight:700}
.hero-card,.section-block,.metric-card,.list-card,.profile-card,.tip-box,.chart-card,.exercise-card{background:var(--surface);border:1px solid var(--stroke);box-shadow:var(--shadow);border-radius:24px}
.hero-card{padding:26px;display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px}
.hero-card h2{margin:.3rem 0 .45rem;font-size:clamp(1.4rem,2.3vw,2rem);line-height:1.1}
.hero-card p{margin:0;color:var(--muted);line-height:1.55}
.mini-poster{width:86px;height:110px;border-radius:18px;object-fit:cover;border:1px solid var(--stroke)}
.section-block{padding:20px;margin-bottom:18px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.section-head h3{margin:0;font-size:1.08rem}
.section-head span,.muted,.metric-card small,.list-card p,.exercise-card p,.mini-note{color:var(--muted)}
.profile-grid,.card-grid,.list-cards,.exercise-grid{display:grid;gap:14px}
.profile-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.profile-card{padding:12px;display:flex;flex-direction:column;gap:8px;transition:.18s transform,.18s border-color}
.profile-card img{width:100%;aspect-ratio:16/10;border-radius:16px;object-fit:cover}
.profile-card.selected,.profile-card:hover{transform:translateY(-2px);border-color:#bfc8ff}
.stack-form{display:grid;gap:12px}
.stack-form.two-col,.two-field-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.span-2{grid-column:span 2}
input,select{width:100%;padding:14px 16px;border-radius:16px;border:1px solid var(--stroke);background:#fff;color:var(--text);outline:none}
input:focus,select:focus{border-color:#aeb8ff;box-shadow:0 0 0 4px rgba(70,88,255,.08)}
button,.primary-btn,.ghost-btn,.day-pill,.status-lock{border:none;border-radius:16px;padding:13px 16px;display:inline-flex;justify-content:center;align-items:center;font-weight:700;cursor:pointer;transition:.18s transform,.18s opacity,.18s background}
.primary-btn{background:var(--accent);color:#fff}
.ghost-btn{background:#f4f6fa;border:1px solid var(--stroke);color:var(--text)}
.day-pill{min-width:48px;background:#f2f4f8;color:#516074}
.day-pill.active{background:var(--accent);color:#fff}
.day-pill.linkish{padding:12px 14px}
.primary-btn:hover,.ghost-btn:hover,.day-pill:hover{transform:translateY(-1px)}
.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.metric-card{padding:18px}
.metric-card strong{display:block;font-size:1.5rem;margin:.25rem 0}
.metric-label{color:#5f72ff;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.days-picker{display:flex;flex-wrap:wrap;gap:10px}
.list-card{padding:16px;display:flex;justify-content:space-between;gap:14px;align-items:center}
.list-card.tall{align-items:flex-start;flex-direction:column}
.list-card.highlight,.exercise-card.recommended-card{border-color:#cfd6ff;background:linear-gradient(180deg,#fff 0%,#f8f9ff 100%)}
.list-card.compact-row{align-items:center}
.mini-list{margin:12px 0 0;padding-left:18px;color:#415065;display:grid;gap:6px}
.tip-box{padding:14px 16px;line-height:1.5}
.soft-box{background:#f8fafc}
.timeline{display:grid;gap:10px}
.timeline-item{padding:14px 16px;border-radius:18px;background:#f8fafc;border:1px solid var(--stroke);display:flex;justify-content:space-between;gap:10px;align-items:center}
.timeline-item.done{background:var(--success-soft);border-color:#bce6d1}
.timeline-item.current{background:var(--accent-soft);border-color:#ccd3ff}
.dual-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wide{width:100%}
.bottom-nav{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);width:min(860px,calc(100% - 24px));display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px;border-radius:22px;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1px solid var(--stroke);box-shadow:var(--shadow);z-index:5}
.bottom-nav a{padding:12px 8px;border-radius:16px;text-align:center;color:var(--muted);font-size:.9rem;font-weight:700}
.bottom-nav a.active{background:var(--accent);color:#fff}
.alert{padding:14px 16px;border-radius:18px;margin:0 0 18px;border:1px solid var(--stroke)}
.alert.error{background:var(--danger-soft);border-color:#f0c9c9;color:#7f2424}
.alert.success{background:var(--success-soft);border-color:#bce6d1;color:#155b3d}
.alert.warning{background:var(--warning-soft);border-color:#f0d5ac;color:#7a4d0f}
.macro-box{display:grid;gap:6px;text-align:right;color:#39465a;font-size:.92rem}
.pill-label{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--accent-soft);color:#5061f7;font-size:.74rem;margin-bottom:8px;font-weight:700}
.bg-shape{position:fixed;border-radius:50%;filter:blur(60px);opacity:.5;z-index:1}
.shape-1{width:220px;height:220px;background:#e7ebff;top:-30px;right:-60px}
.shape-2{width:240px;height:240px;background:#eef1f5;left:-80px;top:220px}
canvas{width:100%!important}
.two-column-layout{display:grid;grid-template-columns:1.45fr 1fr;gap:18px}
.category-grid,.exercise-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.exercise-card{padding:16px;display:grid;gap:12px}
.status-lock,.status-done{background:#eef2f7;color:#5b6679;padding:10px 12px;border-radius:14px;font-size:.88rem;font-weight:700}
.status-done{background:var(--success-soft);color:#1f7a53}
.sticky-side{align-self:start;position:sticky;top:20px}
.stack-stats{display:grid;gap:12px}
.progress-line{display:flex;justify-content:space-between;gap:14px;padding:14px 16px;border-radius:18px;background:#f8fafc;border:1px solid var(--stroke)}
.meal-row,.meal-idea-card{align-items:flex-start}
.session-actions{margin-top:16px}
@media (max-width:900px){.two-column-layout{grid-template-columns:1fr}.sticky-side{position:static}}
@media (max-width:640px){.site-frame{padding:22px 14px 116px}.topbar{margin-bottom:18px}.stack-form.two-col,.two-field-row,.card-grid,.dual-buttons{grid-template-columns:1fr}.span-2{grid-column:auto}.bottom-nav{width:calc(100% - 16px)}.bottom-nav a{font-size:.8rem}}