.page-header{padding:2.5rem 0 2rem;border-bottom:1px solid var(--color-border);margin-bottom:2rem}.page-header h1{font-size:2rem;margin-bottom:.5rem}.subtitle{color:var(--color-muted);font-size:1rem}.filters{display:flex;align-items:flex-end;gap:.75rem;flex-wrap:wrap;padding:1rem 1.25rem;margin-bottom:2.5rem;background-color:var(--color-tag-bg);border:1px solid var(--color-border);border-radius:calc(var(--radius) * 2)}.search-wrapper{position:relative;flex:1;min-width:200px}.search-icon{position:absolute;left:.65rem;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--color-muted);pointer-events:none}.filter-search{width:100%;height:2.25rem;padding:0 .75rem 0 2.15rem;font-size:.875rem;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);outline:none;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}.filter-search:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent) 15%,transparent)}.filter-search::placeholder{color:var(--color-muted)}.date-range{display:flex;align-items:flex-end;gap:.5rem}.date-field{display:flex;flex-direction:column;gap:.3rem}.date-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--color-muted)}.filter-date{height:2.25rem;padding:0 .6rem;font-size:.8rem;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);outline:none;cursor:pointer;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}.filter-date:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent) 15%,transparent)}.date-arrow{font-size:.85rem;color:var(--color-muted);padding-bottom:.45rem;line-height:1}.reset-btn{display:inline-flex;align-items:center;gap:.3rem;height:2.25rem;padding:0 .75rem;font-size:.82rem;font-family:var(--font-sans);font-weight:500;color:var(--color-muted);background:transparent;border:1px solid transparent;border-radius:var(--radius);cursor:pointer;white-space:nowrap;transition:color .15s,background-color .15s}.reset-btn svg{width:13px;height:13px;flex-shrink:0}.reset-btn:hover{color:var(--color-text);background-color:var(--color-tag-bg)}.tags-dropdown{position:relative}.tags-toggle{display:flex;align-items:center;gap:.4rem;height:2.25rem;padding:0 .75rem;font-size:.85rem;font-family:var(--font-sans);font-weight:500;color:var(--color-muted);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);cursor:pointer;white-space:nowrap;transition:border-color .15s,color .15s,box-shadow .15s}.tags-toggle:hover{border-color:var(--color-text);color:var(--color-text)}.tags-toggle[aria-expanded=true]{border-color:var(--color-accent);color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent) 15%,transparent)}.tags-icon{width:13px;height:13px;flex-shrink:0}.tags-count{display:inline-flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem;font-size:.62rem;font-weight:700;line-height:1;background-color:var(--color-accent);color:#fff;border-radius:50%;flex-shrink:0}.chevron{width:13px;height:13px;flex-shrink:0;margin-left:auto;transition:transform .18s ease}.tags-toggle[aria-expanded=true] .chevron{transform:rotate(180deg)}.tags-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:20;min-width:260px;max-width:360px;padding:.85rem;flex-wrap:wrap;gap:.45rem;background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:calc(var(--radius) * 1.5);box-shadow:0 4px 16px #00000014,0 1px 3px #0000000f}.tags-panel:not([hidden]){display:flex}.tag-filter-btn{font-size:.75rem;font-family:var(--font-sans);font-weight:500;letter-spacing:.01em;padding:.3em .8em;border-radius:99px;border:1px solid var(--color-border);background-color:var(--color-tag-bg);color:var(--color-muted);cursor:pointer;line-height:1.5;transition:border-color .12s,color .12s,background-color .12s,box-shadow .12s;white-space:nowrap}.tag-filter-btn:before{content:"#";opacity:.4;margin-right:.05em;font-size:.9em}.tag-filter-btn:hover{border-color:var(--color-text);color:var(--color-text)}.tag-filter-btn.active{background-color:var(--color-accent);border-color:var(--color-accent);color:#fff;box-shadow:0 1px 3px color-mix(in srgb,var(--color-accent) 35%,transparent)}.tag-filter-btn.active:before{opacity:.65}@media(max-width:540px){.filters{padding:.875rem 1rem;gap:.6rem}.search-wrapper,.date-range{width:100%}.date-field{flex:1;min-width:0}.date-arrow{flex-shrink:0}.filter-date{width:100%;min-width:0}.tags-dropdown,.tags-toggle{width:100%}.tags-panel{left:0;right:0;min-width:0;max-width:none}}.loading-state{color:var(--color-muted);font-size:.9rem;margin-bottom:2rem}.timeline{position:relative;padding-left:1.75rem}.timeline:not(:empty):before{content:"";position:absolute;left:0;top:.35rem;bottom:0;width:1px;background-color:var(--color-border)}.month-separator{display:flex;align-items:center;gap:.75rem;margin:1.25rem 0 1.5rem -1.75rem}.month-separator:before{content:"";width:7px;height:7px;transform:rotate(45deg);background-color:var(--color-bg);border:1px solid var(--color-border);flex-shrink:0}.month-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--color-muted)}.timeline-item{position:relative;margin-bottom:2.5rem}.timeline-item:last-child{margin-bottom:0}.timeline-dot{position:absolute;left:-1.875rem;top:.4rem;width:9px;height:9px;border-radius:50%;background-color:var(--color-accent);border:2px solid var(--color-bg);box-shadow:0 0 0 1px var(--color-accent)}.note-card{display:flex;flex-direction:column;gap:.6rem}.note-date{font-size:.78rem;color:var(--color-muted);font-variant-numeric:tabular-nums;letter-spacing:.01em}.note-content{font-size:.975rem;line-height:1.75;color:var(--color-text)}.note-tags{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin-top:.2rem}.tag{font-size:.72rem;background-color:var(--color-tag-bg);color:var(--color-tag-text);padding:.2em .6em;border-radius:99px;font-weight:500;letter-spacing:.01em}.tag:before{content:"#";opacity:.5;margin-right:.1em}.tag.active{background-color:var(--color-accent);color:#fff}.tag.active:before{opacity:.65}.empty-state{padding:2rem 0;color:var(--color-muted);font-size:.9rem}
