:root{font-family:Trebuchet MS,PingFang SC,sans-serif;color:#e9e8f5;background:#111121;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#111121}button,input{font:inherit}main{max-width:1180px;margin:auto;padding:0 32px 60px}header{height:330px;position:relative;display:flex;align-items:center;border-bottom:1px solid #33324f;overflow:hidden}header>div:last-child{position:relative;z-index:2}.kicker{font:700 10px ui-monospace,monospace;letter-spacing:.22em;color:#f0b77d}h1{font-size:clamp(50px,8vw,93px);line-height:.82;margin:18px 0;letter-spacing:-.07em}h1 i{font-weight:400;color:#aaa8d1}header p{color:#908fac;max-width:470px;line-height:1.7}.moon{position:absolute!important;right:5%;width:270px;height:270px;border-radius:50%;background:#e9dfbd;box-shadow:0 0 80px #e9dfbd2e}.moon:after{content:"";position:absolute;background:#111121;width:260px;height:260px;border-radius:50%;left:-70px;top:-30px}.dashboard{display:grid;grid-template-columns:280px 1fr;border-bottom:1px solid #33324f}.entry{padding:35px 28px 28px 0;border-right:1px solid #33324f}.entry h2,.week h2{font-size:25px;margin:0 0 25px}.entry label{display:block;color:#aaa8be;font-size:12px;margin:0 0 20px}.entry label span{float:right;color:#f0b77d}.entry input:not([type=range]){display:block;width:100%;margin-top:7px;background:#1b1b30;border:1px solid #3e3d59;color:#eee;padding:11px;border-radius:3px}.entry input[type=range]{display:block;width:100%;accent-color:#f0b77d;margin-top:12px}.entry>button{width:100%;background:#f0b77d;color:#17172c;border:0;padding:13px;font-weight:800}.error{color:#f08c7d;font-size:11px;min-height:24px}.goal{border-top:1px solid #33324f;margin-top:18px;padding-top:23px}.goal b{float:right;color:#fff}.today{padding:35px 0 35px 38px}.date-row{display:flex;justify-content:space-between;align-items:flex-start}.date-row span,.total span{font-size:10px;color:#77768e;display:block;text-transform:uppercase;letter-spacing:.1em}.date-row input{background:transparent;border:0;border-bottom:1px solid #4c4a68;color:#ddd;padding:8px 0}.total{text-align:right}.total strong{font-size:35px;display:block;margin:3px 0}.total small{color:#93c8b6}.total.short small{color:#f08c7d}.ratio{height:61px;display:flex;margin:30px 0 45px}.ratio>div{padding:11px 15px;background:#5e5b93;min-width:90px;transition:.3s}.ratio>div:last-child{background:#f0b77d;color:#242338}.ratio span{font-size:10px}.ratio b{display:block;font-size:20px}.timeband{position:relative;min-height:90px;background:linear-gradient(90deg,transparent 24.8%,#33324f 25%,transparent 25.2%,transparent 49.8%,#33324f 50%,transparent 50.2%,transparent 74.8%,#33324f 75%,transparent 75.2%);border-left:1px solid #55536d;border-right:1px solid #55536d}.hours{position:absolute;display:flex;justify-content:space-between;left:-9px;right:-9px;top:-22px;color:#68677d;font:9px ui-monospace,monospace}.lane{height:18px;position:relative;margin:7px 0}.lane>span{position:absolute;height:100%;background:#5e5b93;border-radius:8px;min-width:4px}.lane>span.nap{background:#f0b77d}.empty{text-align:center;padding:32px;color:#5f5e75;font-size:12px}.segments{margin-top:28px}.segments article{display:flex;justify-content:space-between;border-top:1px solid #2d2c45;padding:14px 5px}.segments b,.segments span,.segments small{display:block}.segments b{font:700 14px ui-monospace,monospace}.segments span{color:#88869e;font-size:11px;margin-top:5px}.segments small{color:#c2a77f;margin-top:4px}.segments button{background:transparent;border:0;color:#77758c;font-size:20px}.week{display:grid;grid-template-columns:280px 1fr;padding-top:45px}.week p{color:#77758e;font-size:12px}.bars{display:flex;height:250px;gap:9px;padding-left:38px;align-items:flex-end}.bars button{position:relative;height:100%;flex:1;border:0;border-bottom:1px solid #4b4962;background:transparent;color:#aaa8be;padding:0}.bars i{display:block;position:absolute;bottom:25px;left:20%;width:60%;background:#5e5b93;min-height:1px}.bars button.selected i{background:#f0b77d}.bars b{position:absolute;bottom:calc(var(--bar) + 20px);top:4px;left:0;right:0;font-size:10px}.bars small{position:absolute;bottom:5px;left:0;right:0}.goal-line{position:absolute;left:0;right:0;border-top:1px dashed #f0b77d;opacity:.5;z-index:2}@media(max-width:760px){main{padding:0 18px 40px}.moon{width:180px;height:180px;right:-45px;opacity:.5}.dashboard{grid-template-columns:1fr}.entry{border-right:0;border-bottom:1px solid #33324f;padding-right:0}.today{padding-left:0}.date-row{gap:20px}.total strong{font-size:27px}.week{grid-template-columns:1fr}.bars{padding:25px 0 0;height:230px}.ratio{margin-bottom:40px}}