:root{--bg: #fafafa;--fg: #1f1f1f;--muted: #6b6b6b;--accent: #2563eb;--border: #e5e5e5;--card: #ffffff;--danger: #dc2626;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-size:16px;line-height:1.4}main#app{max-width:720px;margin:0 auto;padding:24px 16px 80px}.topbar{display:flex;align-items:center;gap:12px;margin-bottom:16px}.topbar h1{font-size:1.4rem;margin:0;flex:0 0 auto}.topbar input{flex:1;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:var(--card)}.composer{display:grid;gap:8px;margin-bottom:16px;padding:12px;background:var(--card);border:1px solid var(--border);border-radius:8px}.composer input,.composer textarea{padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:1rem;resize:vertical}.composer-actions{display:flex;justify-content:flex-end;gap:8px}.composer-actions button{padding:8px 14px;background:var(--accent);color:#fff;border:0;border-radius:6px;font-size:.95rem;cursor:pointer}.composer-actions button#nova{background:#fff;color:var(--fg);border:1px solid var(--border)}ul.notes{list-style:none;margin:0;padding:0;display:grid;gap:10px}li.note{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:12px 14px}.note-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px}.note-title{font-size:1rem}.note-date{color:var(--muted);font-size:.8rem}.note-body{margin:0 0 8px;font-family:inherit;white-space:pre-wrap;word-wrap:break-word;color:var(--fg)}.note-actions{display:flex;gap:8px}.note-actions button{padding:4px 10px;border:1px solid var(--border);border-radius:6px;background:#fff;cursor:pointer;font-size:.85rem}.note-actions button[data-act=delete]{color:var(--danger);border-color:var(--danger)}li.empty{padding:24px;text-align:center;color:var(--muted);background:transparent;border:1px dashed var(--border);border-radius:8px}