*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:root{--bg:oklch(0.165 0.010 235);--surface:oklch(0.215 0.012 235);--surface-hi:oklch(0.26 0.014 235);--fg:oklch(0.94 0.006 230);--muted:oklch(0.70 0.016 235);--border:oklch(0.31 0.012 235);--accent:oklch(0.66 0.16 245);--accent-hi:oklch(0.74 0.16 245);--accent-ink:oklch(0.15 0.02 245);--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--ink:var(--fg);--canvas:var(--bg);--body:var(--fg);--charcoal:var(--surface);--mute:var(--muted);--stone:var(--muted);--ash:var(--muted);--surface-soft:var(--surface);--surface-card:var(--surface-hi);--surface-dark:var(--bg);--surface-dark-elevated:var(--surface);--on-dark:var(--fg);--on-dark-mute:var(--muted);--hairline:var(--border);--hairline-strong:var(--muted);--font:var(--mono)}:root{color-scheme:dark}[data-theme="light"]{--bg:oklch(0.985 0.003 235);--surface:oklch(0.96 0.004 235);--surface-hi:oklch(0.93 0.006 235);--fg:oklch(0.20 0.012 235);--muted:oklch(0.50 0.012 235);--border:oklch(0.88 0.006 235);--accent:oklch(0.52 0.16 245);--accent-hi:oklch(0.47 0.16 245);--accent-ink:oklch(1 0 0);color-scheme:light}[data-theme="dark"]{color-scheme:dark}img{-webkit-user-drag:none;-khtml-user-drag:none;user-drag:none}html{font-size:16px;-webkit-font-smoothing:antialiased}pre{font-family:var(--mono);font-size:10px;line-height:1.1;overflow:hidden}body{font-family:var(--sans);font-size:16px;line-height:1.6;color:var(--fg);background:var(--bg);min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}a{color:var(--fg);text-decoration:underline}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.mono{font-family:var(--mono)}.wrap{max-width:1120px;margin:0 auto;padding:0 24px}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.nav{border-bottom:1px solid var(--border);height:56px;display:flex;align-items:center}.nav-inner{max-width:960px;width:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:32px}.nav-logo pre{font-size:7px;line-height:1.05;color:var(--fg);letter-spacing:-0.5px}.nav-logo{text-decoration:none}.nav-links{display:flex;gap:24px;align-items:center}.nav-toggle{display:none;font-family:var(--mono);font-size:13px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;min-width:44px;min-height:44px;align-items:center;justify-content:center;cursor:pointer;padding:0 12px}.nav-toggle:hover{background:var(--surface-hi);border-color:var(--muted)}.mobile-nav{display:none}.mobile-nav[hidden]{display:none}.nav-link{font-weight:500;color:var(--fg);text-decoration:none}.nav-link-active{text-decoration:underline;text-underline-offset:4px}.nav-link-mute{color:var(--muted)}.hero-tui{background:var(--bg);color:var(--fg);padding:64px 24px}.hero-tui-inner{max-width:960px;margin:0 auto}.hero-tui-art{color:var(--fg);font-size:10px;line-height:1.15;text-align:center;margin-bottom:32px;white-space:pre;overflow:hidden}.tui-prompt{background:var(--surface);border-radius:4px;padding:8px 12px;display:flex;gap:12px;align-items:center;font-size:16px}.tui-prompt-pipe{color:var(--accent)}.tui-prompt-cmd{color:var(--fg);font-weight:500}.tui-prompt-token{background:var(--accent);color:var(--accent-ink);padding:0 8px;border-radius:4px;font-size:14px}.tui-prompt-target{color:var(--muted)}.converter-section{max-width:960px;width:100%;margin:96px auto;padding:0 24px}.section-header{margin-bottom:0}.section-label{font-size:16px;font-weight:700;color:var(--fg)}.hairline{height:1px;background:var(--border);margin:12px 0 24px}.drop-zone{border:1px dashed var(--border);border-radius:4px;padding:48px 24px;text-align:center;cursor:pointer;transition:background 0.15s,border-color 0.15s}.drop-zone:hover,.drop-zone-active{background:var(--surface-hi);border-color:var(--accent)}.drop-zone-content{display:flex;flex-direction:column;gap:8px;align-items:center;color:var(--muted)}.converter-body.pre-file>:not(.drop-zone):not([data-pre-show]):not(:has(.drop-zone)){display:none!important}.drop-icon{color:var(--fg);font-weight:700;font-size:24px}.drop-hint{font-size:14px;color:var(--muted)}.file-info{display:flex;gap:12px;align-items:center;padding:12px 0;font-size:14px}.file-info[hidden]{display:none}.file-info-name{font-weight:500;color:var(--fg)}.file-info-size{color:var(--muted)}.convert-count{display:flex;align-items:center;gap:6px;padding:4px 0 8px;font-size:13px;color:var(--muted)}.convert-count[hidden]{display:none}.convert-count-info{position:relative;cursor:help;line-height:1;flex-shrink:0}.info-icon{font-size:13px;color:var(--muted)}.info-tooltip{display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--bg);color:var(--fg);font-size:12px;padding:6px 10px;border-radius:4px;white-space:nowrap;z-index:10;line-height:1.4}.convert-count-info:hover .info-tooltip,.convert-count-info:focus .info-tooltip{display:block}.info-wrap{display:inline-flex;align-items:center;cursor:help;position:relative;vertical-align:middle;line-height:1}.info-wrap .info-icon{margin-left:4px}.info-wrap:hover .info-tooltip,.info-wrap:focus .info-tooltip{display:block}.file-previews{display:flex;flex-wrap:wrap;gap:12px;padding:12px 0}.file-previews[hidden]{display:none}.file-preview{width:96px;text-align:center;position:relative}.file-preview-remove{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:13px;font-weight:700;line-height:1;cursor:pointer;padding:0;z-index:1;transition:background 0.15s,transform 0.15s}.file-preview-remove:active{transform:scale(0.96)}.file-preview-remove::before{content:'';position:absolute;inset:-9px;border-radius:50%}.file-preview-remove:hover{background:var(--surface-hi)}.clear-all-btn{font-family:var(--mono);font-size:13px;color:var(--muted);background:none;border:1px solid var(--border);border-radius:4px;padding:4px 10px;height:80px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;align-self:center;transition:background 0.15s,border-color 0.15s}.clear-all-btn:hover{background:var(--surface-hi);border-color:var(--muted);color:var(--fg)}.clear-all-icon{font-weight:700;font-size:16px}.file-preview-img{width:80px;height:80px;object-fit:cover;border-radius:4px;border:1px solid var(--border);display:block;margin:0 auto 4px}.file-preview-name{display:block;font-size:11px;color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-preview-size{display:block;font-size:10px;color:var(--muted)}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.settings-grid[hidden]{display:none}.settings-grid>*{min-width:0}.setting{display:flex;flex-direction:column;gap:8px}.setting[hidden]{display:none}.size-row{display:flex;gap:24px}.size-row .setting{flex:1;min-width:0}.size-row .btn-primary{width:100%}.action-row{display:flex;gap:12px;margin-top:24px}.action-row .btn-primary{flex:1}.setting-blocked{opacity:0.35;pointer-events:none}.setting-label{font-size:14px;font-weight:500;color:var(--muted)}.select-input{font-family:var(--mono);font-size:16px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:8px 12px;height:40px;cursor:pointer;appearance:auto}.select-input:focus{background:var(--bg);border-color:var(--accent);outline:none}.text-input{font-family:var(--mono);font-size:16px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:8px 12px;height:40px}.text-input:focus{background:var(--bg);border-color:var(--accent);outline:none}.quality-row{display:flex;align-items:center;gap:12px}.range-input{-webkit-appearance:none;appearance:none;flex:1;width:100%;height:6px;background:var(--border);border-radius:999px;outline:none;cursor:pointer;background:linear-gradient(to right,var(--accent) var(--_p,0%),var(--border) var(--_p,0%))}.range-input::-webkit-slider-runnable-track{height:6px;background:transparent;border-radius:999px}.range-input::-moz-range-track{height:6px;background:var(--border);border-radius:999px;border:none}.range-input::-moz-range-progress{height:6px;background:var(--accent);border-radius:999px}.range-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--accent);border:2px solid var(--bg);border-radius:50%;cursor:pointer;box-shadow:0 1px 4px oklch(0 0 0 / .35),0 0 0 1px oklch(0 0 0 / .12);margin-top:-6px;transition:transform .12s,background .12s,box-shadow .12s}.range-input::-moz-range-thumb{width:18px;height:18px;background:var(--accent);border:2px solid var(--bg);border-radius:50%;cursor:pointer;box-shadow:0 1px 4px oklch(0 0 0 / .35),0 0 0 1px oklch(0 0 0 / .12);transition:transform .12s,background .12s,box-shadow .12s}.range-input:hover::-webkit-slider-thumb{background:var(--accent-hi);box-shadow:0 2px 8px oklch(0 0 0 / .4)}.range-input:hover::-moz-range-thumb{background:var(--accent-hi)}.range-input:active::-webkit-slider-thumb{transform:scale(1.08)}.range-input:active::-moz-range-thumb{transform:scale(1.08)}.range-input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.range-input:disabled{opacity:.45;cursor:not-allowed}.quality-value{font-size:14px;color:var(--muted);min-width:28px;text-align:right;font-variant-numeric:tabular-nums}.btn-primary{font-family:var(--mono);font-size:16px;font-weight:500;line-height:2;background:var(--accent);color:var(--accent-ink);border:none;border-radius:4px;padding:4px 20px;height:36px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:background 0.15s,transform 0.15s}.btn-primary:hover{background:var(--accent-hi)}.btn-primary:active{background:var(--accent-hi);transform:scale(0.96)}.btn-primary:disabled{background:var(--surface-hi);color:var(--muted);cursor:not-allowed;transform:none}.progress-wrap{margin-top:12px;display:flex;flex-direction:column;gap:6px}.progress-wrap[hidden]{display:none}.progress-track{height:6px;background:var(--border);border-radius:3px;overflow:hidden}.progress-fill{height:100%;width:0%;background:var(--accent);border-radius:3px;transition:width 0.25s ease}.progress-text{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.result-area{margin-top:24px}.preview-row{margin:24px 0;display:flex;justify-content:center}.preview-img{max-width:100%;max-height:500px;height:auto;align-self:center;border-radius:4px;border:1px solid var(--border)}.batch-result-area{margin-top:24px}.batch-result-area[hidden]{display:none}.batch-result-actions{display:flex;gap:12px;flex-wrap:wrap}.footer{margin-top:auto}.footer-inner{max-width:960px;margin:0 auto;padding:32px 24px;display:flex;justify-content:space-between;align-items:center}.footer-text{font-size:14px;color:var(--muted)}.footer-links{display:flex;gap:12px;font-size:14px;color:var(--fg)}.footer-sep{color:var(--border)}.cards-section{max-width:960px;width:100%;margin:96px auto;padding:0 24px}.cards-grid{display:flex;flex-direction:column;gap:16px}.card{display:flex;flex-direction:column;gap:12px;padding:24px;border:1px solid var(--border);border-radius:4px;background:var(--surface);text-decoration:none;transition:background 0.15s,border-color 0.15s}.card:hover{background:var(--surface-hi);border-color:var(--muted)}.card-header{display:flex;align-items:center;gap:8px}.card-icon{font-size:20px;font-weight:700;color:var(--fg);line-height:1}.card-title{font-size:16px;font-weight:500;color:var(--fg);margin:0}.card-desc{font-size:14px;color:var(--muted);line-height:1.5}.card-arrow{font-size:14px;color:var(--fg);text-decoration:underline;text-underline-offset:3px}.category-filters{display:flex;gap:8px;margin:24px 0;flex-wrap:wrap}.cat-btn{padding:8px 16px;border:1px solid var(--border);border-radius:4px;background:var(--surface);color:var(--muted);cursor:pointer;font:inherit;font-size:14px;transition:background 0.15s,border-color 0.15s,color 0.15s}.cat-btn:hover:not(:disabled){border-color:var(--muted);color:var(--fg)}.cat-btn.is-active{border-color:var(--fg);background:var(--fg);color:var(--bg)}.cat-btn:disabled{opacity:0.4;cursor:not-allowed}@media (max-width:880px){.nav-links{display:none}.nav-toggle{display:inline-flex}.nav{position:sticky}.mobile-nav:not([hidden]){display:flex;flex-direction:column;gap:4px;position:absolute;top:100%;left:0;right:0;z-index:60;background:var(--bg);border-bottom:1px solid var(--border);padding:12px 24px 16px}.mobile-nav a{font-family:var(--mono);font-size:13px;text-decoration:none;padding:10px 4px;min-height:44px;display:flex;align-items:center}.mobile-nav a:hover{color:var(--fg)}}@media (max-width:768px){.nav-inner{padding:0 16px;gap:16px!important}.nav-logo pre{font-size:4.5px}.nav-links{display:none}.lang-select{padding:8px 12px;font-size:14px;min-width:120px}.hero-tui{padding:36px 16px 48px;overflow:hidden}.hero-tui-art{font-size:7px;max-width:100%;overflow:hidden}.tui-prompt{font-size:13px;flex-wrap:wrap;gap:8px}.converter-section,.cards-section{margin:40px auto;padding:0 16px}.settings-grid{grid-template-columns:1fr;gap:16px}.drop-hint{font-size:12px}.select-input,.text-input{height:44px}.action-row{flex-direction:column}.btn-primary{width:100%}.footer-inner{flex-direction:column;gap:8px;padding:24px 16px;text-align:center}.footer-links{flex-wrap:wrap;justify-content:center}}@media (max-width:480px){.nav-inner{gap:10px!important}.nav-logo pre{font-size:3.5px}.lang-select{padding:6px 10px;font-size:13px}.hero-tui{padding:24px 12px 36px;overflow:hidden}.hero-tui-art{display:none}.tui-prompt{font-size:12px;justify-content:center}.tui-prompt-pipe{display:none}.drop-zone{padding:28px 16px}.drop-zone-content{gap:6px}.drop-hint{display:none}.converter-section{margin:24px auto}.file-preview{width:72px}.file-preview-img{width:60px;height:60px}.file-preview-remove{width:20px;height:20px;font-size:11px;top:-6px;right:-6px}.settings-grid{gap:12px}.select-input,.text-input{height:44px;font-size:16px}.btn-primary{height:44px;width:100%}.clear-all-btn{height:60px;width:72px}.range-input{height:6px}.range-input::-webkit-slider-thumb{width:22px;height:22px;margin-top:-8px}.range-input::-moz-range-thumb{width:22px;height:22px}.footer-inner{padding:20px 16px}}@media (max-width:360px){.nav-inner{gap:8px!important;padding:0 12px!important}.lang-select{min-width:0!important;width:auto;max-width:110px;padding:6px 24px 6px 8px!important;font-size:12px}.theme-toggle{width:40px;height:40px;min-width:40px;min-height:40px}.cards-grid,.grid{gap:10px}}.lang-select{font-family:var(--mono);font-size:14px;background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:6px 10px;cursor:pointer;appearance:none;-webkit-appearance:none;min-height:36px;line-height:1;padding-right:28px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.theme-toggle{font-family:var(--mono);font-size:14px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;width:44px;height:44px;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;line-height:1;transition:background .15s,border-color .15s}.theme-toggle svg{width:16px;height:16px;display:block}.theme-toggle:hover{background:var(--surface-hi);border-color:var(--muted)}.theme-toggle:active{transform:scale(0.96)}.nav-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.crop-image-wrap{display:flex;flex-direction:column;gap:16px;margin-top:24px}.crop-image-wrap[hidden]{display:none}.crop-image-container{position:relative;display:inline-block;max-width:100%;align-self:center}.crop-image{display:block;max-width:100%;max-height:500px;height:auto;border-radius:4px;border:1px solid var(--border);cursor:crosshair}.crop-overlay{position:absolute;inset:0;pointer-events:none}.crop-box{position:absolute;border:2px solid var(--accent);background:color-mix(in oklab,var(--accent) 8%,transparent);display:none;pointer-events:none}.crop-handle{position:absolute;width:12px;height:12px;background:var(--fg);border:2px solid var(--accent);border-radius:50%;pointer-events:auto;z-index:2}.crop-handle-nw{top:-6px;left:-6px;cursor:nwse-resize}.crop-handle-ne{top:-6px;right:-6px;cursor:nesw-resize}.crop-handle-sw{bottom:-6px;left:-6px;cursor:nesw-resize}.crop-handle-se{bottom:-6px;right:-6px;cursor:nwse-resize}.quad-overlay{position:absolute;inset:0;pointer-events:none}.quad-overlay svg{width:100%;height:100%;display:block;position:absolute;inset:0}.quad-line{fill:color-mix(in oklab,var(--accent) 8%,transparent);stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke}.quad-handle{position:absolute;transform:translate(-50%,-50%);cursor:grab;pointer-events:auto;z-index:2;padding:0}.quad-handle:active{cursor:grabbing}.crop-controls{display:flex;flex-direction:column;gap:12px}.crop-ratio-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.aspect-btn{font-family:var(--mono);font-size:14px;background:var(--surface);color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:4px 14px;cursor:pointer;transition:background 0.15s,border-color 0.15s}.aspect-btn:hover{background:var(--surface-hi);border-color:var(--muted)}.aspect-btn-active{background:var(--fg);color:var(--bg);border-color:var(--fg)}.crop-coord-row{display:flex;gap:12px;justify-content:center}.coord-field{display:flex;flex-direction:column;align-items:center;gap:2px}.coord-label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px}.coord-input{font-family:var(--mono);font-size:13px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:4px 6px;width:56px;height:30px;text-align:center;-moz-appearance:textfield}.coord-input::-webkit-inner-spin-button,.coord-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.coord-input:focus{background:var(--bg);border-color:var(--accent);outline:none}.crop-action-row{display:flex;gap:12px;justify-content:center;position:relative;z-index:1}.btn-secondary{font-family:var(--mono);font-size:16px;font-weight:500;line-height:2;background:transparent;color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:4px 20px;height:36px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:background 0.15s,transform 0.15s}.btn-secondary:hover{background:var(--surface-hi)}.btn-secondary:active{transform:scale(0.96)}.rotate-image-wrap{display:flex;flex-direction:column;gap:16px;margin-top:24px}.rotate-image-wrap[hidden]{display:none}.rotate-preview-container{max-width:100%;overflow:auto;display:flex;justify-content:center;align-self:center;position:relative;border:1px solid var(--border);border-radius:4px;background:var(--surface)}#previewCanvas{display:block;max-width:100%;max-height:500px;border-radius:4px}.mode-toggle{display:flex;gap:0;border-bottom:1px solid var(--border);background:transparent}.btn-tab{font-family:var(--mono);font-size:16px;font-weight:500;line-height:2;background:transparent;color:var(--muted);border:none;border-bottom:2px solid transparent;padding:8px 16px;cursor:pointer;margin-bottom:-1px;transition:color 0.15s,border-color 0.15s}.btn-tab:hover{color:var(--fg)}.btn-tab.is-active{color:var(--fg);border-bottom-color:var(--muted)}.mode-option{flex:1;display:flex;align-items:center;justify-content:center;padding:8px 12px;cursor:pointer;font-size:13px;color:var(--muted);transition:background 150ms,color 150ms}.mode-option input{position:absolute;opacity:0;pointer-events:none}.mode-option:has(input:checked){background:var(--fg);color:var(--bg)}.mode-setting{grid-column:1 / -1}.checkbox-label{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);cursor:pointer;padding:8px 0}.checkbox-label input{width:16px;height:16px;accent-color:var(--accent)}#resultsList{display:flex;flex-direction:column;gap:8px;padding:16px 0}.result-row{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:12px;padding:10px 12px;background:var(--surface);border-radius:4px;font-size:13px}.result-name{color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-sizes{color:var(--muted);font-variant-numeric:tabular-nums}.result-delta{font-variant-numeric:tabular-nums;font-weight:600}.badge-good{color:#00875a}.badge-bad{color:#cc0000}.badge-mute{color:var(--muted)}.result-download{padding:4px 12px;font-size:12px;height:auto}.align-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;cursor:pointer;border:1px solid var(--border);border-radius:4px;font-size:14px;color:var(--fg);user-select:none}.align-btn input{display:none}.align-btn:has(input:checked){background:var(--fg);color:var(--bg);border-color:var(--fg)}.align-btn:hover{border-color:var(--fg)}.base64-tabs{display:flex;gap:0;margin-bottom:24px;border-bottom:1px solid var(--border)}.tab-btn{font-family:var(--mono);font-size:16px;font-weight:500;padding:8px 20px;background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);cursor:pointer;margin-bottom:-1px;transition:color 0.15s,border-color 0.15s}.tab-btn:hover{color:var(--fg)}.tab-btn.is-active,.tab-btn[class*="is-active"]{color:var(--fg);border-bottom-color:var(--fg)}.tab-panel{display:block}.preview-wrap{margin-top:24px}.base64-label{font-size:14px;font-weight:500;color:var(--muted);margin-bottom:8px}.base64-textarea{font-family:var(--mono);font-size:13px;width:100%;padding:12px;border:1px solid var(--border);border-radius:4px;background:var(--surface);color:var(--fg);resize:vertical;line-height:1.5}.base64-textarea:focus{background:var(--bg);border-color:var(--accent);outline:none}.base64-textarea[readonly]{cursor:default}.input-area{margin-bottom:24px}.decode-wrap{margin-top:24px}.enhance-canvas-wrap{margin:24px 0;display:flex;justify-content:center;background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:16px}.enhance-canvas-wrap[hidden]{display:none}.enhance-canvas{max-width:100%;max-height:800px;image-rendering:auto;border-radius:4px}.enhance-section{margin-bottom:24px}.enhance-section-title{font-size:14px;font-weight:500;color:var(--muted);display:flex;align-items:center;gap:8px;margin-bottom:12px}.section-reset{font-family:var(--mono);font-size:13px;color:var(--muted);background:none;border:none;cursor:pointer;padding:0 4px}.section-reset:hover{color:var(--fg)}.search-input{font-family:var(--mono);font-size:14px;background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:8px 12px;width:100%;height:40px;margin-bottom:8px}.search-input:focus{background:var(--bg);border-color:var(--accent);outline:none}.search-input::placeholder{color:var(--muted)}.gif-timeline{display:flex;gap:2px;overflow-x:auto;padding:8px 0;min-height:100px;align-items:stretch;position:relative;border:1px solid var(--border);border-radius:4px;touch-action:pan-x}.gif-frame-block{position:relative;flex:0 0 auto;min-width:80px;max-width:600px;border-radius:4px;border:1px solid var(--border);background:var(--surface-hi);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 10px;cursor:grab;user-select:none;touch-action:none;transition:opacity .15s,width .1s linear}.gif-frame-block canvas{border-radius:2px;display:block;pointer-events:none}.gif-frame-block.dragging{opacity:0.4}.gif-frame-label{font-size:11px;color:var(--muted);margin-top:4px;white-space:nowrap}.grip{position:absolute;right:0;top:0;bottom:0;width:8px;cursor:ew-resize;background:transparent;touch-action:none;z-index:1}.grip:hover,.grip:active{background:color-mix(in oklab,var(--accent) 25%,transparent)}.gif-frame-remove{position:absolute;top:2px;right:2px;width:18px;height:18px;border:none;background:var(--bg);color:var(--fg);border-radius:50%;font-size:12px;line-height:1;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}.gif-frame-block:hover .gif-frame-remove{opacity:0.8}.gif-frame-remove:hover{opacity:1!important}.preview-section{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:16px}.preview-section canvas{max-width:400px;max-height:300px;border-radius:4px;display:block}.playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);pointer-events:none;z-index:3;transition:left .05s linear}.btn-secondary{background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:4px;padding:6px 14px;font:inherit;font-size:14px;cursor:pointer}.btn-secondary:hover{background:var(--surface)}.gif-timeline-ruler{position:absolute;top:0;left:0;right:0;height:18px;pointer-events:none;z-index:0}.ruler-tick{position:absolute;top:0;width:1px;height:100%;background:var(--border)}.ruler-tick-label{position:absolute;top:0;left:2px;font-size:9px;color:var(--muted);white-space:nowrap;line-height:1.2}.preview-area{margin-top:24px}.video-preview{width:100%;max-height:400px;border-radius:4px;background:var(--bg)}.timeline-area{margin-top:24px}.timeline-strip{position:relative;height:32px;margin-bottom:8px}.timeline-track{position:absolute;top:50%;left:0;right:0;height:4px;transform:translateY(-50%);background:var(--border);border-radius:2px;pointer-events:none}.timeline-range-fill{position:absolute;top:0;height:100%;background:var(--accent);border-radius:2px;pointer-events:none}.timeline-handle{position:absolute;top:0;width:100%;height:100%;appearance:none;-webkit-appearance:none;background:transparent;pointer-events:auto;margin:0;z-index:2}.timeline-handle::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:20px;background:var(--fg);border:2px solid var(--bg);border-radius:3px;cursor:pointer;box-shadow:0 0 0 1px var(--border)}.timeline-handle::-moz-range-thumb{width:14px;height:20px;background:var(--fg);border:2px solid var(--bg);border-radius:3px;cursor:pointer;box-shadow:0 0 0 1px var(--border)}.timeline-handle-start{z-index:3}.timeline-handle-end{z-index:2}.timeline-cursor{position:absolute;top:-4px;width:2px;height:40px;background:var(--accent);pointer-events:none;z-index:1;display:none}.timeline-labels{display:flex;justify-content:space-between;margin-top:28px;font-size:11px;color:var(--muted)}.time-input{font-family:var(--mono);font-size:14px;letter-spacing:0.5px}.frames-summary{font-size:16px;font-weight:500;color:var(--fg);margin-bottom:16px}.frames-grid{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:16px}.frame-card{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--surface-hi);border-radius:4px;padding:12px;width:120px}.frame-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:2px}.frame-label{font-size:12px;color:var(--muted);font-family:var(--mono)}.result-actions{display:flex;gap:8px;align-items:center}.frame-download{font-size:12px!important;padding:4px 8px!important}.password-prompt{margin:16px 0;display:flex;align-items:center;gap:12px}.password-input{padding:8px 12px;border:1px solid var(--border);border-radius:4px;font-family:inherit;font-size:14px;background:var(--bg);color:var(--fg)}.file-tree-controls{display:flex;align-items:center;gap:12px;margin:16px 0}.selection-info{margin-left:auto;color:var(--muted);font-size:14px}.file-tree{border:1px solid var(--border);border-radius:4px;padding:12px;max-height:400px;overflow-y:auto}.file-tree-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border)}.file-tree-row:last-child{border-bottom:none}.file-tree-label{display:flex;align-items:center;gap:8px;cursor:pointer;flex:1}.file-checkbox,.dir-checkbox{cursor:pointer}.file-name{font-weight:500}.file-size{color:var(--muted);font-size:13px;margin-left:8px}.file-tree-dir{margin:8px 0}.file-tree-dir-header{display:flex;align-items:center;padding:8px 0}.dir-name{font-weight:600}.file-tree-dir-content{margin-left:24px;border-left:2px solid var(--border);padding-left:12px}.btn-small{padding:6px 12px;font-size:13px}.feedback-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;align-items:center;justify-content:center}.feedback-modal[hidden]{display:none}.feedback-modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:oklch(0 0 0 / 0.4)}.feedback-modal-content{position:relative;background:var(--bg);max-width:480px;width:calc(100% - 48px);padding:24px;border-radius:4px;z-index:1}.feedback-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0}.feedback-modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--fg);padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#feedbackForm textarea{width:100%;font-family:var(--mono);font-size:14px;padding:8px;border:1px solid var(--border);background:var(--surface);color:var(--fg);border-radius:4px;resize:vertical;margin-bottom:12px}#feedbackForm input[type="text"]{width:100%;font-family:var(--mono);font-size:14px;padding:8px;border:1px solid var(--border);background:var(--surface);color:var(--fg);border-radius:4px;margin-bottom:12px}#feedbackForm button[type="submit"]{width:100%}.feedback-status{margin-top:12px;padding:8px;font-size:14px;border-radius:4px}.feedback-status.success{background:var(--surface);color:#30d158;border:1px solid #30d158}.feedback-status.error{background:var(--surface);color:#ff3b30;border:1px solid #ff3b30}.feedback-trigger{background:none;border:none;color:inherit;cursor:pointer;font-family:var(--mono);font-size:inherit;text-decoration:underline;padding:0}.faq-section{max-width:960px;margin:0 auto;padding:48px 24px}.faq-header{margin-bottom:16px}.faq-list{display:flex;flex-direction:column;gap:0}.faq-item{border-bottom:1px solid var(--border)}.faq-item:last-child{border-bottom:none}.faq-question{padding:16px 0;cursor:pointer;font-weight:500;color:var(--fg);list-style:none;display:flex;justify-content:space-between;align-items:center}.faq-question::-webkit-details-marker{display:none}.faq-question::after{content:"[+]";color:var(--muted);font-weight:400;transition:transform 0.2s}.faq-item[open] .faq-question::after{content:"[x]"}.faq-answer{padding:0 0 16px;color:var(--fg);line-height:1.6}.convert-article{max-width:1120px;margin:0 auto 48px;padding:0 24px}.convert-article .ca-head{font-family:var(--mono);font-size:14px;font-weight:700;letter-spacing:.03em;color:var(--fg);margin:32px 0 0}.convert-article .ca-head:first-child{margin-top:0}.convert-article .hairline{margin:12px 0 16px}.convert-article .ca-prose{max-width:68ch}.convert-article .ca-list{list-style:none;margin:0 0 8px;padding:0}.convert-article .ca-list li{padding:8px 0;border-bottom:1px solid var(--border)}.convert-article .ca-list li:last-child{border-bottom:none}.convert-article .ca-list li::before{content:"[+] ";color:var(--muted)}.convert-article .ca-table{width:100%;border-collapse:collapse;font-size:14px}.convert-article .ca-table th,.convert-article .ca-table td{text-align:left;padding:8px 12px 8px 0;border-bottom:1px solid var(--border);vertical-align:top}.convert-article .ca-table tr:last-child th,.convert-article .ca-table tr:last-child td{border-bottom:none}.convert-article .ca-table th{font-family:var(--mono);font-size:12px;font-weight:400;color:var(--muted);white-space:nowrap}.convert-article .ca-links{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px}.convert-article .ca-links li{display:inline;padding:0}.convert-article .ca-links a{font-family:var(--mono);font-size:13px;color:var(--muted);text-decoration:none}.convert-article .ca-links a:hover{color:var(--accent)}.hub-pillar{max-width:1120px;margin:0 auto 48px;padding:0 24px}.hub-pillar h2{font-family:var(--mono);font-size:16px;font-weight:700;line-height:1.5;color:var(--fg);margin:0 0 12px}.hub-pillar p{max-width:68ch;margin:0 0 12px}.hub-pillar p:last-child{margin-bottom:0}.hub-pillar a{font-family:var(--mono);font-size:13px;color:var(--muted);text-decoration:none}.hub-pillar a:hover{color:var(--accent)}.crumb{font-family:var(--mono);font-size:13px;letter-spacing:.09em;color:var(--muted);display:inline-block;text-decoration:none;margin-bottom:12px}.crumb:hover{color:var(--fg)}.hero-tui{background:var(--bg);color:var(--fg);padding:0;border-bottom:1px solid var(--border)}.hero-tui-inner{max-width:1120px;margin:0 auto;padding:0 24px}.hero-tui-art{color:var(--fg);font-size:10px;line-height:1.15;text-align:center;margin:0;padding:8px 0 24px;white-space:pre;overflow:hidden;display:none}.head{padding:72px 0 36px}.eyebrow{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.09em;color:var(--accent);display:inline-block;text-decoration:none;margin-bottom:18px}.eyebrow:hover{color:var(--accent-hi)}h1{font-family:var(--mono);font-size:clamp(34px,5vw,54px);line-height:1.05;letter-spacing:-.04em;font-weight:700}.sub{color:var(--muted);font-size:17px;line-height:1.65;max-width:60ch;margin-top:14px}.route{font-family:var(--mono);font-size:12.5px;color:var(--muted);margin-top:12px;font-feature-settings:"tnum"}.pipe{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:var(--mono);font-size:13px;color:var(--fg);margin-top:22px}.pipe b{font-weight:400;border:1px solid var(--border);border-radius:4px;padding:4px 10px;background:var(--surface)}.pipe span{color:var(--muted)}.converter-section,.cards-section,.blog-list{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:24px;margin:0 auto 48px;max-width:1120px;width:calc(100% - 48px)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-label{font-family:var(--mono);font-size:14px;font-weight:700;letter-spacing:.03em;color:var(--fg)}.hairline{height:1px;background:var(--border);margin:0 0 20px}.drop-zone{border:1px dashed var(--border);border-radius:6px;padding:40px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}.drop-zone:hover,.drop-zone.over{border-color:var(--accent);background:var(--surface-hi)}.drop-icon{color:var(--muted)}.drop-hint{color:var(--muted);font-size:12px;margin-top:8px;display:block;font-family:var(--mono);letter-spacing:.03em}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;margin:20px 0}.setting-label{font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:6px}.select-input,.text-input,.opt select,.opt input[type=text],.opt input[type=number],.search input{background:var(--bg);border:1px solid var(--border);border-radius:4px;color:var(--fg);font-family:var(--mono);font-size:13px;padding:9px 11px;min-height:40px}.select-input:hover,.text-input:hover,.opt select:hover,.opt input:hover{border-color:var(--muted)}.select-input:focus,.text-input:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}.range-input{accent-color:var(--accent)}.btn-primary,.btn{font-family:var(--mono);font-size:13px;letter-spacing:.04em;border-radius:4px;padding:12px 20px;min-height:44px;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.btn-primary{background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);font-weight:700}.btn-primary:hover{background:var(--accent-hi)}.btn-secondary{background:none;color:var(--muted);border:1px solid var(--border)}.btn-secondary:hover{background:var(--surface-hi);color:var(--fg);border-color:var(--muted)}.btn-primary:disabled,.btn:disabled{opacity:.4;cursor:not-allowed}.progress-track{background:var(--border);border-radius:4px;height:6px;overflow:hidden}.progress-fill{background:var(--accent);height:100%}.progress-text{font-family:var(--mono);font-size:12px;color:var(--muted)}.file-info,.convert-count{font-family:var(--mono);font-size:12.5px;color:var(--muted)}.clear-all-btn{background:none;border:1px solid var(--border);color:var(--muted);font-family:var(--mono);font-size:12px;border-radius:4px;padding:6px 10px;cursor:pointer}.clear-all-btn:hover{color:var(--fg);border-color:var(--muted)}.result-area,.batch-result-area{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:16px;margin-top:20px}.preview-img{max-width:100%;border-radius:4px}.wave-area{margin-top:20px}.wave-area[hidden]{display:none}.wave-wrap{position:relative;border:1px solid var(--border);border-radius:6px;background:var(--bg);overflow:hidden}.wave-canvas{display:block;width:100%;height:160px}.wave-ruler{position:relative;height:18px;border-top:1px solid var(--border);font-family:var(--mono);font-size:10px;color:var(--muted)}.wave-selection{position:absolute;top:0;bottom:18px;background:var(--accent);opacity:.25;pointer-events:none}.wave-playhead{position:absolute;top:0;bottom:18px;width:2px;background:var(--accent);pointer-events:none}.zoom-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.transport-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}.transport-row[hidden]{display:none}.time-label{font-family:var(--mono);font-size:13px;color:var(--fg);font-variant-numeric:tabular-nums}.time-sep{color:var(--muted)}.loop-toggle,.vol-label{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;color:var(--muted)}.vol-label .range-input{width:120px}.join-section{margin-top:16px}.join-section[hidden]{display:none}.join-list,.clip-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:12px;color:var(--muted)}.status-text{display:block;margin-top:12px;min-height:1em;font-family:var(--mono);font-size:12px;color:var(--muted)}.export-dialog{background:var(--surface);color:var(--fg);border:1px solid var(--border);border-radius:8px;padding:24px;max-width:min(560px,calc(100% - 48px));margin:auto}.export-dialog::backdrop{background:oklch(0 0 0 / .4)}.toolbar{position:sticky;top:64px;z-index:40;background:color-mix(in oklab,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:8px;box-shadow:0 2px 4px oklch(0 0 0 / .08),0 8px 24px oklch(0 0 0 / .12);width:calc(100% - 24px);max-width:1120px;margin:12px auto;clip-path:inset(-32px -32px 0 -32px)}.toolbar-in{display:flex;align-items:center;gap:14px;padding:16px 24px;flex-wrap:wrap}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tab{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--muted);background:none;border:1px solid var(--border);border-radius:4px;padding:9px 14px;min-height:40px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.tab:hover{background:var(--surface-hi);color:var(--fg)}.tab:active{transform:translateY(1px)}.tab[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg);font-weight:700}.search{margin-left:auto;flex:1 1 220px;max-width:320px;position:relative}.toolbar-in--wide .search{max-width:none;margin-left:0}.search input{width:100%;padding-right:38px}.search input::placeholder{color:var(--muted)}.kbd-hint{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:11px;color:var(--muted);border:1px solid var(--border);border-radius:3px;padding:2px 7px;pointer-events:none}.count{font-family:var(--mono);font-size:12.5px;color:var(--muted);font-feature-settings:"tnum";white-space:nowrap}.cards-grid,.grid{max-width:1120px;margin:0 auto;padding:28px 24px 48px;box-sizing:border-box;width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:14px}.card,.tool{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:20px;display:flex;flex-direction:column;gap:8px;transition:border-color .15s,background .15s;text-decoration:none;color:var(--fg)}.card:hover,.tool:hover{border-color:var(--muted);background:var(--surface-hi)}.card-icon,.marker{font-family:var(--mono);color:var(--muted)}.card-title{font-family:var(--mono);font-size:16px;letter-spacing:-.01em;margin:0;font-weight:500;color:var(--fg)}.card-desc{color:var(--muted);font-size:13.5px;line-height:1.55;flex:1}.card-arrow{font-family:var(--mono);color:var(--muted)}.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}.chip{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:2px 7px;text-transform:uppercase}.cat-btn{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--muted);background:none;border:1px solid var(--border);border-radius:4px;padding:9px 14px;min-height:40px;cursor:pointer}.cat-btn.is-active{background:var(--fg);color:var(--bg);border-color:var(--fg);font-weight:700}.search-input{background:var(--surface);border:1px solid var(--border);border-radius:4px;color:var(--fg);font-family:var(--mono);font-size:13px;padding:11px 13px;min-height:42px}.search-input::placeholder{color:var(--muted)}.footer{border-top:1px solid var(--border);padding:40px 0 36px;margin-top:16px}.footer-inner{max-width:1120px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--mono);font-size:12px;color:var(--muted)}.footer-text,.footer-links{color:var(--muted)}.footer-links a{color:var(--muted)}.footer-links a:hover{color:var(--fg)}.footer-nav{display:flex;gap:8px 24px;flex-wrap:wrap;font-family:var(--mono);font-size:13px}.footer-nav a{color:var(--muted);padding:4px 0}.footer-nav a:hover{color:var(--fg)}.footer-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--mono);font-size:12px;color:var(--muted)}.faq-section,.faq{max-width:1120px;margin:0 auto 48px;padding:0 24px}.faq-item{border-bottom:1px solid var(--border)}.faq-question{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--fg);cursor:pointer;padding:14px 4px;list-style:none}.faq-answer{color:var(--muted);font-size:14px;padding:0 4px 16px;max-width:68ch;line-height:1.7}.feedback-modal-content{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:24px}.feedback-modal-content textarea,.feedback-modal-content input{background:var(--bg);border:1px solid var(--border);color:var(--fg);border-radius:4px;font-family:var(--mono);font-size:13px;padding:9px 11px;width:100%;margin-bottom:12px}.feedback-modal-content textarea:focus,.feedback-modal-content input:focus{outline:2px solid var(--accent)}#cookie-accept{min-height:36px;padding:8px 16px!important;line-height:1}@media (max-width:720px){.nav-links{display:none}.search{margin-left:0;max-width:none}.head{padding:52px 0 28px}#cookie-banner{left:16px!important;right:16px!important;max-width:none!important}#cookie-accept{min-height:44px!important}.lang-select{min-height:44px!important}.footer-inner{gap:20px}.footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}.footer-nav a{min-height:44px;display:flex;align-items:center;padding:6px 0}.footer-meta{flex-direction:column;gap:4px}}@media (max-width:1024px){.toolbar{top:calc(76px + env(safe-area-inset-top,0px));width:auto;max-width:1120px;margin:12px auto;margin-left:max(12px,env(safe-area-inset-left));margin-right:max(12px,env(safe-area-inset-right));border:1px solid var(--border);border-radius:8px;box-shadow:0 1px 2px oklch(0 0 0 / .06),0 4px 16px oklch(0 0 0 / .08);overflow:hidden}.toolbar-in{padding:14px 20px;justify-content:center}}