@charset "UTF-8";:root{--ds-surface-0: #0a1324;--ds-surface-1: #111d33;--ds-surface-2: #182741;--ds-surface-3: #1f3050;--ds-border: #223553;--ds-border-strong: #2f4668;--ds-text: #f2eee2;--ds-text-2: #a7b3c4;--ds-text-3: #8593a8;--ds-accent: #d4a257;--ds-accent-hover: #e0b06a;--ds-accent-soft: rgba(212, 162, 87, .14);--ds-on-accent: #0a1324;--ds-link: #6aaef5;--ds-success: #5fcf8a;--ds-warning: #e3b341;--ds-danger: #ef6b6b;--ds-info: #6aaef5;--ds-focus-ring: 0 0 0 2px var(--ds-surface-0), 0 0 0 4px var(--ds-accent);--ds-shadow-overlay: 0 8px 24px rgba(0, 0, 0, .35);--ds-font-sans: "Supreme", sans-serif;--ds-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--ds-text-xs: 12px;--ds-text-sm: 13px;--ds-text-md: 14px;--ds-text-lg: 16px;--ds-text-xl: 20px;--ds-text-2xl: 24px;--ds-text-3xl: 32px;--ds-weight-regular: 400;--ds-weight-medium: 500;--ds-weight-semibold: 600;--ds-weight-bold: 700;--ds-leading: 1.5;--ds-leading-tight: 1.25;--ds-tracking-tight: -.01em;--ds-space-1: 4px;--ds-space-2: 8px;--ds-space-3: 12px;--ds-space-4: 16px;--ds-space-5: 20px;--ds-space-6: 24px;--ds-space-8: 32px;--ds-space-10: 40px;--ds-space-12: 48px;--ds-space-16: 64px;--ds-radius-sm: 6px;--ds-radius-md: 10px;--ds-radius-lg: 16px;--ds-radius-full: 999px;--ds-border-width: 1px;--ds-duration: .15s;--ds-duration-slow: .25s;--ds-ease: cubic-bezier(.2, 0, 0, 1);--ds-control-sm: 28px;--ds-control-md: 36px;--ds-control-lg: 40px;--ds-row-height: 44px;--ds-topbar-height: 56px;--ds-player-height: 60px;--ds-icon-sm: 16px;--ds-icon-md: 20px;--ds-icon-stroke: 1.75;--ds-container: 1200px;--ds-gutter: 24px;--ds-gap: 20px;--ds-z-topbar: 500;--ds-z-player: 900;--ds-z-backdrop: 1000;--ds-z-dialog: 1001;--ds-z-toast: 9999}.light-theme{--ds-surface-0: #f6f5f1;--ds-surface-1: #ffffff;--ds-surface-2: #f0eee8;--ds-surface-3: #e8e5dd;--ds-border: #e2dfd7;--ds-border-strong: #cbc6ba;--ds-text: #14213a;--ds-text-2: #3f4a60;--ds-text-3: #5f6b84;--ds-accent: #c9984d;--ds-accent-hover: #b8842f;--ds-accent-soft: rgba(201, 152, 77, .16);--ds-on-accent: #14213a;--ds-link: #0f5aa8;--ds-success: #177a42;--ds-warning: #9a6416;--ds-danger: #c93c3c;--ds-info: #0f5aa8;--ds-focus-ring: 0 0 0 2px var(--ds-surface-0), 0 0 0 4px var(--ds-accent);--ds-shadow-overlay: 0 8px 24px rgba(20, 33, 58, .12)}:root[data-theme=light]{--ds-surface-0: #f6f5f1;--ds-surface-1: #ffffff;--ds-surface-2: #f0eee8;--ds-surface-3: #e8e5dd;--ds-border: #e2dfd7;--ds-border-strong: #cbc6ba;--ds-text: #14213a;--ds-text-2: #3f4a60;--ds-text-3: #5f6b84;--ds-accent: #c9984d;--ds-accent-hover: #b8842f;--ds-accent-soft: rgba(201, 152, 77, .16);--ds-on-accent: #14213a;--ds-link: #0f5aa8;--ds-success: #177a42;--ds-warning: #9a6416;--ds-danger: #c93c3c;--ds-info: #0f5aa8;--ds-focus-ring: 0 0 0 2px var(--ds-surface-0), 0 0 0 4px var(--ds-accent);--ds-shadow-overlay: 0 8px 24px rgba(20, 33, 58, .12)}:root[data-theme=contrast-light],:root[data-theme=contrast-light] .light-theme{--ds-surface-0: #f6f5f1;--ds-surface-1: #ffffff;--ds-surface-2: #f0eee8;--ds-surface-3: #e8e5dd;--ds-border: #8a8170;--ds-border-strong: #6f6757;--ds-text: #14213a;--ds-text-2: #2f3a4f;--ds-text-3: #3d475b;--ds-accent: #6b4910;--ds-accent-hover: #573b0d;--ds-accent-soft: rgba(107, 73, 16, .14);--ds-on-accent: #ffffff;--ds-link: #0b4a8c;--ds-success: #0e5a30;--ds-warning: #6b450c;--ds-danger: #922626;--ds-info: #0b4a8c;--ds-focus-ring: 0 0 0 2px var(--ds-surface-0), 0 0 0 4px var(--ds-text);--ds-shadow-overlay: 0 8px 24px rgba(20, 33, 58, .12)}:root[data-theme=contrast-dark]{--ds-border: #62799c;--ds-border-strong: #7890b2;--ds-text-2: #cdd5e0;--ds-text-3: #bcc6d3;--ds-accent: #e0b06a;--ds-accent-hover: #ecc488;--ds-accent-soft: rgba(224, 176, 106, .16);--ds-link: #a3cdf9;--ds-success: #8ee3ae;--ds-warning: #f2c867;--ds-danger: #f8a5a5;--ds-info: #a3cdf9;--ds-focus-ring: 0 0 0 2px var(--ds-surface-0), 0 0 0 4px var(--ds-text)}@font-face{font-family:Supreme;font-weight:400;font-style:normal;font-display:swap;src:url(/mp3konverter/assets/Supreme-Regular-4XHPfODv.woff2) format("woff2")}@font-face{font-family:Supreme;font-weight:500;font-style:normal;font-display:swap;src:url(/mp3konverter/assets/Supreme-Medium-r1fq46EK.woff2) format("woff2")}@font-face{font-family:Supreme;font-weight:700;font-style:normal;font-display:swap;src:url(/mp3konverter/assets/Supreme-Bold-tOPSM1Q8.woff2) format("woff2")}:root[data-theme=dark],:root[data-theme=contrast-dark]{color-scheme:dark}:root[data-theme=light],:root[data-theme=contrast-light]{color-scheme:light}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}#app{min-height:100%}body{font-family:var(--ds-font-sans);font-size:var(--ds-text-lg);line-height:var(--ds-leading);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--ds-surface-0);color:var(--ds-text);overflow-x:hidden;transition:background-color var(--ds-duration-slow) var(--ds-ease),color var(--ds-duration-slow) var(--ds-ease)}h1,h2,h3,h4{line-height:var(--ds-leading-tight)}button,input,select{font:inherit;color:inherit}body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]){background-color:transparent!important}:where(body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie])) :where(*:not(.cookie-banner):not(.cookie-consent):not([class*=cookie])){background-color:transparent!important}body>:not(#app):not(script) [class*=drop],body>:not(#app):not(script) [class*=sub-menu],body>:not(#app):not(script) [class*=submenu],body>:not(#app):not(script) [class*=popup],body>:not(#app):not(script) [class*=popover],body>:not(#app):not(script) [class*=megamenu]{background-color:var(--ds-surface-1)!important}body>:not(#app):not(script) .global-nav-links.is-open{background-color:var(--ds-surface-1)!important}body>:not(#app):not(script):not([class*=cookie]) span:empty{background-color:currentColor!important;border-color:currentColor!important}body>:not(#app):not(script):not([class*=cookie]) [aria-expanded]>span:empty,body>:not(#app):not(script):not([class*=cookie]) [aria-expanded]>span>span:empty,body>:not(#app):not(script):not([class*=cookie]) [aria-expanded]>div>span:empty{background-color:currentColor!important;border-color:currentColor!important}body>:not(#app):not(script):not([class*=cookie]) button svg line,body>:not(#app):not(script):not([class*=cookie]) button svg path,body>:not(#app):not(script):not([class*=cookie]) button svg rect,body>:not(#app):not(script):not([class*=cookie]) [aria-expanded] svg line,body>:not(#app):not(script):not([class*=cookie]) [aria-expanded] svg path,body>:not(#app):not(script):not([class*=cookie]) [aria-expanded] svg rect,body>:not(#app):not(script):not([class*=cookie]) [role=button] svg line,body>:not(#app):not(script):not([class*=cookie]) [role=button] svg path,body>:not(#app):not(script):not([class*=cookie]) [role=button] svg rect{stroke:currentColor!important;fill:currentColor!important}body>:not(#app):not(script) [class*=toggler-icon]{filter:brightness(0) saturate(100%)!important}:root[data-theme=dark] body>:not(#app):not(script) [class*=toggler-icon],:root[data-theme=contrast-dark] body>:not(#app):not(script) [class*=toggler-icon]{filter:brightness(0) saturate(100%) invert(1)!important}.cookie-banner,.cookie-consent,[class*=cookie-banner],[class*=cookie-consent],[id*=cookie-banner],[id*=cookie-consent]{z-index:10000!important;position:fixed!important}body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]),body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) *:not([class*=cookie]):not([id*=cookie]){color:var(--ds-text)!important}body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) a:not([class*=cookie]):not([id*=cookie]),body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) a:not([class*=cookie]):not([id*=cookie]) *{color:var(--ds-link)!important}body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) a:hover:not([class*=cookie]):not([id*=cookie]),body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) a:hover:not([class*=cookie]):not([id*=cookie]) *{color:var(--ds-accent)!important}body>:not(#app):not(script):not(.cookie-banner):not(.cookie-consent):not([class*=cookie]):not([id*=cookie]) [data-lang].global-nav-lang-btn.active{background-color:var(--ds-accent)!important;color:var(--ds-on-accent)!important}.visually-hidden,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.glass-card{background:var(--ds-surface-1);border:var(--ds-border-width) solid var(--ds-border);border-radius:var(--ds-radius-lg);transition:border-color var(--ds-duration) var(--ds-ease)}.glass-card:hover{border-color:var(--ds-border-strong)}:focus-visible{outline:2px solid var(--ds-accent);outline-offset:2px}.btn-secondary:focus-visible,.action-btn:focus-visible,.play-file-btn:focus-visible,.remove-file-btn:focus-visible,.save-file-btn:focus-visible,.player-btn:focus-visible,.option-select:focus-visible,.faq-question:focus-visible,.tool-card:focus-visible,.skip-link:focus-visible{outline:none;box-shadow:var(--ds-focus-ring)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--ds-space-2);height:var(--ds-control-md);padding:0 var(--ds-space-4);border:var(--ds-border-width) solid var(--ds-border-strong);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text);font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);line-height:1;white-space:nowrap;cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),border-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.btn-secondary:hover{background:var(--ds-surface-3)}.action-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ds-space-2);height:var(--ds-control-md);padding:0 var(--ds-space-4);border:var(--ds-border-width) solid transparent;border-radius:var(--ds-radius-md);background:var(--ds-accent);color:var(--ds-on-accent);font-size:var(--ds-text-md);font-weight:var(--ds-weight-semibold);line-height:1;white-space:nowrap;text-decoration:none;cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),border-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.action-btn:hover:not(:disabled){background:var(--ds-accent-hover)}.action-btn:disabled{opacity:.45;cursor:not-allowed}.convert-btn{width:100%;height:var(--ds-control-lg);padding:0 var(--ds-space-5);font-size:var(--ds-text-lg)}.convert-btn.converting-pulse:disabled{opacity:1;cursor:progress}.cancel-btn.action-btn{width:100%;background:transparent;color:var(--ds-danger)}.cancel-btn.action-btn:hover:not(:disabled){background:var(--ds-surface-2)}.retry-btn.action-btn{width:100%;border-color:var(--ds-border-strong);background:var(--ds-surface-2);color:var(--ds-text);font-weight:var(--ds-weight-medium)}.retry-btn.action-btn:hover:not(:disabled){background:var(--ds-surface-3)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-icon{animation:spin .9s linear infinite}.container{max-width:800px;margin:0 auto;display:flex;flex-direction:column}.website-header{position:sticky;top:0;z-index:var(--ds-z-topbar);background:var(--ds-surface-1);border-bottom:var(--ds-border-width) solid var(--ds-border)}.website-header-container{max-width:var(--ds-container);min-height:var(--ds-topbar-height);margin:0 auto;padding:0 var(--ds-gutter);display:flex;justify-content:space-between;align-items:center}.website-logo{font-size:var(--ds-text-xl);font-weight:var(--ds-weight-bold);color:var(--ds-text);display:flex;align-items:center;gap:var(--ds-space-2)}.main-content{flex:1;display:flex;flex-direction:column;gap:var(--ds-space-4)}.hero{padding:var(--ds-space-10) var(--ds-gutter) var(--ds-space-6);text-align:center}.hero-container{max-width:var(--ds-container);margin:0 auto}.hero h1{max-width:48rem;margin:0 auto var(--ds-space-3);font-size:var(--ds-text-3xl);font-weight:var(--ds-weight-bold);line-height:var(--ds-leading-tight);letter-spacing:var(--ds-tracking-tight);color:var(--ds-text);animation:fadeIn var(--ds-duration-slow) var(--ds-ease)}.hero p{max-width:42rem;margin:0 auto;font-size:var(--ds-text-lg);color:var(--ds-text-2);animation:fadeIn var(--ds-duration-slow) var(--ds-ease)}.trust-badges{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--ds-space-2) var(--ds-space-6);margin-top:var(--ds-space-5)}.trust-badge{display:inline-flex;align-items:center;gap:var(--ds-space-2);font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);color:var(--ds-text-2)}.trust-badge svg{width:var(--ds-icon-sm);height:var(--ds-icon-sm);flex-shrink:0}.converter-section{max-width:760px;margin:0 auto var(--ds-space-10);padding:0 var(--ds-gutter)}.converter-wrapper{background:var(--ds-surface-1);border:var(--ds-border-width) solid var(--ds-border);border-radius:var(--ds-radius-lg);padding:var(--ds-space-5)}.file-list-section,.options-section,.converted-list-section{padding-top:var(--ds-space-4);border-top:var(--ds-border-width) solid var(--ds-border)}.section-heading{margin:0 0 var(--ds-space-3);font-size:var(--ds-text-md);font-weight:var(--ds-weight-semibold);line-height:var(--ds-leading);color:var(--ds-text)}.drop-area{border:var(--ds-border-width) dashed var(--ds-border-strong);border-radius:var(--ds-radius-md);padding:var(--ds-space-6);text-align:center;cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),border-color var(--ds-duration) var(--ds-ease)}.drop-area:hover{border-color:var(--ds-accent);background:var(--ds-surface-2)}.drop-area.drag-over{border-color:var(--ds-accent);background:var(--ds-accent-soft)}.drop-content{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2)}.upload-icon-wrap{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:var(--ds-radius-full);background:var(--ds-surface-2);color:var(--ds-text-2);transition:background-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.drop-area.drag-over .upload-icon-wrap{background:var(--ds-accent);color:var(--ds-on-accent)}.drop-title{margin:0;font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);color:var(--ds-text)}.drop-formats{font-size:var(--ds-text-xs);color:var(--ds-text-2)}.drop-paste-hint{font-size:var(--ds-text-xs);color:var(--ds-text-3)}.drop-btn{margin-top:var(--ds-space-2)}.file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.file-list{display:flex;flex-direction:column;gap:var(--ds-space-2)}.file-item{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-space-3);min-height:var(--ds-row-height);padding:var(--ds-space-2) var(--ds-space-3);background:var(--ds-surface-1);border:var(--ds-border-width) solid var(--ds-border);border-radius:var(--ds-radius-md);animation:fadeIn var(--ds-duration-slow) var(--ds-ease);transition:background-color var(--ds-duration) var(--ds-ease),border-color var(--ds-duration) var(--ds-ease)}.file-info{display:flex;flex-direction:column;flex:1;min-width:0;overflow:hidden}.file-info--clickable{cursor:pointer}.file-name{font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);color:var(--ds-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-size:var(--ds-text-xs);color:var(--ds-text-2);font-variant-numeric:tabular-nums}.remove-file-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-sm);height:var(--ds-control-sm);border:var(--ds-border-width) solid transparent;border-radius:var(--ds-radius-sm);background:transparent;color:var(--ds-text-2);cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.remove-file-btn svg{width:var(--ds-icon-sm);height:var(--ds-icon-sm)}.remove-file-btn:hover{background:var(--ds-surface-2);color:var(--ds-danger)}.play-file-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-md);height:var(--ds-control-md);border:var(--ds-border-width) solid var(--ds-border-strong);border-radius:var(--ds-radius-full);background:var(--ds-surface-2);color:var(--ds-text);cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),border-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.play-file-btn:hover{background:var(--ds-surface-3)}.file-item.is-active{background:var(--ds-accent-soft);border-color:var(--ds-accent)}.file-item.is-active .play-file-btn{background:var(--ds-accent);border-color:var(--ds-accent);color:var(--ds-on-accent)}.file-item.is-active .play-file-btn:hover{background:var(--ds-accent-hover);border-color:var(--ds-accent-hover)}.now-playing-badge{display:inline-flex;align-items:center;height:20px;margin-left:var(--ds-space-2);padding:0 calc(var(--ds-space-2) - 1px);border:var(--ds-border-width) solid var(--ds-accent);border-radius:var(--ds-radius-full);background:var(--ds-surface-1);color:var(--ds-text);font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);line-height:1;vertical-align:middle}.converted-hint{margin:0 0 var(--ds-space-3);font-size:var(--ds-text-sm);color:var(--ds-text-2)}.save-file-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;gap:var(--ds-space-2);height:var(--ds-control-md);padding:0 var(--ds-space-3);border:var(--ds-border-width) solid var(--ds-border-strong);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text);font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);line-height:1;cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease)}.save-file-btn svg{width:var(--ds-icon-sm);height:var(--ds-icon-sm)}.save-file-btn:hover{background:var(--ds-surface-3)}.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--ds-space-4)}.option-group{display:flex;flex-direction:column;gap:var(--ds-space-1)}.option-label{font-size:var(--ds-text-sm);font-weight:var(--ds-weight-medium);color:var(--ds-text-2)}.select-control{position:relative;display:flex;align-items:center}.option-select{appearance:none;width:100%;height:var(--ds-control-md);padding:0 calc(var(--ds-space-6) + var(--ds-space-2)) 0 var(--ds-space-3);border:var(--ds-border-width) solid var(--ds-border-strong);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text);font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);cursor:pointer;transition:border-color var(--ds-duration) var(--ds-ease),box-shadow var(--ds-duration) var(--ds-ease)}.option-select:focus-visible{border-color:var(--ds-accent)}.select-chevron{position:absolute;right:var(--ds-space-3);width:var(--ds-icon-sm);height:var(--ds-icon-sm);color:var(--ds-text-3);pointer-events:none}.options-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--ds-space-3);margin-top:var(--ds-space-4)}.format-chip{display:inline-flex;align-items:center;gap:var(--ds-space-2);height:var(--ds-control-sm);padding:0 var(--ds-space-3);border-radius:var(--ds-radius-full);background:var(--ds-surface-2);color:var(--ds-text);font-size:var(--ds-text-sm);font-weight:var(--ds-weight-medium);white-space:nowrap}.format-chip svg{width:var(--ds-icon-sm);height:var(--ds-icon-sm);flex-shrink:0;color:var(--ds-text-2)}.keyboard-hint{display:inline-flex;align-items:center;flex-wrap:wrap;gap:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-text-sm);color:var(--ds-text-2)}.keyboard-hint-item{display:inline-flex;align-items:center;gap:var(--ds-space-1)}.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 calc(var(--ds-space-1) + 2px);border:var(--ds-border-width) solid var(--ds-border-strong);border-bottom-width:2px;border-radius:var(--ds-radius-sm);background:var(--ds-surface-2);color:var(--ds-text);font-family:inherit;font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);line-height:1;white-space:nowrap}.action-section{display:flex;flex-direction:column;align-items:stretch;gap:var(--ds-space-2)}.progress-bar-container{position:relative;height:6px;border-radius:var(--ds-radius-full);background:var(--ds-surface-3);overflow:hidden}.progress-bar-container.shimmer-active:after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:30%;border-radius:var(--ds-radius-full);background:var(--ds-accent);opacity:.5;animation:progressIndeterminate 1.2s var(--ds-ease) infinite;pointer-events:none}@keyframes progressIndeterminate{0%{left:-30%}to{left:100%}}.progress-bar{width:0%;height:100%;border-radius:var(--ds-radius-full);background:var(--ds-accent);transition:width var(--ds-duration-slow) var(--ds-ease)}.progress-container{display:flex;align-items:center;gap:var(--ds-space-3)}.progress-container .progress-bar-container{flex:1}.progress-text{min-width:4ch;font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);color:var(--ds-text-2);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}.status{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text);font-size:var(--ds-text-md);font-weight:var(--ds-weight-medium);text-align:left}.status-icon{width:var(--ds-icon-sm);height:var(--ds-icon-sm);flex-shrink:0;color:var(--ds-info)}.status--success .status-icon{color:var(--ds-success)}.status--error .status-icon{color:var(--ds-danger)}.status--warning .status-icon{color:var(--ds-warning)}body.player-active{padding-bottom:88px}.player-sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:var(--ds-z-player);background:var(--ds-surface-1);border-top:var(--ds-border-width) solid var(--ds-border);box-shadow:var(--ds-shadow-overlay)}.player-inner{display:flex;align-items:center;gap:var(--ds-space-4);max-width:1100px;min-height:var(--ds-player-height);margin:0 auto;padding:var(--ds-space-2) var(--ds-space-4)}.player-track{display:flex;align-items:center;gap:var(--ds-space-3);flex:1 1 180px;min-width:0}.player-track-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-lg);height:var(--ds-control-lg);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text-2)}.player-track-meta{display:flex;flex-direction:column;min-width:0}.player-track-name{font-size:var(--ds-text-md);font-weight:var(--ds-weight-semibold);color:var(--ds-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-track-pos{font-size:var(--ds-text-xs);color:var(--ds-text-2);font-variant-numeric:tabular-nums}.player-controls{display:flex;align-items:center;gap:var(--ds-space-1);flex-shrink:0}.player-btn{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-md);height:var(--ds-control-md);border:var(--ds-border-width) solid transparent;border-radius:var(--ds-radius-full);background:transparent;color:var(--ds-text-2);cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease),color var(--ds-duration) var(--ds-ease)}.player-btn:hover:not(:disabled){background:var(--ds-surface-2);color:var(--ds-text)}.player-btn:disabled{opacity:.45;cursor:not-allowed}.player-btn--primary{width:var(--ds-control-lg);height:var(--ds-control-lg);background:var(--ds-accent);color:var(--ds-on-accent)}.player-btn--primary:hover:not(:disabled){background:var(--ds-accent-hover);color:var(--ds-on-accent)}.player-btn--close{width:var(--ds-control-sm);height:var(--ds-control-sm)}.player-btn--close svg{width:var(--ds-icon-sm);height:var(--ds-icon-sm)}.player-progress{display:flex;align-items:center;gap:var(--ds-space-2);flex:2 1 220px;min-width:0}.player-time{flex-shrink:0;min-width:2.5rem;font-size:var(--ds-text-xs);color:var(--ds-text-2);font-variant-numeric:tabular-nums;text-align:center}.player-seek{flex:1}.player-volume{display:flex;align-items:center;gap:var(--ds-space-1);flex:0 1 130px;min-width:0}.player-volume-slider{flex:1;min-width:60px}.player-slide-enter-active,.player-slide-leave-active{transition:transform var(--ds-duration-slow) var(--ds-ease),opacity var(--ds-duration-slow) var(--ds-ease)}.player-slide-enter-from,.player-slide-leave-to{transform:translateY(100%);opacity:0}#app input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:var(--ds-radius-full);background:var(--ds-border-strong);outline:none;cursor:pointer;touch-action:pan-y}#app input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--ds-accent);border:2px solid var(--ds-surface-1);cursor:pointer}#app input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--ds-accent);border:2px solid var(--ds-surface-1);cursor:pointer}#app input[type=range]::-moz-range-track{height:6px;border-radius:var(--ds-radius-full);background:var(--ds-border-strong)}#app input[type=range]:focus-visible{box-shadow:var(--ds-focus-ring)}#app button,#app [role=button],#app select,#app input[type=range]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media (pointer: coarse){#app input[type=range]{height:8px}#app input[type=range]::-webkit-slider-thumb{width:20px;height:20px}#app input[type=range]::-moz-range-thumb{width:20px;height:20px}}.features,.other-tools-section,.faq-section{padding:var(--ds-space-12) var(--ds-gutter);border-top:var(--ds-border-width) solid var(--ds-border)}.features-container,.other-tools-container{max-width:var(--ds-container);margin:0 auto}.section-title{margin:0 0 var(--ds-space-8);font-size:var(--ds-text-2xl);font-weight:var(--ds-weight-bold);line-height:var(--ds-leading-tight);color:var(--ds-text);text-align:center}.features-grid{display:grid;grid-template-columns:1fr;gap:var(--ds-space-4)}.feature-card{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-5);text-align:center}.feature-icon,.tool-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-lg);height:var(--ds-control-lg);border-radius:var(--ds-radius-md);background:var(--ds-surface-2);color:var(--ds-text-2)}.feature-icon{margin-bottom:var(--ds-space-1)}.feature-icon svg,.tool-icon svg{width:var(--ds-icon-md);height:var(--ds-icon-md)}.feature-card h3{margin:0;font-size:var(--ds-text-lg);font-weight:var(--ds-weight-semibold);color:var(--ds-text)}.feature-card p{margin:0;font-size:var(--ds-text-sm);color:var(--ds-text-2)}.tools-grid{display:grid;grid-template-columns:1fr;gap:var(--ds-space-4)}.tool-card{display:flex;align-items:center;gap:var(--ds-space-4);padding:var(--ds-space-5);color:inherit;text-align:left;text-decoration:none}.tool-body{flex:1;min-width:0}.tool-card h3{margin:0 0 2px;font-size:var(--ds-text-lg);font-weight:var(--ds-weight-semibold);color:var(--ds-text)}.tool-card p{margin:0;font-size:var(--ds-text-sm);color:var(--ds-text-2)}.tool-arrow{flex-shrink:0;width:var(--ds-icon-md);height:var(--ds-icon-md);color:var(--ds-text-3);transition:color var(--ds-duration) var(--ds-ease)}.tool-card:hover .tool-arrow{color:var(--ds-text)}.faq-container{max-width:48rem;margin:0 auto}.faq-item{background:var(--ds-surface-1);border:var(--ds-border-width) solid var(--ds-border);border-radius:var(--ds-radius-lg);overflow:hidden}.faq-item+.faq-item{margin-top:var(--ds-space-3)}.faq-question{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-space-4);padding:var(--ds-space-4) var(--ds-space-6);list-style:none;font-size:var(--ds-text-lg);font-weight:var(--ds-weight-semibold);line-height:var(--ds-leading-tight);color:var(--ds-text);cursor:pointer;transition:background-color var(--ds-duration) var(--ds-ease)}.faq-question::-webkit-details-marker{display:none}.faq-question:hover{background:var(--ds-surface-2)}.faq-toggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--ds-text);transition:transform var(--ds-duration) var(--ds-ease)}.faq-toggle svg{width:var(--ds-icon-md);height:var(--ds-icon-md)}.faq-item[open] .faq-toggle{transform:rotate(180deg)}.faq-answer{padding:var(--ds-space-4) var(--ds-space-6);border-top:var(--ds-border-width) solid var(--ds-border);font-size:var(--ds-text-lg);color:var(--ds-text);animation:fadeIn var(--ds-duration-slow) var(--ds-ease)}.faq-answer p{margin:0}.skip-link{position:absolute;top:var(--ds-space-2);left:var(--ds-space-2);z-index:var(--ds-z-toast);padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius-md);background:var(--ds-accent);color:var(--ds-on-accent);font-size:var(--ds-text-md);font-weight:var(--ds-weight-semibold);text-decoration:none;transform:translateY(calc(-100% - 16px));transition:transform var(--ds-duration) var(--ds-ease)}.skip-link:focus{transform:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (min-width: 640px){.features-grid,.tools-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.features-grid,.tools-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width: 640px){.hero{padding:var(--ds-space-6) var(--ds-space-4) var(--ds-space-5)}.hero h1{font-size:var(--ds-text-2xl)}.converter-section{margin-bottom:var(--ds-space-8);padding:0 var(--ds-space-4)}.converter-wrapper{padding:var(--ds-space-4)}.drop-area{padding:var(--ds-space-5) var(--ds-space-4)}.options-grid{grid-template-columns:1fr}.keyboard-hint{display:none}.features,.other-tools-section,.faq-section{padding:var(--ds-space-10) var(--ds-space-4)}.section-title{margin-bottom:var(--ds-space-6);font-size:var(--ds-text-xl)}.faq-question{padding:var(--ds-space-3) var(--ds-space-4)}.faq-answer{padding:var(--ds-space-3) var(--ds-space-4);font-size:var(--ds-text-sm)}.trust-badges{gap:var(--ds-space-2) var(--ds-space-4)}body.player-active{padding-bottom:180px}.player-inner{flex-wrap:wrap;gap:var(--ds-space-2) var(--ds-space-3);padding:var(--ds-space-2) var(--ds-space-3)}.player-track{flex:1 1 60%;order:1}.player-btn--close{order:2;margin-left:auto}.player-controls{order:3}.player-progress{order:4;flex:1 1 100%}.player-volume{order:5;flex:1 1 100%;max-width:220px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media print{.website-header,.cookie-banner,.player-sticky-bar{display:none!important}.hero{page-break-inside:avoid}.features-grid{break-inside:avoid}}
