:root{--bg:#fff7f3;--card:#fff;--ink:#2a1a1e;--mut:#6b5158;--line:#f0d9df;--rose:#a8446e;--pink:#e8a6bb;--head:#1f4a28;--new:#a8446e;--paid:#1f6b34;--ready:#8a5a00;--done:#5b5b66;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#122a17;--card:#1b3a22;--ink:#fbeff2;--mut:#c9b0b8;--line:#2e5a38;--rose:#e8a6bb;--head:#0b1c0f;--new:#e8a6bb;--paid:#8fd9a0;--ready:#f2c66d;--done:#b9b9c4}}
:root[data-theme="dark"]{--bg:#122a17;--card:#1b3a22;--ink:#fbeff2;--mut:#c9b0b8;--line:#2e5a38;--rose:#e8a6bb;--head:#0b1c0f;--new:#e8a6bb;--paid:#8fd9a0;--ready:#f2c66d;--done:#b9b9c4}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,sans-serif}
header{background:var(--head);color:#fff3e6;padding:16px 20px;display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;justify-content:space-between}
h1{margin:0;font:400 32px 'Brush Script MT','Segoe Script',cursive;color:#e8a6bb}
main{max-width:860px;margin:0 auto;padding:20px}
.box{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:16px}
label{display:block;font-weight:700;margin-bottom:6px}
select,textarea,input{width:100%;font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-height:44px}
button{font:inherit;font-weight:700;cursor:pointer;min-height:44px;border-radius:999px;border:2px solid var(--pink);background:var(--card);color:var(--ink);padding:0 16px}
button.on,button.go{background:var(--pink);color:#2a1a1e}
.row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
#msg{margin:8px 0 0;min-height:1.4em;font-size:14px}
.top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;align-items:baseline}
.id{font-weight:700;font-size:20px;letter-spacing:.06em;color:var(--rose)}
.pill{font-weight:700;font-size:13px;border:1px solid currentColor;border-radius:999px;padding:2px 10px}
.mut{color:var(--mut);font-size:14px}
ul{margin:8px 0;padding-left:20px}
a{color:var(--rose)}
#alert{background:var(--pink);color:#2a1a1e;font-weight:700;cursor:pointer}
