:root{--green:#294c3f;--muted:#7d837c;--ink:#263a31;--paper:#f6f5ef;--line:#dedfd5}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #9aa85f;outline-offset:4px}header{height:92px;max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 4px}.brand{color:var(--ink);font-weight:800;text-decoration:none;display:flex;gap:10px;align-items:center;font-size:19px;letter-spacing:-.8px}.mark{font-size:32px;color:var(--green)}.date{font-size:13px;color:#71796f}main{max-width:1180px;margin:auto}.intro{padding:51px 4px 35px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#7b836f}h1{font-size:42px;font-weight:650;letter-spacing:-2px;margin:14px 0 13px}.intro p{margin:0;color:var(--muted);font-size:15px}.workspace{display:grid;grid-template-columns:1.22fr 1fr;gap:24px}.timer-card{background:#e7ecdf;border:1px solid #d9e0ce;border-radius:24px;padding:27px 32px 23px}.timer-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#6c7863}.label{letter-spacing:1.7px;display:flex;align-items:center;gap:8px;font-size:10px;font-weight:700}.label i{width:6px;height:6px;border-radius:50%;background:#44603e}.modes{display:flex;background:#d9e1d0;width:max-content;padding:4px;border-radius:30px;margin:27px auto 20px;gap:4px}.modes button{border:0;background:transparent;padding:10px 18px;border-radius:24px;color:#75806c;font-size:12px}.modes button.active{background:#fffef8;color:var(--green);box-shadow:0 2px 5px #263a310a;font-weight:700}.clock{width:280px;height:280px;position:relative;margin:0 auto 22px}.clock svg{width:100%;height:100%;transform:rotate(-90deg)}.clock circle{fill:none;stroke-width:2}.track{stroke:#cdd6c2}.progress{stroke:#55704a;stroke-linecap:round;stroke-dasharray:873.3628;stroke-dashoffset:0;transition:stroke-dashoffset .4s}.clock-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center}.clock-face>span{font-size:12px;color:#6a795f}#time{font-size:72px;font-weight:400;letter-spacing:-3px;font-variant-numeric:tabular-nums;margin:12px 0 13px;color:#2c4839}.clock-face .clock-hint{font-size:11px;color:#8a947e}.timer-actions{display:flex;justify-content:center;gap:10px}.start{background:var(--green);border:0;color:white;border-radius:12px;min-width:194px;height:49px;font-size:14px;transition:background .2s}.start:hover{background:#3a6350}.start span{font-size:10px;margin-right:10px}.reset{width:49px;height:49px;border:1px solid #bbc7af;border-radius:12px;background:transparent;color:#496044;font-size:24px}.small-note{text-align:center;font-size:11px;color:#7d886f;margin:18px 0 0;min-height:16px}.tasks-card{padding:32px;background:#fffef9;border:1px solid #e1e3d8;border-radius:24px;display:flex;flex-direction:column;min-width:0}.tasks-heading{display:flex;align-items:center;justify-content:space-between}.tasks-heading .eyebrow{font-size:9px;letter-spacing:1.4px}h2{font-size:23px;margin:10px 0 0;letter-spacing:-1px;font-weight:650}.task-count{background:#edf0e5;color:#6b795d;font-size:12px;padding:8px 12px;border-radius:20px}.task-description{font-size:12px;color:#8a8d80;margin:14px 0 25px}form{display:flex;border-bottom:1px solid #cbd1c2;padding:0 0 10px;gap:8px}input{min-width:0;width:100%;border:0;background:transparent;padding:6px 0;color:var(--ink);font-size:13px}input::placeholder{color:#a2a59a}form button{border:0;border-radius:8px;background:#e9eedd;width:30px;height:30px;color:#4d6341;font-size:22px;flex-shrink:0}ul{padding:0;list-style:none;margin:12px 0 26px;max-height:240px;overflow:auto}li{display:flex;align-items:center;gap:12px;border-bottom:1px solid #f0f0e9;padding:15px 0;font-size:13px}li input{width:17px;height:17px;accent-color:var(--green);flex-shrink:0;cursor:pointer}li span{flex:1;overflow-wrap:anywhere;line-height:1.5}li.done span{text-decoration:line-through;color:#9b9e92}li button{border:0;background:none;color:#a0a695;padding:3px 6px;font-size:18px}li button:hover{color:#953f31}.empty{font-size:13px;color:#9a9f90;text-align:center;margin:12px 0 40px}.empty[hidden]{display:none}.note{margin-top:auto;display:flex;gap:14px;border-radius:13px;background:#f3f2e9;padding:20px 18px}.note-star{font-size:30px;color:#9eaa71;line-height:1}.note strong{font-size:12px;font-weight:600}.note p{font-size:11px;line-height:1.8;color:#90927e;margin:8px 0 0}.save-note{font-size:10px;color:#a0a391;text-align:center;margin:16px 0 0}footer{display:flex;justify-content:space-between;align-items:center;padding:25px 4px 30px;color:#949a88;font-size:11px}footer>span:last-child{font-size:9px;letter-spacing:1.1px}.footer-flower{font-size:16px;margin-left:8px}@media(max-width:1250px){header,main{margin-left:5%;margin-right:5%}}@media(max-width:760px){header{height:73px}.date{font-size:11px}.intro{padding:32px 0 28px}h1{font-size:33px}.intro p{font-size:13px}.workspace{grid-template-columns:1fr;gap:16px}.timer-card{padding:24px 22px}.tasks-card{padding:26px 23px;min-height:390px}.clock{width:255px;height:255px}#time{font-size:66px}.brand{font-size:17px}footer{font-size:10px}footer>span:last-child{font-size:8px;letter-spacing:0}.modes{margin-top:24px}}
