:root{--color-bg: #ffffff;--color-surface: #f8f9fa;--color-surface-elevated: #ffffff;--color-border: #e1e4e8;--color-border-hover: #d1d5da;--color-text: #24292e;--color-text-secondary: #586069;--color-text-muted: #8b949e;--color-primary: #0366d6;--color-primary-hover: #0256c7;--color-primary-active: #0248a3;--color-primary-light: #e8f0fe;--color-focus: #0366d6;--color-focus-ring: rgba(3, 102, 214, .3);--color-error: #cb2431;--color-error-light: #ffeef0;--color-success: #28a745;--color-success-light: #e6ffed;--color-warning: #f97583;--color-warning-light: #fff5f5;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono: "SF Mono", "Fira Code", "Fira Mono", Menlo, Consolas, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--leading-tight: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.75;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(27, 31, 35, .04), 0 1px 1px rgba(27, 31, 35, .06);--shadow-md: 0 4px 6px rgba(27, 31, 35, .07), 0 2px 4px rgba(27, 31, 35, .06);--shadow-lg: 0 10px 15px rgba(27, 31, 35, .1), 0 4px 6px rgba(27, 31, 35, .05);--shadow-xl: 0 20px 25px rgba(27, 31, 35, .1), 0 10px 10px rgba(27, 31, 35, .04);--transition-fast: .12s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--z-dropdown: 100;--z-modal: 200;--z-toast: 300;--z-tooltip: 400;--container-max: 1200px;--header-height: 64px}@media (prefers-color-scheme: dark){:root:not(.light){--color-bg: #0d1117;--color-surface: #161b22;--color-surface-elevated: #21262d;--color-border: #30363d;--color-border-hover: #484f58;--color-text: #e6edf3;--color-text-secondary: #8b949e;--color-text-muted: #6e7681;--color-primary: #58a6ff;--color-primary-hover: #79b8ff;--color-primary-active: #388bfd;--color-primary-light: #1f3a5f;--color-focus: #58a6ff;--color-focus-ring: rgba(88, 166, 255, .3);--color-error: #f85149;--color-error-light: #4d1a1a;--color-success: #3fb950;--color-success-light: #11371e;--color-warning: #f97583;--color-warning-light: #4d1a1a;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .4), 0 4px 6px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .5), 0 10px 10px rgba(0, 0, 0, .4)}}:root.dark{--color-bg: #0d1117;--color-surface: #161b22;--color-surface-elevated: #21262d;--color-border: #30363d;--color-border-hover: #484f58;--color-text: #e6edf3;--color-text-secondary: #8b949e;--color-text-muted: #6e7681;--color-primary: #58a6ff;--color-primary-hover: #79b8ff;--color-primary-active: #388bfd;--color-primary-light: #1f3a5f;--color-focus: #58a6ff;--color-focus-ring: rgba(88, 166, 255, .3);--color-error: #f85149;--color-error-light: #4d1a1a;--color-success: #3fb950;--color-success-light: #11371e;--color-warning: #f97583;--color-warning-light: #4d1a1a;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .4), 0 4px 6px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .5), 0 10px 10px rgba(0, 0, 0, .4)}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{display:flex;flex-direction:column;min-height:100vh;margin:0;background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);transition:background-color var(--transition-normal),color var(--transition-normal)}img,svg{display:block;max-width:100%}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-4)}.header{position:sticky;top:0;z-index:var(--z-dropdown);height:var(--header-height);background-color:var(--color-surface);border-bottom:1px solid var(--color-border);transition:background-color var(--transition-normal),border-color var(--transition-normal)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:var(--space-4)}.logo{display:flex;align-items:center;gap:var(--space-2);color:var(--color-text);text-decoration:none;font-weight:600;font-size:var(--text-lg);flex-shrink:0}.logo:hover,.logo-icon{color:var(--color-primary)}.nav-list{display:none;list-style:none;margin:0;padding:0;gap:var(--space-6)}.nav-link{display:block;padding:var(--space-2) 0;color:var(--color-text-secondary);font-weight:500;font-size:var(--text-sm);border-bottom:2px solid transparent;transition:color var(--transition-fast),border-color var(--transition-fast)}.nav-link:hover,.nav-link:focus{color:var(--color-primary);border-color:var(--color-primary)}@media (min-width: 768px){.nav-list{display:flex}}.theme-toggle{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background-color:transparent;border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.theme-toggle:hover{background-color:var(--color-surface-elevated);border-color:var(--color-border-hover);color:var(--color-text)}.theme-toggle:focus-visible{box-shadow:0 0 0 3px var(--color-focus-ring)}.theme-toggle .icon-sun{display:none}.theme-toggle .icon-moon,html.light .theme-toggle .icon-sun,html.dark .theme-toggle .icon-moon{display:block}html.light .theme-toggle .icon-moon,html.dark .theme-toggle .icon-sun{display:none}.mobile-menu-toggle{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background-color:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;flex-shrink:0}.mobile-menu-toggle:hover{background-color:var(--color-surface-elevated)}@media (min-width: 768px){.mobile-menu-toggle{display:none}}.main{flex:1;padding:var(--space-8) 0}.footer{background-color:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-8) 0 var(--space-6);margin-top:auto}.footer-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);text-align:center}.footer-tagline{margin:0;font-size:var(--text-sm);color:var(--color-text-secondary);max-width:600px}.footer-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-3)}.footer-link{font-size:var(--text-sm);color:var(--color-text-secondary);transition:color var(--transition-fast)}.footer-link:hover{color:var(--color-primary)}.footer-install{padding:0;font:inherit;background:none;border:0;cursor:pointer}.footer-install[hidden]{display:none}.footer-separator{color:var(--color-text-muted)}.footer-copyright{margin:var(--space-4) 0 0;font-size:var(--text-xs);color:var(--color-text-muted)}.hero{text-align:center;padding:var(--space-12) var(--space-4);max-width:720px;margin:0 auto var(--space-12)}.hero h1{margin:0 0 var(--space-4);font-size:clamp(var(--text-3xl),5vw,var(--text-4xl));font-weight:700;line-height:var(--leading-tight);color:var(--color-text)}.hero p{margin:0;font-size:var(--text-lg);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.demo{max-width:640px;margin:0 auto}.demo h2{margin:0 0 var(--space-4);font-size:var(--text-2xl);font-weight:600;color:var(--color-text);text-align:center}.demo .dropzone{min-height:240px}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:absolute;left:var(--space-4);top:calc(-1 * var(--space-16));z-index:var(--z-tooltip);padding:var(--space-2) var(--space-4);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);transition:top var(--transition-fast)}.skip-link:focus{top:var(--space-2)}.nav-link-disabled{color:var(--color-text-muted);cursor:not-allowed}@media (max-width: 767px){.nav.is-open .nav-list{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;gap:0;padding:var(--space-2) var(--space-4) var(--space-4);background-color:var(--color-surface-elevated);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-md)}.nav.is-open .nav-link{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}}.tools-section{margin-top:var(--space-8)}.tools-section h2{margin:0 0 var(--space-6);font-size:var(--text-2xl);font-weight:600}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none}.tool-card{display:flex;flex-direction:column;background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.tool-card:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-md)}.tool-card-link{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5);color:inherit}.tool-card-link:hover{text-decoration:none}.tool-card-name{font-size:var(--text-lg);font-weight:600;color:var(--color-text)}.tool-card-desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.tool-card-planned{gap:var(--space-2);border-style:dashed}.tool-card-planned>.tool-card-link{padding:var(--space-5)}.tool-card-badge{align-self:flex-start;padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);background-color:var(--color-surface);color:var(--color-text-muted);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em}.breadcrumb{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-6);font-size:var(--text-sm);color:var(--color-text-secondary)}.breadcrumb-separator{color:var(--color-text-muted)}.tool-header{max-width:720px;margin-bottom:var(--space-8)}.tool-header h1{margin:0 0 var(--space-3);font-size:clamp(var(--text-2xl),4vw,var(--text-4xl));line-height:var(--leading-tight)}.tool-intro{margin:0;font-size:var(--text-lg);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.tool-hint{margin:var(--space-4) 0 0;font-size:var(--text-sm);color:var(--color-text-secondary)}.tool-panel{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-6);margin-bottom:var(--space-10);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}.dropzone{position:relative;display:flex;align-items:center;justify-content:center;min-height:220px;border:2px dashed var(--color-border-hover);border-radius:var(--radius-lg);background-color:var(--color-surface);text-align:center;transition:border-color var(--transition-fast),background-color var(--transition-fast)}.dropzone.is-dragging{border-color:var(--color-primary);background-color:var(--color-primary-light)}.dropzone.is-disabled{opacity:.6}.dropzone.is-invalid{border-color:var(--color-error);background-color:var(--color-error-light)}.dropzone.has-file{border-style:solid;border-color:var(--color-success)}.dropzone-label{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-8) var(--space-4);cursor:pointer;width:100%}.dropzone.is-disabled .dropzone-label{cursor:not-allowed}.dropzone-title{font-size:var(--text-lg);font-weight:600}.dropzone-hint{font-size:var(--text-sm);color:var(--color-text-secondary)}.dropzone-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.dropzone:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus-ring)}.notice{margin:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);line-height:var(--leading-relaxed)}.notice code{font-family:var(--font-mono);font-size:.95em}.notice-warning{background-color:var(--color-warning-light);border:1px solid var(--color-warning);color:var(--color-text)}.tool-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4)}.field{display:flex;flex-direction:column;gap:var(--space-2)}.field-label{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary)}.field-input{width:100%;padding:var(--space-2) var(--space-3);background-color:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.field-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus-ring);outline:none}.progress-region{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3)}.progress{width:100%;height:8px;overflow:hidden;background-color:var(--color-surface);border-radius:var(--radius-full)}.progress-bar{width:0;height:100%;background-color:var(--color-primary);border-radius:var(--radius-full);transition:width var(--transition-normal)}.progress-text{margin:0;font-size:var(--text-sm);color:var(--color-text-secondary)}.result{display:flex;flex-direction:column;gap:var(--space-5)}.result-previews{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4)}.result-preview{margin:0;padding:var(--space-3);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.result-preview img{width:100%;height:180px;object-fit:contain}.result-preview figcaption{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--color-text-secondary);text-align:center}.result-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--space-4);margin:0;padding:var(--space-4);background-color:var(--color-surface);border-radius:var(--radius-lg)}.result-stat dt{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted)}.result-stat dd{margin:var(--space-1) 0 0;font-size:var(--text-base);font-weight:600}.result-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.button{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-5);background-color:var(--color-primary);color:#fff;border:1px solid transparent;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:background-color var(--transition-fast)}.button:hover{background-color:var(--color-primary-hover);text-decoration:none}.button-secondary{background-color:transparent;color:var(--color-text);border-color:var(--color-border)}.button-secondary:hover{background-color:var(--color-surface)}.status{margin:0;min-height:1.25rem;font-size:var(--text-sm);color:var(--color-text-secondary)}.status.is-error{color:var(--color-error);font-weight:600}.tool-notes,.faq,.related-tools{max-width:760px;margin-bottom:var(--space-10)}.tool-notes h2,.faq h2,.related-tools h2{margin:0 0 var(--space-4);font-size:var(--text-xl);font-weight:600}.tool-notes ul{margin:0;padding-left:var(--space-5);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.tool-notes p{color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.related-tools .tool-grid{max-width:none}.faq-item{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}.faq-item summary{cursor:pointer;font-weight:600}.faq-item p{margin:var(--space-3) 0 0;color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.tool-cta{padding:var(--space-6);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-xl)}.slider{width:100%;height:20px;margin:0;background:transparent;-moz-appearance:none;appearance:none;-webkit-appearance:none;cursor:pointer}.slider::-webkit-slider-runnable-track{height:6px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full)}.slider::-moz-range-track{height:6px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full)}.slider::-webkit-slider-thumb{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;background-color:var(--color-primary);border:2px solid var(--color-surface-elevated);border-radius:var(--radius-full);box-shadow:var(--shadow-sm)}.slider::-moz-range-thumb{width:18px;height:18px;background-color:var(--color-primary);border:2px solid var(--color-surface-elevated);border-radius:var(--radius-full);box-shadow:var(--shadow-sm)}.slider:hover::-webkit-slider-thumb{background-color:var(--color-primary-hover)}.slider:hover::-moz-range-thumb{background-color:var(--color-primary-hover)}.slider:focus-visible{outline:2px solid var(--color-focus);outline-offset:4px;border-radius:var(--radius-full)}.slider:disabled{cursor:not-allowed;opacity:.5}.slider-value{font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:var(--color-text-secondary)}.compare-slider{position:relative;display:block;overflow:hidden;min-height:240px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);touch-action:none;-webkit-user-select:none;user-select:none}.compare-slider-pane{position:absolute;top:0;right:0;bottom:0;left:0}.compare-slider-pane img{width:100%;height:100%;object-fit:contain}.compare-slider-after{clip-path:inset(0 0 0 var(--compare-position, 50%))}.compare-slider-handle{position:absolute;top:0;bottom:0;left:var(--compare-position, 50%);width:2px;margin-left:-1px;background-color:var(--color-primary)}.compare-slider-handle:after{content:"";position:absolute;top:50%;left:50%;width:32px;height:32px;margin:-16px 0 0 -16px;background-color:var(--color-surface-elevated);border:2px solid var(--color-primary);border-radius:var(--radius-full);box-shadow:var(--shadow-md)}.compare-slider-label{position:absolute;bottom:var(--space-3);padding:var(--space-1) var(--space-3);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600}.compare-slider-label-before{left:var(--space-3)}.compare-slider-label-after{right:var(--space-3)}.compare-slider:focus-within{box-shadow:0 0 0 3px var(--color-focus-ring)}.batch{display:flex;flex-direction:column;gap:var(--space-4)}.batch-header{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}.batch-summary{margin:0;font-size:var(--text-sm);color:var(--color-text-secondary)}.batch-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.batch-list{display:flex;flex-direction:column;gap:var(--space-3);margin:0;padding:0;list-style:none}.batch-item{display:grid;grid-template-columns:1fr auto;gap:var(--space-2) var(--space-4);align-items:center;padding:var(--space-3) var(--space-4);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.batch-item[data-selected=true]{border-color:var(--color-primary)}.batch-item[data-status=error]{border-color:var(--color-error)}.batch-item[data-status=cancelled]{opacity:.75}.batch-item-main{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}.batch-item-name{font-weight:600;overflow-wrap:anywhere}.batch-item-meta{font-size:var(--text-sm);color:var(--color-text-secondary);font-variant-numeric:tabular-nums}.batch-item .progress{grid-column:1 / -1}.batch-item-status{grid-column:1 / -1;margin:0;font-size:var(--text-xs);color:var(--color-text-secondary)}.batch-item-status.is-error{color:var(--color-error)}.batch-item-status.is-success{color:var(--color-success)}.batch-item-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:flex-end}.compare-slider-input{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;pointer-events:none}.compare-savings{margin:0;font-size:var(--text-sm);color:var(--color-text-secondary);text-align:center;font-variant-numeric:tabular-nums}.ad-slot{display:block;margin:0 auto var(--space-8);max-width:100%;contain:layout paint;background-color:var(--color-surface);border-radius:var(--radius-lg)}.ad-slot-leaderboard{min-height:100px}@media (min-width: 728px){.ad-slot-leaderboard{min-height:90px}}.ad-slot-rectangle{width:100%;max-width:336px;min-height:250px}.prose{max-width:72ch;margin:0 auto}.prose h1{margin:0 0 var(--space-6);font-size:var(--text-4xl);line-height:var(--leading-tight)}.prose h2{margin:var(--space-10) 0 var(--space-3);font-size:var(--text-2xl);line-height:var(--leading-tight)}.prose p,.prose li{color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.prose p{margin:0 0 var(--space-4)}.prose ul,.prose ol{margin:0 0 var(--space-5);padding-left:var(--space-6)}.prose li+li{margin-top:var(--space-2)}.prose strong{color:var(--color-text)}.prose a{color:var(--color-primary)}.prose code{padding:.1em .35em;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.95em}.page-meta{margin:var(--space-10) 0 0;padding-top:var(--space-4);border-top:1px solid var(--color-border);font-size:var(--text-sm);color:var(--color-text-muted)}.page-placeholder{padding:var(--space-3) var(--space-4);background-color:var(--color-warning-light);border:1px solid var(--color-warning);border-radius:var(--radius-md)}.page-placeholder strong{color:var(--color-text)}.planned-tools{margin-top:var(--space-6)}.planned-tools h2{margin:0 0 var(--space-4);font-size:var(--text-xl)}.notice-info{background-color:var(--color-primary-light);border:1px solid var(--color-primary);color:var(--color-text)}.field-wide{grid-column:1 / -1}.field-check{justify-content:flex-end}.check-label{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);cursor:pointer}.check-label input{flex:none;width:1rem;height:1rem;accent-color:var(--color-primary)}.preset-note{margin:var(--space-3) 0 0;padding:var(--space-3) var(--space-4);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-xs);line-height:var(--leading-relaxed);color:var(--color-text-secondary)}.crop-stage{margin:var(--space-5) 0 0;padding:var(--space-3);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.crop-stage img{display:block;max-width:100%;max-height:60vh;margin:0 auto}.crop-toolbar{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:flex-end;margin-top:var(--space-4)}.crop-ratios{display:flex;flex-direction:column;gap:var(--space-2)}.crop-ratios-label{font-size:var(--text-sm);font-weight:600}.ratio-list{display:flex;flex-wrap:wrap;gap:var(--space-2)}.ratio-button{padding:var(--space-1) var(--space-3);font:inherit;font-size:var(--text-sm);color:var(--color-text);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer}.ratio-button:hover{border-color:var(--color-border-hover)}.ratio-button[aria-pressed=true]{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.crop-actions,.crop-apply{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.order{margin-top:var(--space-5)}.order-list{display:flex;flex-direction:column;gap:var(--space-2);margin:var(--space-3) 0 0;padding:0;list-style:none}.order-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md)}.order-position{min-width:1.5rem;font-size:var(--text-sm);font-weight:600;font-variant-numeric:tabular-nums;color:var(--color-text-muted);text-align:center}.order-item-main{display:flex;flex-direction:column;gap:2px;min-width:0}.order-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.order-item-meta{font-size:var(--text-xs);color:var(--color-text-secondary)}.order-item-actions{display:flex;gap:var(--space-1)}.order-button{min-width:2rem;padding:var(--space-1) var(--space-2);font:inherit;font-size:var(--text-sm);line-height:1;color:var(--color-text);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer}.order-button:hover:not(:disabled){border-color:var(--color-border-hover)}.order-button:disabled{opacity:.4;cursor:default}.order-button-remove:hover{color:var(--color-error);border-color:var(--color-error)}.order-hint{margin:var(--space-3) 0 0;font-size:var(--text-xs);color:var(--color-text-secondary)}.install-banner{position:fixed;right:var(--space-4);bottom:var(--space-4);left:var(--space-4);z-index:var(--z-toast);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3) var(--space-5);max-width:34rem;margin:0 auto;padding:var(--space-4) var(--space-5);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.install-banner[hidden]{display:none}.install-banner-text{flex:1 1 16rem;margin:0;font-size:var(--text-sm);color:var(--color-text-secondary)}.install-banner-actions{display:flex;flex:0 0 auto;gap:var(--space-2)}.lang-switch{display:flex;justify-content:flex-end;margin-block-start:var(--space-2)}.lang-switch-list{display:flex;align-items:center;gap:var(--space-1);margin:0;padding:0;list-style:none}.lang-switch-link,.lang-switch-current{display:inline-block;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;line-height:1.6}.lang-switch-link{color:var(--color-text-secondary);text-decoration:none}.lang-switch-link:hover{color:var(--color-text);background-color:var(--color-surface-elevated)}.lang-switch-current{color:var(--color-text);background-color:var(--color-surface-elevated);border:1px solid var(--color-border)}.translation-notice{margin:0 0 var(--space-4);padding:var(--space-3) var(--space-4);background-color:var(--color-surface-elevated);border:1px solid var(--color-border);border-inline-start:3px solid var(--color-primary);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--color-text-secondary)}.tool-panel [hidden]{display:none}.preset-section{margin:var(--space-5) 0 0}.preset-heading{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}.preset-title{margin:0;font-size:var(--text-lg)}.preset-auto[data-selected=true]{border-color:var(--color-primary);background-color:var(--color-primary-light);color:var(--color-primary)}.preset-row{display:flex;gap:var(--space-3);margin:var(--space-3) 0 0;padding-bottom:var(--space-2);overflow-x:auto;overscroll-behavior-x:contain}.preset-chip{flex:0 0 auto;width:8.5rem;display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-2);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font:inherit;font-size:var(--text-sm);text-align:center;cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.preset-chip:hover:not(:disabled){border-color:var(--color-border-hover)}.preset-chip:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus-ring)}.preset-chip[data-selected=true]{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-light)}.preset-chip:disabled{cursor:progress;opacity:.7}.preset-thumb{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;border-radius:var(--radius-sm);background-color:var(--color-bg)}.preset-chip[data-state=unavailable] .preset-thumb{display:none}.preset-name{font-weight:600}.range-row{display:flex;gap:var(--space-3);align-items:center}.range-input{flex:1 1 auto;min-width:0;height:1.5rem;accent-color:var(--color-primary)}.range-output{flex:none;min-width:4rem;font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:var(--color-text-secondary);text-align:end}.field[data-disabled=true]{opacity:.55}.advanced-adjust{margin:var(--space-5) 0 0;padding:var(--space-3) var(--space-4);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.advanced-adjust[data-modified=true]{border-color:var(--color-primary)}.advanced-adjust>summary{display:flex;gap:var(--space-3);align-items:center;min-height:44px;font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);cursor:pointer;list-style:none}.advanced-adjust>summary::-webkit-details-marker{display:none}.advanced-adjust>summary:after{content:"";flex:none;width:.5rem;height:.5rem;margin-inline-start:auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform var(--transition-fast)}.advanced-adjust[open]>summary:after{transform:rotate(-135deg)}.advanced-body{display:grid;gap:var(--space-4);padding-top:var(--space-3)}.correction-note{margin:var(--space-4) 0 0;font-size:var(--text-xs);line-height:var(--leading-relaxed);color:var(--color-text-secondary)}.correction-note:empty{display:none}@media (min-width: 768px){.preset-row{flex-wrap:wrap;overflow-x:visible}}@media (min-width: 768px){[data-collapsible]>details>summary{display:block;cursor:auto;list-style:none;pointer-events:none}[data-collapsible]>details>summary::-webkit-details-marker{display:none}.intro-disclosure>details{display:none}}@media (max-width: 767px){body{padding-bottom:env(safe-area-inset-bottom)}body:has([data-primary-action][data-sticky=on]){padding-bottom:calc(44px + var(--space-3) + env(safe-area-inset-bottom))}.secondary-section{padding-top:var(--space-4);border-top:1px solid var(--color-border)}[data-collapsible]>.disclosure-body{display:none}[data-collapsible]>details[open]+.disclosure-body{display:block}[data-collapsible]>details>summary{display:flex;align-items:center;gap:var(--space-3);min-height:44px;cursor:pointer;list-style:none;pointer-events:auto}[data-collapsible]>details>summary::-webkit-details-marker{display:none}[data-collapsible]>details>summary h2{margin:0}[data-collapsible]>details>summary:after{content:"";flex:none;width:.5rem;height:.5rem;margin-inline-start:auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform var(--transition-fast)}[data-collapsible]>details[open]>summary:after{transform:rotate(-135deg)}.tool-panel button,.tool-panel .button,.tool-panel select,.tool-panel input:not([type=range]):not(.dropzone-input),.tool-panel .range-input,.dropzone-label,.mobile-menu-toggle,.theme-toggle,.logo,.nav-link,.lang-switch-link,.lang-switch-current,.breadcrumb a{min-height:44px}.tool-panel .button:not([hidden]),.tool-panel button:not([hidden]),.logo,.lang-switch-link,.lang-switch-current,.breadcrumb a{display:inline-flex;align-items:center;justify-content:center}.nav-link{display:flex;align-items:center}.theme-toggle{width:44px}.mobile-menu-toggle{min-width:44px}[data-primary-action][data-sticky=on]{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-dropdown);margin:0;border-radius:0;padding:var(--space-3) var(--space-4);padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom));border-top:1px solid var(--color-border)}}