:root{--surface: #f6f4f1;--surface-alt: #fff8ee;--surface-card: #ffffff;--surface-gradient-end: #efe9e2;--surface-glass: rgba(246, 244, 241, .85);--text-primary: #1c1c1c;--text-muted: #6b6b6b;--text-inverse: #ffffff;--accent: #1f6f78;--accent-soft: #f0c987;--accent-soft-text: #1c1c1c;--border: #e2ded8;--chip-bg: #efe9e2;--chip-hover: #e7dfd5;--inline-code-bg: #f5f1ea;--input-bg: #ffffff;--card-fade-start: rgba(255, 255, 255, 0);--shadow: 0 10px 30px rgba(0, 0, 0, .08);--fab-shadow: 0 14px 28px rgba(31, 111, 120, .3);--ring: 0 0 0 2px rgba(31, 111, 120, .22);font-family:Cascadia Mono,Cascadia Code,SFMono-Regular,Consolas,monospace}:root[data-theme=dark]{--surface: #161514;--surface-alt: #1d1b19;--surface-card: #24211e;--surface-gradient-end: #2b241f;--surface-glass: rgba(22, 21, 20, .82);--text-primary: #f3eee7;--text-muted: #b7ada1;--text-inverse: #fffdf8;--accent: #4aa0ab;--accent-soft: #c8a163;--accent-soft-text: #1a140b;--border: #3b352f;--chip-bg: #302a25;--chip-hover: #3a332d;--inline-code-bg: #1c1917;--input-bg: #1b1815;--card-fade-start: rgba(36, 33, 30, 0);--shadow: 0 16px 36px rgba(0, 0, 0, .35);--fab-shadow: 0 14px 28px rgba(0, 0, 0, .4);--ring: 0 0 0 2px rgba(74, 160, 171, .3)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top left,var(--surface-alt),var(--surface) 55%,var(--surface-gradient-end) 100%);color:var(--text-primary);min-height:100vh}#app{max-width:960px;margin:0 auto;padding:32px 20px 110px}nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;position:relative;z-index:30;background:var(--surface-glass);backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:14px;padding:10px 12px}nav .brand{font-weight:700;font-size:1.2rem}.nav-actions{position:relative}.menu-toggle{min-width:42px;min-height:42px;padding:6px 12px;font-size:1.3rem;line-height:1}.menu-panel{position:absolute;right:0;top:calc(100% + 8px);min-width:190px;background:var(--surface-card);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);padding:8px;display:none;gap:6px;z-index:40}.menu-panel.open{display:grid}.menu-item{width:100%;text-align:left;border-radius:10px;background:transparent;color:var(--text-primary);border:1px solid transparent}.menu-item:hover{background:var(--chip-bg)}.menu-item.active{background:var(--text-primary);color:var(--text-inverse)}button{border:none;background:var(--accent);color:var(--text-inverse);padding:10px 16px;border-radius:999px;cursor:pointer;font-size:.95rem}button.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}button.active{background:var(--text-primary)}button:disabled{opacity:.6;cursor:not-allowed}.login{max-width:420px;margin:120px auto 0;background:var(--surface-card);padding:32px;border-radius:20px;box-shadow:var(--shadow);animation:fade-slide-in .24s ease}.login h1{margin-top:0}.login form{display:grid;gap:16px}label{display:grid;gap:8px;font-size:.95rem}input,textarea{padding:12px 14px;border-radius:12px;border:1px solid var(--border);font-size:1rem;background:var(--input-bg);color:var(--text-primary)}input::placeholder,textarea::placeholder{color:var(--text-muted)}textarea{resize:vertical}.hint{color:var(--text-muted);font-size:.85rem}.chip-bar{display:flex;gap:10px;flex-wrap:wrap;padding:8px 0 16px}.date-chip-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:0 0 12px}.filters-sticky{position:sticky;top:10px;z-index:15;margin-bottom:14px;background:var(--surface-glass);backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:14px;padding:12px}.filters-sticky .chip-bar{padding:0 0 10px}.filters-sticky .date-chip-bar{padding:0}.tag-filter-search{display:grid;gap:8px;margin-bottom:12px;position:relative}.tag-filter-search-label{font-size:.85rem;color:var(--text-muted)}.tag-filter-input{width:100%}.tag-filter-suggestions{position:absolute;top:calc(100% + 4px);left:0;right:0;display:grid;gap:4px;padding:8px;border:1px solid var(--border);border-radius:12px;background:var(--surface-card);box-shadow:var(--shadow);z-index:20}.tag-filter-suggestion{width:100%;border-radius:10px;background:transparent;color:var(--text-primary);text-align:left;padding:10px 12px}.tag-filter-suggestion:hover,.tag-filter-suggestion.active{background:var(--chip-bg)}.date-range-row{display:flex;gap:8px;align-items:center;width:100%}.date-range-row input[type=date]{max-width:150px}.chip{background:var(--chip-bg);color:var(--text-primary);padding:6px 12px;border-radius:999px;font-size:.85rem;border:none;transition:background-color .15s ease,transform .12s ease}.chip:hover{background:var(--chip-hover)}.chip:active{transform:translateY(1px)}.chip.selected{background:var(--accent-soft);color:var(--accent-soft-text)}.chip span{color:var(--text-muted);margin-left:4px}.toolbar{position:fixed;right:22px;bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:45}#newNote{width:64px;height:64px;border-radius:50%;padding:0;font-size:2rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--fab-shadow)}.notes{display:grid;gap:16px}.card{background:var(--surface-card);border-radius:18px;padding:16px;box-shadow:var(--shadow);display:grid;gap:10px;animation:fade-slide-in .18s ease both;cursor:pointer;transition:box-shadow .14s ease,transform .12s ease}.card:hover{transform:translateY(-2px)}.card:focus-visible{outline:none;box-shadow:var(--ring),var(--shadow)}.card header,.read header{display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr);align-items:flex-start;gap:12px}.card-time{color:var(--text-muted);font-size:.78rem;letter-spacing:.01em}.editor .actions,.read .actions{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:10px;padding-top:8px;border-top:1px solid var(--border)}.card .tags,.read .tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;justify-self:end;max-width:100%}.markdown-body{line-height:1.7;font-size:1rem;overflow-wrap:anywhere;word-break:break-word;min-width:0}.markdown-body h1,.markdown-body h2,.markdown-body h3{line-height:1.28}.markdown-body :is(p,ul,ol,blockquote,pre,table){margin:0 0 .85em}.markdown-body :is(img,video,iframe,table,pre){max-width:100%;min-width:0}.markdown-body code{background:var(--inline-code-bg);border-radius:6px;padding:.1em .35em;overflow-wrap:anywhere}.markdown-body pre{width:100%;box-sizing:border-box;background:var(--inline-code-bg);border-radius:10px;padding:10px;white-space:pre-wrap;word-break:break-word;overflow-x:hidden}.markdown-body pre code{display:block;max-width:100%;white-space:pre-wrap;word-break:break-word;background:transparent;border-radius:0;padding:0}.markdown-body blockquote{border-left:3px solid var(--accent-soft);margin-left:0;padding-left:10px;color:var(--text-muted)}.markdown-body>:last-child{margin-bottom:0}.card .body{height:10.5em;overflow:hidden;position:relative}.card .body:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.4em;background:linear-gradient(to bottom,var(--card-fade-start),var(--surface-card))}.editor{display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:16px;background:var(--surface-card);padding:20px;border-radius:18px;box-shadow:var(--shadow);animation:fade-slide-in .2s ease;min-height:0}.editor-screen{display:grid;grid-template-rows:auto minmax(0,1fr);gap:20px;min-height:calc(100dvh - 142px)}.editor>label:first-child{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}.editor #noteBody{min-height:0;height:100%}.tag-editor{display:grid;gap:10px}.tag-editor #tagList{display:flex;flex-wrap:wrap;gap:8px}.read{background:var(--surface-card);padding:24px;border-radius:20px;box-shadow:var(--shadow);display:grid;gap:16px;width:100%;animation:fade-slide-in .2s ease;overflow:hidden;min-width:0}.read .body{min-width:0}.tag-refs{background:var(--surface-card);padding:20px;border-radius:18px;box-shadow:var(--shadow);animation:fade-slide-in .2s ease}.ref-form{display:flex;gap:10px;margin-bottom:16px}.ref-form input{flex:1}table{width:100%;border-collapse:collapse}thead th{text-align:left;color:var(--text-muted);font-weight:600;font-size:.85rem}td,th{padding:10px 6px;border-bottom:1px solid var(--border)}.empty{color:var(--text-muted);font-size:.9rem}.notes .empty{margin:4px 0}.clear-filters{border:1px dashed var(--accent)}.loader{text-align:center;padding:60px 0;color:var(--text-muted)}.dirty-indicator{margin-left:auto;color:var(--text-muted);font-size:.84rem;opacity:0;transform:translateY(2px);transition:opacity .16s ease,transform .16s ease}.dirty-indicator.visible{opacity:1;transform:translateY(0)}button,input,textarea{transition:box-shadow .14s ease,border-color .14s ease,transform .1s ease}button:hover{transform:translateY(-1px)}button:active{transform:translateY(1px)}input:focus,textarea:focus,button:focus-visible{outline:none;box-shadow:var(--ring)}@keyframes fade-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 720px){.editor-screen{min-height:calc(100dvh - 142px)}.toolbar{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}#newNote{width:58px;height:58px;font-size:1.8rem}.ref-form{flex-direction:column}.date-range-row{flex-direction:column;align-items:stretch}.date-range-row input[type=date]{max-width:100%}}