@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600&display=swap");:root{--bg:#111111;--line:#303030;--text:#f2f2ee;--muted:#92928d}*{box-sizing:border-box}body,html{min-height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}button,input{font:inherit}.lock-screen{min-height:100svh;display:grid;place-items:center;background:#0c0c0c}.lock-screen form{width:min(70vw,240px)}.lock-screen input{width:100%;height:1px;border:0;outline:0;padding:0;background:#5d5d58;color:transparent;caret-color:#f3f3ee;transition:height .16s ease,padding .16s ease,background .16s ease}.lock-screen input:focus{height:36px;padding:0 10px;color:var(--text);background:#171717;border:1px solid #63635e}.lock-screen input.wrong{animation:shake .24s linear 2;border-color:#c36c6c}@keyframes shake{50%{transform:translateX(6px)}}.board{width:min(100% - 36px,680px);min-height:100svh;margin:0 auto;padding:clamp(32px,9vw,94px) 0}.masthead{display:flex;align-items:baseline;justify-content:space-between;padding:0 0 24px;border-bottom:1px solid var(--line)}h1{margin:0;color:#f3f3ee;font-size:19px;font-weight:500;letter-spacing:-.045em}.progress{margin:0;color:var(--muted);font:12px DM Mono,monospace}.file{padding-top:9px}.add-form{display:flex;align-items:center;border-bottom:1px solid var(--line)}.add-form input{flex:1 1;min-width:0;border:0;outline:0;padding:18px 2px;background:transparent;color:var(--text);font-size:16px}.add-form input::placeholder{color:#777772}.add-form button{width:38px;height:38px;border:0;border-radius:50%;background:transparent;color:#b7b7b1;cursor:pointer;font-size:24px;font-weight:300;line-height:1}.add-form button:hover{background:#252525;color:var(--text)}.items{display:grid}.note{position:relative;display:flex;align-items:center;min-height:64px;border-bottom:1px solid var(--line)}.check{width:21px;height:21px;flex:0 0 21px;border:1px solid #777772;border-radius:50%;color:#111;background:transparent;cursor:pointer;font-size:13px;line-height:1}.check:hover{border-color:#d2d2cc}.complete .check{border-color:#d6d6d0;background:#d6d6d0}.note-copy{flex:1 1;padding:0 13px}.note-copy p{margin:0;font-size:16px;letter-spacing:-.018em;line-height:1.35}.complete .note-copy p{color:#777772;text-decoration:line-through;text-decoration-thickness:1px}.note-copy small{display:block;margin-top:3px;color:var(--muted);font:11px DM Mono,monospace}.delete{width:31px;height:31px;border:0;border-radius:50%;background:transparent;color:#6f6f6a;cursor:pointer;font-size:20px;line-height:1;opacity:0;transition:opacity .15s ease,background .15s ease,color .15s ease}.delete:focus-visible,.note:hover .delete{opacity:1}.delete:hover{background:#282828;color:var(--text)}.name-popover{position:absolute;z-index:2;right:0;top:55px;width:min(246px,calc(100vw - 42px));padding:13px;background:#242424;border:1px solid #3b3b3b;box-shadow:0 12px 30px #0008}.name-popover label{display:block;margin-bottom:8px;color:var(--muted);font:11px DM Mono,monospace}.name-popover input{width:100%;border:1px solid #4a4a47;outline:0;padding:8px 9px;background:#161616;color:var(--text);font-size:14px}.name-popover input:focus{border-color:#8a8a84}.name-popover div{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}.name-popover button{border:0;padding:5px 7px;background:transparent;color:var(--muted);cursor:pointer;font-size:12px}.name-popover button:last-child{color:var(--text)}@media (max-width:540px){.board{width:min(100% - 28px,680px);padding-top:30px}.delete{opacity:1}}