:root{--teal-50: #f0fdfa;--teal-100: #ccfbf1;--teal-200: #99f6e4;--teal-300: #5eead4;--teal-400: #2dd4bf;--teal-500: #14b8a6;--teal-600: #0d9488;--teal-700: #0f766e;--teal-800: #115e59;--teal-900: #134e4a;--gold-300: #fcd34d;--gold-400: #fbbf24;--gold-500: #f59e0b;--cream: #fefdfb;--sand-100: #f5f5f4;--sand-200: #e7e5e4;--sand-400: #a8a29e;--sand-600: #57534e;--sand-800: #292524;--font-display: "Playfair Display", Georgia, serif;--font-body: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--radius-sm: .5rem;--radius-md: 1rem;--radius-lg: 1.5rem;--radius-full: 9999px;--shadow-soft: 0 4px 20px rgba(13, 148, 136, .1);--shadow-medium: 0 8px 30px rgba(13, 148, 136, .15);--shadow-glow: 0 0 40px rgba(13, 148, 136, .2)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-body);background:linear-gradient(135deg,var(--teal-50) 0%,var(--cream) 50%,var(--teal-100) 100%);background-attachment:fixed;color:var(--sand-800);min-height:100vh;min-height:100dvh;line-height:1.6;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 80%,rgba(45,212,191,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(251,191,36,.08) 0%,transparent 40%),radial-gradient(circle at 50% 50%,rgba(13,148,136,.05) 0%,transparent 70%);pointer-events:none;z-index:0}#root{position:relative;z-index:1}.header{padding:var(--space-lg) var(--space-md);text-align:center;position:relative}.header__decoration{font-size:2rem;margin-bottom:var(--space-sm);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.header__title{font-family:var(--font-display);font-size:clamp(2rem,8vw,3.5rem);font-weight:700;color:var(--teal-700);letter-spacing:-.02em;line-height:1.1;margin-bottom:var(--space-xs)}.header__title span{display:inline-block;background:linear-gradient(135deg,var(--gold-400) 0%,var(--gold-500) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header__subtitle{font-size:1rem;color:var(--sand-600);font-weight:400}.stats{display:flex;justify-content:center;gap:var(--space-lg);padding:var(--space-md);margin-bottom:var(--space-md)}.stat{text-align:center}.stat__number{font-family:var(--font-display);font-size:1.75rem;font-weight:600;color:var(--teal-600)}.stat__label{font-size:.75rem;color:var(--sand-400);text-transform:uppercase;letter-spacing:.05em}.nav{display:flex;justify-content:center;gap:var(--space-sm);padding:0 var(--space-md);margin-bottom:var(--space-lg)}.nav__btn{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-full);background:#fff;color:var(--sand-600);font-family:var(--font-body);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-soft)}.nav__btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-medium)}.nav__btn--active{background:linear-gradient(135deg,var(--teal-500) 0%,var(--teal-600) 100%);color:#fff}.nav__btn svg{width:18px;height:18px}.gallery{padding:0 var(--space-sm);padding-bottom:calc(80px + env(safe-area-inset-bottom))}.gallery__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-xs)}@media (min-width: 640px){.gallery__grid{grid-template-columns:repeat(4,1fr);gap:var(--space-sm)}}@media (min-width: 1024px){.gallery__grid{grid-template-columns:repeat(5,1fr)}}.gallery__item{aspect-ratio:1;position:relative;border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;background:var(--sand-100)}.gallery__item img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.gallery__item:hover img{transform:scale(1.05)}.gallery__item--video:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;background:#ffffffe6;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230d9488'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");background-size:20px;background-repeat:no-repeat;background-position:center;box-shadow:var(--shadow-medium)}.gallery__item--selected:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:3px solid var(--teal-500);border-radius:var(--radius-sm);z-index:2}.gallery__item--selected:after{content:"✓";position:absolute;top:var(--space-xs);right:var(--space-xs);width:24px;height:24px;background:var(--teal-500);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;z-index:3}.upload{padding:var(--space-md);padding-bottom:calc(100px + env(safe-area-inset-bottom))}.upload__zone{border:2px dashed var(--teal-300);border-radius:var(--radius-lg);padding:var(--space-2xl);text-align:center;background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s ease;cursor:pointer}.upload__zone:hover,.upload__zone--active{border-color:var(--teal-500);background:#ffffffe6;box-shadow:var(--shadow-glow)}.upload__icon{width:64px;height:64px;margin:0 auto var(--space-md);background:linear-gradient(135deg,var(--teal-100) 0%,var(--teal-200) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center}.upload__icon svg{width:32px;height:32px;color:var(--teal-600)}.upload__text{font-size:1.125rem;font-weight:500;color:var(--sand-800);margin-bottom:var(--space-xs)}.upload__hint{font-size:.875rem;color:var(--sand-400)}.upload__input{display:none}.upload__actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg);justify-content:center}.upload__btn{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-lg);border:none;border-radius:var(--radius-full);font-family:var(--font-body);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.upload__btn--primary{background:linear-gradient(135deg,var(--teal-500) 0%,var(--teal-600) 100%);color:#fff;box-shadow:var(--shadow-medium)}.upload__btn--primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow)}.upload__btn--secondary{background:#fff;color:var(--teal-600);box-shadow:var(--shadow-soft)}.upload__btn svg{width:20px;height:20px}.upload__preview{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-sm);margin-top:var(--space-lg)}.upload__preview-item{aspect-ratio:1;border-radius:var(--radius-sm);overflow:hidden;position:relative;background:var(--sand-100)}.upload__preview-item img,.upload__preview-item video{width:100%;height:100%;object-fit:cover}.upload__preview-remove{position:absolute;top:var(--space-xs);right:var(--space-xs);width:24px;height:24px;border:none;border-radius:50%;background:#0009;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;line-height:1}.queue{margin-top:var(--space-lg);padding:var(--space-md);background:#ffffffb3;border-radius:var(--radius-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.queue__header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.queue__icon{width:20px;height:20px;color:var(--gold-500);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.queue__title{font-weight:600;color:var(--sand-800)}.queue__count{margin-left:auto;padding:var(--space-xs) var(--space-sm);background:var(--gold-300);border-radius:var(--radius-full);font-size:.75rem;font-weight:600;color:var(--sand-800)}.queue__item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm);background:var(--sand-100);border-radius:var(--radius-sm);margin-bottom:var(--space-xs)}.queue__item-thumb{width:40px;height:40px;border-radius:var(--radius-sm);object-fit:cover}.queue__item-name{flex:1;font-size:.875rem;color:var(--sand-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue__item-status{font-size:.75rem;color:var(--sand-400)}.viewer{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2;z-index:100;display:flex;flex-direction:column}.viewer__header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md);padding-top:calc(var(--space-md) + env(safe-area-inset-top))}.viewer__close{width:44px;height:44px;border:none;border-radius:50%;background:#ffffff1a;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}.viewer__close svg{width:24px;height:24px}.viewer__actions{display:flex;gap:var(--space-sm)}.viewer__action{width:44px;height:44px;border:none;border-radius:50%;background:#ffffff1a;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.viewer__action:hover{background:#fff3}.viewer__action svg{width:22px;height:22px}.viewer__content{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--space-md);overflow:hidden}.viewer__media{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--radius-sm)}.viewer__info{padding:var(--space-md);padding-bottom:calc(var(--space-md) + env(safe-area-inset-bottom));color:#fff;text-align:center}.viewer__author{font-size:.875rem;opacity:.7}.viewer__date{font-size:.75rem;opacity:.5}.bottom-bar{position:fixed;bottom:0;left:0;right:0;padding:var(--space-md);padding-bottom:calc(var(--space-md) + env(safe-area-inset-bottom));background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid var(--sand-200);display:flex;justify-content:center;gap:var(--space-sm);z-index:50}.bottom-bar__btn{flex:1;max-width:200px;display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md);border:none;border-radius:var(--radius-full);font-family:var(--font-body);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.bottom-bar__btn--primary{background:linear-gradient(135deg,var(--teal-500) 0%,var(--teal-600) 100%);color:#fff;box-shadow:var(--shadow-medium)}.bottom-bar__btn--primary:hover{transform:translateY(-2px)}.bottom-bar__btn--secondary{background:var(--sand-100);color:var(--sand-600)}.bottom-bar__btn svg{width:20px;height:20px}.toast{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom) + var(--space-md));left:50%;transform:translate(-50%);padding:var(--space-sm) var(--space-lg);background:var(--sand-800);color:#fff;border-radius:var(--radius-full);font-size:.875rem;font-weight:500;z-index:200;animation:toast-in .3s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.toast--success{background:var(--teal-600)}.toast--error{background:#dc2626}.toast--offline{background:var(--gold-500);color:var(--sand-800)}.offline-indicator{position:fixed;top:env(safe-area-inset-top);left:0;right:0;padding:var(--space-sm);background:var(--gold-400);color:var(--sand-800);text-align:center;font-size:.875rem;font-weight:500;z-index:100;display:flex;align-items:center;justify-content:center;gap:var(--space-sm)}.offline-indicator svg{width:18px;height:18px}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-2xl);color:var(--sand-400)}.loading__spinner{width:40px;height:40px;border:3px solid var(--teal-100);border-top-color:var(--teal-500);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:var(--space-md)}@keyframes spin{to{transform:rotate(360deg)}}.empty{text-align:center;padding:var(--space-2xl);color:var(--sand-400)}.empty__icon{font-size:4rem;margin-bottom:var(--space-md);opacity:.5}.empty__text{font-size:1rem;margin-bottom:var(--space-xs);color:var(--sand-600)}.empty__hint{font-size:.875rem}.progress{height:4px;background:var(--sand-200);border-radius:var(--radius-full);overflow:hidden;margin-top:var(--space-sm)}.progress__bar{height:100%;background:linear-gradient(90deg,var(--teal-400),var(--teal-600));border-radius:var(--radius-full);transition:width .3s ease}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:center;justify-content:center;padding:var(--space-md)}.modal{background:#fff;border-radius:var(--radius-lg);padding:var(--space-lg);max-width:400px;width:100%;box-shadow:var(--shadow-medium)}.modal__title{font-family:var(--font-display);font-size:1.5rem;color:var(--teal-700);margin-bottom:var(--space-md)}.modal__input{width:100%;padding:var(--space-md);border:2px solid var(--sand-200);border-radius:var(--radius-md);font-family:var(--font-body);font-size:1rem;transition:border-color .2s}.modal__input:focus{outline:none;border-color:var(--teal-500)}.modal__actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg)}.modal__btn{flex:1;padding:var(--space-md);border:none;border-radius:var(--radius-full);font-family:var(--font-body);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.modal__btn--primary{background:var(--teal-600);color:#fff}.modal__btn--secondary{background:var(--sand-100);color:var(--sand-600)}.qr-display{text-align:center;padding:var(--space-lg)}.qr-display__code{background:#fff;padding:var(--space-md);border-radius:var(--radius-md);display:inline-block;margin-bottom:var(--space-md);box-shadow:var(--shadow-soft)}.qr-display__url{font-size:.875rem;color:var(--sand-400);word-break:break-all}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.viewer__nav{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border:none;border-radius:50%;background:#ffffff26;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.viewer__nav:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.1)}.viewer__nav--prev{left:var(--space-md)}.viewer__nav--next{right:var(--space-md)}.viewer__nav svg{width:28px;height:28px}@media (max-width: 640px){.viewer__nav{width:40px;height:40px}.viewer__nav--prev{left:var(--space-xs)}.viewer__nav--next{right:var(--space-xs)}.viewer__nav svg{width:24px;height:24px}}.viewer__counter{position:absolute;bottom:var(--space-md);left:50%;transform:translate(-50%);padding:var(--space-xs) var(--space-md);background:#0009;color:#fff;border-radius:var(--radius-full);font-size:.875rem;font-weight:500;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.viewer__action--delete{background:#dc262633}.viewer__action--delete:hover{background:#dc262666}.viewer__folder{font-size:.75rem;opacity:.6;margin-top:var(--space-xs)}.viewer__owner-badge{display:inline-flex;align-items:center;gap:var(--space-xs);margin-top:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:#2dd4bf33;color:var(--teal-300);border-radius:var(--radius-full);font-size:.75rem}.gallery__filters{display:flex;gap:var(--space-xs);padding:0 var(--space-sm);margin-bottom:var(--space-md);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.gallery__filters::-webkit-scrollbar{display:none}.gallery__filter{flex-shrink:0;display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border:1px solid var(--sand-200);border-radius:var(--radius-full);background:#fff;color:var(--sand-600);font-family:var(--font-body);font-size:.8rem;cursor:pointer;transition:all .2s ease;white-space:nowrap}.gallery__filter:hover{border-color:var(--teal-300);color:var(--teal-600)}.gallery__filter--active{background:var(--teal-600);border-color:var(--teal-600);color:#fff}.gallery__filter svg{width:14px;height:14px}.gallery__filter-count{padding:1px 6px;background:#0000001a;border-radius:var(--radius-full);font-size:.7rem}.gallery__filter--active .gallery__filter-count{background:#fff3}.gallery__item--owner{box-shadow:inset 0 0 0 2px var(--teal-400)}.gallery__item-owner{position:absolute;bottom:var(--space-xs);right:var(--space-xs);width:20px;height:20px;background:var(--teal-500);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;z-index:2;box-shadow:0 2px 4px #0000004d}.upload__folder{margin-top:var(--space-lg);padding:var(--space-md);background:#ffffffb3;border-radius:var(--radius-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload__folder-label{display:block;font-size:.875rem;font-weight:500;color:var(--sand-600);margin-bottom:var(--space-sm)}.upload__folder-row{display:flex;gap:var(--space-sm);align-items:center}.upload__folder-select{flex:1;padding:var(--space-sm) var(--space-md);border:2px solid var(--sand-200);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.9rem;background:#fff;color:var(--sand-800);cursor:pointer;transition:border-color .2s}.upload__folder-select:focus{outline:none;border-color:var(--teal-500)}.upload__folder-new{width:44px;height:44px;border:2px solid var(--sand-200);border-radius:var(--radius-md);background:#fff;color:var(--teal-600);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.upload__folder-new:hover{border-color:var(--teal-500);background:var(--teal-50)}.upload__folder-new svg{width:22px;height:22px}.upload__folder-input{flex:1;padding:var(--space-sm) var(--space-md);border:2px solid var(--teal-400);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.9rem;background:#fff;color:var(--sand-800)}.upload__folder-input:focus{outline:none;border-color:var(--teal-500)}.upload__folder-input::placeholder{color:var(--sand-400)}.upload__folder-cancel{width:44px;height:44px;border:none;border-radius:var(--radius-md);background:var(--sand-200);color:var(--sand-600);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.upload__folder-cancel:hover{background:var(--sand-300)}.upload__folder-cancel svg{width:20px;height:20px}.install-guide{text-align:center;max-width:360px}.install-guide__icon{width:80px;height:80px;margin:0 auto var(--space-md);background:linear-gradient(135deg,var(--teal-100) 0%,var(--teal-200) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center}.install-guide__icon svg{width:40px;height:40px;color:var(--teal-600)}.install-guide__text{color:var(--sand-600);font-size:.95rem;line-height:1.5;margin-bottom:var(--space-lg)}.install-guide__steps{text-align:left;background:var(--sand-100);border-radius:var(--radius-md);padding:var(--space-md);margin-bottom:var(--space-lg)}.install-guide__step{display:flex;align-items:flex-start;gap:var(--space-sm);padding:var(--space-sm) 0;font-size:.9rem;color:var(--sand-800);line-height:1.4}.install-guide__step:not(:last-child){border-bottom:1px solid var(--sand-200)}.install-guide__step-num{flex-shrink:0;width:24px;height:24px;background:var(--teal-500);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600}.install-guide__ios-icon{display:inline-block;font-size:1rem}