@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";.image-viewer{position:relative;width:100%;aspect-ratio:16 / 9;background-color:#000;border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--shadow);cursor:pointer}.main-image,.previous-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.placeholder-content{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#666;text-align:center;padding:20px;will-change:transform}.placeholder-content p{margin:5px 0}.placeholder-content p:last-child{font-size:.8em;opacity:.7}.fullscreen-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000;z-index:1000;display:flex;justify-content:center;align-items:center}.fullscreen-image{max-width:100%;max-height:100%;object-fit:cover;width:100%;height:100%}.close-fullscreen{position:absolute;top:20px;right:20px;width:40px;height:40px;background-color:#00000080;border:none;border-radius:50%;color:#fff;font-size:24px;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:background-color .2s}.close-fullscreen:hover{background-color:#000c}.ken-burns{overflow:hidden}.image-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;color:var(--secondary-light);background-color:#0000004d;text-align:center;padding:20px;box-sizing:border-box;border-radius:var(--border-radius)}.image-placeholder p{margin:5px 0}.image-placeholder p:last-child{font-size:.8em;opacity:.7}:root{--crossfade-duration: 1s;--crossfade-timing: ease-in-out}.fade-in{animation:fadeIn var(--crossfade-duration) var(--crossfade-timing) forwards;z-index:2}.fade-out{animation:fadeOut var(--crossfade-duration) var(--crossfade-timing) forwards;z-index:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fullscreen-image.fade-in{animation:fadeIn var(--crossfade-duration) var(--crossfade-timing) forwards;z-index:1002}.fullscreen-image.fade-out{animation:fadeOut var(--crossfade-duration) var(--crossfade-timing) forwards;z-index:1001;position:absolute;top:0;left:0;right:0;bottom:0}.vignette-overlay:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at center,#0000 50%,#0009 90%,#000c);pointer-events:none;z-index:5;border-radius:inherit}.audio-controls{display:flex;align-items:center;padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-surface);border-radius:var(--border-radius);box-shadow:var(--shadow);gap:var(--spacing-md)}.audio-controls .icon-button{background:none;border:none;color:var(--text-primary);cursor:pointer;padding:var(--spacing-xs);line-height:1;transition:color .2s}.audio-controls .icon-button:hover:not(:disabled){color:var(--accent)}.audio-controls .icon-button:disabled{opacity:.4;cursor:not-allowed}.play-pause-button{font-size:1.5em}.time-display{font-size:.9em;color:var(--text-muted);min-width:40px;text-align:center}.progress-bar-container{flex-grow:1;height:8px;cursor:pointer;background-color:var(--border-subtle);border-radius:4px;position:relative;margin:0 var(--spacing-sm)}.progress-bar-background{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--border-subtle);border-radius:4px}.progress-bar-fill{position:absolute;top:0;left:0;height:100%;background-color:var(--accent);border-radius:4px}.progress-bar-handle{position:absolute;top:50%;transform:translate(-50%,-50%);width:16px;height:16px;background-color:var(--text-primary);border-radius:50%;box-shadow:0 1px 3px #0000004d;cursor:pointer}.volume-control{display:flex;align-items:center;gap:var(--spacing-sm)}.volume-icon{color:var(--text-muted)}.volume-slider{width:120px;height:6px;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border-subtle);border-radius:3px;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:var(--text-primary);border-radius:50%;cursor:pointer}.volume-slider::-moz-range-thumb{width:14px;height:14px;background:var(--text-primary);border-radius:50%;cursor:pointer;border:none}.audio-controls.column-layout{flex-direction:column;align-items:stretch;padding:var(--spacing-md);gap:var(--spacing-md)}.progress-row{width:100%}.progress-display{display:flex;align-items:center;width:100%;gap:var(--spacing-sm)}.playback-controls{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);width:100%}.playback-buttons-row{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md);flex-wrap:nowrap}.playback-buttons-row .icon-button{font-size:1.5em}.stop-button:disabled{opacity:.5;cursor:not-allowed;width:100%}.volume-control{display:flex;align-items:center;gap:var(--spacing-sm);width:auto}.usage-display{margin-bottom:15px;padding:10px;border-radius:8px;text-align:center}.premium-indicator{display:flex;align-items:center;justify-content:center;gap:8px;color:gold;font-weight:600}.premium-icon{font-size:1.2em}.free-indicator{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--text-primary)}.remaining-time{font-weight:500}.remaining-time.warning{color:#ff6b6b;font-weight:600}.mini-upgrade-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:4px 12px;border-radius:12px;font-size:.8em;font-weight:500;cursor:pointer;transition:transform .2s}.mini-upgrade-btn:hover{transform:scale(1.05)}.progress-container{display:flex;align-items:center;gap:15px;margin-bottom:20px}.progress-bar{flex:1;height:8px;background-color:var(--border-subtle);border-radius:4px;position:relative;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-hover));border-radius:4px;transition:width .1s ease}.time-display{font-size:14px;color:var(--text-primary);font-weight:500;min-width:45px;text-align:center}.control-buttons{display:flex;justify-content:center;gap:15px;margin-bottom:20px}.control-btn{background-color:var(--accent);color:var(--text-primary);border:none;border-radius:50%;width:50px;height:50px;font-size:18px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.control-btn:hover:not(:disabled){background-color:var(--accent-hover);transform:scale(1.1)}.control-btn:disabled{background-color:var(--text-muted);cursor:not-allowed;opacity:.6}.play-pause-btn{width:60px;height:60px;font-size:24px;background:linear-gradient(135deg,var(--accent),var(--accent-hover))}.volume-control{display:flex;align-items:center;gap:10px;justify-content:center}.volume-icon{font-size:18px}.volume-slider{width:100px;height:6px;background:var(--border-color);outline:none;border-radius:3px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--primary-color);border-radius:50%;cursor:pointer}.volume-slider::-moz-range-thumb{width:16px;height:16px;background:var(--primary-color);border-radius:50%;cursor:pointer;border:none}.volume-value{font-size:12px;color:var(--text-color);min-width:35px}.limit-warning{margin-top:10px;padding:8px 15px;background-color:#ffe6e6;color:#d63031;border-radius:8px;text-align:center;font-weight:500;font-size:14px}@media (max-width: 768px){.audio-controls{padding:15px}.usage-display{margin-bottom:10px}.free-indicator{flex-direction:column;gap:5px}.progress-container,.control-buttons{gap:10px}.control-btn{width:45px;height:45px;font-size:16px}.play-pause-btn{width:55px;height:55px;font-size:20px}.volume-control{gap:8px}.volume-slider{width:80px}}.usage-information{width:100%;padding-top:var(--spacing-sm);border-top:1px solid var(--border-subtle);display:flex;flex-direction:column;gap:var(--spacing-sm)}.premium-status,.free-status{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xs)}.status-label{color:var(--text-muted);font-size:.85em;font-weight:500}.status-value{color:var(--text-primary);font-size:.85em;font-weight:600}.status-value.warning{color:var(--accent)}.upgrade-button{background-color:var(--accent);color:var(--text-primary);border:none;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius);font-size:.8em;font-weight:500;cursor:pointer;transition:background-color .2s;margin-left:var(--spacing-sm)}.limit-warning{text-align:center;color:var(--accent);font-size:.8em;font-weight:500;padding:var(--spacing-xs);background-color:#3b82f61a;border-radius:var(--border-radius);margin-top:var(--spacing-xs)}@media (max-width: 768px){.premium-status,.free-status{flex-direction:column;align-items:flex-start;gap:var(--spacing-xs)}.upgrade-button{margin-left:0;align-self:flex-end}}.usage-status-display{text-align:center;width:100%}.usage-status-text{color:var(--text-muted);font-size:.85em;font-weight:500}.usage-status-text.warning{color:#ff6b35}.usage-status-text.premium-text{color:var(--accent);font-weight:600;text-shadow:0 0 6px rgba(59,130,246,.3)}.upgrade-button-full{width:100%;background-color:var(--accent);color:var(--text-primary);border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);font-size:.9em;font-weight:600;cursor:pointer;transition:background-color .2s,transform .1s;text-align:center}.upgrade-button-full:hover{background-color:var(--accent-hover);transform:translateY(-1px)}.upgrade-button-full:active{transform:translateY(0)}.limit-warning{text-align:center;color:var(--accent);font-size:.8em;font-weight:500;padding:var(--spacing-xs);background-color:#3b82f61a;border-radius:var(--border-radius);width:100%;box-sizing:border-box}@media (max-width: 768px){.usage-status-text{font-size:.8em}.upgrade-button-full{font-size:.85em;padding:var(--spacing-xs) var(--spacing-sm)}.playback-buttons-row{gap:var(--spacing-xs)}.playback-buttons-row .icon-button{font-size:1.2em;padding:calc(var(--spacing-xs) * .8)}}.settings-panel,.visual-options-panel{padding:15px;margin-bottom:15px}.settings-panel h2,.book-info-form h2{margin-top:0;margin-bottom:5px;font-size:18px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:600;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--accent-color, #007bff);text-shadow:1px 1px 2px rgba(0,0,0,.15);border-bottom:1px solid var(--tertiary-dark);padding-bottom:5px;border-bottom-color:var(--accent-color, #007bff)}.settings-panel hr,.book-info-form hr{border:none;height:1px;background-color:var(--accent-color, #007bff);width:80%;margin:0 auto 15px}.settings-panel .form-row{display:flex;gap:20px;margin-bottom:15px}.settings-panel .form-group{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0;overflow:hidden}.settings-panel .form-group label{margin-bottom:0;display:inline-block;font-weight:600;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--secondary-light, #cccccc);text-shadow:1px 1px 1px rgba(0,0,0,.1);padding-bottom:2px}.settings-panel .form-group select,.settings-panel .file-input-display{padding:8px 12px;border:1px solid var(--input-border, #ccc);border-radius:var(--border-radius, 4px);font-size:14px;background-color:var(--input-bg, #fff);color:var(--input-text, #333);box-sizing:border-box;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis}.settings-panel .file-selection-group label{margin-bottom:5px}.settings-panel .file-input-display{display:flex;justify-content:flex-start;align-items:center}.settings-panel .file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-grow:1;margin-left:10px}.settings-panel .browse-button{padding:4px 8px;font-size:.8em;cursor:pointer;flex-shrink:0;margin-right:0}.settings-panel .icon-button{background:none;border:none;padding:var(--spacing-xs);color:#fff;font-size:1.2em;line-height:1;cursor:pointer;transition:color .2s}.settings-panel .icon-button:hover{color:var(--accent-color);background:none;border:none}.settings-panel .ken-burns-group{flex:none;width:100%;justify-content:flex-start;margin-top:10px}.settings-panel .ken-burns-toggle{display:flex;align-items:center;gap:8px;border:none;padding:0;background-color:transparent}.settings-panel .ken-burns-toggle input[type=checkbox]{width:auto;margin:0}.settings-panel .ken-burns-toggle label{font-weight:400;color:#666;font-size:14px;margin-bottom:0;cursor:pointer}.file-input-display-label{display:block;cursor:pointer;border-radius:var(--border-radius, 4px);padding:0;border:none;background:none}.settings-panel .file-input-display{display:flex;justify-content:flex-start;align-items:center;padding:8px 12px;border:1px solid var(--input-border, #ccc);border-radius:var(--border-radius, 4px);background-color:var(--input-bg, #fff);color:var(--input-text, #333);transition:background-color .2s,border-color .2s}.file-input-display-label:hover .file-input-display{background-color:var(--input-bg-hover, #eee);border-color:var(--input-border-hover, #bbb)}.settings-panel .file-name:placeholder-shown{font-style:italic;color:#888}.settings-panel .file-name:empty{font-style:italic;color:#888}.settings-panel .file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-grow:1;margin-left:10px;margin-right:0}.icon-button-placeholder{display:inline-flex;align-items:center;justify-content:center;margin-right:var(--spacing-sm);color:var(--icon-color, var(--secondary-light));font-size:1.2em;flex-shrink:0}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.form-group.effects-group{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:25px;flex-wrap:nowrap;width:100%}.effect-toggle{display:flex;align-items:center;gap:6px;flex-shrink:0}.effect-toggle label{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.effect-toggle input[type=checkbox]{cursor:pointer;margin:0;vertical-align:middle}.api-key-input-container{display:flex;flex-direction:column;align-items:flex-start;gap:5px;width:100%}.api-key-help-link.api-key-link-above{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;color:var(--accent-color);text-decoration:none;font-size:.9em;padding:0;margin-bottom:3px}.api-key-help-link.api-key-link-above:hover{text-decoration:underline}.api-key-field{width:100%;flex-grow:0;padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--border-radius);background-color:var(--input-bg);color:var(--text-color);font-size:.9em;box-sizing:border-box}.form-group.full-width{width:100%;flex-basis:100%}.file-input-display-label{display:block;width:100%;cursor:pointer}.file-input-display{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px dashed var(--border-color);border-radius:var(--border-radius);background-color:var(--input-bg-secondary);color:var(--secondary-light);transition:background-color .2s,border-color .2s;text-align:left}.file-input-display:hover{background-color:var(--input-bg-hover);border-color:var(--accent-color)}.file-input-display .icon-button-placeholder{color:var(--accent-color);font-size:1.2em}.file-input-display .file-name{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:italic;color:var(--text-color-muted)}.form-group.inline-option label{flex-shrink:0;min-width:120px;text-align:left;margin-bottom:0}.form-group.inline-option select,.form-group.inline-option .frequency-dropdown{flex-grow:1}.form-group.inline-option select option{background-color:var(--bg-surface)}.switch-container{position:relative;display:inline-block;width:36px;height:20px}.switch-label{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--border-subtle);transition:background-color .3s ease;border-radius:20px}.switch-label:before{position:absolute;content:"";height:16px;width:16px;left:2px;bottom:2px;background-color:#fff;transition:transform .3s ease;border-radius:50%;box-shadow:0 1px 3px #0003}.switch-input:checked+.switch-label{background-color:var(--accent-color)}.switch-input:focus+.switch-label{box-shadow:0 0 1px 2px var(--accent-color)}.switch-input:checked+.switch-label:before{transform:translate(16px)}.visual-options-panel .form-group{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0;overflow:hidden;padding:0;border:none}.visual-options-panel .form-row{margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--border-subtle)}.visual-options-panel .form-group.inline-option{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:20px}.visual-options-panel .form-group.inline-option label{flex-shrink:0;width:140px;text-align:left;margin-bottom:0;padding-left:5px}.visual-options-panel .form-group.inline-option select{flex-grow:1;min-width:150px;max-width:100%}.visual-options-panel .form-group.inline-option select option{background-color:var(--bg-surface)}.visual-options-panel .form-group.inline-option select option:hover{background-color:var(--accent-hover);color:var(--text-primary)}.visual-options-panel .switch-container{flex-shrink:0}.switch-wrapper{display:flex;align-items:center;justify-content:space-between;width:100%;gap:15px}.switch-text-label{font-size:14px;color:var(--text-primary);font-weight:500;flex-grow:1;cursor:pointer}.switch-control{position:relative;width:40px;height:22px;flex-shrink:0}.switch-input{opacity:0;width:0;height:0}.switch-slider-label{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--border-subtle);border-radius:22px;transition:background-color .2s}.switch-slider-label:before{position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:transform .2s}.switch-input:checked+.switch-slider-label{background-color:var(--accent)}.switch-input:checked+.switch-slider-label:before{transform:translate(18px)}.book-info-form{background:var(--bg-surface);color:var(--text-primary);padding:var(--spacing-md);border-radius:var(--border-radius);box-shadow:var(--shadow)}.book-info-form h2{margin-top:0;margin-bottom:5px;font-size:18px;font-family:Inter,sans-serif;font-weight:600;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--accent);text-shadow:1px 1px 2px rgba(0,0,0,.15);border-bottom:1px solid var(--border-subtle);padding-bottom:var(--spacing-xs);border-bottom-color:var(--accent)}.book-info-form hr{border:none;height:1px;background-color:var(--accent);width:80%;margin:0 auto 15px}.form-row{display:flex;gap:20px;margin-bottom:15px}.form-group{flex:1;display:flex;flex-direction:column;gap:5px}.form-group.full-width{width:100%}.form-group.inline-option{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;gap:15px;width:100%}.form-group.inline-option label{flex-shrink:0;margin-bottom:0;min-width:120px;text-align:left}#book-title{max-width:none;min-width:200px}#book-genre{min-width:200px;flex-grow:1;max-width:none}.form-group.inline-option select option:hover{background-color:var(--accent-hover);color:var(--text-primary)}.form-group.inline-option select,.form-group.inline-option input{flex:1;max-width:150px;min-width:0}.form-group label{display:inline-block;font-weight:600;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--text-muted);text-shadow:1px 1px 1px rgba(0,0,0,.1);padding-bottom:2px;margin-bottom:3px}.form-group input,.form-group select,.form-group textarea{padding:8px 12px;border:1px solid var(--border-subtle);border-radius:var(--border-radius);font-size:14px;background-color:var(--input-bg);color:var(--text-primary)}.custom-instructions-textarea{resize:vertical;min-height:80px;font-family:inherit}.form-group .helper-text{font-size:12px;color:var(--text-primary);opacity:.7;margin-top:3px}@media (max-width: 768px){.top-section,.form-row{flex-direction:column}.form-group.inline-option{flex-direction:column;align-items:flex-start;gap:5px}.form-group.inline-option label{min-width:unset}.form-group.inline-option select,.form-group.inline-option input{max-width:unset;width:100%}.settings-panel{flex-direction:column;align-items:flex-start}}.playlist-tile{background:var(--bg-surface);color:var(--text-primary);padding:20px;border-radius:var(--border-radius);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:15px}.playlist-tile h2{margin-top:0;margin-bottom:5px;font-size:18px;font-family:Inter,sans-serif;font-weight:600;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--accent);text-shadow:1px 1px 2px rgba(0,0,0,.15);border-bottom:1px solid var(--border-subtle);padding-bottom:8px;border-bottom-color:var(--accent)}.playlist-options{display:flex;flex-direction:column;gap:10px}.playlist-container{border-top:1px solid var(--border-subtle);padding-top:16px}.playlist-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.file-count{color:var(--text-muted);font-size:11px;font-weight:500}.clear-playlist{background:none;border:1px solid var(--border-subtle);color:var(--text-muted);padding:4px 8px;border-radius:4px;font-size:10px;cursor:pointer;transition:all .2s}.clear-playlist:hover{border-color:var(--accent);color:var(--accent)}.playlist-scroll{max-height:300px;overflow-y:auto;border:1px solid var(--border-subtle);border-radius:6px;background-color:var(--input-bg)}.playlist-scroll::-webkit-scrollbar{width:6px}.playlist-scroll::-webkit-scrollbar-track{background:var(--input-bg);border-radius:3px}.playlist-scroll::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:3px;transition:background-color .2s}.playlist-scroll::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.playlist-item{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background-color .2s;-webkit-user-select:none;user-select:none}.playlist-item:last-child{border-bottom:none}.playlist-item:hover{background-color:#3b82f60d}.playlist-item.active{background-color:#3b82f61a;border-left:3px solid var(--accent)}.drag-handle{color:var(--text-muted);font-size:14px;margin-right:8px;cursor:grab;line-height:1}.drag-handle:hover{color:var(--text-primary)}.playlist-item:active .drag-handle{cursor:grabbing}.item-info{flex:1;min-width:0;margin-right:8px}.item-name{color:var(--text-primary);font-size:12px;font-weight:500;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.item-meta{display:flex;align-items:center;gap:6px;font-size:10px}.now-playing{color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.track-number{color:var(--text-muted)}.remove-item{background:none;border:none;color:var(--text-muted);font-size:16px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:3px;transition:all .2s;line-height:1;flex-shrink:0}.remove-item:hover{background-color:#e74c3c1a;color:#e74c3c}.playlist-item[draggable=true]{cursor:grab}.playlist-item:active[draggable=true]{cursor:grabbing;opacity:.8}.playlist-scroll:empty:after{content:"No files in playlist";display:block;text-align:center;color:var(--text-muted);font-size:11px;padding:20px;font-style:italic}@media (max-width: 768px){.playlist-scroll{max-height:250px}.item-name{font-size:11px}}:root{--bg-primary: #0B0E17;--bg-surface: #141827;--text-primary: #F1F5FF;--text-muted: #8A91B4;--accent: #3B82F6;--accent-hover: #2563EB;--border-subtle: rgba(139, 145, 180, .1);--border-hover: rgba(139, 145, 180, .2);--input-bg: rgba(139, 145, 180, .05);--primary-color: var(--accent);--primary-dark: var(--accent-hover);--secondary-color: #e74c3c;--text-color: var(--text-primary);--light-text: var(--text-primary);--bg-color: var(--bg-primary);--card-bg: var(--bg-surface);--input-border: var(--border-subtle);--input-text: var(--text-primary);--shadow: 0 2px 10px rgba(0, 0, 0, .1);--border-radius: 8px;--border-color: var(--border-subtle)}@media (prefers-color-scheme: dark){:root{--primary-color: #4a90e2;--primary-dark: #3a7bc8;--secondary-color: #f56553;--text-color: rgba(255, 255, 255, .87);--light-text: #222;--bg-color: #1a1a1a;--card-bg: #2c2c2c;--input-bg: #3a3a3a;--input-border: #555;--input-text: rgba(255, 255, 255, .87);--shadow: 0 4px 15px rgba(0, 0, 0, .4);--border-color: #444}}body{margin:0;padding:0;font-family:Inter,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);overflow-x:hidden}.audiobook-player{width:100%;margin:0;padding:0;display:flex;flex-direction:column;min-height:100vh;overflow-x:hidden}.sticky-top-bar{position:sticky;top:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background-color:var(--bg-surface);border-bottom:1px solid var(--border-subtle);box-shadow:0 2px 10px #0000001a;width:100%;box-sizing:border-box}.top-bar-left{display:flex;align-items:center;gap:15px}.logo-image-small{width:50px;height:50px;border-radius:8px}.app-title{background:linear-gradient(to bottom,var(--accent),var(--accent-hover));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.8em;margin:0;font-weight:600}.top-bar-right{display:flex;align-items:center;gap:15px;height:44px}.help-button{padding:8px 16px;border-radius:var(--border-radius);background-color:var(--accent);color:#fff;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;justify-content:center;height:44px;box-sizing:border-box}.help-button:hover{background-color:var(--accent-hover)}.main-content-grid{display:grid;grid-template-columns:minmax(200px,1fr) minmax(350px,2.5fr) minmax(250px,1fr);gap:20px;padding:20px;flex:1;width:100%;box-sizing:border-box;overflow-x:hidden}.left-column,.center-column,.right-column{display:flex;flex-direction:column;gap:20px;min-width:0;overflow:hidden}.left-column,.right-column{max-width:100%}.left-column *,.right-column *{max-width:100%;box-sizing:border-box}.file-drop-zone{min-height:200px;border:2px dashed var(--border-subtle);border-radius:var(--border-radius);display:flex;align-items:center;justify-content:center;transition:border-color .2s,background-color .2s;cursor:pointer;padding:20px}.file-drop-zone:hover{border-color:var(--accent);background-color:#3b82f60d}.file-selection-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.file-select-button{display:flex;align-items:center;gap:10px;padding:15px 20px;background-color:var(--accent);color:#fff;border:none;border-radius:var(--border-radius);font-size:16px;font-weight:500;cursor:pointer;transition:background-color .2s}.file-select-button:hover{background-color:var(--accent-hover)}.file-icon{font-size:20px}.file-drop-text{color:var(--text-muted);margin:0;font-size:14px}.selected-file-name{color:var(--text-primary);font-weight:500;font-size:14px;margin:0;text-align:center;word-break:break-all}.help-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.help-popup{background-color:var(--bg-surface);border-radius:var(--border-radius);max-width:600px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:0 10px 40px #0000004d}.help-popup-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border-subtle)}.help-popup-header h3{margin:0;color:var(--text-primary);font-size:1.5em}.close-button{background:none;border:none;font-size:24px;color:var(--text-muted);cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.close-button:hover{background-color:var(--border-subtle);color:var(--text-primary)}.help-popup-content{padding:20px}.help-section{margin-bottom:25px}.help-section:last-child{margin-bottom:0}.help-section h4{color:var(--accent);margin:0 0 10px;font-size:1.1em}.help-section ul{margin:0;padding-left:20px;color:var(--text-primary)}.help-section li{margin-bottom:5px;line-height:1.5}.help-section p{margin:0;color:var(--text-primary);line-height:1.6}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0b0e17cc;display:flex;justify-content:center;align-items:center;z-index:1000;color:var(--text-primary);font-size:1.5em}.main-content.blurred{filter:blur(5px);pointer-events:none;-webkit-user-select:none;user-select:none}.auth-button{border:none;padding:8px 16px;border-radius:var(--border-radius);cursor:pointer;font-weight:500;transition:all .2s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;font-size:14px;height:44px;box-sizing:border-box}.auth-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.login-button{background-color:var(--accent);color:#fff}.profile-button{background-color:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-subtle)}.profile-mini{width:24px;height:24px;border-radius:50%;object-fit:cover;border:2px solid var(--border-subtle)}.profile-button span{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usage-warning{background-color:#fef3cd;color:#856404;padding:15px;margin:0 20px;border-radius:var(--border-radius);border:1px solid #ffeaa7;display:flex;align-items:center;justify-content:space-between;gap:15px}.usage-warning p{margin:0;font-weight:500}.upgrade-button{background-color:var(--accent);color:#fff;border:none;padding:10px 20px;border-radius:var(--border-radius);cursor:pointer;font-weight:500;transition:background-color .2s}.upgrade-button:hover{background-color:var(--accent-hover)}@media (max-width: 1200px){.main-content-grid{grid-template-columns:25% 45% 30%}}@media (max-width: 768px){.sticky-top-bar{flex-direction:column;gap:10px;padding:15px}.top-bar-left{flex-direction:column;text-align:center}.main-content-grid{grid-template-columns:1fr;gap:15px;padding:15px}.app-title{font-size:1.5em}.logo-image-small{width:40px;height:40px}}.debug-panel{margin-bottom:20px}.debug-content{display:flex;flex-direction:column;gap:15px}.debug-section{padding:10px;background-color:#8b91b40d;border-radius:var(--border-radius);border:1px solid var(--border-subtle)}.debug-section h4{margin:0 0 8px;color:var(--text-muted);font-size:14px;font-weight:600}.debug-section p{margin:0;font-size:13px;color:var(--text-primary)}.debug-section pre{margin:0;font-size:11px;color:var(--text-primary);white-space:pre-wrap;word-break:break-word;max-height:200px;overflow-y:auto;padding:8px;background-color:#0003;border-radius:4px}.audio-section{margin-bottom:20px}.audio-section .file-drop-zone{margin-top:15px}.upload-buttons{display:flex;gap:8px;justify-content:center;margin-bottom:12px;flex-wrap:wrap}.upload-buttons .file-select-button{padding:8px 12px;font-size:11px;min-width:80px;text-align:center}.upload-buttons .file-select-button span{display:block;font-size:10px}.modal-overlay,.user-profile-modal{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0b0e17cc;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.user-profile-modal .modal-content{background-color:var(--bg-surface);border-radius:var(--border-radius);box-shadow:var(--shadow);max-width:600px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:profileSlideIn .3s ease}.modal-backdrop{position:absolute;top:0;left:0;right:0;bottom:0}@keyframes profileSlideIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.close-button{position:absolute;top:15px;right:15px;background:none;border:none;font-size:24px;color:var(--text-primary);cursor:pointer;opacity:.8;transition:opacity .2s;z-index:10}.profile-header{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);color:var(--text-primary);padding:30px;border-radius:var(--border-radius) var(--border-radius) 0 0;display:flex;align-items:center;gap:20px}.profile-avatar{width:80px;height:80px;border-radius:50%;overflow:hidden;border:3px solid rgba(255,255,255,.3);flex-shrink:0}.profile-avatar img{width:100%;height:100%;object-fit:cover}.avatar-initials{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#fff3;font-size:32px;font-weight:700}.profile-info h2{margin:0 0 5px;font-size:24px;font-weight:700}.email{margin:0 0 10px;opacity:.9;font-size:16px}.user-tier{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.user-tier.premium{background-color:gold;color:#2c3e50}.user-tier.free{background-color:#fff3;color:#fff}.tier-icon{font-size:16px}.profile-content{padding:30px}.subscription-info,.usage-info,.license-info{margin-bottom:30px;padding-bottom:25px;border-bottom:1px solid var(--border-subtle)}.subscription-info:last-child,.usage-info:last-child,.license-info:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.subscription-info h3,.usage-info h3,.license-info h3{margin:0 0 20px;color:var(--text-primary);font-size:18px;font-weight:600;display:flex;align-items:center;gap:8px}.subscription-details,.license-details{display:flex;flex-direction:column;gap:12px}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.detail-item strong{color:var(--text-primary);font-weight:600}.detail-item span{color:var(--text-primary);opacity:.8}.premium-text{color:#f39c12!important;font-weight:600!important;opacity:1!important}.free-text{color:var(--text-primary)!important;opacity:.7!important}.active{color:#27ae60!important;font-weight:600!important;opacity:1!important}.inactive{color:#e74c3c!important;font-weight:600!important;opacity:1!important}.features-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}.feature-tag{background-color:var(--accent);color:var(--text-primary);padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500;text-transform:capitalize}.usage-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px}.usage-stat{text-align:center;padding:15px;background-color:var(--bg-primary);border-radius:var(--border-radius);border:1px solid var(--border-subtle)}.stat-value{display:block;font-size:20px;font-weight:700;color:var(--accent);margin-bottom:5px}.stat-label{font-size:12px;color:var(--text-primary);opacity:.7;text-transform:uppercase;letter-spacing:.5px}.profile-actions{padding:20px 30px 30px;display:flex;justify-content:center}.logout-button{background-color:var(--secondary-color);color:var(--text-primary);border:none;padding:12px 30px;border-radius:var(--border-radius);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.logout-button:hover{background-color:#c0392b;transform:translateY(-2px);box-shadow:0 4px 12px #e74c3c4d}@media (max-width: 768px){.user-profile-modal{margin:10px;max-height:95vh}.profile-header{padding:20px;flex-direction:column;text-align:center;gap:15px}.profile-avatar{width:60px;height:60px}.avatar-initials{font-size:24px}.profile-info h2{font-size:20px}.profile-content{padding:20px}.usage-stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.usage-stat{padding:10px}.stat-value{font-size:16px}.detail-item{flex-direction:column;align-items:flex-start;gap:4px}.profile-actions{padding:15px 20px 25px}}.paypal-button-container{width:100%}.payment-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;color:var(--text-primary)}.loading-spinner{width:20px;height:20px;border:2px solid var(--border-subtle);border-top:2px solid var(--accent);border-radius:50%;animation:spin 1s linear infinite}.paypal-button{width:100%;background:linear-gradient(135deg,#0070ba,#005ea6);color:#fff;border:none;border-radius:var(--border-radius);padding:15px 20px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.paypal-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #0070ba4d}.paypal-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.paypal-content{display:flex;align-items:center;justify-content:center;gap:10px}.paypal-logo{font-weight:700;font-family:Arial,sans-serif;letter-spacing:-.5px}.paypal-disclaimer{text-align:center;margin-top:8px;color:var(--text-primary);opacity:.7}.stripe-button-container{width:100%}.stripe-form{margin-bottom:20px;padding:20px;background-color:var(--bg-primary);border-radius:var(--border-radius);border:1px solid var(--border-subtle)}.stripe-form h4{margin:0 0 15px;color:var(--text-primary);font-size:16px;font-weight:600}.card-input-group{margin-bottom:15px}.card-input-row{display:grid;grid-template-columns:2fr 1fr;gap:15px}.card-input-group label{display:block;margin-bottom:5px;color:var(--text-primary);font-weight:500;font-size:14px}.card-input-group input{width:100%;padding:12px;border:1px solid var(--border-subtle);border-radius:var(--border-radius);font-size:14px;background-color:var(--input-bg);color:var(--text-primary);transition:border-color .2s;box-sizing:border-box}.card-input-group input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #3b82f633}.card-input-group input:disabled{opacity:.6;cursor:not-allowed}.stripe-button{width:100%;background:linear-gradient(135deg,#635bff,#4f46e5);color:#fff;border:none;border-radius:var(--border-radius);padding:15px 20px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.stripe-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #635bff4d}.stripe-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.stripe-disclaimer{text-align:center;margin-top:8px;color:var(--text-primary);opacity:.7}.payment-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;color:var(--text-color)}.loading-spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top:2px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.button-loading{display:flex;align-items:center;justify-content:center;gap:10px}@media (max-width: 768px){.card-input-row{grid-template-columns:1fr;gap:15px}.stripe-form{padding:15px}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0b0e17cc;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.premium-upgrade-modal{background-color:var(--bg-surface);border-radius:var(--border-radius);box-shadow:var(--shadow);max-width:500px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.close-button{position:absolute;top:15px;right:15px;background:none;border:none;font-size:24px;color:var(--text-primary);cursor:pointer;opacity:.7;transition:opacity .2s}.close-button:hover{opacity:1}.upgrade-header{text-align:center;padding:30px 30px 20px;background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);color:var(--text-primary);border-radius:var(--border-radius) var(--border-radius) 0 0}.premium-icon{font-size:48px;margin-bottom:10px}.upgrade-header h2{margin:0 0 10px;font-size:28px;font-weight:700}.upgrade-subtitle{margin:0;opacity:.9;font-size:16px}.current-usage{padding:25px 30px;border-bottom:1px solid var(--border-subtle)}.current-usage h3{margin:0 0 15px;color:var(--text-primary);font-size:18px;font-weight:600}.usage-stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}.stat-item{text-align:center;padding:15px;background-color:var(--bg-primary);border-radius:var(--border-radius)}.stat-value{display:block;font-size:28px;font-weight:700;color:var(--accent);margin-bottom:5px}.stat-label{font-size:14px;color:var(--text-primary);opacity:.8}.premium-benefits{padding:25px 30px;border-bottom:1px solid var(--border-subtle)}.premium-benefits h3{margin:0 0 20px;color:var(--text-primary);font-size:18px;font-weight:600}.benefits-list{list-style:none;padding:0;margin:0}.benefits-list li{display:flex;align-items:center;gap:12px;padding:10px 0;color:var(--text-primary);font-size:15px}.benefit-icon{font-size:18px;width:24px;text-align:center}.pricing-section{padding:25px 30px;text-align:center;border-bottom:1px solid var(--border-subtle)}.price-display{display:flex;align-items:baseline;justify-content:center;gap:2px;margin-bottom:10px}.currency{font-size:24px;font-weight:600;color:var(--accent)}.amount{font-size:48px;font-weight:700;color:var(--accent)}.period{font-size:18px;color:var(--text-primary);opacity:.8}.price-note{margin:0;color:var(--text-primary);opacity:.8;font-size:14px}.payment-section{padding:25px 30px;border-bottom:1px solid var(--border-subtle)}.payment-section h3{margin:0 0 15px;color:var(--text-primary);font-size:18px;font-weight:600}.payment-options{display:flex;gap:15px}.payment-option{flex:1;display:flex;align-items:center;padding:15px;border:2px solid var(--border-subtle);border-radius:var(--border-radius);cursor:pointer;transition:all .2s}.payment-option:hover{border-color:var(--accent)}.payment-option.selected{border-color:var(--accent);background-color:#3b82f61a}.payment-option input[type=radio]{display:none}.payment-info{display:flex;align-items:center;gap:10px;width:100%;justify-content:center}.payment-logo{font-size:20px}.upgrade-actions{padding:25px 30px;display:flex;gap:15px}.cancel-button,.upgrade-button{flex:1;padding:12px 20px;border:none;border-radius:var(--border-radius);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.cancel-button{background-color:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border-subtle)}.cancel-button:hover:not(:disabled){background-color:var(--border-subtle)}.upgrade-button{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);color:var(--text-primary)}.upgrade-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}.upgrade-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.processing{display:flex;align-items:center;gap:8px;justify-content:center}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.upgrade-footer{padding:20px 30px 30px;text-align:center}.upgrade-footer p{margin:5px 0;color:var(--text-primary);opacity:.8;font-size:14px}@media (max-width: 768px){.premium-upgrade-modal{margin:10px;max-height:95vh}.upgrade-header,.current-usage,.premium-benefits,.pricing-section,.payment-section,.upgrade-actions,.upgrade-footer{padding-left:20px;padding-right:20px}.usage-stats{grid-template-columns:1fr;gap:15px}.payment-options,.upgrade-actions{flex-direction:column}.amount{font-size:40px}}.privacy-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0b0e17cc;display:flex;justify-content:center;align-items:center;z-index:2000;padding:20px}.privacy-modal-content{background-color:var(--bg-surface);border-radius:8px;width:100%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 8px 32px #0009;border:1px solid var(--border-subtle);color:var(--text-primary)}.privacy-modal-header{display:flex;justify-content:space-between;align-items:center;padding:25px 30px 20px;border-bottom:1px solid var(--border-subtle);flex-shrink:0}.privacy-modal-header h2{margin:0;color:var(--text-primary);font-size:1.5rem;font-weight:600}.privacy-modal-header .close-button{background:none;border:none;color:var(--text-muted);font-size:24px;cursor:pointer;padding:5px;line-height:1;transition:color .2s}.privacy-modal-header .close-button:hover{color:var(--text-primary)}.privacy-modal-body{flex:1;overflow-y:auto;padding:25px 30px 30px}.privacy-section{line-height:1.6}.privacy-section h3{color:var(--accent);margin:30px 0 15px;font-size:1.2rem;font-weight:600;border-bottom:1px solid var(--border-subtle);padding-bottom:8px}.privacy-section h3:first-of-type{margin-top:0}.privacy-section h4{color:var(--accent-hover);margin:20px 0 10px;font-size:1.1rem;font-weight:500}.privacy-section p{color:var(--text-muted);margin:15px 0;text-align:justify}.privacy-section ul{color:var(--text-muted);margin:15px 0;padding-left:20px}.privacy-section li{margin:8px 0}.privacy-section strong{color:var(--text-primary);font-weight:600}.privacy-modal-body::-webkit-scrollbar{width:8px}.privacy-modal-body::-webkit-scrollbar-track{background:#2a2a2a;border-radius:4px}.privacy-modal-body::-webkit-scrollbar-thumb{background:#555;border-radius:4px}.privacy-modal-body::-webkit-scrollbar-thumb:hover{background:#666}@media (max-width: 768px){.privacy-modal-overlay{padding:10px}.privacy-modal-content{max-height:95vh}.privacy-modal-header{padding:20px 20px 15px}.privacy-modal-header h2{font-size:1.3rem}.privacy-modal-body{padding:20px}.privacy-section{font-size:.95rem}.privacy-section h3{font-size:1.1rem}.privacy-section h4{font-size:1rem}}@media (max-width: 480px){.privacy-modal-header{padding:15px 15px 10px}.privacy-modal-body{padding:15px}.privacy-section{font-size:.9rem}}.app{display:flex;flex-direction:column;min-height:100vh}:root{--font-family: "Inter", sans-serif;--bg-primary: #0B0E17;--bg-surface: #141827;--text-primary: #F1F5FF;--text-muted: #8A91B4;--accent: #3B82F6;--accent-hover: #2563EB;--border-subtle: rgba(139, 145, 180, .1);--border-hover: rgba(139, 145, 180, .2);--input-bg: rgba(139, 145, 180, .05);--primary-dark: var(--bg-primary);--secondary-dark: var(--bg-surface);--tertiary-dark: var(--bg-surface);--primary-light: var(--text-primary);--secondary-light: var(--text-muted);--accent-color: var(--accent);--input-border: var(--border-subtle);--input-text: var(--text-primary);--card-bg: var(--bg-surface);--shadow: 0 2px 5px rgba(0, 0, 0, .2);--border-radius: 6px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;font-family:var(--font-family);font-size:16px;line-height:1.6;font-weight:400;color-scheme:dark;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-color:var(--bg-primary);font-family:var(--font-family)}#root{width:100%;margin:0;box-sizing:border-box}button{border-radius:var(--border-radius);border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--bg-surface);color:var(--text-primary);cursor:pointer;transition:border-color .25s,background-color .25s}button:hover{background-color:var(--accent);border-color:var(--accent-hover)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}input,select{font-family:inherit;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--border-subtle);border-radius:var(--border-radius);background-color:var(--input-bg);color:var(--text-primary);font-size:1em;box-sizing:border-box;transition:border-color .2s}input:focus,select:focus{border-color:var(--accent);outline:none}a{font-weight:500;color:var(--accent);text-decoration:inherit;transition:color .2s}a:hover{color:var(--accent-hover)}.card{background-color:var(--card-bg);padding:var(--spacing-md);border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:var(--spacing-lg);text-align:left}h1{font-size:2.5em;line-height:1.1;color:var(--text-primary)}h2{margin-top:0;margin-bottom:var(--spacing-md);font-size:1.4em;color:var(--text-primary);border-bottom:1px solid var(--border-subtle);padding-bottom:var(--spacing-sm)}label{font-size:.9em;color:var(--text-muted);display:block;margin-bottom:var(--spacing-xs)}@media (prefers-color-scheme: dark){:root{color-scheme:dark;color:#ffffffde;background-color:#1a1a1a}}.login-modal,.profile-modal{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0b0e17cc;display:flex;justify-content:center;align-items:center;z-index:1000}.login-container,.profile-container{background-color:var(--bg-surface);border-radius:8px;padding:25px;width:100%;max-width:500px;position:relative;box-shadow:0 4px 20px #00000080;color:var(--text-primary);border:1px solid var(--border-subtle)}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:var(--text-muted)}.form-group input{width:100%;padding:12px;border-radius:4px;border:1px solid var(--border-subtle);background-color:var(--input-bg);color:var(--text-primary);font-size:16px}.primary-button{background-color:var(--accent);color:var(--text-primary);padding:12px 20px;border:none;border-radius:4px;cursor:pointer;font-size:16px;width:100%;transition:background-color .2s}.primary-button:hover{background-color:var(--accent-hover)}.primary-button:disabled{background-color:var(--text-muted);cursor:not-allowed}.text-button{background:none;border:none;color:var(--accent);cursor:pointer;font-size:14px;text-decoration:underline;padding:0}.text-button:hover{color:var(--accent-hover)}.forgot-password{text-align:right;margin-top:8px}.toggle-form{margin-top:20px;text-align:center}.close-button{position:absolute;right:15px;top:15px;background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer}.close-button:hover{color:var(--text-primary)}.error-message{color:#ef4444;margin-bottom:15px;padding:8px 12px;background-color:#ef44441a;border-radius:4px;font-size:14px}.success-message{color:#10b981;margin-bottom:15px;padding:8px 12px;background-color:#10b9811a;border-radius:4px;font-size:14px}.social-login{margin-top:25px;text-align:center}.social-login p{color:var(--text-muted);margin-bottom:15px;position:relative}.social-login p:before,.social-login p:after{content:"";position:absolute;top:50%;width:35%;height:1px;background-color:var(--border-subtle)}.social-login p:before{left:0}.social-login p:after{right:0}.social-buttons{display:flex;justify-content:center;gap:15px}.social-button{display:flex;justify-content:center;align-items:center;width:60px;height:60px;border-radius:50%;border:1px solid var(--border-subtle);background-color:var(--bg-surface);color:var(--text-primary);cursor:pointer;transition:all .2s;font-size:24px}.social-button.google{width:80px;height:80px;font-size:32px;background-color:var(--bg-surface);margin:0 auto}.social-button.google:hover{background-color:#db4437}.social-button.facebook:hover{background-color:#4267b2}.social-button.twitter:hover{background-color:#1da1f2}.social-button.github:hover{background-color:#333}.google-only{width:100%;max-width:240px;height:50px;border-radius:4px;display:flex;align-items:center;justify-content:center;gap:12px;background-color:var(--bg-surface);color:var(--text-primary);font-weight:600;margin:20px auto;transition:background-color .2s}.google-only svg{font-size:24px}.google-only:hover{background-color:var(--accent)}.profile-info{display:flex;gap:20px;margin-bottom:25px}.avatar img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid var(--border-subtle)}.user-details{flex:1}.license-info{margin-top:20px;padding:15px;background-color:var(--bg-surface);border-radius:6px;border:1px solid var(--border-subtle)}.license-info h3{margin-top:0;margin-bottom:15px;color:var(--text-muted)}.license-features ul{margin-top:5px;padding-left:20px}.logout-button{background-color:#dc2626;color:var(--text-primary);padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-size:16px;transition:background-color .2s}.logout-button:hover{background-color:#b91c1c}.login-page{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:var(--bg-primary);padding:20px}.loading-auth{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:var(--bg-primary);color:var(--text-primary);font-size:1.5rem}.app-description{margin-bottom:25px;text-align:center}.app-description p{color:var(--text-muted);line-height:1.5;margin-bottom:20px;font-size:16px}.demo-section{margin-top:20px}.demo-section p{color:var(--text-primary);margin-bottom:10px;font-weight:500}.demo-link{display:inline-flex;align-items:center;gap:8px;color:var(--accent);text-decoration:none;padding:10px 16px;background-color:#3b82f61a;border-radius:6px;border:1px solid rgba(59,130,246,.3);transition:all .2s;font-weight:500}.demo-link:hover{background-color:#3b82f633;border-color:#3b82f680;color:var(--accent-hover);transform:translateY(-2px)}.demo-link svg{font-size:14px}.auth-section{text-align:center;margin-top:25px}.auth-section p{color:var(--text-muted);margin-bottom:15px;font-size:16px}.google-signin-button{width:100%;max-width:280px;height:55px;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:12px;background-color:var(--bg-surface);color:var(--text-primary);font-weight:600;margin:0 auto;transition:all .2s;border:1px solid var(--border-subtle);font-size:16px;cursor:pointer}.google-signin-button:hover:not(:disabled){background-color:var(--accent);border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}.google-signin-button:disabled{background-color:var(--text-muted);border-color:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}.google-signin-button svg{font-size:20px}.privacy-agreement{margin-top:20px;text-align:center;padding-top:15px;border-top:1px solid var(--border-subtle)}.privacy-agreement p{color:var(--text-muted);font-size:14px;margin:0;line-height:1.4}.privacy-link{background:none;border:none;color:var(--accent);cursor:pointer;text-decoration:underline;font-size:14px;padding:0;margin:0;transition:color .2s}.privacy-link:hover{color:var(--accent-hover)}.privacy-link:focus{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}