:root{--ink:#25243b;--muted:#7f7d92;--paper:#faf9fc;--line:#ebe9f0;--purple:#7666dc;--orange:#ed956e;--mint:#66bda9}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans","Noto Sans SC",sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#fff;border-right:1px solid var(--line);padding:31px 18px 22px;display:flex;flex-direction:column}.brand{font-size:23px;font-weight:700;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:10px;padding:0 12px 41px}.brand-mark{background:var(--purple);color:#fff;width:31px;height:31px;border-radius:10px;display:grid;place-items:center;font-size:17px}nav{display:grid;gap:8px}nav a{color:#858397;text-decoration:none;padding:12px;border-radius:10px;font-size:14px;font-weight:500}nav a span{font-size:19px;margin-right:12px;color:#8f8ca2}nav a.active{background:#f0edff;color:#5b4bc3}nav a.active span{color:#5b4bc3}.sidebar-bottom{margin-top:auto}.focus-card{margin:0 3px 22px;padding:16px;background:#f7f5ff;border-radius:13px}.tiny-label,.eyebrow{margin:0;color:#9d9aaa;letter-spacing:1.3px;font-size:10px;font-weight:700}.focus-card strong{display:block;font-size:13px;margin:8px 0 13px}.week-dots{display:flex;justify-content:space-between}.week-dots i{width:9px;height:9px;border-radius:50%;background:#dedbe9}.week-dots i.done{background:var(--purple)}.profile{border-top:1px solid var(--line);padding:20px 3px 0;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-size:13px}.avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f3c9b8;color:#9b4f30;font-weight:bold}.profile b,.profile small{display:block}.profile small{font-size:10px;color:var(--muted);margin-top:3px}.profile em{font-style:normal;margin-left:auto;color:#aaa}main{margin-left:248px;max-width:1380px;padding:48px 6.3vw 56px}header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:35px}h1,h2,h3,p{margin-top:0}h1{font-size:30px;margin:8px 0 8px;letter-spacing:-.7px}h1 span{font-size:25px}.subtitle{color:var(--muted);font-size:14px;margin:0}.header-actions{display:flex;gap:12px;align-items:center}.icon-button,.new-plan,.text-button,.more,.period,.check{border:0;font-family:inherit;cursor:pointer}.icon-button{position:relative;background:#fff;border:1px solid var(--line);border-radius:10px;width:42px;height:42px;font-size:20px;color:#666}.icon-button i{position:absolute;width:6px;height:6px;right:10px;top:10px;border-radius:50%;background:#f18370}.new-plan{background:var(--purple);color:white;border-radius:10px;padding:12px 17px;font-size:13px;font-weight:600}.hero{height:204px;border-radius:17px;background:#6254bf;color:#fff;display:flex;overflow:hidden;margin-bottom:42px}.hero-copy{padding:30px 38px;width:52%;position:relative;z-index:2}.hero-copy>p{opacity:.7;font-size:13px;margin-bottom:3px}.progress-line{display:flex;align-items:baseline;gap:8px}.progress-line strong{font-size:42px;letter-spacing:-2px}.progress-line span{font-size:13px;opacity:.82}.bar{height:7px;max-width:335px;border-radius:8px;background:rgba(255,255,255,.22);margin:17px 0 12px;overflow:hidden}.bar span{display:block;height:100%;width:40%;background:#f6c56d;border-radius:inherit;transition:.3s}.hero-copy small{font-size:12px;opacity:.73}.hero-art{position:relative;flex:1;background:linear-gradient(115deg,#7668d5,#9e80db);overflow:hidden}.hero-art p{position:absolute;right:33px;bottom:20px;opacity:.8;font-size:13px}.sun{position:absolute;width:92px;height:92px;border:2px solid rgba(255,255,255,.45);border-radius:50%;right:115px;top:19px}.hill{position:absolute;border-radius:50% 50% 0 0;bottom:-40px;transform:rotate(-7deg)}.hill-one{height:130px;width:340px;background:#5e4ab8;right:-5px}.hill-two{height:100px;width:290px;background:#8170d3;right:150px;bottom:-48px}.runner{position:absolute;right:190px;bottom:78px;font-size:35px;color:#fff;transform:rotate(-20deg)}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:19px}.section-heading h2{font-size:20px;margin:6px 0 0;letter-spacing:-.4px}.text-button{background:transparent;color:#6f60c9;font-size:13px}.text-button span{font-size:17px;margin-left:5px}.plans-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.plan-card{min-height:205px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s,box-shadow .2s}.plan-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px #3631540d}.card-top{display:flex;justify-content:space-between}.icon-circle{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:20px}.study .icon-circle{background:#f0edff;color:#6b5bd1}.workout .icon-circle{background:#fff0e9;color:#e57b54}.run .icon-circle{background:#e7f7f3;color:#46a995}.read .icon-circle{background:#fff6dc;color:#d6a733}.more{background:transparent;color:#aaa;letter-spacing:1px;font-weight:bold}.category{font-size:11px;color:#9a97a8;margin-bottom:7px}.plan-card h3{font-size:16px;margin-bottom:6px}.plan-detail{font-size:12px;color:var(--muted);margin:0}.card-footer{display:flex;align-items:center;justify-content:space-between;color:#9a97a8;font-size:11px}.check{width:22px;height:22px;border-radius:50%;border:1.5px solid #d8d5e0;background:white;color:white;font-size:13px}.completed{background:#fdfcff}.completed .check{background:var(--purple);border-color:var(--purple)}.bottom-grid{display:grid;grid-template-columns:1.58fr 1fr;gap:18px;margin-top:42px}.card-surface{border:1px solid var(--line);border-radius:15px;background:#fff;padding:22px}.compact{margin-bottom:12px}.period{border:1px solid var(--line);border-radius:7px;background:#fff;font-size:11px;color:#777;padding:7px 9px}.chart{height:150px;display:flex;border-bottom:1px solid #ebe9f1}.y-labels{width:37px;display:flex;flex-direction:column;justify-content:space-between;color:#b1aebe;font-size:10px;padding-bottom:0}.bars{flex:1;display:flex;justify-content:space-around;align-items:end;background:repeating-linear-gradient(to bottom,transparent 0,transparent 49%,#f3f1f6 50%,transparent 51%,transparent 99%,#f3f1f6 100%)}.bars>div{height:100%;width:23px;display:flex;align-items:center;justify-content:end;flex-direction:column;gap:8px}.bars i{width:100%;border-radius:6px 6px 2px 2px;background:#bcb4ed}.bars .today i{background:var(--purple)}.bars b{font-size:10px;color:#aaa;font-weight:400;height:15px}.legend{display:flex;gap:19px;font-size:11px;color:#888;margin-top:14px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.purple{background:#7666dc}.orange{background:#ed956e}.streak-count{display:flex;align-items:center;gap:13px;margin:16px 0}.streak-count strong{font-size:54px;letter-spacing:-3px;color:#6254bf}.streak-count span{font-size:12px;color:#777;line-height:1.6}.mini-calendar{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:17px}.mini-calendar span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:10px;color:#a5a2b2}.mini-calendar .done{background:#efeaff;color:#6e5bd3}.mini-calendar .today{background:#6e5bd3;color:white}.streak-note{font-size:11px;color:#999;margin:16px 0 0}dialog{border:0;border-radius:16px;padding:0;box-shadow:0 20px 60px #211a4c30;width:min(420px,90vw)}dialog::backdrop{background:#20194866}dialog form{padding:28px;display:grid;gap:13px}dialog h2{margin:0 0 7px}dialog label{font-size:12px;color:#666;display:grid;gap:6px}dialog input,dialog select{border:1px solid #dedbe7;border-radius:8px;padding:11px;font:inherit;color:#333;background:#fff}.close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:24px;color:#888;cursor:pointer}@media(max-width:1050px){.plans-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.sidebar{display:none}main{margin:0;padding:28px 20px}header{margin-bottom:25px}.header-actions .icon-button{display:none}.new-plan{padding:11px}h1{font-size:25px}.hero-copy{padding:26px;width:70%}.hero-art{opacity:.7}.plans-grid,.bottom-grid{grid-template-columns:1fr}.bottom-grid{margin-top:25px}.hero{height:190px}}