*{box-sizing:border-box} :root{color-scheme:dark;--step:clamp(100px,18vh,158px);--ease:cubic-bezier(.19,1,.22,1)}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000;color:#f2f2ef;font-family:"Segoe UI Variable","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit;color:inherit}button{border:0;padding:0;background:none;text-align:left;cursor:pointer}button:focus-visible,summary:focus-visible{outline:1px solid #777;outline-offset:9px}button:hover{color:#fff}button:disabled{opacity:.25;cursor:default}
[hidden]{display:none!important}#app{height:100%;height:100dvh;perspective:1100px;overflow:hidden}#focus{position:absolute;inset:0;touch-action:none;user-select:none;-webkit-user-select:none;outline:none;overflow:hidden;transition:transform .65s var(--ease),opacity .5s;transform-origin:50% 50%}
#focus.retreat{transform:translateZ(-400px) rotateY(-9deg);opacity:0;pointer-events:none}#track{position:absolute;inset:0;pointer-events:none;mask-image:linear-gradient(transparent,black 15%,black 85%,transparent)}
.task{position:absolute;left:clamp(26px,9vw,130px);right:clamp(26px,9vw,130px);top:50%;margin:0;transform:translate3d(0,calc(var(--offset)*var(--step) - 50%),0);font-size:clamp(36px,5.3vw,64px);line-height:1.18;letter-spacing:-.045em;font-weight:300;transition:transform .65s var(--ease),opacity .45s,color .3s;opacity:var(--opacity);color:#d5d5d3;overflow-wrap:anywhere}
.task:not(.current){opacity:0!important}.task.current{color:#f7f7f4}.label{position:relative;display:inline}.label:after{content:"";position:absolute;left:0;right:0;top:54%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left center;transition:transform .28s ease-out}.task.done .label:after{transform:scaleX(1)}.task.pending{color:#a39889}.task.dragging{transition:none}
#empty{position:absolute;left:9vw;top:50%;transform:translateY(-50%);margin:0;font-size:clamp(36px,7vw,80px);letter-spacing:-.05em;line-height:1.1}#empty span{font-size:.5em;color:#444;letter-spacing:-.035em}
#overview,#editor{position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;padding:clamp(34px,8vh,90px) clamp(28px,9vw,130px);background:#000;animation:arrive .55s var(--ease);scrollbar-width:none}#overview::-webkit-scrollbar,#editor::-webkit-scrollbar{display:none}.overview-inner{max-width:800px}h1{font-size:clamp(68px,13vw,140px);letter-spacing:-.07em;font-weight:200;margin:0 0 8px;line-height:.95}.eyebrow{color:#4b4b49;font-size:18px;margin:22px 0 60px;letter-spacing:-.02em}
#lists{display:flex;flex-direction:column;gap:18px;margin-bottom:48px}#lists button{font-size:clamp(30px,6vw,60px);line-height:1.1;letter-spacing:-.045em;color:#565654}#lists button.selected{color:#f3f3f0}#lists small{font-size:.3em;letter-spacing:0;display:inline-block;margin-left:20px;color:#777;vertical-align:middle}.actions{display:flex;flex-wrap:wrap;gap:22px 32px;color:#a0a09b;font-size:18px}.quiet,details{color:#64645f;font-size:15px;line-height:1.6;max-width:530px}#pending:empty{display:none}details{margin-top:44px}summary{cursor:pointer;list-style:none;display:inline-block}summary::-webkit-details-marker{display:none}details p{margin:18px 0}#edit-form{max-width:760px;margin:auto}label{display:block;color:#656560;font-size:16px;margin-bottom:14px}input,textarea{border:0;outline:0;display:block;width:100%;border-radius:0;background:#000;font-weight:300}input{font-size:clamp(36px,6vw,64px);letter-spacing:-.04em;margin-bottom:42px}textarea{resize:none;min-height:45vh;font-size:clamp(20px,2.7vw,30px);line-height:1.65;letter-spacing:-.025em}input:focus,textarea:focus{box-shadow:0 1px 0 #333}
#welcome{position:absolute;inset:0;background:#000;display:flex;align-items:center;padding:9vw;z-index:4}#welcome h2{font-weight:200;font-size:clamp(40px,7vw,78px);line-height:1.02;letter-spacing:-.05em;margin:0 0 40px}#welcome p{font-size:20px;line-height:1.65;color:#74746f;margin:0 0 38px}#welcome button{font-size:28px}#welcome small{display:block;color:#383835;margin-top:30px;font-size:13px}#toast{position:fixed;bottom:max(30px,env(safe-area-inset-bottom));left:10%;right:10%;text-align:center;font-size:15px;color:#999;opacity:0;transition:opacity .2s;pointer-events:none}#toast.visible{opacity:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes arrive{from{opacity:0;transform:translateZ(200px)}to{opacity:1;transform:translateZ(0)}}
#quick-add{position:absolute;inset:0;background:#000;display:flex;align-items:center;padding:9vw;z-index:3}#quick-form{width:100%}#next-task{margin:0;font-size:clamp(32px,5vw,64px);box-shadow:none}#next-task::placeholder{color:#353532}
@media(max-width:600px){:root{--step:clamp(110px,19vh,150px)}.task{font-size:36px;left:8vw;right:8vw}.eyebrow{margin-bottom:45px}#lists small{margin-left:14px}#overview,#editor{padding-top:max(48px,env(safe-area-inset-top))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}