:root{color-scheme:light;--ink:#273b30;--paper:#f7f5ee;--line:#d8d9ca;--green:#24563e}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 system-ui,"Microsoft YaHei",sans-serif}
.wrap{width:min(740px,calc(100% - 40px));margin:auto}
header{border-bottom:1px solid var(--line)}
.mast,.heading,.sheethead,.actions,footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mast{padding:20px 0}.brand{font-weight:750}.brand b{background:var(--green);color:white;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:7px;margin-right:5px}
.mono,.kicker,time{font:11px/1.5 ui-monospace,monospace;letter-spacing:.11em}
.heading{margin:64px 0 34px;align-items:flex-end}.kicker{color:var(--green);font-weight:bold}
h1{font:700 clamp(44px,8vw,70px)/1.15 Georgia,"Songti SC",SimSun,serif;margin:10px 0}.heading h1 span{color:#b46336}.sub,.panel p,.empty{color:#647166}.sub{margin:0}time{white-space:nowrap}
.sheet{background:#fffef8;border:1px solid var(--line);border-top:4px solid var(--green);border-radius:4px;padding:28px;box-shadow:0 5px 0 #ebeade}
.sheethead{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:22px}h2{font-size:21px;margin:0}
.entry{display:flex;gap:10px}.panel label{font-weight:bold}.panel p{font-size:14px}
input,button{font:inherit}input{min-width:0;flex:1;border:1px solid #aab7a7;background:white;color:var(--ink);border-radius:5px;padding:11px}
button{border:0;border-radius:5px;background:var(--green);color:white;cursor:pointer;padding:10px 15px}
:focus-visible{outline:3px solid #a46125;outline-offset:3px}button:disabled{opacity:.55}
nav{display:flex;gap:4px;margin-top:22px}nav button,.actions button,.delete{background:transparent;color:#55675a;font-size:14px}
nav [aria-pressed=true]{background:#e6ebde;color:var(--green);font-weight:bold}
ul{padding:0;list-style:none;margin:14px 0}li{border-top:1px solid var(--line);display:flex;align-items:center;min-height:56px}
.check{display:flex;align-items:center;flex:1;min-width:0;gap:14px;cursor:pointer;overflow-wrap:anywhere;padding:10px 0}
.check input{flex:none;accent-color:var(--green);width:19px;height:19px}
.check input:checked+span{text-decoration:line-through;color:#6e796e}.delete:hover{color:#933d2c}.empty{text-align:center;padding:22px 0}
.actions{border-top:1px solid var(--line)}#message{color:#8a4428;margin-bottom:0}#message:empty{display:none}footer{font-size:10px;color:#657268;margin-top:24px}
@media(max-width:520px){.heading{margin:36px 0 22px;display:block}time{display:block;margin-top:12px}.sheet{padding:18px}.wrap{width:calc(100% - 28px)}button{padding:10px}.mast .mono{font-size:10px}}