@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";canvas{position:fixed!important;z-index:9999!important;pointer-events:none!important}:root{--primary: hsl(199, 89%, 48%);--primary-glow: hsla(199, 89%, 48%, .4);--primary-glow-strong: hsla(199, 89%, 48%, .6);--accent: hsl(180, 100%, 45%);--bg-main: radial-gradient(circle at top left, #e0f2fe, #f0f9ff, #eef2ff);--glass-bg: rgba(255, 255, 255, .45);--glass-border: rgba(255, 255, 255, .6);--glass-blur: blur(30px);--text-main: #0f172a;--text-muted: #475569;--radius-xl: 32px;--radius-lg: 24px;--radius-md: 16px;--shadow-soft: 0 4px 30px rgba(0, 0, 0, .05);--shadow-glow: 0 10px 40px rgba(14, 165, 233, .3);--shadow-lift: 0 20px 50px rgba(0, 0, 0, .12), 0 10px 20px rgba(0, 0, 0, .08)}*{margin:0;padding:0;box-sizing:border-box;font-family:Outfit,sans-serif}body{background:var(--bg-main);background-attachment:fixed;color:var(--text-main);overflow-x:hidden;min-height:100vh}.glass-panel{background:#ffffffd9;backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 32px #00000014,0 4px 16px #0000000a,inset 0 1px #fffc;will-change:transform}.bg-penguins{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden;pointer-events:none;opacity:.12}.bg-penguin{position:absolute;font-size:2.5rem;filter:blur(.5px);animation:float-penguin linear infinite}@keyframes float-penguin{0%{transform:translateY(110vh) rotate(0)}to{transform:translateY(-10vh) rotate(360deg)}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}.login-box{max-width:480px;width:100%;padding:4rem 3rem;border-radius:var(--radius-xl);text-align:center}.login-icon{width:80px;height:80px;background:linear-gradient(135deg,var(--primary),var(--accent));border-radius:24px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:2.5rem;box-shadow:0 10px 20px var(--primary-glow);animation:float-soft 3s ease-in-out infinite;will-change:transform}.login-title{font-size:3.2rem;font-weight:800;margin-bottom:.5rem;color:#0f172a;letter-spacing:-1.5px;line-height:1.1;display:block}.login-subtitle{color:var(--text-muted);font-size:1.2rem;margin-bottom:2.5rem}.login-form input{width:100%;padding:1.2rem;border-radius:var(--radius-md);border:1px solid rgba(0,0,0,.05);background:#fffc;font-size:1.1rem;margin-bottom:1.5rem;outline:none;transition:all .3s ease;text-align:center}.login-form input:focus{border-color:var(--primary);background:#fff;box-shadow:0 0 0 4px var(--primary-glow),0 8px 20px #0ea5e933;transform:translateY(-2px)}.login-button{width:100%;padding:1.2rem;border:none;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;font-weight:700;font-size:1.2rem;cursor:pointer;transition:all .3s ease}.login-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 15px 40px var(--primary-glow-strong)}.login-button:active{transform:translateY(-1px) scale(1);box-shadow:0 8px 20px var(--primary-glow)}.app-container{min-height:100vh}.app-header{position:sticky;top:1rem;z-index:100;padding:1rem 2rem;margin:1rem auto;max-width:1200px;border-radius:var(--radius-lg)}.header-content{display:flex;justify-content:space-between;align-items:center}.header-title{display:flex;align-items:center;gap:1rem}.header-icon{width:44px;height:44px;background:linear-gradient(135deg,var(--primary),var(--accent));border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;box-shadow:0 4px 12px var(--primary-glow);transition:transform .3s ease}.header-icon:hover{transform:rotate(5deg) scale(1.05)}.header-title h1{font-size:1.8rem;font-weight:700;color:var(--text-main);letter-spacing:-.5px}.header-actions{display:flex;gap:1rem;align-items:center}.timeline-container{max-width:1200px;margin:0 auto;padding:2rem}.timeline-section{margin-bottom:5rem}.timeline-date{font-size:1.4rem;font-weight:700;margin-bottom:2rem;padding:.8rem 1.8rem;display:inline-flex;align-items:center;gap:.8rem;border-radius:50px;color:var(--primary)}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2.5rem}.photo-card{aspect-ratio:1;border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;position:relative;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 12px #00000014;will-change:transform;transform:translateZ(0)}.photo-card:hover{transform:translateY(-12px) scale(1.03) rotate(.5deg) translateZ(0);box-shadow:0 25px 50px #00000026,0 0 30px var(--primary-glow)}.photo-card:active{transform:translateY(-8px) scale(1.01) translateZ(0);transition:all .1s ease}.photo-card img{width:100%;height:100%;object-fit:cover;transition:transform .3s cubic-bezier(.34,1.56,.64,1);will-change:transform}.photo-card:hover img{transform:scale(1.08) translateZ(0)}.photo-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,23,42,.8),transparent);opacity:0;transition:opacity .3s ease;display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem}.photo-card:hover .photo-overlay{opacity:1}.photo-actions{display:flex;gap:1rem}.photo-btn{padding:.8rem;background:#fff3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);border-radius:15px;color:#fff;cursor:pointer;flex:1;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.photo-btn:hover{background:#fff;color:var(--primary);transform:translateY(-2px)}.photo-btn.delete:hover,.delete-btn-lite:hover{background:#ff4757!important;border-color:#ff4757!important;color:#fff!important}.notifications-container{position:fixed;bottom:2rem;right:2rem;z-index:1000;display:flex;flex-direction:column;gap:1rem}.notification{padding:1rem 2rem;border-radius:20px;color:#fff;font-weight:600;box-shadow:0 10px 30px #00000026;animation:slideInBounce .5s cubic-bezier(.34,1.56,.64,1);will-change:transform,opacity}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInBounce{0%{transform:translate(120%) translateZ(0);opacity:0}60%{transform:translate(-10px) translateZ(0);opacity:1}80%{transform:translate(5px) translateZ(0)}to{transform:translate(0) translateZ(0)}}.notification.success{background:#10b981}.notification.error{background:#ef4444}.notification.info{background:var(--primary)}.btn{padding:.8rem 2rem;border-radius:50px;border:none;font-weight:700;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:.8rem;font-size:1rem;position:relative;overflow:hidden;will-change:transform;transform:translateZ(0)}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff6;transform:translate(-50%,-50%);transition:width .4s cubic-bezier(.4,0,.2,1),height .4s cubic-bezier(.4,0,.2,1)}.btn:active:before{width:300px;height:300px}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,#2563eb 100%);color:#fff;box-shadow:0 8px 20px var(--primary-glow)}.btn-primary:hover{transform:translateY(-2px) scale(1.02) translateZ(0);box-shadow:0 12px 35px var(--primary-glow-strong),0 0 20px #0ea5e94d}.btn-primary:active{transform:translateY(0) scale(1) translateZ(0);box-shadow:0 4px 12px var(--primary-glow);transition:all .1s ease}.btn-secondary{background:#fff;color:var(--primary);border:2px solid var(--primary);box-shadow:0 4px 12px #0000000d}.btn-secondary:hover{background:var(--primary);color:#fff;transform:translateY(-2px) scale(1.02) translateZ(0);box-shadow:0 8px 20px var(--primary-glow),0 0 15px #0ea5e933}.btn-secondary:active{transform:translateY(0) scale(1) translateZ(0);transition:all .1s ease}.btn-icon{width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;border:none;background:#fff;color:var(--text-muted);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);will-change:transform;transform:translateZ(0)}.btn-icon:hover{color:var(--primary);background:#0ea5e926;transform:rotate(5deg) scale(1.1) translateZ(0);box-shadow:0 4px 12px #0ea5e933}.btn-icon:active{transform:rotate(0) scale(.95) translateZ(0);transition:all .1s ease}.nav-arrows{position:fixed;right:2rem;bottom:2rem;display:flex;flex-direction:column;gap:1rem}.nav-arrow{width:56px;height:56px;border-radius:20px}::-webkit-scrollbar{width:10px}*{scrollbar-width:thin;scrollbar-color:#cbd5e1 var(--bg-main)}::selection{background:var(--primary-glow);color:var(--primary)}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px;border:2px solid var(--bg-main)}::-webkit-scrollbar-thumb:hover{background:var(--primary)}.md-hide{display:inline}@media(max-width:900px){.md-hide{display:none}}@media(max-width:768px){.login-title{font-size:2.2rem}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.header-content{flex-direction:column;gap:1rem;text-align:center}.header-title{width:100%}.header-title h1{font-size:1.3rem}.header-actions{width:100%;flex-wrap:wrap;justify-content:center;gap:.5rem}.btn{padding:.6rem 1.2rem;font-size:.9rem}.btn-icon{width:40px;height:40px}.sm-hide{display:none!important}.timeline-container{padding:1rem}.app-header{margin:.5rem;padding:1rem}.filter-bar{flex-wrap:wrap;gap:.5rem;padding:.5rem}.filter-btn{font-size:.85rem;padding:.5rem 1rem}.timeline-date{font-size:1.1rem;padding:.6rem 1.2rem}.photo-card{border-radius:12px}.mini-action-btn{width:28px;height:28px;font-size:.75rem}.comment-card{max-width:90%;padding:1.5rem}.modal-overlay{padding:1rem}.nav-arrows{right:1rem;bottom:1rem}.nav-arrow{width:48px;height:48px}.recap-banner{flex-direction:column;padding:1.5rem;text-align:center}.recap-content h2{font-size:1.5rem}.recap-content p{font-size:1rem}}.lightbox-overlay{position:fixed;inset:0;background:#0f172ad9;backdrop-filter:blur(30px) saturate(120%);-webkit-backdrop-filter:blur(30px) saturate(120%);z-index:3000;display:flex;align-items:center;justify-content:center;padding:2rem;overflow-y:auto;animation:fadeIn .2s ease-out}.lightbox-content{width:100%;max-width:1000px;display:flex;flex-direction:column;align-items:center;gap:2rem;position:relative}.lightbox-image{width:100%;max-width:800px;max-height:70vh;object-fit:contain;border-radius:var(--radius-lg);box-shadow:0 20px 60px #00000080,0 0 40px #0ea5e933;animation:zoomIn .3s cubic-bezier(.34,1.56,.64,1)}@keyframes zoomIn{0%{transform:scale(.9) translateZ(0);opacity:0}to{transform:scale(1) translateZ(0);opacity:1}}.lightbox-close{position:fixed;top:2rem;right:2rem;padding:.8rem 1.5rem;background:#ffffff26;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.3);border-radius:50px;color:#fff;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .2s;z-index:3001}.lightbox-close:hover{background:#ffffff40;transform:scale(1.05)}.lightbox-info{width:100%;max-width:700px;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius-lg);padding:2rem;box-shadow:0 10px 30px #0003;border:1px solid rgba(255,255,255,.5)}.lightbox-nav{position:fixed;top:50%;transform:translateY(-50%) translateZ(0);width:50px;height:50px;background:#ffffff26;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:3001;will-change:transform}.lightbox-nav:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.15) translateZ(0);box-shadow:0 8px 20px #ffffff4d}.lightbox-nav:active{transform:translateY(-50%) scale(1.05) translateZ(0)}.lightbox-nav.prev{left:2rem}.lightbox-nav.next{right:2rem}.lightbox-actions{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}@media(max-width:768px){.lightbox-overlay{padding:1rem}.lightbox-image{max-height:60vh}.lightbox-info{padding:1.5rem}.lightbox-nav{width:40px;height:40px}.lightbox-nav.prev{left:1rem}.lightbox-nav.next{right:1rem}}.thumbnail-favs{display:none}.modal-overlay{position:fixed;inset:0;background:#0f172ab3;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:4000;display:flex;align-items:center;justify-content:center;padding:1.5rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.comment-card{width:90%;max-width:400px;border-radius:var(--radius-xl);padding:2rem;background:#fffffff2;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);position:relative;box-shadow:0 25px 50px #0000004d;border:1px solid rgba(255,255,255,.6)}.comment-section{margin-top:0}.comment-label{font-size:.9rem;font-weight:700;color:var(--primary);margin-bottom:.5rem;display:block}.comment-input{width:100%;padding:1rem;border-radius:var(--radius-md);border:2px solid #e2e8f0;background:#f8fafc;margin-bottom:1rem;font-size:.95rem;resize:none;transition:all .2s;font-family:inherit}.comment-input:focus{outline:none;border-color:var(--primary);background:#fff;box-shadow:0 0 0 3px #3b82f61a}.lightbox-image{max-width:90vw;max-height:75vh;object-fit:contain;border-radius:var(--radius-md)}.lightbox-info{width:90vw!important;max-width:600px!important;padding:1.5rem!important}.recap-banner{margin-bottom:3rem;padding:2.5rem;border-radius:var(--radius-xl);display:flex;align-items:center;gap:2rem;background:#fff}.recap-icon{font-size:4rem}.recap-content h2{font-size:2rem;font-weight:800;color:var(--primary);margin-bottom:.5rem}.recap-content p{color:var(--text-muted);font-size:1.1rem}.penguin-loader-container{position:fixed;inset:0;background:var(--bg-main);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem}.waddling-penguin{font-size:6rem;animation:waddle .6s ease-in-out infinite}@keyframes waddle{0%,to{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(10deg) translateY(-10px)}}.filter-bar{display:flex;justify-content:center;gap:1rem;margin-bottom:4rem;flex-wrap:wrap}.filter-btn{padding:.9rem 2.2rem;border-radius:50px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #0000000a;color:var(--text-muted);position:relative;overflow:hidden;will-change:transform;transform:translateZ(0)}.filter-btn:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:3px;background:var(--primary);transform:translate(-50%);transition:width .3s cubic-bezier(.4,0,.2,1);border-radius:3px 3px 0 0}.filter-btn:hover{transform:translateY(-2px) translateZ(0);box-shadow:0 8px 16px #0000001a,0 0 20px #0ea5e926;border-color:var(--primary);color:var(--primary)}.filter-btn:hover:after{width:60%}.filter-btn.active{background:linear-gradient(135deg,var(--primary) 0%,#2563eb 100%);color:#fff;border-color:var(--primary);box-shadow:0 8px 20px var(--primary-glow),0 0 25px #0ea5e94d;transform:translateY(-2px) scale(1.05) translateZ(0)}.filter-btn.active:after{width:0}.filter-btn:active{transform:translateY(0) translateZ(0);transition:all .1s ease}.random-btn{margin:0 auto 4rem;padding:1rem 2.5rem;display:flex;background:#fff;border:2.5px solid var(--primary);color:var(--primary);font-weight:800;font-size:1.1rem}.random-btn:hover{background:var(--primary);color:#fff;transform:scale(1.05)}.photo-top-actions{position:absolute;top:1rem;right:1rem;display:flex;gap:.5rem;z-index:10}.mini-action-btn{width:32px;height:32px;border-radius:10px;background:#ffffffe6;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);font-weight:800;color:var(--text-muted);will-change:transform,background-color;position:relative;transform:translateZ(0)}.mini-action-btn:hover{background:#fff;transform:scale(1.2) translateZ(0);box-shadow:0 6px 16px #00000026;z-index:20}.mini-action-btn:active{transform:scale(.9) translateZ(0);transition:all .1s ease}.mini-action-btn.k.active{background:var(--primary);color:#fff;transform:scale(1.1) translateZ(0);animation:heartBeat .5s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 12px var(--primary-glow)}.mini-action-btn.m.active{background:#ff7eb3;color:#fff;transform:scale(1.1) translateZ(0);animation:heartBeat .5s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 12px #ff7eb366}@keyframes heartBeat{0%,to{transform:scale(1.1) translateZ(0)}25%{transform:scale(1.3) translateZ(0)}50%{transform:scale(1.1) translateZ(0)}75%{transform:scale(1.25) translateZ(0)}}.comment-badge{position:absolute;top:-2px;right:-2px;width:8px;height:8px;background:#10b981;border-radius:50%;border:2px solid white;box-shadow:0 2px 4px #0000001a}.comment-preview-popup{position:absolute;top:100%;right:0;width:200px;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:.8rem;border-radius:12px;box-shadow:0 10px 25px #00000026;margin-top:.5rem;display:block;opacity:0;visibility:hidden;transform:translateY(10px);border:1px solid rgba(255,255,255,.5);text-align:left;z-index:100;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.comment-preview-popup:before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px;background:transparent}.mini-action-btn:hover .comment-preview-popup{opacity:1;visibility:visible;transform:translateY(0)}.preview-item{margin-bottom:.5rem;font-size:.8rem}.preview-item:last-child{margin-bottom:0}.preview-label{font-weight:700;display:block;margin-bottom:.1rem}.preview-text{color:var(--text-muted);line-height:1.3;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.settings-overlay{position:fixed;inset:0;background:#0f172a66;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:5000;display:flex;align-items:center;justify-content:center;padding:1.5rem}.settings-modal{width:100%;max-width:600px;max-height:90vh;background:#fffffff2;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);border-radius:var(--radius-xl);padding:2.5rem;overflow-y:auto;position:relative;box-shadow:0 25px 50px #0003;border:1px solid rgba(255,255,255,.7)}.settings-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(0,0,0,.05)}.settings-header h2{font-size:1.8rem;font-weight:800;color:var(--primary);margin:0}.settings-section{margin-bottom:2.5rem}.settings-section h3{font-size:1.1rem;font-weight:700;color:#1e293b;margin-bottom:1.2rem;display:flex;align-items:center;gap:.6rem}.settings-hint{font-size:.85rem;color:var(--text-muted);margin-top:.6rem;line-height:1.4}.settings-form{display:flex;flex-direction:column;gap:1.2rem}.settings-help{background:#00000008;padding:1.5rem;border-radius:16px;font-size:.9rem;color:#475569}.settings-help p{margin-bottom:.5rem}.settings-help code{background:#e2e8f0;padding:.2rem .4rem;border-radius:6px;font-family:monospace;font-weight:600}.btn-danger{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;box-shadow:0 8px 20px #ef444440;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn-danger:hover{transform:translateY(-2px);box-shadow:0 12px 30px #ef444459}.settings-danger-zone{margin-top:2rem;padding-top:2rem;border-top:1px dashed rgba(239,68,68,.3);text-align:center}.settings-danger-zone h3{color:#ef4444;font-size:1.2rem;font-weight:800;margin-bottom:.5rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.settings-danger-zone p{color:var(--text-muted);font-size:.9rem;margin-bottom:1.5rem}.drag-drop-overlay{position:fixed;inset:0;background:#0ea5e9f2;backdrop-filter:blur(30px) saturate(150%);-webkit-backdrop-filter:blur(30px) saturate(150%);z-index:5000;display:flex;align-items:center;justify-content:center;animation:fadeIn .2s ease-out;pointer-events:none}.drag-drop-content{text-align:center;color:#fff;animation:float-soft 2s ease-in-out infinite}.drag-drop-content svg{margin-bottom:1.5rem;filter:drop-shadow(0 10px 20px rgba(0,0,0,.3));animation:pulse 2s ease-in-out infinite}.drag-drop-content h2{font-size:2.5rem;font-weight:800;margin-bottom:.5rem;text-shadow:0 4px 10px rgba(0,0,0,.2)}.drag-drop-content p{font-size:1.2rem;opacity:.9;text-shadow:0 2px 5px rgba(0,0,0,.2)}@keyframes float-soft{0%,to{transform:translateY(0) translateZ(0)}50%{transform:translateY(-10px) translateZ(0)}}@keyframes pulse{0%,to{transform:scale(1) translateZ(0);opacity:1}50%{transform:scale(1.1) translateZ(0);opacity:.8}}@media(min-width:1024px){.header-actions{gap:.75rem}.header-actions .btn{padding:.8rem 1.2rem;font-size:.9rem;min-width:unset}.app-header{padding:.75rem 1.5rem}}@media(max-width:768px){.header-title h1{font-size:1.4rem}.header-actions{gap:.5rem}.sm-hide{display:none!important}}@media(max-width:1100px){.md-hide{display:none!important}}.timeline-section p{line-height:1.6}