.converter-content{max-width:900px;margin:0 auto;padding:48px 24px 32px;position:relative;z-index:1}.converter-header{text-align:center;margin-bottom:32px}.converter-icon-badge{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;margin-bottom:16px;border-radius:var(--radius-md);background:rgb(var(--primary-rgb) / .12)}.converter-icon-badge .material-symbols-outlined{font-size:26px;color:var(--primary)}.converter-header h1{margin:0 0 8px;font-size:1.7rem;font-weight:700;letter-spacing:-.01em;color:var(--text-main);word-break:keep-all;overflow-wrap:anywhere}.converter-subtitle{margin:0;font-size:.9rem;line-height:1.6;color:var(--text-muted);word-break:keep-all;overflow-wrap:anywhere}.converter-dropzone{position:relative;margin-bottom:20px;padding:44px 24px;border:1px dashed var(--border-strong);border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:border-color .2s,background .2s}.converter-dropzone:hover{border-color:var(--primary);background:rgb(var(--primary-rgb) / .04)}.converter-dropzone.drag-over{border-color:var(--primary);border-style:solid;background:rgb(var(--primary-rgb) / .08)}.dropzone-icon{margin-bottom:10px}.dropzone-icon .material-symbols-outlined{font-size:44px;color:var(--text-muted);transition:color .2s}.converter-dropzone:hover .dropzone-icon .material-symbols-outlined,.converter-dropzone.drag-over .dropzone-icon .material-symbols-outlined{color:var(--primary)}.dropzone-text{margin:0 0 4px;font-size:.98rem;font-weight:600;color:var(--text-main);word-break:keep-all;overflow-wrap:anywhere}.dropzone-hint{margin:0;font-size:.8rem;color:var(--text-muted);word-break:keep-all;overflow-wrap:anywhere}.converter-controls{margin-bottom:20px;padding:16px 20px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-md)}.converter-controls-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:14px}.converter-controls .control-group{display:flex;flex-direction:column;gap:6px;min-width:120px;margin:0}.converter-controls .control-group-wide{flex:1;min-width:180px}.converter-controls .control-group label{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;font-weight:600;color:var(--text-muted)}.converter-select{padding:8px 10px;font-family:inherit;font-size:.85rem;color:var(--text-main);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;outline:none;transition:border-color .2s}.converter-select:focus{border-color:var(--primary)}.converter-select option{background:var(--bg-card);color:var(--text-main)}.converter-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;margin:8px 0;border-radius:var(--radius-pill);background:var(--border-strong);outline:none;cursor:pointer}.converter-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border:none;border-radius:50%;background:var(--primary);cursor:pointer}.converter-range::-moz-range-thumb{width:16px;height:16px;border:none;border-radius:50%;background:var(--primary);cursor:pointer}.converter-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.conv-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid transparent;border-radius:var(--radius-sm);font-family:inherit;font-size:.84rem;font-weight:600;line-height:1.3;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.conv-btn .material-symbols-outlined{font-size:18px;flex-shrink:0}.conv-btn-primary{background:var(--primary);color:var(--on-primary)}.conv-btn-primary:hover{background:var(--primary-hover)}.conv-btn-secondary{background:var(--bg-card);color:var(--text-main);border-color:var(--border)}.conv-btn-secondary:hover{background:var(--bg-hover);border-color:var(--border-strong)}.conv-btn-danger{background:transparent;color:var(--danger);border-color:var(--border)}.conv-btn-danger:hover{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,transparent)}.file-counter{margin-left:auto;font-size:.8rem;color:var(--text-muted)}.converter-file-list{display:flex;flex-direction:column;gap:8px}.converter-file-card{position:relative;display:flex;align-items:center;gap:14px;padding:10px 14px;overflow:hidden;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-md);transition:border-color .2s}.converter-file-card:hover{border-color:var(--border-strong)}.converter-file-card.done{border-color:rgb(var(--secondary-rgb) / .22)}.converter-file-card.converting{border-color:rgb(var(--primary-rgb) / .35)}.file-card-preview{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;overflow:hidden;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm)}.file-card-preview img{max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated}.file-card-info{flex:1;min-width:0}.file-card-name{margin:0 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.86rem;font-weight:600;color:var(--text-main)}.file-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font-size:.75rem;color:var(--text-muted)}.converter-file-error{margin:6px 0 0;color:var(--danger);font-size:.8rem}.file-format-badge{padding:1px 8px;border-radius:var(--radius-pill);font-size:.7rem;font-weight:600;color:var(--primary);background:rgb(var(--primary-rgb) / .12)}.badge-result{color:var(--secondary);background:rgb(var(--secondary-rgb) / .12)}.file-arrow{font-size:14px!important;color:var(--text-muted)}.file-card-actions{display:flex;gap:4px;flex-shrink:0}.file-action-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;transition:background .15s,color .15s,border-color .15s}.file-action-btn .material-symbols-outlined{font-size:18px}.file-action-btn:hover{background:var(--bg-hover);color:var(--text-main);border-color:var(--border-strong)}.action-download{color:var(--secondary);border-color:rgb(var(--secondary-rgb) / .35)}.action-download:hover{color:var(--secondary);background:rgb(var(--secondary-rgb) / .12);border-color:var(--secondary)}.action-remove:hover{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,transparent)}.file-card-progress{position:absolute;bottom:0;left:0;height:2px;background:var(--primary);animation:converter-progress 1.2s ease-in-out infinite}@keyframes converter-progress{0%{width:0;left:0}50%{width:60%;left:20%}to{width:0;left:100%}}.file-card-done-bar{position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--secondary)}.converting-spinner .material-symbols-outlined{font-size:20px;color:var(--primary)}.converting-spinner .spin{animation:converter-spin 1s linear infinite}@keyframes converter-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.converter-motion-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}.converter-motion-controls .control-group{min-width:0}.converter-motion-controls .control-group label{white-space:normal}.converter-motion-controls input,.converter-motion-controls select{width:100%;min-width:0;box-sizing:border-box}.converter-motion-note{margin:10px 0 0;font-size:.79rem;line-height:1.65;color:var(--text-muted);overflow-wrap:anywhere}.converter-audio-option{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:.85rem;color:var(--text-main)}.converter-audio-option input{accent-color:var(--primary);width:16px;height:16px;flex:0 0 auto}.converter-background-option input[type=color]{width:34px;height:22px;padding:0 2px;border:1px solid var(--border, #444);border-radius:4px;background:none;cursor:pointer}.file-card-preview video{display:block;width:100%;height:100%;object-fit:contain}.converter-progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;inset:auto 0 0;width:100%;height:3px;border:0;background:var(--border)}.converter-progress::-webkit-progress-bar{background:var(--border)}.converter-progress::-webkit-progress-value{background:var(--primary)}.converter-progress::-moz-progress-bar{background:var(--primary)}.file-action-btn:disabled{opacity:.4;cursor:default}.converter-file-error{overflow-wrap:anywhere}@media(max-width:650px){.converter-motion-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:360px){.converter-motion-controls{grid-template-columns:minmax(0,1fr)}}.converter-empty{padding:48px 24px;text-align:center;color:var(--text-muted)}.converter-empty .material-symbols-outlined{display:block;margin-bottom:12px;font-size:56px;opacity:.3}.converter-empty p{margin:0;font-size:.9rem;word-break:keep-all;overflow-wrap:anywhere}@media(max-width:768px){.converter-content{padding:32px 16px 24px}.converter-header h1{font-size:1.4rem}.converter-dropzone{padding:32px 16px}.dropzone-icon .material-symbols-outlined{font-size:36px}.converter-controls-row{flex-direction:column;align-items:stretch}.converter-controls .control-group{min-width:0}.converter-controls .control-group label{white-space:normal}.converter-range{height:32px;margin:0;background:linear-gradient(var(--border-strong),var(--border-strong)) center / 100% 4px no-repeat}.converter-range::-webkit-slider-thumb{width:20px;height:20px}.converter-range::-moz-range-thumb{width:20px;height:20px}.converter-actions{justify-content:center}.conv-btn{min-height:40px;padding:8px 14px;max-width:100%;min-width:0;white-space:normal;word-break:keep-all}.file-counter{width:100%;margin:4px 0 0;text-align:center}.file-card-actions{gap:6px}.file-action-btn{width:40px;height:40px}.converter-content~.site-footer{padding-bottom:84px}}@media(max-width:600px){.file-card-name{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;line-height:1.35}}@media(max-width:480px){.converter-content{padding:24px 12px 20px}.converter-header h1{font-size:1.25rem}.file-card-preview{width:40px;height:40px}.file-card-name{font-size:.78rem}.converter-file-card{gap:10px;padding:8px 10px}}
