@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Serif+SC:wght@500;600;700&display=swap');
:root{--ink:#153b35;--paper:#f5f0e5;--yellow:#f4cf62;--coral:#e1765b;--mist:#d8e0d1;--line:#d8d1c3}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Serif SC',serif}button,input{font:inherit}button{cursor:pointer}.screen{width:min(100%,620px);min-height:100svh;margin:auto;padding:48px 24px 32px}.hidden{display:none!important}.mark{width:68px;height:68px;border-radius:24px;background:var(--ink);color:var(--yellow);display:grid;place-items:center;font-size:34px;font-weight:700;box-shadow:9px 9px 0 var(--yellow)}.mark.small{width:52px;height:52px;font-size:25px;border-radius:18px;margin-top:22px}.eyebrow,.mini{font:500 11px 'DM Mono',monospace;letter-spacing:.12em;margin:28px 0 8px}.eyebrow{color:#618078}.mini{color:#51736a;margin:0 0 8px}h1{font-size:clamp(38px,10vw,58px);line-height:1.15;letter-spacing:-.06em;margin:0}h1 em{color:var(--coral);font-style:normal}.intro{font-size:16px;line-height:1.9;color:#4d625d;max-width:410px;margin:25px 0 28px}.card{background:#fffdf8;border:1px solid var(--line);border-radius:22px;box-shadow:0 10px 28px #143d3611}.choice{padding:12px}.primary{border:0;border-radius:14px;padding:15px 18px;background:var(--ink);color:white;font-weight:700;font-size:16px;width:100%;transition:transform .15s}.primary:active{transform:scale(.98)}.text,.back,.logout{border:0;background:transparent;color:var(--ink);padding:14px;width:100%;font-size:14px}.back{width:auto;padding:0;margin-bottom:9px;color:#5b756e}.form{padding:18px;margin-top:28px}.form label{display:block;font-size:13px;margin:0 0 15px}.form input,.add input{display:block;width:100%;background:#f5f2e8;border:1px solid transparent;border-radius:12px;padding:13px;margin-top:7px;outline:none}.form input:focus,.add input:focus{border-color:var(--ink)}header{display:flex;justify-content:space-between;align-items:start;padding-top:8px}header .eyebrow{margin:0 0 7px}h2{font-size:25px;letter-spacing:-.05em;line-height:1.35;margin:0}.invite{width:42px;height:42px;border:1px solid var(--ink);background:transparent;color:var(--ink);border-radius:50%;font-size:24px}.next{display:flex;justify-content:space-between;align-items:center;padding:20px;margin:24px 0 14px}.next strong{font-size:19px;display:block}.next p:not(.mini){font-size:13px;color:#647770;margin:7px 0 0}.sun{font-size:42px;color:var(--yellow);text-shadow:2px 2px var(--coral)}.add{display:grid;grid-template-columns:1fr auto;gap:8px;background:var(--mist);padding:11px;border-radius:17px}.add input{margin:0;background:#fffdf8;padding:12px}.add input[type=datetime-local]{grid-column:1/2;font:11px 'DM Mono',monospace;color:#587068}.add button{grid-column:2;grid-row:1/3;border:0;background:var(--coral);color:white;border-radius:12px;padding:0 15px;font-weight:700}.list-title{display:flex;justify-content:space-between;margin:28px 4px 12px;font-size:15px}.list-title span:last-child{font:11px 'DM Mono',monospace;color:#71827c}.tasks{display:grid;gap:9px}.task{display:flex;align-items:center;gap:12px;padding:14px;background:#fffdf8;border-radius:15px;border:1px solid var(--line)}.check{appearance:none;width:22px;height:22px;border:1.5px solid var(--ink);border-radius:50%;flex:none;margin:0}.check:checked{background:var(--ink);box-shadow:inset 0 0 0 5px var(--yellow)}.task .copy{flex:1;min-width:0}.task strong{display:block;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task small{display:block;color:#72827b;font:11px 'DM Mono',monospace;margin-top:4px}.task.done strong{text-decoration:line-through;color:#94a09c}.empty{padding:28px 12px;color:#73817c;text-align:center;font-size:14px}.install{margin-top:20px;width:100%;border:1px dashed var(--ink);padding:12px;background:transparent;border-radius:13px;color:var(--ink)}.logout{color:#8a665e;text-decoration:underline;margin-top:22px}dialog{border:0;border-radius:25px;padding:30px;width:min(360px,calc(100% - 32px));background:var(--paper);color:var(--ink);box-shadow:0 18px 80px #0005}dialog::backdrop{background:#143d366b}dialog h2{margin-bottom:12px}dialog p{font-size:14px;color:#536861;line-height:1.75}dialog output{display:block;text-align:center;letter-spacing:.18em;background:var(--yellow);font:700 25px 'DM Mono',monospace;padding:17px;border-radius:13px;margin:20px 0}.close{position:absolute;right:14px;top:11px;border:0;background:transparent;font-size:27px;color:var(--ink)}#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;background:var(--ink);color:white;padding:12px 17px;border-radius:99px;font-size:13px;transition:.25s;pointer-events:none;white-space:nowrap}#toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:650px){body{background:linear-gradient(115deg,#e7e9da,var(--paper) 42%,#f2dcc5)}.screen{background:var(--paper);box-shadow:0 0 70px #143d2022}}
