:root{--ink:#303044;--muted:#90909f;--purple:#8370bf;--line:#eeeef4}*{box-sizing:border-box}body{margin:0;background:#f7f8fb;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-size:14px}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:.18s}button:hover{filter:brightness(.96)}button:focus-visible,a:focus-visible{outline:3px solid #baa9e5;outline-offset:3px}.sidebar{width:216px;position:fixed;inset:0 auto 0 0;background:#fff;border-right:1px solid var(--line);padding:40px 24px}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none;font-size:24px;font-weight:650;letter-spacing:3px}.brand-icon{width:44px;height:46px;border-radius:15px;background:#eee9f9;color:#8b76b9;text-align:center;font-size:36px;line-height:42px}.brand small{display:block;font-size:9px;letter-spacing:2.3px;color:#aaa5b5;margin-top:5px}.nav-label{font-size:11px;letter-spacing:2px;color:#aeacb9;margin:56px 14px 17px}.nav-item{border:0;background:none;width:100%;padding:15px;text-align:left;color:#8c8b9b;border-radius:10px;margin-bottom:9px}.nav-item span{font-size:21px;vertical-align:-2px;margin-right:14px}.nav-item.active{background:#f0ecf9;color:#826bb5;font-weight:600}.sidebar-bottom{position:absolute;bottom:31px;left:28px;color:#92909f;font-size:12px}.tiny-moon{font-size:28px;color:#bdb0d8}.sidebar-bottom small{font-size:10px;color:#b4b0bd}.local-label{border-top:1px solid var(--line);margin-top:25px;padding-top:21px;font-size:10px}.local-label i,.hero-tag span{display:inline-block;width:5px;height:5px;background:#94b4a6;border-radius:50%;margin-right:6px}main{margin-left:216px;max-width:1570px;padding:0 42px}header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:11px;color:#92909f}.breadcrumb span{margin:0 12px;color:#c5c2ce}.breadcrumb b{font-weight:400;color:#5d596b}.header-date{letter-spacing:.5px}.page-heading{display:flex;align-items:center;justify-content:space-between;margin:32px 0 28px}.eyebrow{font-size:9px;letter-spacing:2.2px;color:#aaa2b9}h1{font-size:26px;letter-spacing:.6px;font-weight:600;margin:10px 0}h1 span{color:#b0a0cc}p{line-height:1.8}.page-heading p{color:#92909e;font-size:12px;margin:0}.primary{border:0;background:#8673bb;color:#fff;padding:13px 22px;border-radius:9px;box-shadow:0 5px 12px #8570b520;font-size:13px}.primary span{font-size:19px;margin-right:5px}.hero{height:268px;background:#eeebf6;position:relative;overflow:hidden;border:1px solid #e8e3f1;border-radius:15px;display:flex;justify-content:space-between}.hero-copy{padding:28px 32px;z-index:1}.hero-tag{font-size:10px;letter-spacing:1.6px;color:#8a7ba5}.hero-tag span{background:#a38aba}.hero h2{font-size:26px;font-weight:500;line-height:1.5;letter-spacing:2px;margin:13px 0 9px;color:#534961}.hero p{font-size:11px;color:#9b8fa9;margin:0;line-height:1.9}.hero-footer{font-size:10px;color:#8f7da6;margin-top:14px;letter-spacing:1px}.hero-footer span{font-size:17px;margin-right:8px}.night-art{width:47%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 65% 65%,#d6ccea90,transparent 65%)}.moon{position:absolute;left:42%;top:43px;width:111px;height:111px;border-radius:50%;box-shadow:-19px 17px 0 0 #fffbeb;transform:rotate(-20deg);filter:drop-shadow(0 12px 15px #b8a8ca30)}.orbit{position:absolute;border:1px solid #dbd3e77a;border-radius:50%;width:290px;height:290px;left:20%;top:0}.orbit-two{width:400px;height:400px;left:7%;top:-55px}.star{position:absolute;color:#b3a0c8}.s1{top:54px;left:27%;font-size:23px}.s2{top:101px;right:13%;font-size:29px}.s3{top:162px;left:39%;font-size:13px}.s4{top:26px;right:23%;font-size:32px}.cloud{position:absolute;width:170px;height:30px;border-radius:50%;background:#e3ddef;filter:blur(2px);bottom:47px;left:18%;box-shadow:30px -8px 0 7px #e3ddef,60px 0 0 #e3ddef}.c2{bottom:77px;left:67%;opacity:.6;transform:scale(.65)}.art-label{position:absolute;bottom:19px;left:32%;color:#b0a1c2;font-size:7px;letter-spacing:2px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0}.stat{border:1px solid var(--line);border-radius:13px;background:#fff;padding:19px 23px}.stat-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#817e90}.stat-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;font-size:20px}.purple{background:#f2eef9;color:#9e8ac6}.blue{background:#edf2fa;color:#8c9fc1}.peach{background:#fbf1e9;color:#c9a485}.stat-value{font-size:30px;font-weight:550;letter-spacing:.5px;margin:5px 0 11px}.stat-value small{font-size:12px;font-weight:400;color:#9993a6;margin:0 5px}.stat-note{font-size:10px;color:#a19caa}.middle{display:grid;grid-template-columns:minmax(0,2.25fr) minmax(220px,1fr);gap:20px;margin-bottom:22px}.panel{border:1px solid var(--line);border-radius:13px;background:#fff}.trend{padding:23px 24px 0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}h2{font-size:15px;font-weight:600;margin:0}.subtle{font-size:8px;font-weight:400;letter-spacing:1px;color:#b5afbf;margin-left:10px}.panel-heading p{font-size:10px;color:#a5a0af;margin:7px 0 0}.week-switch{display:flex;align-items:center;gap:10px;background:#f8f7fa;border:1px solid #efedf3;padding:4px;border-radius:6px;font-size:10px;color:#82788f;white-space:nowrap}.week-switch button{border:0;background:none;color:#9386a7;font-size:18px;padding:0 4px}.week-switch button:disabled{opacity:.3;cursor:default}.chart-legend{display:flex;justify-content:flex-end;gap:18px;font-size:9px;color:#a09aa9;margin:21px 0 0}.chart-legend i{display:inline-block;width:7px;height:7px;background:#b4a2d3;border-radius:2px;margin-right:5px}.chart-legend i.dash{width:12px;height:0;border-top:1px dashed #c1b0da;vertical-align:3px}.chart svg{display:block;width:100%;height:180px;overflow:visible}.chart-foot{border-top:1px solid #f2f0f5;font-size:10px;color:#a29aa9;padding:13px 0;display:flex;align-items:center;gap:8px}.dot{width:5px;height:5px;background:#b5a2d3;border-radius:50%;flex-shrink:0}.tip{padding:25px;background:#f1f3f0;border-color:#e8ece7}.tip-icon{font-size:28px;color:#9eac94;margin-bottom:15px}.tip .eyebrow{color:#a1aa9b;font-size:8px}.tip h2{font-size:18px;color:#636f5c;margin-top:13px;font-weight:500}.tip p{font-size:11px;color:#939b8d;line-height:2.1;margin:14px 0 23px}.tip-line{height:1px;background:#e1e6dc}.tip-bottom{font-size:10px;color:#96a08c;display:flex;justify-content:space-between;align-items:center;padding-top:14px}.tip-bottom span{font-size:22px}.records{padding:23px 24px 7px}.text-button{background:none;border:0;font-size:11px;color:#9984b6}.text-button span{margin-left:7px}.sample-tag{background:#f6f3fa;color:#a79ab7;padding:3px 5px;border-radius:4px;margin-left:7px;font-size:9px}table{width:100%;border-collapse:collapse;text-align:left;font-size:11px;margin-top:17px}th{color:#aaa4b4;font-size:10px;font-weight:400;background:#faf9fc;padding:11px 13px}td{padding:17px 13px;border-bottom:1px solid #f3f1f6;color:#706a7d}tbody tr:last-child td{border-bottom:0}.day-label{color:#a7a1b0;font-size:9px;margin-left:9px}.time-icon{color:#b3a2cc;margin-right:7px}.duration-cell{font-weight:550}.badge{padding:5px 9px;border-radius:5px;font-size:10px;background:#f1f3ed;color:#96a17f}.badge.great{background:#f0ebfa;color:#9d86bd}.badge.fair{background:#fbf2e7;color:#b4a080}.badge.poor{background:#f6eded;color:#b78a8a}.delete{color:#aaa2b6;background:none;border:0;font-size:10px;padding:5px}.delete:hover{color:#b96e76}footer{display:flex;justify-content:space-between;color:#b5b0be;font-size:8px;letter-spacing:1.2px;padding:24px 0}footer span{font-size:10px;letter-spacing:1px}#empty{text-align:center;color:#a49ab1;padding:40px}dialog{border:1px solid #eae4f1;border-radius:18px;width:450px;max-width:calc(100% - 28px);padding:28px;color:var(--ink);box-shadow:0 20px 100px #33294525}dialog::backdrop{background:#27203655;backdrop-filter:blur(5px)}.modal-heading{display:flex;justify-content:space-between;align-items:center}.modal-heading h2{font-size:23px;margin-top:10px}.close{border:0;background:#f6f3fa;border-radius:50%;width:30px;height:30px;color:#a395b6;font-size:22px}.modal-description{color:#aaa1b5;font-size:11px;margin-bottom:21px}form>label{display:block;font-size:12px;color:#7c718b;margin:14px 0}input[type=datetime-local],textarea{display:block;width:100%;border:1px solid #e4deed;border-radius:7px;background:#fbfafc;padding:11px;margin-top:8px;color:#60546e;min-width:0}input:focus,textarea:focus{outline:2px solid #c3b3df}.duration-preview{font-size:11px;color:#9681b1;background:#f5f1fa;border-radius:7px;padding:12px}fieldset{padding:0;border:0;margin:19px 0}legend{font-size:12px;color:#7c718b;margin-bottom:10px}.quality-options{display:flex;gap:8px}.quality-options label{flex:1;text-align:center;padding:10px 0;background:#f8f6fa;border:1px solid #eee9f4;border-radius:7px;color:#9b8da9;font-size:12px;cursor:pointer}.quality-options label:has(:checked){color:#8266ac;background:#eee6f8;border-color:#bfacd7}.quality-options input{appearance:none;width:0;margin:0}.quality-options label:focus-within{outline:2px solid #baa9e5}.optional{color:#bdb5c6;font-size:10px}.save-button{width:100%;margin-top:4px}#form-error{color:#ba737d;font-size:12px}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#514460;color:#fff;padding:13px 24px;border-radius:10px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:5;max-width:90%}#toast.show{opacity:1}.record-note{display:block;max-width:210px;font-size:9px;color:#aaa1b5;margin-top:5px;overflow-wrap:anywhere}
@media(min-width:1500px){main{margin-right:auto;margin-left:240px;padding:0 55px}.hero{height:290px}.hero-copy{padding:32px 40px}.hero h2{font-size:29px}.chart svg{height:205px}}@media(max-width:1100px){.sidebar{width:175px;padding:35px 18px}main{margin-left:175px;padding:0 25px}.subtle{display:none}.middle{grid-template-columns:minmax(0,1.8fr) minmax(200px,1fr)}.trend{padding:20px 15px 0}.stat{padding:17px}.tip{padding:22px 18px}.hero h2{font-size:24px}.night-art{width:43%}}@media(max-width:760px){.sidebar{position:relative;width:100%;height:74px;padding:15px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);border-right:0}.brand{font-size:19px;gap:8px}.brand-icon{width:34px;height:37px;font-size:29px;line-height:33px}.brand small{font-size:7px;letter-spacing:1.2px}.nav-label,.sidebar-bottom{display:none}nav{display:flex;gap:3px}.nav-item{width:auto;font-size:11px;padding:10px;margin:0}.nav-item span{display:none}main{margin:0;padding:0 18px}header{height:49px;font-size:9px}.page-heading{margin:25px 0 20px;gap:8px}h1{font-size:20px}h1 span{display:none}.eyebrow{font-size:7px}.page-heading p{font-size:10px}.primary{padding:11px 13px;font-size:11px;white-space:nowrap}.primary span{font-size:15px;margin:0}.hero{height:250px}.hero-copy{padding:26px 22px}.hero h2{font-size:23px}.hero p{font-size:10px}.night-art{position:absolute;right:0;width:40%;height:100%;opacity:.65}.moon{left:39%;top:47px;width:63px;height:63px;box-shadow:-13px 12px 0 #fffbeb}.orbit-one{left:15%;width:200px;height:200px;top:24px}.orbit-two{width:270px;height:270px;top:-10px;left:-10%}.cloud{left:35%;bottom:65px}.art-label{display:none}.stats{gap:8px;margin:14px 0}.stat{padding:13px 10px}.stat-label{font-size:10px}.stat-icon{display:none}.stat-value{font-size:23px;margin-top:13px;white-space:nowrap;letter-spacing:0}.stat-value small{font-size:9px;margin:0 2px}.stat-note{font-size:8px;line-height:1.5;min-height:24px}.middle{grid-template-columns:1fr;gap:14px;margin-bottom:14px}.trend{padding:20px 16px 0}.tip{padding:20px 23px;position:relative}.tip-icon{position:absolute;right:25px;top:20px}.tip h2{font-size:17px}.tip p{font-size:11px;margin-bottom:0}.tip p br{display:none}.tip-line,.tip-bottom{display:none}.records{padding:20px 15px 5px}.panel-heading p{font-size:9px}.sample-tag{display:none}.table-wrap{overflow-x:auto}table{min-width:560px}th,td{padding-left:8px;padding-right:8px}.week-switch{font-size:9px;gap:4px}.record-note{max-width:150px}footer{font-size:7px}dialog{padding:23px}.header-date{font-size:8px}}
