:root { --ink:#11110f; --paper:#f1eee6; --coral:#ff694d; --lime:#d8ff54; --muted:#aaa79f; --line:rgba(241,238,230,.15); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--paper); background:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; overflow-x:hidden; }
button,input { font:inherit; } button { color:inherit; }
.noise { position:fixed; inset:0; pointer-events:none; opacity:.08; z-index:20; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); }
.site-header { position:sticky; top:0; z-index:10; height:78px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 clamp(20px,4vw,70px); border-bottom:1px solid var(--line); background:rgba(17,17,15,.82); backdrop-filter:blur(18px); }
.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font-weight:900; letter-spacing:.11em; }
.brand-mark { display:inline-grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--coral); color:var(--ink); font-weight:1000; }
nav { display:flex; gap:6px; }
.nav-link,.icon-button { border:0; background:transparent; cursor:pointer; }
.nav-link { padding:10px 14px; color:var(--muted); border-radius:99px; font-size:.86rem; font-weight:700; }
.nav-link:hover,.nav-link.active { color:var(--paper); background:rgba(255,255,255,.07); }
.icon-button { justify-self:end; width:38px; height:38px; border:1px solid var(--line); border-radius:50%; font-size:1.2rem; }
.view { display:none; animation:enter .45s ease both; } .view.active { display:block; }
@keyframes enter { from { opacity:0; transform:translateY(12px); } }
.hero { min-height:calc(100vh - 78px); display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:40px; padding:8vh clamp(24px,7vw,120px); }
.eyebrow { margin:0 0 22px; color:var(--lime); font-size:.74rem; font-weight:900; letter-spacing:.2em; }
h1,h2 { margin:0; line-height:.9; letter-spacing:-.06em; text-transform:uppercase; }
h1 { font-size:clamp(4rem,9.5vw,9rem); font-weight:950; }
h1 em,h2 em { color:var(--coral); font-family:Georgia,serif; font-weight:400; text-transform:none; }
.hero-note { max-width:510px; margin:30px 0; color:var(--muted); font-size:clamp(1rem,1.5vw,1.2rem); line-height:1.65; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; gap:35px; padding:0 24px; border:1px solid transparent; border-radius:4px; text-decoration:none; cursor:pointer; font-weight:850; transition:.2s; }
.button.primary { background:var(--coral); color:var(--ink); } .button.primary:hover { background:var(--lime); transform:translateY(-2px); }
.button.ghost { background:transparent; border-color:var(--line); } .button.ghost:hover { border-color:var(--paper); }
.focus-orbit { aspect-ratio:1; position:relative; display:grid; place-items:center; max-width:560px; width:100%; margin-inline:auto; }
.orbit { position:absolute; border:1px solid rgba(255,105,77,.42); border-radius:50%; inset:5%; animation:rotate 14s linear infinite; }
.orbit::after { content:""; position:absolute; top:50%; left:-5px; width:10px; height:10px; border-radius:50%; background:var(--lime); box-shadow:0 0 28px var(--lime); }
.orbit-two { inset:18%; border-style:dashed; animation-direction:reverse; animation-duration:22s; }
@keyframes rotate { to { transform:rotate(360deg); } }
.focus-core { width:58%; aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--coral); color:var(--ink); border-radius:50%; text-align:center; box-shadow:0 0 90px rgba(255,105,77,.25); }
.focus-core span,.focus-core small { font-size:.68rem; font-weight:900; letter-spacing:.18em; }
.focus-core strong { max-width:90%; font-size:clamp(2rem,5vw,4.8rem); line-height:.95; letter-spacing:-.07em; }
.stat-strip { display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid var(--line); margin:0 clamp(20px,4vw,70px); }
.stat-strip>div { padding:28px; border-right:1px solid var(--line); } .stat-strip>div:last-child { border-right:0; }
.stat-strip strong { display:block; font-size:2rem; } .stat-strip span { color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.09em; }
.progress-track { height:4px; background:rgba(255,255,255,.1); margin-top:14px; } .progress-track i { display:block; width:0; height:100%; background:var(--lime); transition:width .5s ease; }
.workout-section { padding:120px clamp(24px,7vw,120px); }
.section-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:30px; margin-bottom:50px; }
.section-heading h2,.page-intro h1 { font-size:clamp(3rem,7vw,7rem); }
.section-heading>p { max-width:500px; justify-self:end; color:var(--muted); line-height:1.65; }
.exercise-list { border-top:1px solid var(--line); }
.exercise-card { display:grid; grid-template-columns:74px 1fr auto 54px; gap:20px; align-items:center; min-height:112px; border-bottom:1px solid var(--line); transition:.25s ease; }
.exercise-card:hover { padding-inline:14px; background:rgba(255,255,255,.025); } .exercise-card.done { opacity:.48; } .exercise-card.done h3 { text-decoration:line-through; }
.exercise-number { color:var(--coral); font-size:.75rem; font-weight:900; }
.exercise-main h3 { margin:0 0 8px; font-size:clamp(1.1rem,2vw,1.55rem); letter-spacing:-.025em; } .exercise-main p { margin:0; color:var(--muted); font-size:.86rem; }
.exercise-prescription { text-align:right; } .exercise-prescription b { display:block; } .exercise-prescription span { color:var(--muted); font-size:.74rem; }
.complete-check { width:44px; height:44px; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; font-size:0; }
.complete-check::after { content:"✓"; font-size:1rem; opacity:0; } .complete-check:hover { border-color:var(--lime); }
.exercise-card.done .complete-check { background:var(--lime); color:var(--ink); border-color:var(--lime); } .exercise-card.done .complete-check::after { opacity:1; }
.finish-button { width:100%; min-height:82px; margin-top:40px; padding:0 26px; display:flex; justify-content:space-between; align-items:center; border:0; background:#23231f; color:#777; font-size:1.05rem; font-weight:850; }
.finish-button.ready { background:var(--lime); color:var(--ink); cursor:pointer; }
.page-intro { padding:120px clamp(24px,7vw,120px) 70px; } .page-intro>p:last-child { max-width:560px; color:var(--muted); font-size:1.1rem; line-height:1.65; }
.week-grid { display:grid; grid-template-columns:repeat(7,minmax(150px,1fr)); overflow-x:auto; padding:0 clamp(24px,7vw,120px) 120px; }
.day-card { min-height:430px; padding:24px; border:1px solid var(--line); border-right:0; display:flex; flex-direction:column; justify-content:space-between; }
.day-card:last-child { border-right:1px solid var(--line); } .day-card.today { background:var(--coral); color:var(--ink); transform:translateY(-12px); }
.day-card.complete::after { content:"✓ DONE"; color:var(--lime); font-size:.7rem; font-weight:900; letter-spacing:.12em; } .day-card.today.complete::after { color:var(--ink); }
.day-card .day-name { font-size:.7rem; font-weight:900; letter-spacing:.15em; } .day-card h3 { margin:auto 0 12px; font-size:2rem; line-height:.95; text-transform:uppercase; }
.day-card p { min-height:42px; color:var(--muted); font-size:.8rem; } .day-card.today p { color:rgba(17,17,15,.65); } .day-card span { font-size:.75rem; font-weight:800; }
.settings-grid { width:min(920px,calc(100% - 48px)); margin:0 auto 120px; }
fieldset { border:0; border-top:1px solid var(--line); padding:30px 0 45px; margin:0; } legend { padding-top:30px; font-size:1.2rem; font-weight:850; }
.segmented,.check-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:24px; } .check-grid { grid-template-columns:repeat(5,1fr); }
.segmented input,.check-grid input { position:absolute; opacity:0; }
.segmented span,.check-grid span { display:grid; place-items:center; min-height:60px; border:1px solid var(--line); cursor:pointer; font-weight:750; }
.segmented input:checked+span,.check-grid input:checked+span { background:var(--coral); border-color:var(--coral); color:var(--ink); }
.toggle-list { margin-top:20px; } .toggle-list label { display:flex; align-items:center; justify-content:space-between; padding:22px 0; border-bottom:1px solid var(--line); }
.toggle-list b,.toggle-list small { display:block; } .toggle-list small { margin-top:5px; color:var(--muted); }
.toggle-list input { appearance:none; width:52px; height:28px; padding:3px; border-radius:99px; background:#3b3a35; cursor:pointer; transition:.2s; }
.toggle-list input::before { content:""; display:block; width:22px; height:22px; border-radius:50%; background:white; transition:.2s; }
.toggle-list input:checked { background:var(--lime); } .toggle-list input:checked::before { transform:translateX(24px); background:var(--ink); }
.save-button { width:100%; } .save-message { min-height:24px; color:var(--lime); text-align:center; }
footer { min-height:200px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:40px clamp(24px,7vw,120px); border-top:1px solid var(--line); color:var(--muted); }
footer>span { color:var(--paper); font-weight:950; letter-spacing:.13em; } footer small { justify-self:end; }
.celebration { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:24px; background:var(--ink); transform:translateY(110%); transition:transform .6s cubic-bezier(.8,0,.2,1); text-align:center; }
.celebration.open { transform:translateY(0); } .celebration h2 { margin:25px 0 40px; font-size:clamp(4rem,10vw,9rem); } .celebration p { color:var(--lime); letter-spacing:.18em; font-weight:900; }
.reveal { animation:reveal .8s both; animation-timeline:view(); animation-range:entry 10% cover 28%; } @keyframes reveal { from { opacity:0; transform:translateY(30px); } }
@media (max-width:860px) {
  .site-header { grid-template-columns:1fr auto; height:68px; } .site-header nav { position:fixed; left:50%; bottom:16px; transform:translateX(-50%); padding:5px; border:1px solid var(--line); border-radius:99px; background:rgba(17,17,15,.94); backdrop-filter:blur(16px); } .site-header .icon-button { display:none; }
  .hero { grid-template-columns:1fr; min-height:auto; padding-top:90px; } h1 { font-size:clamp(3.9rem,17vw,7rem); } .focus-orbit { max-width:430px; }
  .stat-strip { grid-template-columns:1fr 1fr; } .stat-strip>div:nth-child(2) { border-right:0; } .stat-strip>div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .section-heading { grid-template-columns:1fr; } .section-heading>p { justify-self:start; }
  .exercise-card { grid-template-columns:44px 1fr 46px; padding:18px 0; } .exercise-prescription { grid-column:2; text-align:left; } .complete-check { grid-column:3; grid-row:1/3; }
  .check-grid { grid-template-columns:1fr 1fr; } footer { grid-template-columns:1fr; gap:14px; padding-bottom:110px; } footer small { justify-self:start; }
}
@media (max-width:520px) {
  .brand { font-size:.85rem; } .nav-link { padding:9px 10px; font-size:.75rem; } .hero { padding-inline:22px; } .hero-actions .button { width:100%; }
  .stat-strip { margin-inline:0; } .stat-strip>div { padding:20px; } .workout-section { padding:90px 20px; } .exercise-number { align-self:start; padding-top:5px; } .segmented { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }