:root{color-scheme:light;font-family:Inter,system-ui,sans-serif;background:#f3f4f6;color:#111827}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#f3f4f6}body.dark-mode{background:#0f172a;color:#e2e8f0}body.dark-mode .panel{background:#111827;border-color:#334155;box-shadow:0 14px 40px #0f172a73}body.dark-mode input,body.dark-mode textarea,body.dark-mode select{background:#0f172a;color:#e2e8f0;border-color:#475569}body.dark-mode .search-input{background:#0f172a}body.dark-mode .note-card{background:#1f2937;border-color:#334155}body.dark-mode .note-card.read{background:#111827}body.dark-mode .note-header span,body.dark-mode .stats-row,body.dark-mode .note-card p{color:#cbd5e1}button,input,textarea,select{font:inherit}.app-shell{max-width:1040px;margin:0 auto;padding:24px;display:grid;gap:24px}.app-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.app-header h1{margin:0}.theme-toggle-small{padding:8px 12px;border:none;border-radius:8px;background:#e5e7eb;color:#111827;cursor:pointer;font-size:18px;transition:background .2s ease,transform .1s ease;flex-shrink:0}.theme-toggle-small:hover{background:#d1d5db;transform:scale(1.1)}body.dark-mode .theme-toggle-small{background:#334155;color:#e2e8f0}body.dark-mode .theme-toggle-small:hover{background:#475569}.panel{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:24px;box-shadow:0 14px 40px #0f172a14}h1,h2,h3{margin:0 0 16px}.controls-row{display:grid;gap:12px;margin-bottom:20px}@media (min-width: 640px){.controls-row{grid-template-columns:1fr 180px}}.search-input,select,.note-form input,.note-form textarea{width:100%;padding:12px 14px;border:1px solid #d1d5db;border-radius:12px;margin-top:8px}.note-form label{display:block;margin-bottom:16px;font-weight:600}.note-form textarea{min-height:120px;resize:vertical}.form-actions{display:flex;gap:12px;flex-wrap:wrap}button{padding:12px 18px;border:none;border-radius:999px;background:#2563eb;color:#fff;cursor:pointer;transition:background .2s ease,transform .1s ease}button:hover{background:#1d4ed8;transform:translateY(-1px)}button.secondary{background:#6b7280}button.danger{background:#dc2626}.error{color:#b91c1c;margin:0 0 16px}.list-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap}.stats-row{display:flex;gap:12px;flex-wrap:wrap;color:#4b5563}.notes-list{display:grid;gap:18px}.note-card{border:1px solid #e5e7eb;border-radius:16px;padding:18px;position:relative;background:#fff}.note-card.read{background:#ecfdf5}.note-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.note-header h3{margin:0}.note-actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}.read-badge{position:absolute;right:18px;top:18px;background:#22c55e;color:#fff;padding:6px 12px;border-radius:999px;font-size:.85rem}