*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,Helvetica Neue,Arial,sans-serif;background:var(--bg);color:var(--text);transition:background-color .2s ease,color .2s ease;height:100dvh;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--bg: #0f0f0f;--bg-elevated: #161616;--bg-card: #1c1c1c;--bg-hover: rgba(255, 255, 255, .04);--text: #e2e2e2;--text-muted: #888888;--text-faint: #404040;--accent: #d4a96a;--accent-dim: rgba(212, 169, 106, .12);--border: rgba(255, 255, 255, .07);--border-strong: rgba(255, 255, 255, .13);--radius-sm: 4px;--radius: 8px;--navbar-h: 52px;--sidebar-w: 224px}[data-theme=light]{--bg: #f2f2f2;--bg-elevated: #ffffff;--bg-card: #ffffff;--bg-hover: rgba(0, 0, 0, .04);--text: #1a1a1a;--text-muted: #666666;--text-faint: #cccccc;--accent: #b07a28;--accent-dim: rgba(176, 122, 40, .1);--border: rgba(0, 0, 0, .08);--border-strong: rgba(0, 0, 0, .14)}.app-layout{display:flex;flex-direction:column;height:100dvh;overflow:hidden}.app-body{display:flex;flex:1;overflow:hidden}.main-content{flex:1;overflow-y:auto;scroll-behavior:smooth;min-width:0}.main-content::-webkit-scrollbar,.sidebar::-webkit-scrollbar{width:5px}.main-content::-webkit-scrollbar-track,.sidebar::-webkit-scrollbar-track{background:transparent}.main-content::-webkit-scrollbar-thumb,.sidebar::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}.main-content::-webkit-scrollbar-thumb:hover,.sidebar::-webkit-scrollbar-thumb:hover{background:var(--text-faint)}.navbar{height:var(--navbar-h);flex-shrink:0;display:flex;align-items:center;gap:6px;padding:0 10px;background:var(--bg-elevated);border-bottom:1px solid var(--border);-webkit-user-select:none;user-select:none;z-index:50}.navbar-logo{font-size:1.2rem;font-weight:900;color:var(--accent);letter-spacing:-1.5px;padding:0 6px;pointer-events:none}.navbar-spacer{flex:1}.icon-btn{width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;font-size:1.05rem;flex-shrink:0;transition:background .15s,color .15s}.icon-btn:hover{background:var(--bg-hover);color:var(--text)}.view-toggle{display:flex;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.view-btn{padding:5px 13px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:.78rem;font-weight:500;white-space:nowrap;transition:background .12s,color .12s;display:flex;align-items:center;gap:4px}.view-btn.active{background:var(--accent);color:#1a0e00;font-weight:700}.view-btn:not(.active):hover{background:var(--bg-hover);color:var(--text)}.sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--bg-elevated);border-right:1px solid var(--border);overflow-y:auto;padding:8px 0 16px}.sidebar-divider{height:1px;background:var(--border);margin:6px 10px}.folder-item,.all-item{width:100%;display:flex;align-items:center;gap:5px;padding:6px 10px;border:none;background:transparent;color:var(--text-muted);font-size:.81rem;cursor:pointer;text-align:left;min-width:0;transition:background .1s,color .1s}.folder-item:hover,.all-item:hover{background:var(--bg-hover);color:var(--text)}.folder-item.active,.all-item.active{color:var(--accent);background:var(--accent-dim)}.folder-arrow{flex-shrink:0;width:10px;font-size:.65rem;color:var(--text-faint);transition:color .1s}.folder-icon{flex-shrink:0;font-size:.8rem}.folder-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.folder-count{flex-shrink:0;font-size:.68rem;color:var(--text-faint);background:var(--bg-hover);padding:1px 5px;border-radius:10px}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:5px;padding:10px}.media-tile{position:relative;aspect-ratio:1;overflow:hidden;cursor:pointer;background:var(--bg-card);border-radius:var(--radius-sm);outline:none;animation:tile-in .35s ease both}.media-tile:focus-visible{box-shadow:0 0 0 2px var(--accent);z-index:1}@keyframes tile-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.media-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s cubic-bezier(.25,.46,.45,.94)}.media-tile:hover img,.media-tile:focus-visible img{transform:scale(1.07)}.video-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--bg-card);transition:background .15s}.media-tile:hover .video-placeholder{background:color-mix(in srgb,var(--bg-card) 80%,var(--accent) 20%)}.video-play-icon{width:46px;height:46px;border-radius:50%;background:#ffffff14;display:flex;align-items:center;justify-content:center;font-size:1.15rem;color:var(--text-muted);transition:background .15s,color .15s,transform .2s}.media-tile:hover .video-play-icon{background:var(--accent);color:#1a0e00;transform:scale(1.1)}.video-filename{font-size:.68rem;color:var(--text-faint);text-align:center;padding:0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.media-tile-overlay{position:absolute;bottom:0;left:0;right:0;padding:24px 8px 7px;background:linear-gradient(transparent,#000000b8);opacity:0;transition:opacity .2s;pointer-events:none}.media-tile:hover .media-tile-overlay,.media-tile:focus-visible .media-tile-overlay{opacity:1}.tile-name{font-size:.71rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.tile-date{font-size:.63rem;color:#fff9;margin-top:2px}.timeline{padding:20px 20px 48px;max-width:1400px}.timeline-year{margin-bottom:52px}.timeline-year-heading{font-size:clamp(2.8rem,7vw,5.5rem);font-weight:900;color:var(--text-faint);line-height:1;letter-spacing:-3px;margin-bottom:18px;-webkit-user-select:none;user-select:none}.timeline-month{margin-bottom:28px}.timeline-month-heading{font-size:.78rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:1.8px;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--border)}.month-count{font-weight:400;color:var(--text-faint)}.timeline-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:4px}.loading{display:flex;align-items:center;justify-content:center;height:100%;min-height:300px}.spinner{width:30px;height:30px;border:2px solid var(--border-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .65s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state,.error-state{display:flex;align-items:center;justify-content:center;height:100%;min-height:300px;color:var(--text-muted);font-size:.875rem}.lightbox-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f0;z-index:1000;display:flex;align-items:center;justify-content:center;animation:lb-fade-in .15s ease;overscroll-behavior:contain;outline:none}@keyframes lb-fade-in{0%{opacity:0}to{opacity:1}}@keyframes lb-scale-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.lightbox-content{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.lightbox-media{max-width:calc(100vw - 110px);max-height:calc(100vh - 80px);object-fit:contain;border-radius:var(--radius-sm);animation:lb-scale-in .2s ease;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.lightbox-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:#ffffff1a;border:none;color:#ffffffd9;font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .15s;z-index:10}.lightbox-close:hover{background:#ffffff38;color:#fff}.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:64px;background:#ffffff12;border:none;color:#fffc;font-size:1.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-sm);transition:background .15s,color .15s;z-index:10;line-height:1}.lightbox-nav:hover{background:#ffffff2e;color:#fff}.lightbox-prev{left:10px}.lightbox-next{right:10px}.lightbox-info{position:absolute;bottom:0;left:0;right:0;padding:40px 16px 14px;background:linear-gradient(transparent,#000c);display:flex;align-items:center;gap:14px;pointer-events:none;z-index:5}.lightbox-filename{font-size:.875rem;color:#fff;font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lightbox-date,.lightbox-meta,.lightbox-counter{font-size:.75rem;color:#ffffff8c;white-space:nowrap;flex-shrink:0}@media (max-width: 900px){:root{--sidebar-w: 200px}}@media (max-width: 700px){.sidebar{display:none}.gallery{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:3px;padding:6px}.timeline-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:3px}.lightbox-media{max-width:100vw;max-height:calc(100vh - 56px);border-radius:0}.lightbox-nav{width:36px;height:50px;font-size:1.5rem}.view-btn{padding:5px 9px}}@media (max-width: 420px){.gallery,.timeline-grid{grid-template-columns:repeat(3,1fr)}.lightbox-info{flex-wrap:wrap;gap:6px}}