.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.auth-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;width:100%;max-width:440px;padding:48px 40px}.auth-header{text-align:center;margin-bottom:40px}.auth-icon{width:64px;height:64px;color:#667eea;margin:0 auto 20px}.auth-header h1{font-size:32px;font-weight:700;color:#1a202c;margin-bottom:8px}.auth-header p{color:#718096;font-size:16px}.auth-form,.form-group{margin-bottom:24px}.form-group label{display:block;margin-bottom:8px;color:#4a5568;font-weight:500;font-size:14px}.form-group input{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:16px;transition:all .2s}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{background-color:#f7fafc;cursor:not-allowed}.btn-primary{width:100%;padding:14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:16px;font-weight:600;transition:transform .2s,box-shadow .2s}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.error-message{background-color:#fed7d7;color:#c53030;padding:12px 16px;border-radius:8px;margin-bottom:24px;font-size:14px}.auth-footer{text-align:center;color:#718096;font-size:14px}.auth-footer a{color:#667eea;font-weight:600}.auth-footer a:hover{text-decoration:underline}.layout{display:flex;min-height:100vh}.sidebar{width:280px;background:linear-gradient(180deg,#667eea,#764ba2);color:#fff;display:flex;flex-direction:column;padding:32px 24px;box-shadow:2px 0 12px #0000001a}.sidebar-header{display:flex;align-items:center;gap:12px;margin-bottom:48px}.sidebar-logo{width:40px;height:40px}.sidebar-header h2{font-size:24px;font-weight:700}.nav-list{list-style:none;flex:1}.nav-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:8px;margin-bottom:8px;transition:background .2s;color:#ffffffe6}.nav-item:hover{background:#ffffff26}.nav-item.active{background:#ffffff40;color:#fff;font-weight:600}.nav-icon{font-size:20px}.nav-label{font-size:16px}.logout-btn{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:8px;background:#0003;color:#fff;width:100%;transition:background .2s}.logout-btn:hover{background:#0000004d}.main-content{flex:1;background:#f7fafc;overflow-y:auto}@media(max-width:768px){.sidebar{width:80px;padding:24px 16px}.sidebar-header h2,.nav-label{display:none}.sidebar-logo{margin:0 auto}}.dashboard{padding:40px;max-width:1400px;margin:0 auto}.dashboard h1{font-size:36px;margin-bottom:32px;color:#1a202c}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-bottom:48px}.stat-card{background:#fff;border-radius:12px;padding:32px;text-align:center;box-shadow:0 2px 8px #0000001a;transition:transform .2s,box-shadow .2s}.stat-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.stat-card-action{cursor:pointer;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.stat-icon{font-size:48px;margin-bottom:16px}.stat-value{font-size:48px;font-weight:700;color:#667eea;margin-bottom:8px}.stat-card-action .stat-value,.stat-card-action .stat-label{color:#fff}.stat-label{font-size:16px;color:#718096;font-weight:500}.section{margin-bottom:48px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.section-header h2{font-size:24px;color:#1a202c}.link{color:#667eea;font-weight:600;transition:color .2s}.link:hover{color:#764ba2}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.photo-card{aspect-ratio:1;border-radius:8px;overflow:hidden;background:#f7fafc;cursor:pointer;transition:transform .2s}.photo-card:hover{transform:scale(1.05)}.photo-card img{width:100%;height:100%;object-fit:cover}.empty-state{text-align:center;padding:64px 32px;background:#fff;border-radius:12px}.empty-state p{color:#718096;font-size:18px;margin-bottom:24px}.loading{text-align:center;padding:64px;font-size:18px;color:#718096}.photos-page{padding:40px;max-width:1400px;margin:0 auto}.photos-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.photos-header h1{font-size:36px;color:#1a202c}.photos-count{color:#718096;font-size:18px}.photos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}.photo-item{background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 8px #0000001a}.photo-item:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.photo-item img{width:100%;aspect-ratio:1;object-fit:cover}.photo-title{padding:16px;font-weight:600;color:#1a202c}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:16px;max-width:900px;max-height:90vh;overflow:auto;position:relative}.modal-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;background:#00000080;color:#fff;font-size:24px;z-index:1}.modal-close:hover{background:#000000b3}.modal-content img{width:100%;display:block}.modal-info{padding:24px}.modal-info h3{font-size:24px;margin-bottom:12px;color:#1a202c}.modal-info p{color:#718096;margin-bottom:24px}.btn-danger{background:#e53e3e;color:#fff;padding:12px 24px;border-radius:8px;font-weight:600;transition:background .2s}.btn-danger:hover{background:#c53030}.albums-page{padding:40px;max-width:1400px;margin:0 auto}.albums-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.albums-header h1{font-size:36px;color:#1a202c}.albums-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}.album-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;transition:transform .2s,box-shadow .2s}.album-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.album-cover{height:200px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center}.album-preview{font-size:64px;opacity:.9}.album-empty{color:#fff;font-size:18px;opacity:.7}.album-info{padding:20px}.album-info h3{font-size:20px;margin-bottom:8px;color:#1a202c}.album-info p{color:#718096;font-size:14px;margin-bottom:12px;line-height:1.5}.album-meta{color:#a0aec0;font-size:14px;margin-bottom:12px}.btn-danger-small{background:#f56565;color:#fff;padding:8px 16px;border-radius:6px;font-size:14px;border:none;cursor:pointer;transition:background .2s}.btn-danger-small:hover{background:#e53e3e}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:12px;padding:32px;max-width:500px;width:90%;max-height:90vh;overflow-y:auto}.modal-content h2{font-size:24px;margin-bottom:24px;color:#1a202c}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#1a202c;font-weight:500}.form-group input,.form-group textarea{width:100%;padding:12px;border:1px solid #cbd5e0;border-radius:8px;font-size:16px;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.btn-secondary{background:#e2e8f0;color:#1a202c;padding:12px 24px;border-radius:8px;border:none;cursor:pointer;font-size:16px;font-weight:600;transition:background .2s}.btn-secondary:hover{background:#cbd5e0}.empty-state{text-align:center;padding:80px 20px;color:#718096}.empty-state p{font-size:18px;margin-bottom:24px}.upload-page{padding:40px;max-width:900px;margin:0 auto}.upload-page h1{font-size:36px;margin-bottom:32px;color:#1a202c}.upload-container{background:#fff;border-radius:16px;padding:48px;box-shadow:0 2px 8px #0000001a}.upload-area{border:3px dashed #cbd5e0;border-radius:12px;padding:64px 32px;text-align:center;transition:all .3s}.upload-area:hover{border-color:#667eea;background:#f7fafc}.upload-area.dragging{border-color:#667eea;background:#edf2f7;transform:scale(1.02)}.file-input{display:none}.file-label{cursor:pointer;display:block}.upload-icon{font-size:64px;margin-bottom:16px}.upload-text{font-size:20px;font-weight:600;color:#1a202c;margin-bottom:8px}.upload-hint{color:#718096;font-size:14px}.files-list{margin-top:32px}.files-list h3{font-size:18px;margin-bottom:16px;color:#1a202c}.file-item{background:#f7fafc;padding:16px;border-radius:8px;margin-bottom:12px}.file-item span{display:block;margin-bottom:8px;color:#1a202c}.progress-bar{height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s}.files-list .btn-primary{margin-top:24px;width:100%;padding:16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:16px;font-weight:600;transition:transform .2s,box-shadow .2s}.files-list .btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.files-list .btn-primary:disabled{opacity:.6;cursor:not-allowed}.app{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5}#root{min-height:100vh}button{cursor:pointer;border:none;background:none;font-family:inherit}input{font-family:inherit}a{text-decoration:none;color:inherit}