:root{color-scheme:dark;--bg: #0a0a10;--surface: #16161f;--surface-2: #1e1e2a;--text: #f4f4f7;--muted: #9797a6;--accent: #7c5cff;--accent-2: #ff5cb8;--accent-rgb: 124, 92, 255;--accent2-rgb: 255, 92, 184;--glow-intensity: 1;--gradient-accent: linear-gradient(135deg, var(--accent), var(--accent-2));--danger: #e5484d;--bar-bg: #131b2e;--warn: #ffa94d;--accent-muted: #b9a8f5;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(circle at 12% 0%,rgba(var(--accent-rgb),calc(var(--glow-intensity) * .16)),transparent 45%),radial-gradient(circle at 88% 12%,rgba(var(--accent2-rgb),calc(var(--glow-intensity) * .12)),transparent 40%),var(--bg);background-attachment:fixed;color:var(--text)}button{font:inherit}.btn{background:var(--surface-2);color:#e7e3ff;font-weight:600;letter-spacing:.01em;border:1px solid #2c2c38;border-radius:10px;padding:.55em 1.1em;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .1s ease,box-shadow .15s ease}.btn:hover:not(:disabled){background:#26262f;border-color:#3a3a48}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--gradient-accent);border-color:transparent;font-weight:600;box-shadow:0 6px 18px rgba(var(--accent-rgb),.35)}.btn-primary:hover:not(:disabled){box-shadow:0 8px 22px rgba(var(--accent-rgb),.5);filter:brightness(1.06)}.btn-danger{background:transparent;border-color:var(--danger);color:var(--danger)}.btn-danger:hover:not(:disabled){background:#e5484d1f}.icon-btn{background:transparent;border:none;color:var(--text);font-size:1.2rem;cursor:pointer;padding:.25em .5em;border-radius:8px;transition:background-color .15s ease}.icon-btn:hover:not(:disabled){background:#ffffff14}.icon-btn:disabled{opacity:.3}.download-progress-btn{display:inline-flex;align-items:center;gap:.35em;font-size:.85rem}.download-progress-pct{font-size:.75em;color:var(--muted);font-variant-numeric:tabular-nums}.muted{color:var(--muted);font-size:.9em}.muted.small{font-size:.75em}.error-text{color:var(--danger)}.error-text.small{font-size:.8em}.error-banner{background:#e5484d14;border:1px solid rgba(229,72,77,.3);border-radius:10px;padding:.6rem .8rem;margin-bottom:1rem}.error-banner p{margin:.2rem 0}.login-screen{display:flex;justify-content:center;min-height:100%;height:auto;overflow-y:auto;padding:1.5rem;background:radial-gradient(circle at 30% 15%,rgba(var(--accent-rgb),calc(var(--glow-intensity) * .35)),transparent 45%),radial-gradient(circle at 75% 30%,rgba(var(--accent2-rgb),calc(var(--glow-intensity) * .25)),transparent 40%),radial-gradient(circle at 50% 90%,rgba(var(--accent-rgb),calc(var(--glow-intensity) * .15)),transparent 50%),var(--bg)}.login-content{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:420px;padding:1.5rem 0}.login-card{max-width:420px;text-align:center}.login-features{width:100%;text-align:left;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:1.25rem 1.5rem}.login-features h3{margin:0 0 .75rem;font-size:1rem;color:var(--text)}.login-features ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.6rem}.login-features li{font-size:.9rem;color:var(--muted)}.login-footer-links{margin:1rem 0 0;font-size:.8rem;text-align:center}.login-footer-links a{color:var(--accent)}.app-logo{width:76px;height:76px;margin:0 auto 1rem;object-fit:contain;display:block;filter:drop-shadow(0 12px 24px rgba(var(--accent-rgb),.45))}.app-title-gradient{margin-bottom:0;background:var(--gradient-accent);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:2rem}.login-card h2{font-size:1.1rem;font-weight:500;color:var(--muted)}.fine-print{font-size:.75em;color:var(--muted);margin-top:1.5rem}.app-shell{display:flex;flex-direction:column;height:100%}.app-body{display:flex;flex:1;min-height:0}.app-content-wrap{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}.app-content{flex:1;overflow-y:auto;padding:1rem;padding-bottom:0}.app-content.no-padding{padding:0;overflow:hidden}.desktop-sidebar{display:none}.bottom-nav{display:flex;justify-content:space-around;border-top:1px solid #24242e;background:var(--bar-bg)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:.15rem;color:var(--muted);text-decoration:none;padding:.6rem;flex:1;text-align:center;font-size:.8rem}.bottom-nav a .nav-icon{font-size:1.15rem}.bottom-nav a.active{color:var(--text)}.app-topbar{display:flex;align-items:center;justify-content:space-between;padding:.6rem .8rem;margin:-.25rem -.25rem .75rem;background:var(--bar-bg);border-radius:12px}.app-topbar-brand{display:flex;align-items:center;gap:.5rem}.app-topbar-logo{width:32px;height:32px;object-fit:contain;display:block;filter:drop-shadow(0 4px 10px rgba(var(--accent-rgb),.4))}.app-topbar-title{font-weight:800;font-size:1.2rem;background:var(--gradient-accent);-webkit-background-clip:text;background-clip:text;color:transparent}.app-topbar-avatar{width:30px;height:30px;border-radius:50%;object-fit:cover;border:1px solid #2c2c38}.photo-viewer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;background:#06060aeb;display:flex;align-items:center;justify-content:center;padding:2rem}.photo-viewer-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}.photo-viewer-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;border:none;background:#ffffff1f;color:#fff;font-size:1rem;cursor:pointer}.offline-banner{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;text-align:center;font-size:.78rem;font-weight:600;color:var(--warn);background:#ffa94d1f;padding:.4rem .8rem;border-bottom:1px solid rgba(255,169,77,.25)}.offline-banner-reconnect{padding:.2rem .7rem;border-radius:999px;border:1px solid rgba(255,169,77,.5);background:#ffa94d26;color:var(--warn);font-size:.75rem;font-weight:700;cursor:pointer}.offline-banner-reconnect:disabled{opacity:.6;cursor:default}.library-header{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.header-hint{width:100%;overflow:hidden;position:relative;height:1.6rem;margin:.4rem 0 .2rem}.header-hint-text{position:absolute;top:50%;left:100%;transform:translateY(-50%);white-space:nowrap;color:var(--warn);font-size:1rem;font-weight:600;animation:hint-marquee 16s linear infinite}@keyframes hint-marquee{0%{left:100%}to{left:-100%}}.library-header h1{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:default}.library-header-actions{display:flex;gap:.5rem;flex-wrap:wrap}.library-toolbar{display:flex;gap:.5rem;margin:.5rem 0;flex-wrap:wrap}.connected-folders{display:flex;gap:.4rem;flex-wrap:wrap;margin:.4rem 0}.folder-chip{display:inline-flex;align-items:center;gap:.35rem;background:var(--surface, rgba(255,255,255,.06));border:1px solid var(--border, rgba(255,255,255,.12));border-radius:999px;padding:.25em .5em .25em .7em;font-size:.85rem;color:var(--muted);transition:background .2s,border-color .2s,color .2s}.folder-chip-broken{background:#0000004d;border-color:#ffa94d4d;color:#ffffff59}.folder-chip-broken .folder-chip-reconnect{color:var(--warn, #ffa94d)}.folder-chip-remove,.folder-chip-reconnect{background:none;border:none;color:var(--muted);cursor:pointer;font-size:1rem;line-height:1;padding:0 .2em}.folder-chip-remove:hover{color:var(--text, #fff)}.folder-chip-reconnect{font-size:.85rem}.folder-chip-reconnect:hover{color:var(--accent, var(--text))}.folder-chip-reconnect:disabled{opacity:.5;cursor:default}.folder-chip-add{display:inline-flex;align-items:center;background:none;border:1px dashed var(--border, rgba(255,255,255,.2));border-radius:999px;padding:.25em .7em;font-size:.85rem;color:var(--muted);cursor:pointer}.folder-chip-add:hover{color:var(--text);border-color:var(--muted)}.folder-chip-add:disabled{opacity:.5;cursor:default}.search-input{width:100%;padding:.6em .8em;margin:.75rem 0;border-radius:8px;border:1px solid #2c2c38;background:var(--surface-2);color:var(--text)}.search-box{position:relative;margin:.6rem 0 .75rem}.search-box .search-input{margin:0;padding-left:2.2rem;border-radius:999px;font-size:.9rem}.search-box-icon{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);font-size:.85rem;opacity:.55;pointer-events:none}.tabs{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.tab{background:none;border:none;color:var(--muted);padding:.4em .8em;border-radius:999px;cursor:pointer;transition:background-color .15s ease,color .15s ease}.tab:hover{color:var(--text)}.tab.active{background:rgba(var(--accent-rgb),.22);color:var(--text)}.tab-hide-all{margin-left:auto;border:1px dashed #2c2c38;font-size:.85rem}.tab-hide-all:hover{border-color:var(--muted)}.empty-state{text-align:center;padding:3rem 1rem}.library-list{display:flex;flex-direction:column;gap:.25rem}.library-item{display:flex;align-items:center;justify-content:space-between;border-radius:10px;padding:.4rem}.library-item.active{background:rgba(var(--accent-rgb),.14);box-shadow:inset 3px 0 0 var(--accent)}.library-item-highlight{animation:library-item-pulse 1.3s ease-in-out 2;border-radius:10px}@keyframes library-item-pulse{0%,to{background:transparent;box-shadow:none}50%{background:rgba(var(--accent-rgb),.22);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.4)}}.item-actions{display:flex;align-items:center;gap:.25rem;flex-shrink:0;flex-wrap:nowrap}.library-item-checkbox{flex-shrink:0;width:18px;height:18px;accent-color:var(--accent);cursor:pointer}.library-item-main{display:flex;align-items:center;gap:.75rem;background:none;border:none;color:inherit;text-align:left;flex:1;min-width:0;cursor:pointer;padding:.25rem}.thumb{position:relative;width:44px;height:44px;border-radius:8px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.thumb img{width:100%;height:100%;object-fit:cover}.thumb-playing-badge{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0a0a108c;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.eq-bars{display:inline-flex;align-items:flex-end;gap:2px}.eq-bars span{display:block;height:100%;width:3px;background:var(--gradient-accent);border-radius:2px;transform-origin:bottom;transform:scaleY(.25);animation:eq-bounce 1s ease-in-out infinite;animation-play-state:paused}.eq-bars.playing span{animation-play-state:running}.eq-bars.eq-sm{height:14px}.eq-bars.eq-md{height:20px}.eq-bars span:nth-child(1){animation-duration:.9s}.eq-bars span:nth-child(2){animation-duration:1.15s;animation-delay:.15s}.eq-bars span:nth-child(3){animation-duration:.8s;animation-delay:.3s}.eq-bars span:nth-child(4){animation-duration:1.05s;animation-delay:.05s}@keyframes eq-bounce{0%,to{transform:scaleY(.25)}50%{transform:scaleY(1)}}.file-input-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}.spinner{display:inline-block;border:2px solid rgba(255,255,255,.25);border-top-color:var(--accent-2);border-radius:50%;animation:spin .7s linear infinite}.spinner-sm{width:14px;height:14px}.spinner-md{width:20px;height:20px}@keyframes spin{to{transform:rotate(360deg)}}.meta{min-width:0}.title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.artist{color:var(--accent-muted);font-size:.85em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.download-progress{font-size:.75em;color:var(--muted)}.player-bar{position:relative;display:flex;flex-direction:column;gap:.3rem;padding:.5rem .75rem;background:linear-gradient(180deg,var(--surface-2),var(--surface));border-top:1px solid #2c2c38;cursor:pointer;overflow:hidden}.player-bar-main{display:flex;align-items:center;gap:.75rem}.player-bar-volume{display:flex;align-items:center;gap:.5rem;padding-left:56px}.player-bar-volume-icon{font-size:.8rem;flex-shrink:0;opacity:.8}.player-bar-progress{position:absolute;top:0;left:0;height:2px;background:var(--gradient-accent);transition:width .2s linear}.player-bar-thumb{position:relative;width:44px;height:44px;border-radius:8px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;box-shadow:0 2px 8px #0000004d}.player-bar-thumb img{width:100%;height:100%;object-fit:cover}.mini-eq-badge{position:absolute;bottom:2px;right:2px;background:#0a0a10a6;border-radius:4px;padding:2px 3px;display:flex}.player-bar-meta{min-width:0;flex:1}.player-bar-meta .title{font-weight:600}.player-bar-meta .artist{color:var(--accent-muted);font-size:.85em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-bar-controls{display:flex;align-items:center;gap:.25rem;flex-shrink:0}.player-bar-controls .play-btn{font-size:1.6rem}.now-playing-page{position:relative;height:100%;display:flex;flex-direction:column;padding:.5rem 1.5rem 1.5rem;background:radial-gradient(circle at 50% 0%,var(--surface-2),var(--bg) 70%);overflow:hidden}.now-playing-backdrop{position:absolute;top:-10%;right:-10%;bottom:-10%;left:-10%;background-size:cover;background-position:center;filter:blur(40px) saturate(1.4) brightness(.55);transform:scale(1.15);z-index:0}.now-playing-topbar,.now-playing-art-wrap,.video-window,.now-playing-meta,.now-playing-progress,.now-playing-transport,.now-playing-download{position:relative;z-index:1}.now-playing-topbar{display:flex;align-items:center;padding:.5rem 0}.now-playing-topbar .icon-btn{font-size:1.8rem;line-height:1}.now-playing-kicker{flex:1;text-align:center;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;color:var(--muted)}.now-playing-spacer{width:2.2rem}.now-playing-art-wrap{display:flex;justify-content:center;padding:1.5rem 0}.now-playing-art{width:min(72vw,320px);aspect-ratio:1;border-radius:16px;background:linear-gradient(135deg,var(--surface-2),var(--surface));display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 20px 60px #00000080}.now-playing-art img{width:100%;height:100%;object-fit:cover}.now-playing-art-fallback{font-size:5rem;opacity:.6}.video-window{position:relative;width:min(100%,640px);margin:1rem auto 0}.video-surface{display:block;width:100%;max-height:42vh;border-radius:12px;background:#000;box-shadow:0 16px 40px #00000080}.video-fullscreen-btn{position:absolute;top:.5rem;right:.5rem;width:34px;height:34px;border-radius:8px;border:none;background:#0a0a1099;color:var(--text);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.video-fullscreen-btn:hover{background:#0a0a10d9}.now-playing-meta{text-align:center;margin:.5rem 0 1.5rem}.now-playing-title-row{display:flex;align-items:center;justify-content:center;gap:.6rem}.now-playing-title{font-size:1.3rem;font-weight:700}.now-playing-artist{color:var(--accent-muted);margin-top:.25rem}.now-playing-progress{margin-bottom:1rem}.now-playing-progress .seek-bar{width:100%;accent-color:var(--accent)}.time-row{display:flex;justify-content:space-between;font-size:.75em;color:var(--muted);margin-top:.25rem}.now-playing-transport{display:flex;align-items:center;justify-content:center;gap:1.25rem;margin:.5rem 0 1.5rem}.now-playing-transport .icon-btn{font-size:1.1rem}.play-btn-lg{width:68px;height:68px;border-radius:50%;background:var(--gradient-accent);border:none;color:var(--text);font-size:1.7rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 30px rgba(var(--accent-rgb),.5);transition:transform .15s ease}.play-btn-lg:active{transform:scale(.92)}.now-playing-volume{display:flex;align-items:center;gap:.6rem;max-width:280px;margin:0 auto 1rem}.now-playing-volume-icon{font-size:1.1rem;flex-shrink:0;width:1.4rem;text-align:center}.volume-bar{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:3px;border-radius:999px;background:#2c2c38;outline:none;cursor:pointer}.volume-bar::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:11px;height:11px;border-radius:50%;background:var(--accent);cursor:pointer}.volume-bar::-moz-range-track{height:3px;border-radius:999px;background:#2c2c38}.volume-bar::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:var(--accent);border:none;cursor:pointer}.now-playing-download{display:flex;justify-content:center;gap:.5rem;margin-top:auto;flex-wrap:wrap}.item-menu{position:relative}.item-menu-dropdown{position:absolute;top:100%;right:0;z-index:20;min-width:180px;background:var(--surface-2);border:1px solid #2c2c38;border-radius:10px;box-shadow:0 12px 32px #00000080;overflow:hidden;margin-top:.25rem}.item-menu-option{display:flex;align-items:center;gap:.6rem;width:100%;padding:.6rem .8rem;background:none;border:none;color:var(--text);text-align:left;cursor:pointer;font-size:.9rem}.item-menu-option:hover{background:#ffffff0f}.item-menu-icon{font-size:1rem;width:1.2rem;text-align:center}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-end;justify-content:center;z-index:100}.modal-card{width:100%;max-width:480px;max-height:80vh;overflow-y:auto;background:var(--surface);border-radius:16px 16px 0 0;padding:1.25rem;box-shadow:0 -16px 40px #00000080}@media (min-width: 640px){.modal-backdrop{align-items:center}.modal-card{border-radius:16px}}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.modal-header h2{margin:0;font-size:1.1rem}.playlist-picker-list{display:flex;flex-direction:column;gap:.6rem;margin:1rem 0;max-height:40vh;overflow-y:auto}.playlist-create-row{display:flex;gap:.5rem;margin:.75rem 0}.playlist-create-row .search-input{margin:0;flex:1}.form-field{margin:.75rem 0;display:flex;flex-direction:column;gap:.3rem}.form-field .search-input{margin:0}.share-names-row{display:flex;gap:.6rem}.share-names-row .form-field{flex:1;min-width:0}.share-message-input{background:var(--surface-2);border:1px solid #2c2c38;border-radius:10px;padding:.6em .8em;color:var(--text);font:inherit;resize:vertical}.share-consent-row{margin:1rem 0;font-size:.85rem;color:var(--muted);align-items:flex-start}.share-consent-row input{margin-top:.2rem;flex-shrink:0}.share-success{color:var(--text);font-size:.95rem;margin:.75rem 0}.share-link-row .search-input{margin:0}.share-occasion-row{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 .75rem}.share-occasion-chip{display:flex;align-items:center;gap:.3rem;padding:.4em .7em;border-radius:999px;border:1px solid #2c2c38;background:var(--surface-2);color:var(--muted);font-size:.85rem;cursor:pointer}.share-occasion-chip.active{border-color:transparent;background:linear-gradient(135deg,var(--chip-c1),var(--chip-c2));color:#fff;font-weight:600}.share-template-row{display:flex;gap:.6rem;flex-wrap:wrap;margin:.5rem 0 .75rem}.share-template-option{display:flex;flex-direction:column;align-items:center;gap:.3rem;width:72px;padding:4px;border-radius:10px;border:2px solid transparent;background:var(--surface-2);cursor:pointer;color:var(--muted);font-size:.7rem;text-align:center}.share-template-option img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:6px}.share-template-option span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.share-template-option.active{border-color:var(--accent);color:var(--text);font-weight:600}.share-template-option-none{justify-content:center;aspect-ratio:3/4;font-size:.75rem}.share-font-row{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 .75rem}.share-font-option{padding:.5em .9em;border-radius:8px;border:1px solid #2c2c38;background:var(--surface-2);color:var(--muted);font-size:.95rem;cursor:pointer}.share-font-option.active{border-color:var(--accent);color:var(--text);font-weight:600}.share-message-style-row{display:flex;gap:1.25rem;align-items:center;margin:.5rem 0 .75rem}.share-color-field{display:flex;flex-direction:column;gap:.3rem}.share-color-field input[type=color]{width:44px;height:32px;padding:0;border:1px solid #2c2c38;border-radius:6px;background:none;cursor:pointer}.share-size-field{display:flex;flex-direction:column;gap:.3rem;flex:1}.share-size-field input[type=range]{width:100%}.share-ttl-row{display:flex;gap:.5rem;margin:.5rem 0 .75rem}.share-ttl-option{flex:1;text-align:center;padding:.5em;border-radius:8px;border:1px solid #2c2c38;background:var(--surface-2);color:var(--muted);font-size:.85rem;cursor:pointer}.share-ttl-option.active{border-color:var(--accent);color:var(--text);font-weight:600}.share-pin-toggle-row{display:flex;align-items:center;gap:.5rem;margin:.5rem 0}.share-pin-input{width:100px;font-size:20px;letter-spacing:6px;text-align:center;margin-top:.4rem}.share-preview-toggle-row{font-size:.85rem;margin:.6rem 0}.share-modal-layout{width:100%;max-width:480px}.share-modal-layout.with-preview{display:flex;align-items:flex-start;gap:16px;max-width:920px}.share-modal-layout.with-preview .modal-card{flex:1;min-width:0;max-width:480px}.share-modal-layout.with-preview .share-preview-page{flex:1;min-width:0;max-width:440px;max-height:80vh}.share-modal-layout.with-preview.has-template{max-width:1320px}.share-modal-layout.with-preview.has-template .share-preview-page{max-width:780px}@media (max-width: 800px){.share-modal-layout.with-preview{flex-direction:column;max-width:480px;max-height:90vh;overflow-y:auto}.share-modal-layout.with-preview .modal-card{max-height:none;overflow-y:visible}.share-modal-layout.with-preview .share-preview-page{max-width:none;max-height:none;overflow-y:visible}}.share-qr-wrap{display:flex;justify-content:center;margin:.75rem 0}.share-qr-wrap img{border-radius:12px;background:#fff;padding:8px;width:140px;height:140px}.share-preview-page{width:100%;max-width:560px;max-height:90vh;overflow-y:auto;position:relative;background:radial-gradient(circle at 20% 10%,color-mix(in srgb,var(--c1) 35%,transparent),transparent 45%),radial-gradient(circle at 85% 25%,color-mix(in srgb,var(--c2) 25%,transparent),transparent 40%),radial-gradient(circle at 50% 90%,color-mix(in srgb,var(--c1) 15%,transparent),transparent 50%),#0a0a10;color:#f4f4f7;padding:24px;border-radius:16px}.share-preview-page.has-template{background-size:cover;background-position:center}.share-preview-close{position:absolute;top:14px;right:14px;background:#ffffff1a;z-index:1}.share-preview-book{display:flex;gap:0;width:100%;justify-content:center}.share-preview-card{flex:0 1 480px;min-width:0;max-width:480px;margin:0 auto;aspect-ratio:3 / 4;display:flex;flex-direction:column;justify-content:center;background:#ffffff0a;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:32px 28px;text-align:center;box-shadow:0 16px 48px #00000059}.share-preview-page-right{flex:0 1 480px;min-width:0;max-width:480px;aspect-ratio:3 / 4;border-radius:0 24px 24px 0;border:1px solid rgba(255,255,255,.1);border-left:none;background-size:cover;background-position:center;box-shadow:0 16px 48px #00000059}.share-preview-book:has(.share-preview-page-right) .share-preview-card{border-radius:24px 0 0 24px}@media (max-width: 700px){.share-preview-page-right{display:none}.share-preview-book:has(.share-preview-page-right) .share-preview-card{border-radius:24px}}.share-preview-eyebrow{font-size:13px;color:#b9a8f5;font-weight:600;letter-spacing:.03em;text-transform:uppercase;margin-bottom:6px}.share-preview-from{font-size:26px;font-weight:800;margin:0 0 18px;background:linear-gradient(135deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 1px 4px rgba(0,0,0,.4)}.share-preview-from-stack{margin:0 0 18px;display:grid;grid-template-columns:1fr auto 1fr;row-gap:8px}.share-preview-from-name{font-size:24px;font-weight:800;line-height:1.2;white-space:nowrap;background:linear-gradient(135deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 1px 4px rgba(0,0,0,.4)}.share-preview-from-name-sender{grid-row:1;grid-column:1 / 3;justify-self:end}.share-preview-from-name-recipient{grid-row:3;grid-column:2 / 4;justify-self:start}.share-preview-tang{grid-row:2;grid-column:2;justify-self:center;font-size:13px;font-weight:500;font-style:italic;color:#f4f4f7;text-shadow:0 1px 3px rgba(0,0,0,.5)}.share-preview-message{font-size:16px;line-height:1.6;color:#f4f4f7;background:#ffffff0d;border-radius:16px;padding:18px 20px;margin:0 0 24px;white-space:pre-wrap;word-break:break-word}.share-preview-media{margin-bottom:20px;border-radius:16px;overflow:hidden;background:#000}.share-preview-media audio,.share-preview-media video{width:100%;display:block}.share-preview-photo{width:100%;display:block;max-height:480px;object-fit:contain;background:#000}.share-preview-media-fallback{padding:40px;font-size:40px}.share-preview-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.share-preview-btn{display:inline-flex;align-items:center;gap:6px;background:#ffffff0f;border:1px solid #2c2c38;color:#e7e3ff;font-weight:600;font-size:14px;padding:10px 18px;border-radius:10px}.share-preview-btn-primary{background:linear-gradient(135deg,var(--c1),var(--c2));border-color:transparent;color:#fff}.share-preview-footer{margin-top:28px;font-size:12px;color:#9797a6}.share-preview-badge{text-align:center;font-size:11px;color:#f4f4f799;margin-top:14px}.share-preview-page.has-template .share-preview-eyebrow,.share-preview-page.has-template .share-preview-footer{color:#f4f4f7;text-shadow:0 1px 3px rgba(0,0,0,.55)}.share-preview-page.has-template .share-preview-btn:not(.share-preview-btn-primary){background:#2563eb8c;border-color:#2563ebcc;color:#fff}.share-preview-page.has-template .share-preview-message{background:#4a9eff40;color:#fdfdfd}.share-preview-page.has-template .share-preview-media,.share-preview-page.has-template .share-preview-photo{background:#4a9eff40}.playlist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1rem;margin-top:1rem}.playlist-card{background:none;border:none;color:inherit;cursor:pointer;text-align:left;padding:0}.playlist-card-art{width:100%;aspect-ratio:1;border-radius:10px;background:linear-gradient(135deg,var(--surface-2),var(--surface));display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:2rem;margin-bottom:.4rem}.playlist-card-art img{width:100%;height:100%;object-fit:cover}.playlist-card-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-rename-form{flex:1}.playlist-rename-form .search-input{margin:0}.settings-section{margin:1.5rem 0;padding-bottom:1rem;border-bottom:1px solid #24242e}.toggle-row{display:flex;align-items:center;gap:.6rem;cursor:pointer}.theme-color-row{display:flex;flex-wrap:wrap;gap:1.25rem;margin:.75rem 0 1rem}.theme-color-field{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem;color:var(--muted)}.theme-color-field input[type=color]{width:48px;height:32px;border:1px solid #2c2c38;border-radius:8px;background:none;padding:0;cursor:pointer}.theme-select-field{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.6rem 0;font-size:.9rem}.theme-select-field select{background:var(--surface-2);color:var(--text);border:1px solid #2c2c38;border-radius:8px;padding:.4em .6em;font:inherit;cursor:pointer}.settings-credit{border-bottom:none;text-align:center}.settings-credit p{margin:.3em 0}.sent-shares-list{display:flex;flex-direction:column;gap:.4rem}.sent-share-row{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;background:var(--surface-2);border-radius:10px}.sent-share-emoji{font-size:1.3rem;flex-shrink:0}.sent-share-meta{flex:1;min-width:0}.sent-share-title{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-credit a{color:var(--accent);text-decoration:none}.settings-credit a:hover{text-decoration:underline}.doc-page{padding:1.5rem;max-width:720px;margin:0 auto}.doc-page-inner h1{margin-top:1.2rem}.doc-page-inner h2{margin-top:1.6rem;font-size:1.1em}.doc-page-inner p,.doc-page-inner li{line-height:1.6;color:var(--text)}.doc-page-inner a{color:var(--accent)}.doc-page-inner code{background:var(--surface-2);padding:.15em .4em;border-radius:4px;font-size:.9em}.crash-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center}.crash-screen-inner{max-width:360px}.floating-video{position:fixed;top:0;left:0;z-index:60;width:220px;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 14px 36px #0009;border:1px solid #2c2c38}.floating-video-draghandle{position:absolute;top:0;left:0;right:0;height:22px;z-index:1;cursor:grab;touch-action:none}.floating-video-draghandle:active{cursor:grabbing}.floating-video-mute{position:absolute;top:4px;right:4px;z-index:2;width:24px;height:24px;border-radius:50%;border:none;background:#0a0a108c;color:var(--text);font-size:.75rem;display:flex;align-items:center;justify-content:center;cursor:pointer}.floating-video-surface{display:block;width:100%;aspect-ratio:16 / 9;background:#000}@media (min-width: 900px){.desktop-sidebar{display:flex;flex-direction:column;width:232px;flex-shrink:0;padding:1.5rem 1rem;background:var(--bar-bg);border-right:1px solid #24242e}.desktop-sidebar-brand{display:flex;align-items:center;gap:.6rem;margin-bottom:.75rem;padding:.4rem .5rem;border-radius:10px;text-decoration:none;color:inherit;cursor:pointer;transition:background .15s,transform .1s}.desktop-sidebar-brand:hover{background:#ffffff0d}.desktop-sidebar-brand:active{transform:scale(.97)}.desktop-sidebar-logo{width:36px;height:36px;object-fit:contain;display:block;flex-shrink:0;filter:drop-shadow(0 4px 10px rgba(var(--accent-rgb),.35))}.desktop-sidebar-title{font-weight:800;font-size:1.25rem;background:var(--gradient-accent);-webkit-background-clip:text;background-clip:text;color:transparent}.desktop-sidebar-signout{margin:0 .5rem 1.5rem;padding:.5rem .75rem;border-radius:8px;border:1px solid #2c2c38;background:transparent;color:var(--muted);font-size:.85rem;font-weight:600;cursor:pointer;text-align:center}.desktop-sidebar-signout:hover{background:#ef44441a;color:#ef4444;border-color:#ef444459}.desktop-sidebar nav{display:flex;flex-direction:column;gap:.2rem}.desktop-sidebar nav a{display:flex;align-items:center;gap:.75rem;padding:.65rem .75rem;border-radius:10px;color:var(--muted);text-decoration:none;font-weight:600;font-size:.95rem}.desktop-sidebar nav a .nav-icon{font-size:1.2rem}.desktop-sidebar nav a:hover{background:#ffffff0d;color:var(--text)}.desktop-sidebar nav a.active{background:rgba(var(--accent-rgb),.16);color:var(--text)}.sidebar-expand-toggle{display:flex;align-items:center;gap:.75rem;width:100%;padding:.65rem .75rem;border-radius:10px;border:none;background:none;color:var(--muted);font:inherit;font-weight:600;font-size:.95rem;cursor:pointer;text-align:left}.sidebar-expand-toggle:hover{background:#ffffff0d;color:var(--text)}.sidebar-expand-toggle.open{color:var(--text)}.sidebar-expand-caret{margin-left:auto;font-size:.75rem;transition:transform .15s}.sidebar-expand-toggle.open .sidebar-expand-caret{transform:rotate(90deg)}.sidebar-sublist{display:flex;flex-direction:column;gap:.1rem;margin:.1rem 0 .3rem 1.9rem;padding-left:.5rem;border-left:1px solid rgba(255,255,255,.08)}.sidebar-sublist-item{padding:.4rem .6rem;border-radius:8px;color:var(--muted);text-decoration:none;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-sublist-item:hover{background:#ffffff0d;color:var(--text)}.sidebar-sublist-item.active{color:var(--text);font-weight:600}.sidebar-sublist-manage{color:var(--accent);font-weight:600}.sidebar-sublist-empty{padding:.4rem .6rem;font-size:.8rem;color:var(--muted)}.sidebar-sublist-hint{margin:0 .6rem .3rem;font-size:.72rem;color:var(--muted)}.sidebar-sublist-row{display:flex;align-items:center;gap:.4rem}.sidebar-sublist-row input[type=checkbox]{flex-shrink:0;cursor:pointer}.sidebar-sublist-row .sidebar-sublist-item{flex:1;min-width:0}.sidebar-pin-badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.1rem;height:1.1rem;padding:0 .3rem;border-radius:999px;background:var(--gradient-accent);color:#fff;font-size:.7rem;font-weight:700}.desktop-sidebar-source{display:flex;flex-direction:column;gap:.5rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.08)}.desktop-sidebar-source .btn{display:flex;width:100%;justify-content:center}.desktop-sidebar-source .connected-folders{margin:0}.app-topbar,.bottom-nav{display:none}.app-content{max-width:1100px;width:100%;margin:0 auto;padding:2rem 2.5rem}.app-content.no-padding{max-width:none;padding:0}.mobile-only-source-toolbar{display:none}.login-content{max-width:480px}}