:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.photo-grid{padding:20px;width:100%;box-sizing:border-box}.thumbnails-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;padding:20px 0;box-sizing:border-box}.thumbnail-item{position:relative;cursor:pointer;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #00000014;transition:transform .2s ease,box-shadow .2s ease;background-color:#f7fafc;border:2px solid transparent}.thumbnail-item:hover{transform:translateY(-4px);box-shadow:0 8px 24px #38b2ac33;border-color:#38b2ac}.delete-photo-button{position:absolute;top:8px;right:8px;background:#dc3545e6;color:#fff;border:none;border-radius:50%;width:36px;height:36px;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10;transition:all .2s ease;opacity:0;transform:scale(.8)}.thumbnail-item:hover .delete-photo-button{opacity:1;transform:scale(1)}.delete-photo-button:hover{background:#dc3545;transform:scale(1.1)}.thumbnail-image{width:100%;height:200px;object-fit:cover;display:block}.modal-overlay{position:fixed;inset:0;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{position:relative;max-width:90vw;max-height:90vh;display:flex;justify-content:center;align-items:center;width:auto;height:auto}.modal-image{max-width:90vw;max-height:90vh;width:auto;height:auto;object-fit:contain;border-radius:8px;display:block}.close-button{position:absolute;top:-40px;right:0;border:none;color:#fff;font-size:36px;cursor:pointer;padding:0;width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;transition:background-color .2s ease}.close-button:hover{background-color:#fff3}.download-button{position:absolute;top:-40px;right:50px;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0;width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;transition:background-color .2s ease}.download-button:hover{background-color:#fff3}.nav-button{position:absolute;top:50%;transform:translateY(-50%);background:#38b2ace6;border:none;color:#fff;font-size:36px;cursor:pointer;padding:10px 15px;border-radius:50%;width:60px;height:60px;display:flex;justify-content:center;align-items:center;transition:all .2s ease;z-index:1001;box-shadow:0 4px 12px #38b2ac4d}.nav-button:hover{background:#38b2ac;transform:translateY(-1) scale(1.1);box-shadow:0 6px 16px #38b2ac66}.nav-button-prev{left:20px;border-radius:50%!important}.nav-button-next{right:20px;border-radius:50%!important}.photo-counter{position:absolute;bottom:-50px;left:50%;transform:translate(-50%);color:#fff;font-size:16px;font-weight:500;background:#000000b3;padding:8px 16px;border-radius:20px}.slideshow-container{position:fixed;inset:0;background-color:#000;z-index:2000;display:flex;justify-content:center;align-items:center}.slideshow-content{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.slideshow-exit{position:absolute;top:20px;right:20px;background:#38b2ace6;border:none;color:#fff;font-size:16px;font-weight:500;cursor:pointer;padding:10px 20px;border-radius:8px;transition:all .3s ease;z-index:2001;box-shadow:0 4px 12px #38b2ac4d}.slideshow-exit:hover{background:#38b2ac;transform:translateY(-1px);box-shadow:0 6px 16px #38b2ac66}.slideshow-exit.visible{opacity:1;pointer-events:auto}.slideshow-exit.hidden{opacity:0;pointer-events:none}.slideshow-image-container{position:relative;width:90vw;height:90vh;display:flex;justify-content:center;align-items:center}@keyframes kenBurnsZoomIn{0%{transform:scale(1) translate(0)}to{transform:scale(1.1) translate(-2%,-2%)}}@keyframes kenBurnsZoomOut{0%{transform:scale(1.1) translate(2%,2%)}to{transform:scale(1) translate(0)}}@keyframes kenBurnsPanLeft{0%{transform:scale(1.05) translate(2%)}to{transform:scale(1.1) translate(-2%)}}@keyframes kenBurnsPanRight{0%{transform:scale(1.05) translate(-2%)}to{transform:scale(1.1) translate(2%)}}.slideshow-image{position:absolute;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease-in-out;transform-origin:center}.slideshow-image.active{opacity:1;animation-duration:3s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}.slideshow-image.active:nth-child(4n+1){animation-name:kenBurnsZoomIn}.slideshow-image.active:nth-child(4n+2){animation-name:kenBurnsZoomOut}.slideshow-image.active:nth-child(4n+3){animation-name:kenBurnsPanLeft}.slideshow-image.active:nth-child(4n+4){animation-name:kenBurnsPanRight}.slideshow-counter{position:absolute;bottom:40px;left:50%;transform:translate(-50%);color:#fff;font-size:18px;font-weight:500;background:#000000b3;padding:10px 20px;border-radius:25px;z-index:2001;transition:all .3s ease}.slideshow-counter.visible{opacity:1}.slideshow-counter.hidden{opacity:0}.delete-confirmation-overlay{position:fixed;inset:0;background-color:#000000bf;display:flex;justify-content:center;align-items:center;z-index:3000}.delete-confirmation-dialog{background:#fff;border-radius:12px;padding:24px;max-width:400px;width:90%;text-align:center;box-shadow:0 8px 32px #0000004d}.delete-confirmation-dialog h3{margin:0 0 16px;color:#2d3748;font-size:1.25rem;font-weight:600}.delete-confirmation-dialog p{margin:0 0 24px;color:#4a5568;line-height:1.5}.delete-confirmation-buttons{display:flex;gap:12px;justify-content:center}.delete-cancel-button,.delete-confirm-button{padding:10px 20px;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:80px}.delete-cancel-button{background:#e2e8f0;color:#4a5568}.delete-cancel-button:hover{background:#cbd5e0}.delete-confirm-button{background:#e53e3e;color:#fff}.delete-confirm-button:hover{background:#c53030;transform:translateY(-1px)}@media (max-width: 768px){.thumbnails-container{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.thumbnail-image{height:150px}.close-button{top:-50px;right:-10px}.download-button{top:-50px;right:40px;font-size:20px;width:35px;height:35px}.nav-button{font-size:28px;width:50px;height:50px;padding:8px 12px}.nav-button-prev{left:10px}.nav-button-next{right:10px}.photo-counter{font-size:14px;padding:6px 12px}.delete-confirmation-dialog{padding:20px;margin:0 16px}.delete-confirmation-buttons{flex-direction:column}.delete-cancel-button,.delete-confirm-button{width:100%}}.album-view{flex:1;background-color:#f5f7fa}.album-header{background:linear-gradient(135deg,#fff,#f7fafc);padding:30px 20px;border-bottom:1px solid #e2e8f0;text-align:center;box-shadow:0 2px 8px #0000000d;position:relative}.album-title{font-size:2.5rem;font-weight:600;color:#2d3748;margin:0 0 15px}.album-description{font-size:1.1rem;color:#4a5568;max-width:600px;margin:0 auto 20px}.album-meta{display:flex;justify-content:center;gap:30px;font-size:.9rem;color:#4a5568}.photo-count{font-weight:500}.loading{display:flex;justify-content:center;align-items:center;height:50vh;font-size:1.2rem;color:#6c757d}.error-message{display:flex;justify-content:center;align-items:center;height:50vh;font-size:1.2rem;color:#dc3545;text-align:center}.password-dialog{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;padding:40px 20px}.password-dialog h2{font-size:2rem;color:#2c3e50;margin-bottom:15px}.password-dialog p{font-size:1.1rem;color:#6c757d;margin-bottom:30px;text-align:center;max-width:400px}.password-dialog form{display:flex;flex-direction:column;gap:15px;width:100%;max-width:300px}.password-input{padding:12px 16px;border:2px solid #dee2e6;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.password-input:focus{outline:none;border-color:#007bff}.submit-button{padding:12px 24px;background-color:#007bff;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .2s ease}.submit-button:hover{background-color:#0056b3}.album-controls-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:20px;gap:20px}.album-info-left{display:flex;flex-direction:column;gap:4px;text-align:left}.slideshow-center{display:flex;justify-content:center}.slideshow-button{background:linear-gradient(135deg,#38b2ac,#319795);color:#fff;border:none;padding:10px 20px;font-size:14px;font-weight:500;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px;box-shadow:0 2px 8px #38b2ac4d}.slideshow-button:hover:not(:disabled){background:linear-gradient(135deg,#319795,#2c7a7b);transform:translateY(-1px);box-shadow:0 4px 12px #38b2ac66}.slideshow-button:disabled{background:#a0aec0;cursor:not-allowed;box-shadow:none;transform:none}.sharing-buttons{display:flex;justify-content:flex-end;gap:10px}.share-button{width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;font-size:18px;font-weight:700;color:#fff;transition:all .2s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #00000026}.share-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.share-button.email{background:linear-gradient(135deg,#38b2ac,#319795);font-size:18px;width:48px;height:48px;line-height:1}.share-button.facebook,.share-button.twitter{background:linear-gradient(135deg,#38b2ac,#319795)}@media (max-width: 768px){.album-title{font-size:2rem}.album-controls-row{grid-template-columns:1fr;gap:15px;text-align:center}.album-info-left{text-align:center}.sharing-buttons{justify-content:center}.album-header{padding:20px 15px}.sharing-buttons{top:15px;right:15px;gap:8px}.share-button{width:36px;height:36px;font-size:16px}.share-button.email{font-size:16px;width:36px;height:36px}}.app-footer{background-color:#f8f9fa;border-top:1px solid #e9ecef;padding:24px 20px;margin-top:auto;text-align:center}.footer-text{margin:0;color:#6c757d;font-size:.9rem}@media (max-width: 768px){.app-footer{padding:20px 15px}.footer-text{font-size:.8rem}}.albums-container{flex:1;background-color:#f5f7fa;padding:20px}.albums-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;padding:0 20px}.albums-header h1{font-size:2.5rem;font-weight:600;color:#2d3748;margin:0;background:linear-gradient(135deg,#38b2ac,#319795);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.logout-button{background:linear-gradient(135deg,#e53e3e,#c53030);color:#fff;border:none;padding:10px 20px;font-size:.9rem;font-weight:500;border-radius:6px;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #e53e3e4d}.logout-button:hover{background:linear-gradient(135deg,#c53030,#9c2e2e);transform:translateY(-1px);box-shadow:0 4px 12px #e53e3e66}.loading-state,.error-state,.empty-state{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;text-align:center}.loading-spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-left:4px solid #38b2ac;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{to{transform:rotate(360deg)}}.loading-state p,.error-state p,.empty-state p{color:#4a5568;font-size:1.1rem;margin:0}.empty-state h2{color:#2d3748;font-size:1.8rem;margin:0 0 10px}.retry-button{background:linear-gradient(135deg,#38b2ac,#319795);color:#fff;border:none;padding:10px 20px;font-size:1rem;font-weight:500;border-radius:6px;cursor:pointer;transition:all .2s ease;margin-top:20px;box-shadow:0 2px 8px #38b2ac4d}.retry-button:hover{background:linear-gradient(135deg,#319795,#2c7a7b);transform:translateY(-1px);box-shadow:0 4px 12px #38b2ac66}.albums-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;padding:0 20px;max-width:1400px;margin:0 auto}.album-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px #00000014;transition:all .3s ease;cursor:pointer;border:2px solid transparent}.album-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #38b2ac26;border-color:#38b2ac}.album-thumbnail{position:relative;width:100%;height:200px;overflow:hidden;background:linear-gradient(135deg,#f7fafc,#edf2f7)}.album-image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.album-card:hover .album-image{transform:scale(1.05)}.album-placeholder{display:flex;justify-content:center;align-items:center;width:100%;height:100%;font-size:3rem;color:#a0aec0;background:linear-gradient(135deg,#f7fafc,#edf2f7)}.album-info{padding:20px}.album-title{font-size:1.3rem;font-weight:600;color:#2d3748;margin:0 0 8px;line-height:1.3}.album-description{color:#4a5568;font-size:.9rem;margin:0 0 12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.album-meta{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:#718096;gap:10px}.photo-count{font-weight:500;color:#38b2ac}.created-date{font-style:italic}@media (max-width: 768px){.albums-container{padding:15px}.albums-header{flex-direction:column;gap:20px;margin-bottom:30px;text-align:center}.albums-header h1{font-size:2rem}.albums-grid{grid-template-columns:1fr;gap:20px;padding:0}.album-card{border-radius:12px}.album-thumbnail{height:180px}.album-info{padding:16px}.album-meta{flex-direction:column;align-items:flex-start;gap:4px}}.login-container{min-height:100vh;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);display:flex;justify-content:center;align-items:center;padding:20px}.login-content{background:#fff;border-radius:16px;padding:40px;box-shadow:0 10px 40px #0000001a;width:100%;max-width:400px;border:1px solid #e2e8f0}.login-header{text-align:center;margin-bottom:30px}.login-header h1{font-size:2.5rem;font-weight:600;color:#2d3748;margin:0 0 10px;background:linear-gradient(135deg,#38b2ac,#319795);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.login-header p{color:#4a5568;font-size:1.1rem;margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:500;color:#2d3748;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.form-input{padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .2s ease;background-color:#f7fafc}.form-input:focus{outline:none;border-color:#38b2ac;background-color:#fff;box-shadow:0 0 0 3px #38b2ac1a}.form-input::placeholder{color:#a0aec0}.login-button{background:linear-gradient(135deg,#38b2ac,#319795);color:#fff;border:none;padding:14px 24px;font-size:1rem;font-weight:500;border-radius:8px;cursor:pointer;transition:all .2s ease;margin-top:10px;box-shadow:0 4px 12px #38b2ac4d}.login-button:hover:not(:disabled){background:linear-gradient(135deg,#319795,#2c7a7b);transform:translateY(-1px);box-shadow:0 6px 16px #38b2ac66}.login-button:disabled{background:#a0aec0;cursor:not-allowed;transform:none;box-shadow:none}.error-message{background-color:#fed7d7;color:#e53e3e;padding:12px 16px;border-radius:8px;font-size:.9rem;border:1px solid #feb2b2}.login-footer{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #e2e8f0}.login-footer p{color:#4a5568;font-size:.9rem;margin:0}@media (max-width: 480px){.login-content{padding:30px 20px;margin:10px}.login-header h1{font-size:2rem}.login-header p{font-size:1rem}}.app{min-height:100vh;background-color:#f5f7fa;width:100%;display:flex;flex-direction:column}.app-header{background:linear-gradient(135deg,#38b2ac,#2c7a7b);color:#fff;padding:20px;text-align:center;box-shadow:0 4px 12px #38b2ac4d;position:relative;display:flex;align-items:center;justify-content:center;min-height:80px}.app-icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:48px;height:48px;transition:opacity .2s ease}.app-header a{display:inline-block;line-height:0}.app-header a:hover .app-icon{opacity:.8}.app-header h1{margin:0;font-size:2.5rem;font-weight:600}.nav-buttons{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;gap:8px;z-index:10}.nav-button{background:linear-gradient(135deg,#38b2ac,#319795);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;display:flex;align-items:center;gap:6px;white-space:nowrap;min-width:auto;flex-shrink:0;box-shadow:0 2px 8px #38b2ac4d}.nav-button:hover{background:linear-gradient(135deg,#319795,#2c7a7b);transform:translateY(-1);box-shadow:0 4px 12px #38b2ac66}.nav-button.logout:hover{background:linear-gradient(135deg,#dc3545,#c82333);box-shadow:0 4px 12px #dc354566}.error-message{display:flex;justify-content:center;align-items:center;height:50vh;font-size:1.2rem;color:#4a5568;text-align:center}@media (max-width: 768px){.app-header{padding:15px;min-height:60px}.app-header h1{font-size:1.8rem}.app-icon{width:36px;height:36px;left:10px}.nav-buttons{right:80px;gap:4px}.nav-button{padding:6px 12px;font-size:12px;gap:4px}}@media (max-width: 480px){.app-header h1{font-size:1.5rem}.nav-buttons{right:60px;gap:3px}.nav-button{padding:5px 10px;font-size:11px}}