:root{--paper:#faf7f2;--card:#fff;--ink:#2a2622;--muted:#7a7069;--accent:#b4542e;--accent-soft:#f4e6df;--border:#e7e0d6;--radius:14px;--shadow:0 1px 2px #2a26220d, 0 8px 24px -16px #2a262259}@media (prefers-color-scheme:dark){:root{--paper:#17150f;--card:#211e18;--ink:#f0ebe3;--muted:#a49a90;--accent:#e08a5f;--accent-soft:#3a2a21;--border:#322d25;--shadow:0 1px 2px #0000004d, 0 8px 24px -16px #000c}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6}.page{max-width:42rem;margin:0 auto;padding:3rem 1.25rem 5rem}.masthead{align-items:center;gap:.75rem;margin-bottom:.25rem;display:flex}.masthead-icon{background:var(--accent-soft);width:2.5rem;height:2.5rem;color:var(--accent);border-radius:12px;flex:none;place-items:center;display:grid}h1{letter-spacing:-.015em;margin:0;font-family:ui-serif,Georgia,Times New Roman,serif;font-size:clamp(1.7rem,5vw,2.25rem);font-weight:600}.tagline{color:var(--muted);margin:0 0 2rem;font-size:.95rem}.composer{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:.75rem;padding:1.25rem;display:flex}label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:.8rem;font-weight:600}input[type=text]{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--border);border-radius:10px;padding:.7rem .85rem;transition:border-color .12s,box-shadow .12s}input[type=text]::placeholder{color:var(--muted);opacity:.7}input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}button{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;gap:.45rem;padding:.65rem 1rem;font-weight:600;transition:background-color .12s,color .12s,border-color .12s,transform 80ms;display:inline-flex}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn-primary{background:var(--accent);color:#fff;align-self:flex-start}.btn-primary:disabled{opacity:.45;cursor:not-allowed}.btn-quiet{color:var(--muted);border-color:var(--border);background:0 0;padding:.45rem .8rem;font-size:.875rem}.btn-quiet:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.btn-quiet:disabled{opacity:.4;cursor:not-allowed}.list-head{justify-content:space-between;align-items:center;gap:1rem;margin:2.5rem 0 .75rem;display:flex}.count{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.8rem;font-weight:600}.notes{flex-direction:column;gap:.6rem;margin:0;padding:0;list-style:none;display:flex}.note{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:.9rem 1.1rem}.note-text{overflow-wrap:anywhere;margin:0}.note-time{color:var(--muted);margin-top:.3rem;font-size:.78rem;display:block}.empty{border:1px dashed var(--border);border-radius:var(--radius);text-align:center;color:var(--muted);margin:0;padding:2rem 1.25rem}.confirm{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.confirm-text{color:var(--muted);font-size:.85rem}.btn-danger{background:var(--accent);color:#fff;padding:.45rem .8rem;font-size:.875rem}.footnote{color:var(--muted);text-align:center;margin-top:3rem;font-size:.82rem}