:root{--background:oklch(1.0000 0 0);--foreground:oklch(0.1450 0 0);--card:oklch(0.9736 0.0062 317.7530);--card-foreground:oklch(0.1450 0 0);--popover:oklch(1 0 0);--popover-foreground:oklch(0.1450 0 0);--primary:oklch(0.5713 0.1127 229.9061);--primary-foreground:oklch(1.0000 0 0);--secondary:oklch(0.9700 0 0);--secondary-foreground:oklch(0.2050 0 0);--muted:oklch(0.9700 0 0);--muted-foreground:oklch(0.5560 0 0);--accent:oklch(0.9349 0.0054 17.2540);--accent-foreground:oklch(0.2050 0 0);--destructive:oklch(0.5770 0.2450 27.3250);--destructive-foreground:oklch(1 0 0);--border:oklch(0.9220 0 0);--input:oklch(0.9220 0 0);--ring:oklch(0.7080 0 0);--chart-1:oklch(0.8100 0.1000 252);--chart-2:oklch(0.6200 0.1900 260);--chart-3:oklch(0.5500 0.2200 263);--chart-4:oklch(0.4900 0.2200 264);--chart-5:oklch(0.4200 0.1800 266);--sidebar:oklch(0.9850 0 0);--sidebar-foreground:oklch(0.1450 0 0);--sidebar-primary:oklch(0.2050 0 0);--sidebar-primary-foreground:oklch(0.9850 0 0);--sidebar-accent:oklch(0.9700 0 0);--sidebar-accent-foreground:oklch(0.2050 0 0);--sidebar-border:oklch(0.9220 0 0);--sidebar-ring:oklch(0.7080 0 0);--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-serif:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--radius:0.625rem;--shadow-2xs:0 1px 3px 0px #0000000d;--shadow-xs:0 1px 3px 0px #0000000d;--shadow-sm:0 1px 3px 0px #0000001a,0 1px 2px -1px #0000001a;--shadow:0 1px 3px 0px #0000001a,0 1px 2px -1px #0000001a;--shadow-md:0 1px 3px 0px #0000001a,0 2px 4px -1px #0000001a;--shadow-lg:0 1px 3px 0px #0000001a,0 4px 6px -1px #0000001a;--shadow-xl:0 1px 3px 0px #0000001a,0 8px 10px -1px #0000001a;--shadow-2xl:0 1px 3px 0px #00000040;--tracking-normal:0em;--spacing:0.25rem}.dark{--background:oklch(0.1450 0 0);--foreground:oklch(0.9850 0 0);--card:oklch(0.2050 0 0);--card-foreground:oklch(0.9850 0 0);--popover:oklch(0.2690 0 0);--popover-foreground:oklch(0.9850 0 0);--primary:oklch(0.9220 0 0);--primary-foreground:oklch(0.2050 0 0);--secondary:oklch(0.2690 0 0);--secondary-foreground:oklch(0.9850 0 0);--muted:oklch(0.2690 0 0);--muted-foreground:oklch(0.7080 0 0);--accent:oklch(0.3710 0 0);--accent-foreground:oklch(0.9850 0 0);--destructive:oklch(0.7040 0.1910 22.2160);--destructive-foreground:oklch(0.9850 0 0);--border:oklch(0.2750 0 0);--input:oklch(0.3250 0 0);--ring:oklch(0.5560 0 0);--chart-1:oklch(0.8100 0.1000 252);--chart-2:oklch(0.6200 0.1900 260);--chart-3:oklch(0.5500 0.2200 263);--chart-4:oklch(0.4900 0.2200 264);--chart-5:oklch(0.4200 0.1800 266);--sidebar:oklch(0.2050 0 0);--sidebar-foreground:oklch(0.9850 0 0);--sidebar-primary:oklch(0.4880 0.2430 264.3760);--sidebar-primary-foreground:oklch(0.9850 0 0);--sidebar-accent:oklch(0.2690 0 0);--sidebar-accent-foreground:oklch(0.9850 0 0);--sidebar-border:oklch(0.2750 0 0);--sidebar-ring:oklch(0.4390 0 0);--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-serif:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--radius:0.625rem;--shadow-2xs:0 1px 3px 0px #0000000d;--shadow-xs:0 1px 3px 0px #0000000d;--shadow-sm:0 1px 3px 0px #0000001a,0 1px 2px -1px #0000001a;--shadow:0 1px 3px 0px #0000001a,0 1px 2px -1px #0000001a;--shadow-md:0 1px 3px 0px #0000001a,0 2px 4px -1px #0000001a;--shadow-lg:0 1px 3px 0px #0000001a,0 4px 6px -1px #0000001a;--shadow-xl:0 1px 3px 0px #0000001a,0 8px 10px -1px #0000001a;--shadow-2xl:0 1px 3px 0px #00000040}@theme inline{--color-background:var(--background);--color-foreground:var(--foreground);--color-card:var(--card);--color-card-foreground:var(--card-foreground);--color-popover:var(--popover);--color-popover-foreground:var(--popover-foreground);--color-primary:var(--primary);--color-primary-foreground:var(--primary-foreground);--color-secondary:var(--secondary);--color-secondary-foreground:var(--secondary-foreground);--color-muted:var(--muted);--color-muted-foreground:var(--muted-foreground);--color-accent:var(--accent);--color-accent-foreground:var(--accent-foreground);--color-destructive:var(--destructive);--color-destructive-foreground:var(--destructive-foreground);--color-border:var(--border);--color-input:var(--input);--color-ring:var(--ring);--color-chart-1:var(--chart-1);--color-chart-2:var(--chart-2);--color-chart-3:var(--chart-3);--color-chart-4:var(--chart-4);--color-chart-5:var(--chart-5);--color-sidebar:var(--sidebar);--color-sidebar-foreground:var(--sidebar-foreground);--color-sidebar-primary:var(--sidebar-primary);--color-sidebar-primary-foreground:var(--sidebar-primary-foreground);--color-sidebar-accent:var(--sidebar-accent);--color-sidebar-accent-foreground:var(--sidebar-accent-foreground);--color-sidebar-border:var(--sidebar-border);--color-sidebar-ring:var(--sidebar-ring);--font-sans:var(--font-sans);--font-mono:var(--font-mono);--font-serif:var(--font-serif);--radius-sm:calc(var(--radius) - 4px);--radius-md:calc(var(--radius) - 2px);--radius-lg:var(--radius);--radius-xl:calc(var(--radius) + 4px);--shadow-2xs:var(--shadow-2xs);--shadow-xs:var(--shadow-xs);--shadow-sm:var(--shadow-sm);--shadow:var(--shadow);--shadow-md:var(--shadow-md);--shadow-lg:var(--shadow-lg);--shadow-xl:var(--shadow-xl);--shadow-2xl:var(--shadow-2xl)}body,html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;background:var(--color-background);color:var(--color-foreground);display:flex;flex-direction:column;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-family:var(--font-sans);justify-content:flex-start;margin:0;padding:0}#root,body,html{height:100%;width:100%}.app{align-items:center;background:linear-gradient(135deg,#ebf1f4,#f1e8ea);display:flex;flex-direction:column;justify-content:flex-start;min-height:100vh;overflow-x:hidden;width:100%}.header-icon{height:50px;margin-right:10px;width:50px}.header-text{display:flex;flex:1 1;justify-content:center}.header{background-color:#ffffff6a;background-position:50%;background-repeat:no-repeat;background-size:cover;box-sizing:border-box;color:#fff;height:70px;justify-content:space-between;padding:0 20px;position:fixed;top:0;width:100%;z-index:10}.header,.header-left{align-items:center;display:flex}.login-button{background:linear-gradient(90deg,#f88,#88f);border:none;border-radius:20px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px;transition:opacity .3s ease}.login-button:hover{opacity:.8}.back-button{background:#fff3;border:1px solid #ffffff4d;border-radius:20px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .3s ease}.back-button:hover{background:#ffffff4d}.header-content{color:#fff;font-size:24px;text-align:center}.main-content{align-items:flex-start;flex:1 1;max-width:1200px;padding:90px 20px 80px}.container,.main-content{box-sizing:border-box;display:flex;justify-content:center}.container{align-items:center;background-color:#fff;bottom:0;height:70px;padding:10px 20px;position:fixed;width:100%;z-index:100}.powered-by{color:#666;font-size:12px;position:absolute;right:20px;text-align:right}.powered-by-link{color:#666;text-decoration:none;transition:color .3s ease}.powered-by-link:hover{color:#333;text-decoration:underline}.company-name{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:1.2rem;font-weight:700;text-decoration:none}.toggle-button{background:linear-gradient(90deg,#f88,#88f);background-color:#6200ea;border:none;border-radius:25px;color:#fff;cursor:pointer;font-size:16px;height:50px;padding:10px 20px;position:relative;transition:all .3s ease;width:200px}.toggle-button:hover{box-shadow:0 4px 8px #0003;transform:translateY(-2px)}.toggle-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.browse-button{background:linear-gradient(90deg,#667eea,#764ba2)}#audioCanvas{background:#0000;border-radius:25px;height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:1000}@media (max-width:768px){.app{height:auto;min-height:100vh}.header{height:60px;padding:0 15px}.header-icon{height:40px;margin-right:8px;width:40px}.container{margin-top:80px;padding:10px}.main-content{padding-top:80px}.login-button{font-size:14px;padding:6px 12px}}@media (max-width:480px){.header{height:55px;padding:0 10px}.header-icon{height:35px;margin-right:6px;width:35px}.header h1{font-size:20px}.container{margin-top:75px;padding:8px}.main-content{padding-top:75px}.login-button{font-size:12px;padding:4px 8px}}.main-content{margin-top:0;padding-top:90px;width:100%}.markdown-container{display:flex;flex-direction:column;margin-top:0;max-width:85%;padding:100px 20px;width:100%}.markdown-card{word-wrap:break-word;background-color:hsla(0,0%,100%,.685);border-radius:10px;box-shadow:0 2px 4px #0000001a;box-sizing:border-box;margin:5px 0;padding:5px;text-indent:5px;width:100%}.login-container{align-items:center;box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;padding:70px 20px 20px}.login-card{background-color:#ffffffe6;border-radius:20px;box-shadow:0 4px 20px #0000001a;max-width:400px;padding:40px;text-align:center;width:100%}.login-card h2{color:#333;font-size:28px;margin-bottom:10px}.login-card p{color:#666;font-size:16px;margin-bottom:30px}.google-login-button{align-items:center;background:#fff;border:2px solid #ddd;border-radius:25px;color:#333;cursor:pointer;display:flex;font-size:16px;gap:10px;justify-content:center;padding:12px 24px;transition:all .3s ease;width:100%}.google-login-button:hover{background:#f8f9fa;border-color:#bbb;box-shadow:0 4px 12px #0000001a;transform:translateY(-1px)}.google-icon{-webkit-text-fill-color:#0000;background:linear-gradient(90deg,#4285f4,#34a853,#fbbc05,#ea4335);background-clip:text;-webkit-background-clip:text;font-size:18px;font-weight:700}.google-login-wrapper{align-items:center;display:flex;justify-content:center;width:100%}.user-profile{align-items:center;cursor:pointer;display:flex;gap:10px}.user-avatar{border:2px solid #ffffff4d;border-radius:50%;height:32px;transition:border-color .3s ease;width:32px}.user-avatar:hover{border-color:#fff9}.user-profile-dropdown{position:relative}.dropdown-menu{background:#fff;border:1px solid #0000001a;border-radius:12px;box-shadow:0 4px 20px #00000026;margin-top:8px;min-width:250px;overflow:hidden;position:absolute;right:0;top:100%;z-index:1000}.dropdown-header{align-items:center;background:#f8f9fa;display:flex;gap:12px;padding:16px}.dropdown-avatar{border:2px solid #e9ecef;border-radius:50%;height:40px;width:40px}.dropdown-user-info{flex:1 1}.dropdown-name{color:#333;font-size:14px;font-weight:600;margin-bottom:2px}.dropdown-email{color:#666;font-size:12px}.dropdown-divider{background:#e9ecef;height:1px;margin:0}.dropdown-item{align-items:center;color:#333;cursor:pointer;display:flex;font-size:14px;gap:10px;padding:12px 16px;transition:background-color .2s ease}.dropdown-item:hover{background-color:#f8f9fa}.dropdown-item span{font-size:16px;text-align:center;width:20px}.logout-item{border-top:1px solid #e9ecef;color:#dc3545}.logout-item:hover{background-color:#fff5f5}.watermark-button{background:linear-gradient(90deg,#f88,#88f)!important;font-size:16px;font-weight:600;width:260px!important;z-index:3!important}.watermark-button:hover{opacity:.8}.authenticated-page{align-items:center;box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;padding:70px 20px 20px}.authenticated-content{background-color:#ffffffe6;border-radius:20px;box-shadow:0 4px 20px #0000001a;max-width:600px;padding:40px;text-align:center;width:100%}.authenticated-content h2{color:#333;font-size:28px;margin-bottom:20px}.authenticated-content p{color:#666;font-size:16px;margin-bottom:20px}.welcome-actions{align-items:center;display:flex;flex-direction:column;gap:16px;margin:30px 0}.welcome-button{align-items:center;border:none;border-radius:25px;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:8px;height:50px;justify-content:center;padding:12px 24px;transition:all .3s ease;width:280px}.welcome-button:hover:not(:disabled){box-shadow:0 4px 12px #0003;transform:translateY(-2px)}.welcome-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.welcome-button.watermark-button{background:linear-gradient(90deg,#f88,#88f)}.welcome-button.browse-button{background:linear-gradient(90deg,#667eea,#764ba2)}.waveform-cards-container{display:flex;flex-direction:column;margin-top:0;max-width:85%;padding:100px 20px;width:100%}.waveform-cards-container.disabled{filter:blur(1px);opacity:.6;pointer-events:none}.waveform-card{background:#fffffff2;border:1px solid #0000000d;border-radius:16px;box-shadow:0 4px 20px #0000001a;box-sizing:border-box;margin:20px 0;padding:20px;width:100%}.waveform-header{align-items:flex-start;margin-bottom:16px}.file-name{color:#333;font-weight:600;word-break:break-word}.file-metadata{flex-wrap:wrap}.file-metadata span{background:#f8f9fa;border-radius:6px;color:#666;font-size:14px;padding:4px 8px}.header-buttons{align-items:center}.cancel-button{border:none;border-radius:20px;font-size:14px;font-weight:500;padding:6px 12px}.cancel-button,.remove-button{align-items:center;cursor:pointer;display:flex;justify-content:center;transition:all .2s ease}.remove-button{border:none;border-radius:50%;color:#fff;font-size:16px;height:32px;width:32px}.remove-button:hover{transform:scale(1.1)}.waveform-container{border-radius:12px;box-sizing:border-box;margin:16px 0;padding:16px;transition:background-color .2s ease;width:100%}.waveform-container:hover{background:#e9ecef}.waveform-container.dragging{background:#dee2e6}.waveform-canvas{border-radius:8px;box-shadow:0 2px 8px #0000001a;display:block;height:120px;max-width:100%}.waveform-actions{justify-content:center;margin-top:16px}.action-button{border-radius:25px;font-weight:600;transition:all .3s ease}.preview-button{background:linear-gradient(90deg,#28a745,#20c997)}.preview-button:hover:not(:disabled){opacity:.8;transform:translateY(-1px)}.preview-button:disabled{opacity:.5;transform:none}.watermark-button-small{background:linear-gradient(90deg,#f88,#88f)}.watermark-button-small:hover{opacity:.8;transform:translateY(-1px)}.waveform-scrollbar-container{margin-top:12px;padding:0 16px}.waveform-time-info{font-family:monospace}.waveform-scrollbar{background:#e9ecef;border:1px solid #dee2e6;border-radius:10px;height:20px;margin-bottom:8px}.waveform-scrollbar:hover{background:#dee2e6}.waveform-scrollbar-thumb{background:linear-gradient(90deg,#f88,#88f);border:1px solid #ffffff4d;border-radius:10px;box-shadow:0 2px 4px #0000001a;min-width:20px;top:0;transition:opacity .2s ease}.waveform-scrollbar-thumb:hover{opacity:.8}.waveform-scrollbar-thumb:active{opacity:.9}.progress-overlay{align-items:center;display:flex;height:100vh;justify-content:center;left:0;pointer-events:all;position:fixed;top:0;width:100vw;z-index:9999}.progress-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#00000080;height:100%;left:0;position:absolute;top:0;width:100%}.progress-card{animation:progressCardFadeIn .2s ease-out;background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 10px 30px #0000004d;max-width:90vw;padding:0;position:relative;width:450px}@keyframes progressCardFadeIn{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.progress-header{align-items:center;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;padding:20px 24px 16px}.progress-title{color:#333;font-size:18px;font-weight:600;margin:0}.progress-cancel-button{align-items:center;background:none;border:none;border-radius:4px;color:#666;cursor:pointer;display:flex;font-size:20px;height:32px;justify-content:center;line-height:1;padding:4px 8px;transition:all .2s ease;width:32px}.progress-cancel-button:hover{background-color:#f5f5f5;color:#333}.progress-cancel-button:active{background-color:#e0e0e0}.progress-content{padding:20px 24px 24px}.progress-filename{display:flex;flex-direction:column;gap:4px;margin-bottom:16px}.filename-label{color:#666;font-size:12px;font-weight:500;letter-spacing:.5px;text-transform:uppercase}.filename-value{color:#333;font-size:14px;font-weight:500;word-break:break-all}.progress-bar-container{align-items:center;display:flex;gap:12px;margin-bottom:16px}.progress-bar{background-color:#f0f0f0;flex:1 1;height:8px;overflow:hidden}.progress-bar,.progress-bar-fill{border-radius:4px;position:relative}.progress-bar-fill{background:linear-gradient(90deg,#007bff,#0056b3);height:100%;transition:width .3s ease}.progress-bar-fill:after{animation:progressShimmer 2s infinite;background:linear-gradient(90deg,#fff0,#fff3 50%,#fff0);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes progressShimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.progress-percentage{color:#333;font-size:14px;font-weight:600;min-width:45px;text-align:right}.progress-details{color:#666;display:flex;flex-direction:column;font-size:13px;gap:8px}.chunk-info{color:#555;font-weight:500}.bytes-info{color:#666;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.progress-status{color:#007bff;font-style:italic;font-weight:500}.watermarks-info{background-color:#e6f0ff;border-radius:4px;color:#06c;display:inline-block;font-weight:700;margin-top:8px;padding:4px 8px}@media (max-width:480px){.progress-card{margin:10px;width:95vw}.progress-content,.progress-header{padding-left:16px;padding-right:16px}.progress-title{font-size:16px}.filename-value{font-size:13px}}@media (prefers-color-scheme:dark){.progress-card{background:#2a2a2a;border-color:#444}.progress-title{color:#fff}.progress-header{border-bottom-color:#444}.progress-cancel-button{color:#ccc}.progress-cancel-button:hover{background-color:#3a3a3a;color:#fff}.filename-label{color:#999}.filename-value{color:#fff}.progress-bar{background-color:#444}.progress-percentage{color:#fff}.chunk-info{color:#ccc}.bytes-info{color:#999}.progress-status{color:#4da6ff}.watermarks-info{background-color:#1a3d66;color:#66b3ff}}.information-card{align-items:stretch;background:#fff;border-radius:20px;box-shadow:0 8px 32px #0000001a;box-sizing:border-box;display:flex;justify-content:center;min-height:200px;overflow:hidden;padding:0;position:relative;transition:all .3s ease;width:100%}.information-card:hover{box-shadow:0 16px 48px #00000026;transform:translateY(-4px)}.information-card-content{align-items:stretch;display:flex;gap:0;position:relative;width:100%;z-index:1}.information-card-content.desktop-layout{flex-direction:row}.information-card-content.desktop-layout.image-right{flex-direction:row-reverse}.information-card-content.mobile-layout{flex-direction:column;gap:0;text-align:center}.foreground-image-container{align-items:center;display:flex;flex:0 0 45%;justify-content:center;min-height:200px;padding:1px}.desktop-layout .foreground-image-container{flex:0 0 45%}.mobile-layout .foreground-image-container{border-radius:0;flex:none;margin:0;order:1;padding:20px;width:100%}.foreground-image{border-radius:18px;display:block;height:auto;margin:0 auto;max-height:160px;max-width:90%;object-fit:contain;transition:transform .3s ease;width:auto}.information-card:hover .foreground-image{transform:scale(1.02)}.mobile-layout .foreground-image{max-height:150px;max-width:80%}.information-text-container{word-wrap:break-word;align-items:flex-start;background:#fff;box-sizing:border-box;display:flex;flex:1 1;flex-direction:column;justify-content:center;overflow:hidden;overflow-wrap:break-word;padding:25px}.desktop-layout .information-text-container{text-align:left}.mobile-layout .information-text-container{align-items:center;flex:0 0 auto;order:2;padding:20px;text-align:center;width:100%}.information-title{color:#2c3e50;font-size:24px;font-weight:700;line-height:1.3;margin:0 0 24px}.mobile-layout .information-title{font-size:20px;line-height:1.2;margin:0 0 12px}.information-text{word-wrap:break-word;color:#3c3c3c;font-size:18px;font-weight:300;line-height:1.6;margin:0;white-space:pre-wrap}.desktop-layout .information-text{font-size:18px}.mobile-layout .information-text{font-size:14px;line-height:1.4}@media (max-width:768px){.information-card{border-radius:16px;padding:0}.information-card-content{gap:0}}@media (max-width:480px){.information-card{border-radius:12px;padding:0}.information-text{font-size:14px}}@media (min-width:1440px){.information-text{font-size:22px}.information-card-content{gap:60px;max-width:1400px}}.information-banner{box-sizing:border-box;left:50%;margin:0 -50vw;min-height:400px;overflow:hidden;padding:60px 20px;right:50%;width:100vw}.information-banner,.information-banner-content{align-items:center;display:flex;justify-content:center;position:relative}.information-banner-content{gap:40px;max-width:1200px;width:100%}.banner-image-container{align-items:center;display:flex;flex:0 0 auto;justify-content:center;max-width:400px}.banner-image{border-radius:20px;box-shadow:0 10px 30px #0003;height:auto;max-height:300px;max-width:100%;object-fit:contain;transition:transform .3s ease;width:auto}.information-banner:hover .banner-image{transform:scale(1.02)}.banner-text-container{align-items:center;display:flex;flex:1 1;flex-direction:column;gap:25px;justify-content:center;text-align:center}.banner-title-box{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50px;box-shadow:0 8px 25px #00000026;display:inline-block;margin-bottom:10px;max-width:90%;padding:16px 32px;text-align:center}.banner-title{word-wrap:break-word;color:#fff;font-size:32px;font-weight:700;-webkit-hyphens:auto;hyphens:auto;line-height:1.2;margin:0;overflow-wrap:break-word;text-shadow:0 2px 4px #0000001a;white-space:normal}.banner-information{color:#fff;font-size:20px;font-weight:300;line-height:1.6;margin:0;max-width:600px;text-shadow:0 2px 4px #0003}@media (max-width:768px){.information-banner{min-height:300px;padding:40px 15px}.information-banner-content{flex-direction:column;gap:30px;text-align:center}.banner-image-container{max-width:300px;order:1}.banner-image{max-height:200px}.banner-text-container{align-items:center;gap:20px;order:2;text-align:center}.banner-title{font-size:24px}.banner-information{font-size:16px;max-width:100%}}@media (max-width:480px){.information-banner{min-height:250px;padding:30px 10px}.information-banner-content{gap:20px}.banner-image-container{max-width:250px}.banner-image{max-height:150px}.banner-title-box{border-radius:40px;padding:12px 24px}.banner-title{font-size:20px}.banner-information{font-size:14px;line-height:1.5}}@media (max-width:360px){.banner-title{font-size:18px}.banner-information{font-size:13px}}.waveform-card{display:flex;flex-direction:column;overflow:hidden}.waveform-header{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:16px}.file-info{flex:1 1}.file-name{cursor:pointer;font-size:18px;font-weight:700;margin:0 0 8px}.file-name:hover{color:#007bff}.filename-edit-container{align-items:center;display:flex;gap:8px}.filename-input{border:2px solid #007bff;border-radius:4px;font-size:18px;font-weight:700;outline:none;padding:6px 12px;width:300px}.cancel-filename-btn{background:#dc3545;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:6px 10px}.cancel-filename-btn:hover{background:#c82333}.file-metadata{color:#666;display:flex;font-size:14px;gap:16px}.watermark-indicator{align-items:center;color:#f44;display:inline-flex;font-weight:700;gap:4px;margin-left:8px}.watermark-indicator .emoji{font-size:16px}.watermark-indicator .loading-text{font-style:italic}.watermark-indicator .loading-text,.watermark-indicator .position-count{color:#666;font-size:12px;margin-left:4px}.header-buttons{display:flex;gap:8px}.cancel-button,.remove-button{background:#6c757d;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px}.cancel-button:hover,.remove-button:hover{background:#5a6268}.remove-button{background:#dc3545}.remove-button:hover{background:#c82333}.waveform-container{background:#f8f9fa;flex:0 0 50px;padding:12px}.waveform-container.dragging{cursor:grabbing}.waveform-canvas{background:#fff;border:1px solid #ddd;border-radius:4px;cursor:grab;height:50px;-webkit-user-select:none;user-select:none;width:100%}.waveform-canvas:active{cursor:grabbing}.waveform-scrollbar-container{background:#f8f9fa;padding:0 16px 16px}.waveform-time-info{color:#666;display:flex;font-size:12px;justify-content:space-between;margin-bottom:8px}.waveform-scrollbar{background:#e0e0e0;border-radius:4px;cursor:pointer;height:8px;position:relative;width:100%}.waveform-scrollbar-thumb{background:#007bff;border-radius:4px;cursor:grab;height:100%;position:absolute;transition:background-color .2s}.waveform-scrollbar-thumb:hover{background:#0056b3}.waveform-scrollbar-thumb:active{cursor:grabbing}.waveform-actions{background:#fff;border-top:1px solid #e0e0e0;gap:12px;padding:16px}.action-button{align-items:center;display:flex;font-size:14px;gap:6px;padding:10px 20px}.preview-button{background:#28a745;color:#fff}.preview-button:hover:not(:disabled){background:#218838}.preview-button:disabled{background:#6c757d;cursor:not-allowed}.watermark-button-small{background:#007bff;color:#fff}.watermark-button-small:hover:not(:disabled){background:#0056b3}.watermark-button-small:disabled{background:#6c757d;cursor:not-allowed}.watermark-messages-container{background-color:#f8f9fa;border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;margin-top:20px;min-height:150px;overflow:hidden;padding:15px}.watermark-messages-header{align-items:center;display:flex;flex-shrink:0;gap:8px;margin-bottom:10px;margin-top:0}.watermark-messages-header .emoji{font-size:16px}.watermark-messages-info{color:#666;display:flex;flex-shrink:0;font-size:14px;justify-content:space-between;margin-bottom:10px}.watermark-table-container{border-top:1px solid #e5e5e5;display:flex;flex:1 1 auto;flex-direction:column;overflow-y:auto;padding-top:10px}.watermark-table{background-color:#fff;border-collapse:collapse;border-radius:4px;box-shadow:0 1px 2px #0000000d;overflow:hidden;width:100%}.watermark-table thead tr{background-color:#f8f9fa}.watermark-table th{border-bottom:1px solid #e5e5e5;color:#444;font-size:14px;font-weight:700;padding:12px 8px;text-align:left}.watermark-table th.pos-column{min-width:80px}.watermark-table th.id-column{min-width:120px}.watermark-table th.message-column{width:50%}.watermark-table tbody tr{border-bottom:1px solid #f0f0f0}.watermark-table tbody tr:last-child{border-bottom:none}.watermark-table td{padding:10px 8px;text-align:left}.watermark-table .pos-cell{color:#444;font-family:monospace;font-size:13px;font-weight:700}.watermark-table .id-cell{color:#666;font-family:monospace;font-size:11px;word-break:break-all}.watermark-table .message-cell{color:#333;font-size:13px;word-break:break-word}.watermark-table .empty-message{color:#999;font-style:italic}.watermark-no-info{color:#888;padding:20px;text-align:center}.watermark-messages-footer{color:#888;flex-shrink:0;font-size:12px;margin-top:10px;text-align:center}.key-message{background:#fbfbfc;border:1px solid #eef0f3;border-radius:8px;padding:6px 12px}.km-row{grid-gap:6px 12px;display:grid;gap:6px 12px;grid-template-columns:140px 1fr;padding:8px 0}.km-row+.km-row{border-top:1px solid #eef0f3}.km-key{color:#445;font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase}.km-value{color:#222;font-size:13px}.km-links{margin:0;padding-left:16px}.km-links li{margin:2px 0}.km-links a{color:#0d6efd;text-decoration:none}.km-links a:hover{text-decoration:underline}@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.recording-dot{animation:pulse 1.5s infinite;background:#f44;border-radius:50%;height:8px;width:8px}.realtime-info{align-items:center;display:flex;font-size:14px;justify-content:space-between;width:100%}.status-indicator{align-items:center;color:#333;display:flex;font-weight:500;gap:8px}.progress-info{color:#666;font-size:13px}.user-profile-page{background:linear-gradient(135deg,#ebf1f4,#f1e8ea);flex-direction:column;justify-content:flex-start;min-height:100vh;overflow-x:hidden}.profile-header,.user-profile-page{align-items:center;display:flex;width:100%}.profile-header{background-color:#ffffff6a;background-position:50%;background-repeat:no-repeat;background-size:cover;box-sizing:border-box;color:#fff;height:70px;justify-content:space-between;padding:0 20px;position:fixed;top:0;z-index:10}.profile-header .back-button{background:#fff3;border:1px solid #ffffff4d;border-radius:20px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .3s ease}.profile-header .back-button:hover{background:#ffffff4d}.profile-header h1{flex:1 1;font-size:24px;font-weight:400;margin:0;text-align:center}.profile-container{background-color:#ffffffe6;border-radius:20px;box-shadow:0 4px 20px #0000001a;box-sizing:border-box;color:#333;margin:90px auto 20px;max-width:600px;padding:40px;width:100%}.profile-avatar-section{border-bottom:1px solid #e0e0e0;margin-bottom:40px;padding-bottom:30px;text-align:center}.avatar-container{display:inline-block;margin-bottom:15px;position:relative}.profile-avatar{border:4px solid #667eea;border-radius:50%;height:120px;object-fit:cover;transition:all .3s ease;width:120px}.profile-avatar.editable{cursor:pointer;filter:brightness(.8)}.profile-avatar.editable:hover{filter:brightness(.6);transform:scale(1.05)}.avatar-edit-overlay{color:#fff;font-size:12px;left:50%;opacity:0;pointer-events:none;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%);transition:opacity .3s ease}.avatar-container:hover .avatar-edit-overlay{opacity:1}.avatar-edit-overlay span:first-child{display:block;font-size:24px;margin-bottom:5px}.avatar-edit-overlay span:last-child{font-weight:500;text-shadow:1px 1px 2px #000c}.profile-avatar-section h2{color:#333;font-size:24px;font-weight:500;margin:0}.profile-form{padding:0}.form-group{margin-bottom:25px}.form-group label{color:#333;display:block;font-size:14px;font-weight:600;margin-bottom:8px}.form-group input{background-color:#fff;border:2px solid #ddd;border-radius:25px;box-sizing:border-box;color:#333;font-size:16px;padding:12px 16px;transition:all .3s ease;width:100%}.form-group input:disabled{background-color:#f8f9fa;border-color:#e9ecef;color:#666;cursor:not-allowed}.form-group input.editable{background-color:#fff;border-color:#667eea}.form-group input.editable:focus{border-color:#f88;box-shadow:0 4px 12px #f883;outline:none}.watermark-message-field{word-wrap:break-word;background-color:#f8f9fa;border:2px solid #e9ecef;border-radius:25px;box-sizing:border-box;color:#666;cursor:not-allowed;font-family:Courier New,Courier,monospace;font-size:14px;line-height:1.4;overflow-wrap:break-word;padding:12px 16px;resize:none;width:100%}.profile-actions{border-top:1px solid #e9ecef;display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:35px;padding-top:25px}.cancel-button,.edit-button,.save-button{align-items:center;border:none;border-radius:25px;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;height:50px;justify-content:center;padding:12px 24px;transition:all .3s ease;width:180px}.edit-button{background:linear-gradient(90deg,#667eea,#764ba2)}.edit-button:hover{box-shadow:0 4px 12px #0003;transform:translateY(-2px)}.save-button{background:linear-gradient(90deg,#28a745,#20c997)}.save-button:hover{box-shadow:0 4px 12px #0003;transform:translateY(-2px)}.cancel-button{background:#6c757d;color:#fff}.cancel-button:hover{background:#5a6268;transform:translateY(-1px)}@media (max-width:768px){.profile-header{height:60px;padding:0 15px}.profile-header h1{font-size:20px}.profile-container{margin:80px 20px 20px;padding:30px 20px}.form-group input{font-size:14px;padding:10px 14px}.profile-actions{align-items:center;flex-direction:column}.cancel-button,.edit-button,.save-button{max-width:280px;width:100%}}@media (max-width:480px){.profile-header{height:55px;padding:0 10px}.profile-header h1{font-size:18px}.profile-container{margin:75px 15px 20px;padding:25px 15px}.form-group input{font-size:14px;padding:10px 12px}.cancel-button,.edit-button,.save-button{font-size:14px;height:45px}}.waveform-browser-overlay{align-items:center;background-color:#00000080;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.waveform-browser{background:#fff;border-radius:12px;box-shadow:0 10px 30px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:800px;overflow:hidden;width:100%}.waveform-browser-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e0e0e0;color:#fff;display:flex;justify-content:space-between;padding:20px 24px}.waveform-browser-header h2{font-size:20px;font-weight:600;margin:0}.close-button{align-items:center;background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:18px;height:32px;justify-content:center;transition:background-color .2s;width:32px}.close-button:hover{background:#ffffff4d}.waveform-browser-controls{align-items:center;background:#f8f9fa;border-bottom:1px solid #e0e0e0;display:flex;flex-wrap:wrap;gap:16px;padding:16px 24px}.search-container{flex:1 1;min-width:200px}.search-input{border:1px solid #ddd;border-radius:6px;box-sizing:border-box;font-size:14px;padding:8px 12px;width:100%}.search-input:focus{border-color:#667eea;box-shadow:0 0 0 2px #667eea1a;outline:none}.sort-controls{align-items:center;display:flex;gap:8px}.sort-select{background:#fff;border:1px solid #ddd;border-radius:6px;cursor:pointer;font-size:14px;padding:8px 12px}.sort-order-button{align-items:center;background:#667eea;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:14px;height:32px;justify-content:center;transition:background-color .2s;width:32px}.sort-order-button:hover{background:#5a6fd8}.waveform-browser-content{flex:1 1;overflow-y:auto;padding:0}.empty-container,.error-container,.loading-container{align-items:center;color:#666;display:flex;flex-direction:column;justify-content:center;padding:40px 20px;text-align:center}.loading-spinner{animation:spin 1s linear infinite;font-size:24px;margin-bottom:12px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-message{color:#e74c3c;font-weight:500;margin-bottom:16px}.retry-button{background:#667eea;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .2s}.retry-button:hover{background:#5a6fd8}.waveforms-list{padding:0}.waveforms-count{background:#fafafa;border-bottom:1px solid #f0f0f0;color:#666;font-size:14px;padding:12px 24px}.waveform-item{align-items:center;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;padding:10px 20px;transition:background-color .2s}.waveform-item:hover{background:#f8f9fa}.waveform-info{flex:1 1;min-width:0}.waveform-name{color:#333;font-size:16px;font-weight:600;margin-bottom:8px;word-break:break-word}.waveform-metadata{display:flex;flex-wrap:wrap;gap:16px}.metadata-item{background:#f0f0f0;border-radius:4px;color:#666;font-size:12px;padding:2px 6px;white-space:nowrap}.waveform-actions{border:none;display:flex;gap:8px;margin-left:16px}.action-button{border:none;border-radius:6px;cursor:pointer;font-size:12px;font-weight:500;padding:8px 12px;transition:all .2s;white-space:nowrap}.select-button{background:#28a745;color:#fff}.select-button:hover{background:#218838;transform:translateY(-1px)}.delete-button{background:#dc3545;color:#fff}.delete-button:hover{background:#c82333;transform:translateY(-1px)}.delete-button.disabled{cursor:not-allowed;opacity:.7}.delete-button.disabled,.delete-button.disabled:hover{background:#6c757d;transform:none}.waveform-browser-footer{background:#f8f9fa;border-top:1px solid #e0e0e0;padding:16px 24px;text-align:right}.close-footer-button{background:#6c757d;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;padding:10px 20px;transition:background-color .2s}.close-footer-button:hover{background:#5a6268}@media (max-width:768px){.waveform-browser-overlay{padding:10px}.waveform-browser{max-height:95vh}.waveform-browser-controls{align-items:stretch;flex-direction:column}.sort-controls{justify-content:center}.waveform-item{align-items:stretch;flex-direction:column;gap:12px}.waveform-actions{margin-left:0}.waveform-actions,.waveform-metadata{justify-content:center}}@media (max-width:480px){.waveform-browser-header{padding:16px}.waveform-browser-controls,.waveform-item{padding:12px 16px}.waveforms-count{padding:8px 16px}.metadata-item{font-size:11px}.action-button{font-size:11px;padding:6px 10px}}.technology-showcase{display:flex;flex-direction:column;gap:40px;margin:120px auto 60px;max-width:1200px;padding:30px 60px}.technology-showcase .information-banner+.information-banner{margin-top:-40px}.showcase-section{align-items:stretch;background:#fff;border-radius:20px;box-shadow:0 8px 32px #0000001a;display:flex;gap:0;margin-bottom:50px;min-height:200px;overflow:hidden;transition:all .3s ease}.showcase-section:hover{box-shadow:0 16px 48px #00000026;transform:translateY(-4px)}.showcase-section:last-child{margin-bottom:0}.showcase-section.reverse{flex-direction:row-reverse}.showcase-card{background:#0000;border:none;border-radius:0;box-shadow:none;display:flex;flex-direction:column;justify-content:center;padding:24px;transition:none}.showcase-card:hover{box-shadow:none;transform:none}.showcase-image-container{align-items:center;background:linear-gradient(135deg,#ffb6c1,#c0df94);display:flex;flex:0 0 45%;justify-content:center;min-height:200px;padding:1px}.showcase-section:first-child .showcase-image-container{background:linear-gradient(135deg,#b9dca7,#87ceeb)}.showcase-image{border-radius:18px;display:block;height:auto;margin:0 auto;max-height:160px;max-width:90%;object-fit:contain;transition:transform .3s ease;width:auto}.showcase-section:hover .showcase-image{transform:scale(1.02)}.showcase-content{word-wrap:break-word;box-sizing:border-box;display:flex;flex:1 1;flex-direction:column;justify-content:center;overflow:hidden;overflow-wrap:break-word;padding:25px}.showcase-content.left,.showcase-content.right{text-align:left}.showcase-title{color:#2c3e50;font-size:24px;font-weight:700;line-height:1.3;margin-bottom:24px}.showcase-description{color:#3c3c3c;font-size:18px;line-height:1.6;margin:0}@media (max-width:700px){.technology-showcase{gap:30px;margin:80px auto 100px;min-height:0;padding:15px 30px}.technology-showcase .information-banner+.information-banner{margin-top:-30px}.showcase-section,.showcase-section.reverse{border-radius:16px;flex-direction:column;gap:0;margin-bottom:60px;min-height:0}.showcase-section:last-child{margin-bottom:30px}.showcase-image-container{align-items:center;background:linear-gradient(135deg,#ffb6c1,#c0df94);display:flex;flex:none;justify-content:center;order:1;padding:20px;width:100%}.showcase-section:first-child .showcase-image-container{background:linear-gradient(135deg,#b9dca7,#87ceeb)}.showcase-image{display:block;height:auto;margin:0 auto;max-height:150px;max-width:80%;object-fit:contain;width:auto}.showcase-content{word-wrap:break-word;box-sizing:border-box;flex:0 0 auto;order:2;overflow:hidden;overflow-wrap:break-word;padding:20px;text-align:center;width:100%}.showcase-content.left,.showcase-content.right{text-align:center}.showcase-title{font-size:20px;line-height:1.2;margin-bottom:12px}.showcase-description{font-size:14px;line-height:1.4;margin:0}}