:root{--notes-bg:#f8f9fa;--notes-surface:#fff;--notes-border:#dee2e6;--notes-text:#212529;--notes-text-muted:#6c757d;--notes-primary:#495057;--notes-primary-hover:#343a40;--notes-accent:#0d6efd;--notes-danger:#dc3545;--notes-warn:#fd7e14;--notes-success:#198754;--notes-shadow:0 4px 16px #0000000f;--notes-radius:12px;--notes-font:"Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--notes-font);color:var(--notes-text);background:var(--notes-bg);margin:0}button,input,textarea,select{font:inherit}a{color:inherit}.notes-shell{max-width:900px;margin:0 auto;padding:1.5rem}.notes-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.notes-brand{align-items:center;gap:.75rem;display:flex}.notes-brand h1{margin:0;font-size:1.5rem;font-weight:700}.notes-brand span{font-size:1.5rem}.notes-header-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.notes-status{background:var(--notes-border);color:var(--notes-text-muted);border-radius:999px;padding:.25rem .6rem;font-size:.85rem;font-weight:600}.notes-status.online{color:var(--notes-success);background:#d1e7dd}.notes-status.offline{color:var(--notes-danger);background:#f8d7da}.notes-toolbar{margin-bottom:1.25rem}.notes-btn{cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;padding:.6rem 1rem;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .1s,background .15s;display:inline-flex}.notes-btn:hover{transform:translateY(-1px)}.notes-btn:disabled{opacity:.6;cursor:not-allowed}.notes-btn-primary{background:var(--notes-primary);color:#fff}.notes-btn-primary:hover{background:var(--notes-primary-hover)}.notes-btn-ghost{background:var(--notes-surface);color:var(--notes-text-muted);border:1px solid var(--notes-border)}.notes-btn-danger{background:var(--notes-danger);color:#fff}.notes-card{background:var(--notes-surface);border:1px solid var(--notes-border);border-radius:var(--notes-radius);box-shadow:var(--notes-shadow);padding:1.25rem}.notes-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;display:grid}.notes-note-card{flex-direction:column;gap:.75rem;display:flex}.notes-note-header{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.notes-note-header h3{margin:0;font-size:1.1rem;font-weight:600}.notes-note-badges{flex-wrap:wrap;justify-content:flex-end;gap:.35rem;display:flex}.notes-badge{text-transform:uppercase;letter-spacing:.02em;border-radius:999px;padding:.15rem .45rem;font-size:.7rem;font-weight:700}.notes-badge-encrypted{color:#5e3fd7;background:#e0d4fc}.notes-badge-dirty{color:#856404;background:#fff3cd}.notes-badge-offline{color:#721c24;background:#f8d7da}.notes-note-preview{color:var(--notes-text-muted);flex:1;margin:0;font-size:.95rem;line-height:1.5}.notes-note-actions{gap:.5rem;display:flex}.notes-empty{text-align:center;color:var(--notes-text-muted);padding:4rem 1rem}.notes-empty p{margin:0 0 1rem}.notes-error-banner{color:#721c24;border-radius:var(--notes-radius);background:#f8d7da;margin-bottom:1rem;padding:.75rem 1rem}.notes-field{flex-direction:column;gap:.35rem;margin-bottom:1rem;display:flex}.notes-field label{color:var(--notes-text-muted);font-size:.85rem;font-weight:600}.notes-field input,.notes-field textarea{border:1px solid var(--notes-border);color:var(--notes-text);resize:vertical;background:#fff;border-radius:8px;padding:.65rem .8rem}.notes-error{color:var(--notes-danger);margin:.25rem 0 .75rem;font-size:.9rem}.notes-editor{background:var(--notes-surface);border:1px solid var(--notes-border);border-radius:var(--notes-radius);box-shadow:var(--notes-shadow);padding:1.25rem}.notes-editor-actions{gap:.5rem;display:flex}.notes-login{place-items:center;min-height:100vh;padding:1rem;display:grid}.notes-login-card{width:min(420px,100%)}.notes-login-card h2{margin:0 0 .25rem;font-weight:700}.notes-login-card p{color:var(--notes-text-muted);margin:0 0 1.25rem}.notes-auth-footer{text-align:center;color:var(--notes-text-muted);margin:1.25rem 0 0;font-size:.9rem}.notes-auth-footer a{color:var(--notes-accent);font-weight:600;text-decoration:none}.notes-auth-footer a:hover{text-decoration:underline}.notes-dev-hint{color:var(--notes-text-muted);margin:.5rem 0 0;font-size:.8rem}.notes-settings h2{margin:1.5rem 0 .25rem;font-size:1.15rem}.notes-settings h2:first-of-type{margin-top:0}.notes-settings-desc{color:var(--notes-text-muted);margin:0 0 1rem;font-size:.9rem;line-height:1.5}.notes-toggle{cursor:pointer;align-items:center;gap:.75rem;margin-bottom:1rem;font-weight:500;display:flex}.notes-toggle input[type=checkbox]{width:1.25rem;height:1.25rem}