:root{--bg-primary:#17161b;--bg-secondary:#212025;--bg-card:#2b2e33;--bg-card-hover:#363940;--text-primary:#f3f4f6;--text-secondary:#cfd3de;--text-tertiary:#adb1ba;--text-quaternary:#878b94;--accent:#28ee64;--accent-hover:#22d459;--accent-bg:#28ee641f;--accent-text:#17161b;--border:#2c2c2f;--border-2:#363940;--error:#ee4848;--error-hover:#d43d3d;--surface:#212124;--radius:12px;--radius-sm:8px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;font-size:16px}body{background:var(--bg-primary);color:var(--text-primary);min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.logo{color:var(--accent);align-items:center;gap:8px;font-size:1.5rem;font-weight:700;display:flex}.logo-icon{border-radius:8px;width:36px;height:36px}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 20px;font-size:.95rem;font-weight:500;transition:background .2s,transform .1s;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:var(--accent-text)}.btn-primary:hover{background:var(--accent-hover)}.btn-text{color:var(--text-secondary);background:0 0;padding:6px 12px}.btn-text:hover{color:var(--text-primary)}.btn-icon{color:var(--text-primary);border-radius:var(--radius-sm);cursor:pointer;background:#ffffff1a;border:none;padding:8px 16px}.btn-icon:hover{background:#fff3}.btn-store{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border)}.btn-store:hover{background:var(--bg-card-hover)}.loading{min-height:300px;color:var(--text-secondary);justify-content:center;align-items:center;display:flex}.empty-state{text-align:center;color:var(--text-secondary);padding:60px 20px}.empty-hint{margin-top:8px;font-size:.85rem}.error{text-align:center;color:var(--error);flex-direction:column;align-items:center;gap:16px;padding:60px 20px;display:flex}.error .btn{margin-top:8px}.breadcrumb{color:var(--text-secondary);align-items:center;gap:6px;font-size:.85rem;display:flex}.breadcrumb a{color:var(--accent);text-decoration:none}.breadcrumb a:hover{text-decoration:underline}.breadcrumb-sep{color:var(--text-secondary);font-size:.75rem}.back-link{color:var(--text-secondary);font-size:.9rem}.back-link:hover{color:var(--text-primary)}.landing{max-width:960px;margin:0 auto;padding:0 20px}.landing-header{justify-content:space-between;align-items:center;padding:20px 0;display:flex}.hero{text-align:center;border-radius:var(--radius);background:radial-gradient(at 50% 0,#28ee6426 0%,#0000 80%);padding:80px 0 60px}.hero h2{margin-bottom:16px;font-size:2.2rem;line-height:1.3}.hero-sub{color:var(--text-secondary);max-width:520px;margin:0 auto 32px}.store-buttons{justify-content:center;gap:12px;display:flex}.features{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;padding:40px 0 80px;display:grid}.feature-card{background:var(--bg-card);border-radius:var(--radius);text-align:center;border:1px solid var(--border);padding:24px;transition:background .2s,border-color .2s}.feature-card:hover{background:var(--bg-card-hover);border-color:var(--border-2)}.feature-icon{background:var(--accent-bg);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 16px;font-size:2rem;display:flex}.feature-card h3{margin-bottom:8px}.feature-card p{color:var(--text-secondary);font-size:.9rem}.landing-footer{text-align:center;color:var(--text-secondary);border-top:1px solid var(--border);padding:20px 0;font-size:.85rem}.login-page{justify-content:center;align-items:center;min-height:100dvh;padding:20px;display:flex}.login-card{background:var(--bg-secondary);border-radius:var(--radius);text-align:center;width:100%;max-width:400px;padding:48px 40px}.login-card .logo{margin-bottom:12px;font-size:2rem}.login-desc{color:var(--text-secondary);margin-bottom:32px}.btn-google,.btn-apple{border-radius:var(--radius-sm);cursor:pointer;border:1px solid var(--border);justify-content:center;align-items:center;gap:10px;width:100%;padding:14px;font-size:1rem;display:flex}.btn-google{color:#333;background:#fff}.btn-google:hover{background:#f5f5f5}.btn-apple{color:#fff;background:#000}.btn-apple:hover{background:#1a1a1a}.login-buttons{flex-direction:column;gap:12px;display:flex}.dashboard{max-width:960px;margin:0 auto;padding:0 20px}.dashboard-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px 0;display:flex}.dashboard-header .logo a{color:var(--accent)}.header-space-label{color:var(--text-secondary);font-size:1rem;font-weight:500}.user-info{color:var(--text-secondary);align-items:center;gap:12px;font-size:.9rem;display:flex}.header-left{align-items:center;gap:12px;display:flex}.breadcrumb-item{align-items:center;gap:6px;display:flex}.dashboard-main{padding:32px 0}.dashboard-main h2{margin-bottom:20px}.space-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.space-card{background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);padding:24px;transition:background .2s,border-color .2s}.space-card:hover{background:var(--bg-card-hover);border-color:var(--border-2)}.space-card-icon{margin-bottom:12px;font-size:2rem}.space-card h3{margin-bottom:4px}.space-meta{color:var(--text-secondary);font-size:.85rem}.space-detail{max-width:960px;margin:0 auto;padding:0 20px}.space-detail-header{border-bottom:1px solid var(--border);padding:20px 0}.space-detail-header h1{margin:8px 0 12px;font-size:1.5rem}.member-list{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}.member-badge{background:var(--bg-card);border-radius:20px;padding:4px 12px;font-size:.85rem}.admin-tag{color:var(--accent);margin-left:4px;font-size:.75rem}.album-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;padding:24px 0;display:grid}.album-card{background:var(--bg-card);border-radius:var(--radius);text-align:center;border:1px solid var(--border);padding:24px;transition:background .2s,border-color .2s}.album-card:hover{background:var(--bg-card-hover);border-color:var(--border-2)}.album-card-icon{background:var(--bg-secondary);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 12px;font-size:1.5rem;display:flex}.album-card h3{margin-bottom:4px;font-size:1rem}.album-meta{color:var(--text-secondary);font-size:.85rem}.album-view{max-width:1200px;margin:0 auto;padding:0 20px}.album-view-header{border-bottom:1px solid var(--border);padding:20px 0}.album-view-header h1{margin:8px 0 12px;font-size:1.5rem}.uploader-filter{flex-wrap:wrap;gap:8px;padding:16px 0;display:flex}.filter-chip{border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;border-radius:20px;padding:6px 14px;font-size:.85rem;transition:all .2s}.filter-chip:hover{background:var(--bg-card-hover);color:var(--text-primary)}.filter-chip.active{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.photo-content{padding:24px 0}.photo-group{margin-bottom:32px}.group-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.group-label{color:var(--text-secondary);font-size:.9rem}.group-actions{gap:4px;display:flex}.group-action-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:4px;height:28px;padding:0 10px;font-size:.75rem;transition:all .2s;display:flex}.group-action-btn:hover{background:var(--bg-card-hover);color:var(--text-primary);border-color:var(--text-secondary)}.group-action-btn:disabled{opacity:.4;cursor:not-allowed}.group-action-danger:hover{border-color:var(--error);color:var(--error);background:#ee48481a}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:4px;display:grid}.photo-thumb{aspect-ratio:1;background:var(--bg-card);cursor:pointer;border:none;border-radius:4px;padding:0;position:relative;overflow:hidden}.expiry-badge{color:#fff;background:#0000008c;border-radius:4px;padding:1px 5px;font-size:10px;line-height:1.4;position:absolute;bottom:4px;right:4px}.expiry-urgent{background:#ee4848d9;font-weight:600}.photo-thumb img{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .3s;position:absolute;inset:0}.photo-thumb img.thumb-loaded{opacity:1}.thumb-placeholder.thumb-hidden{display:none}.thumb-placeholder{background:linear-gradient(90deg, var(--bg-card) 25%, var(--bg-card-hover) 50%, var(--bg-card) 75%);background-size:200% 100%;width:100%;height:100%;animation:1.5s ease-in-out infinite skeleton-pulse;position:absolute;inset:0}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton{background:linear-gradient(90deg, var(--bg-card) 25%, var(--bg-card-hover) 50%, var(--bg-card) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-pulse}.page-skeleton{max-width:960px;margin:0 auto;padding:0 20px}.page-skeleton-header{border-bottom:1px solid var(--border);align-items:center;gap:12px;height:60px;margin-bottom:32px;padding-bottom:0;display:flex}.skeleton-logo{width:120px;height:28px}.skeleton-text{width:80px;height:16px}.skeleton-card{height:120px}.skeleton-thumb{aspect-ratio:1}.skeleton-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;display:grid}.skeleton-grid-photos{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:4px;display:grid}.error-page{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:60vh;padding:40px 20px;display:flex}.error-icon{font-size:3rem}.error-message{color:var(--error);text-align:center;font-size:1rem}.error-actions{gap:12px;margin-top:8px;display:flex}.toast-container{z-index:2000;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{background:var(--bg-secondary);color:var(--text-primary);border-radius:var(--radius-sm);border:1px solid var(--border);pointer-events:auto;padding:12px 24px;font-size:.9rem;animation:.3s ease-out toast-in;box-shadow:0 4px 12px #0006}.toast-error{border-color:var(--error);color:var(--error)}.toast-success{border-color:var(--accent);color:var(--accent)}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes modal-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.confirm-overlay{z-index:1100;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--bg-secondary);border-radius:var(--radius);border:1px solid var(--border);width:90%;max-width:380px;padding:24px;animation:.2s ease-out modal-in}.confirm-title{margin-bottom:10px;font-size:1.1rem}.confirm-message{color:var(--text-secondary);margin-bottom:24px;font-size:.9rem;line-height:1.5}.confirm-actions{justify-content:flex-end;gap:8px;display:flex}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover{background:var(--error-hover)}.bulk-progress-overlay{z-index:1200;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.bulk-progress-dialog{background:var(--bg-secondary);border-radius:var(--radius);border:1px solid var(--border);width:90%;max-width:340px;padding:28px 24px;animation:.2s ease-out modal-in}.bulk-progress-label{text-align:center;margin-bottom:16px;font-size:.95rem}.bulk-progress-track{background:var(--bg-card);border-radius:3px;height:6px;overflow:hidden}.bulk-progress-fill{background:var(--accent);border-radius:3px;height:100%;transition:width .3s}.photo-viewer{z-index:1000;background:#000000eb;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.viewer-content{flex-direction:column;max-width:90vw;max-height:90vh;display:flex}.viewer-toolbar{justify-content:flex-end;gap:8px;padding:8px 0;display:flex}.viewer-image{object-fit:contain;border-radius:4px;max-width:90vw;max-height:calc(90vh - 60px)}.viewer-loading{color:var(--text-secondary);text-align:center;padding:60px}@media (width<=600px){.hero h2{font-size:1.6rem}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.space-grid{grid-template-columns:1fr}.album-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.login-card{padding:32px 24px}.hero{padding:48px 0 40px}.features{padding:24px 0 48px}.dashboard-main{padding:24px 0}.store-buttons{flex-direction:column}.dashboard-header{flex-wrap:wrap;gap:8px}.breadcrumb{font-size:.75rem}.user-info{font-size:.8rem}}.storage-bar{background:var(--bg-card);border-radius:var(--radius-sm);align-items:center;gap:10px;margin:16px 0;padding:12px 16px;display:flex}.storage-label{color:var(--text-secondary);white-space:nowrap;font-size:.75rem}.storage-track{background:var(--bg-secondary);border-radius:3px;flex:1;height:6px;overflow:hidden}.storage-fill{border-radius:3px;height:100%;transition:width .3s}.storage-text{color:var(--text-secondary);white-space:nowrap;font-size:.7rem}.policy-notice{background:var(--bg-card);border-radius:var(--radius-sm);border:1px solid var(--border);margin-top:40px;padding:20px}.policy-notice h4{color:var(--text-secondary);margin-bottom:10px;font-size:.8rem;font-weight:600}.policy-notice p{color:var(--text-secondary);margin-bottom:6px;font-size:.75rem;line-height:1.6}.policy-notice p:last-child{margin-bottom:0}