:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-panel: #0f3460;--text-primary: #e8e8e8;--text-secondary: #a8a8b8;--accent-primary: #e94560;--accent-secondary: #533483;--border-color: #2a2a4a}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.5}button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:14px;font-weight:500;transition:background-color .2s,transform .1s}button:hover{transform:translateY(-1px)}button:active{transform:translateY(0)}button.primary{background-color:var(--accent-primary);color:#fff}button.primary:hover{background-color:#ff5a75}button.secondary{background-color:var(--bg-panel);color:var(--text-primary);border:1px solid var(--border-color)}button.secondary:hover{background-color:var(--accent-secondary)}input[type=range]{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:var(--bg-secondary);outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent-primary);cursor:pointer}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent-primary);cursor:pointer;border:none}.panel{background-color:var(--bg-panel);border-radius:8px;padding:16px;border:1px solid var(--border-color)}.label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);margin-bottom:8px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-secondary)}.image-loader{border:2px dashed var(--border-color);border-radius:8px;padding:32px;text-align:center;cursor:pointer;transition:all .2s ease;background-color:var(--bg-secondary)}.image-loader:hover{border-color:var(--accent-primary);background-color:#e945600d}.image-loader.dragging{border-color:var(--accent-primary);background-color:#e945601a}.image-loader.loading{pointer-events:none;opacity:.7}.image-loader-content{display:flex;flex-direction:column;align-items:center;gap:12px}.upload-icon{color:var(--text-secondary);opacity:.6}.image-loader:hover .upload-icon{color:var(--accent-primary);opacity:1}.upload-text{color:var(--text-primary);font-size:14px;margin:0}.upload-hint{color:var(--text-secondary);font-size:12px;margin:0}.loading-spinner{color:var(--accent-primary);font-size:14px}.benchmark-gallery{padding:20px 0 8px}.gallery-header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:0 4px 12px;border-bottom:1px solid var(--border-color, #1e2a3a);margin-bottom:16px}.gallery-title{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-primary, #e6edf3)}.gallery-title .count{color:var(--accent, #ef4060);font-weight:700;margin-left:8px}.gallery-sub{font-size:12px;color:var(--text-secondary, #8aa0b4)}.gallery-groups{display:flex;flex-direction:column;gap:20px}.gallery-group{display:flex;flex-direction:column;gap:10px}.gallery-group-label{display:flex;align-items:baseline;gap:10px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary, #8aa0b4)}.gallery-group-label .badge{padding:2px 8px;border-radius:10px;background:#ef406024;color:var(--accent, #ef4060);font-weight:600;letter-spacing:.05em}.gallery-group-label .hint{color:var(--text-muted, #6b7a8f);text-transform:none;letter-spacing:0}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}.gallery-tile{position:relative;background:linear-gradient(180deg,#0f1a2b,#0a1220);border:1px solid #1e2a3a;border-radius:10px;padding:10px;cursor:pointer;display:flex;flex-direction:column;gap:10px;transition:border-color .18s ease,transform .12s ease,box-shadow .18s ease;box-shadow:0 1px 2px #0003}.gallery-tile:hover{border-color:var(--accent, #ef4060);transform:translateY(-2px);box-shadow:0 6px 20px #00000059,0 0 0 1px #ef40604d}.gallery-tile:focus-visible{outline:2px solid var(--accent, #ef4060);outline-offset:2px}.gallery-tile.loading{opacity:.55;cursor:wait}.gallery-tile-thumb{position:relative;aspect-ratio:1 / 1;border-radius:6px;overflow:hidden;background:linear-gradient(45deg,#141f30 25%,transparent 25%),linear-gradient(-45deg,#141f30 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#141f30 75%),linear-gradient(-45deg,transparent 75%,#141f30 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;background-color:#0a1220}.gallery-tile-thumb img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;display:block}.gallery-tile-overlay{position:absolute;top:6px;right:6px;padding:2px 7px;border-radius:10px;background:#0a1220cc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-size:10px;font-weight:600;color:var(--text-primary, #e6edf3);letter-spacing:.04em}.accent-badge{background:#5eead424!important;color:#5eead4!important}.real-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.real-tile .gallery-tile-thumb{aspect-ratio:16 / 10}.gallery-tile-noise{position:absolute;top:6px;left:6px;padding:2px 7px;border-radius:10px;background:#ef4060d9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-size:10px;font-weight:700;color:#fff;letter-spacing:.04em;text-transform:uppercase}.gallery-tile-caption{display:flex;align-items:center;justify-content:space-between;gap:8px}.gallery-tile-name{font-family:ui-monospace,JetBrains Mono,Menlo,Consolas,monospace;font-size:11px;color:var(--text-primary, #e6edf3);letter-spacing:.02em}.gallery-tile-meta{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--text-secondary, #8aa0b4)}.gallery-tile-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--text-muted, #6b7a8f)}.gallery-error,.gallery-loading{padding:24px;color:var(--text-secondary, #8aa0b4);font-size:13px;text-align:center}.gallery-error strong{color:var(--accent, #ef4060);margin-right:6px}.before-after{display:flex;flex-direction:column;gap:8px;height:100%;min-height:300px}.before-after-box{position:relative;flex:1;min-height:280px;display:flex;align-items:center;justify-content:center;padding:16px;background-color:#2a2a3a;background-image:linear-gradient(45deg,#3a3a4a 25%,transparent 25%),linear-gradient(-45deg,#3a3a4a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#3a3a4a 75%),linear-gradient(-45deg,transparent 75%,#3a3a4a 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;border:1px solid var(--border-color);border-radius:8px;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;cursor:ew-resize}.before-after-box.dragging{cursor:grabbing}.ba-frame{position:relative;max-width:100%;max-height:100%;width:100%;overflow:hidden;background:#fff;box-shadow:0 4px 20px #0006}.ba-layer{position:absolute;top:0;right:0;bottom:0;left:0}.ba-layer canvas,.ba-layer img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:fill;background-color:#fff;pointer-events:none;display:block}.ba-label{position:absolute;top:8px;padding:2px 8px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#0000008c;border-radius:3px;pointer-events:none}.ba-label-before{left:8px}.ba-label-after{right:8px}.ba-handle{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;z-index:2;pointer-events:none}.ba-handle-knob{pointer-events:auto}.ba-handle:focus-visible{outline:none}.ba-handle:focus-visible .ba-handle-knob{box-shadow:0 0 0 3px #e9456066}.ba-handle-line{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:var(--accent-primary);box-shadow:0 0 0 1px #0000004d}.ba-handle-knob{position:absolute;top:50%;left:50%;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;background:var(--accent-primary);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0006;cursor:grab}.before-after-box.dragging .ba-handle-knob{cursor:grabbing;transform:scale(1.05)}.before-after-caption{text-align:center;font-size:11px;color:var(--text-secondary);font-family:ui-monospace,Menlo,Consolas,monospace}.comparison-view{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;height:100%;min-height:300px}.comparison-view.mode-onion,.comparison-view.mode-toggle,.comparison-view.mode-slider{grid-template-columns:1fr}.image-panel{display:flex;flex-direction:column;background-color:var(--bg-panel);border-radius:8px;border:1px solid var(--border-color);overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.panel-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.panel-dimensions{font-size:11px;color:var(--text-secondary);font-family:monospace}.panel-content{flex:1;display:flex;align-items:center;justify-content:center;padding:16px;overflow:auto;background-color:#2a2a3a;background-image:linear-gradient(45deg,#3a3a4a 25%,transparent 25%),linear-gradient(-45deg,#3a3a4a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#3a3a4a 75%),linear-gradient(-45deg,transparent 75%,#3a3a4a 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.panel-placeholder{color:var(--text-secondary);font-size:14px}.image-canvas{max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated;background-color:#fff;transition:transform .12s ease}.image-canvas.svg-img{image-rendering:auto}.image-canvas{-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.panel-header-right,.panel-actions{display:flex;align-items:center;gap:10px}.zoom-control{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-secondary)}.zoom-control label{text-transform:uppercase;letter-spacing:.08em;font-weight:600}.zoom-control input[type=range]{width:80px;height:14px;accent-color:var(--accent)}.zoom-value{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--text-primary);min-width:32px;text-align:right}.zoom-reset{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);padding:2px 8px;border-radius:3px;font-size:10px;cursor:pointer;letter-spacing:.04em}.zoom-reset:hover{border-color:var(--accent);color:var(--accent)}.copy-button{background:transparent;border:1px solid var(--border-color);color:var(--text-primary);padding:4px 12px;border-radius:4px;font-size:11px;letter-spacing:.04em;cursor:pointer;transition:all .12s ease}.copy-button:hover{border-color:var(--accent);color:var(--accent)}.copy-button.ok{color:#5eead4;border-color:#5eead4}.copy-button.err{color:#ef4060;border-color:#ef4060}.svg-container{max-width:100%;max-height:100%;display:flex;align-items:center;justify-content:center}.svg-container svg{max-width:100%;max-height:100%;background-color:#fff}@media(max-width:1024px){.comparison-view{grid-template-columns:1fr 1fr}.comparison-view .image-panel:last-child{grid-column:span 2}}@media(max-width:640px){.comparison-view{grid-template-columns:1fr}.comparison-view .image-panel:last-child{grid-column:span 1}.image-panel{min-height:220px}.panel-content{min-height:180px}.panel-header{flex-wrap:wrap;gap:6px}.panel-header-right{gap:6px}}.metrics-panel{background-color:var(--bg-panel);border-radius:8px;border:1px solid var(--border-color);padding:12px 16px}.metrics-panel.processing{opacity:.7}.metrics-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.metrics-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.processing-indicator{font-size:11px;color:var(--accent-primary);animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.metrics-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}.metric-item{display:flex;flex-direction:column;gap:4px}.metric-item.highlight .metric-value{color:#4ade80}.metric-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.metric-value{font-size:18px;font-weight:700;color:var(--text-primary);font-family:monospace}.metric-unit{font-size:12px;font-weight:400;color:var(--text-secondary);margin-left:2px}@media(max-width:768px){.metrics-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:480px){.metrics-grid{grid-template-columns:repeat(2,1fr)}}.parameter-controls{background-color:var(--bg-panel);border-radius:8px;border:1px solid var(--border-color);padding:12px 16px}.controls-header{margin-bottom:12px;display:flex;align-items:center;gap:8px}.controls-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.controls-tuned-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 6px;border-radius:3px;background:var(--accent-primary);color:#fff}.controls-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 24px}.slider-control{display:flex;flex-direction:column;gap:8px}.slider-header{display:flex;justify-content:space-between;align-items:center}.slider-label{font-size:13px;font-weight:500;color:var(--text-primary)}.slider-value{font-size:13px;font-weight:600;color:var(--accent-primary);font-family:monospace}.slider-input{width:100%;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-secondary);border-radius:3px;outline:none}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent-primary);cursor:pointer;transition:transform .1s}.slider-input::-webkit-slider-thumb:hover{transform:scale(1.1)}.slider-input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent-primary);cursor:pointer;border:none;transition:transform .1s}.slider-input::-moz-range-thumb:hover{transform:scale(1.1)}@media(max-width:768px){.controls-grid{grid-template-columns:1fr;gap:16px}}.diff-overlay{display:flex;align-items:center;gap:12px}.diff-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.diff-buttons{display:flex;gap:4px;background-color:var(--bg-secondary);padding:4px;border-radius:6px}.diff-button{display:flex;align-items:center;gap:6px;padding:6px 12px;background:transparent;border:none;border-radius:4px;color:var(--text-secondary);font-size:12px;cursor:pointer;transition:all .15s}.diff-button:hover{background-color:var(--bg-panel);color:var(--text-primary)}.diff-button.active{background-color:var(--accent-primary);color:#fff}.diff-icon{font-family:monospace;font-weight:700;font-size:11px}.diff-text{font-weight:500}@media(max-width:640px){.diff-overlay{gap:8px}.diff-label{display:none}.diff-buttons{flex-wrap:wrap;padding:2px;gap:2px}.diff-button{padding:6px 8px;font-size:11px;min-height:36px}.diff-icon{display:none}}.about-page{min-height:100vh;background-color:#0b0b17;color:#e8e8ea;font-family:Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-feature-settings:"ss01","cv11";line-height:1.55}.about-header{position:sticky;top:0;z-index:10;background:#0b0b17d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}.about-header-inner{max-width:1120px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}.about-back,.about-github{font-size:13px;color:#9ca0af;background:transparent;border:none;padding:6px 10px;cursor:pointer;font-family:inherit;letter-spacing:.02em;text-decoration:none}.about-back:hover,.about-github:hover{color:#f5f5f7}.about-brand{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#f5f5f7}.about-main{max-width:1120px;margin:0 auto;padding:80px 24px 120px}.about-hero{padding:40px 0 80px;max-width:800px}.about-eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#e94560;margin-bottom:32px}.about-title{font-size:clamp(42px,6.4vw,76px);font-weight:700;line-height:1.05;letter-spacing:-.02em;color:#f5f5f7;margin:0 0 32px}.about-title .accent{color:#e94560}.about-lede{font-size:19px;line-height:1.55;color:#b5b8c4;margin:0;max-width:640px}.about-section{padding:60px 0;border-top:1px solid rgba(255,255,255,.06)}.about-section-label{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#9ca0af;margin-bottom:40px}.about-h2{font-size:clamp(28px,3.4vw,40px);font-weight:700;letter-spacing:-.01em;color:#f5f5f7;margin:0 0 24px;line-height:1.15}.about-stages{display:grid;grid-template-columns:1fr;gap:48px}.stage-card{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start;padding:32px;background:#ffffff05;border:1px solid rgba(255,255,255,.06);border-radius:14px}.stage-head{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}.stage-num{font-size:13px;font-weight:700;letter-spacing:.08em;color:#e94560;font-variant-numeric:tabular-nums}.stage-label{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#9ca0af}.stage-title{font-size:clamp(22px,2.6vw,28px);font-weight:700;color:#f5f5f7;margin:0 0 18px;letter-spacing:-.01em;line-height:1.2}.stage-caption{font-size:15px;line-height:1.65;color:#b5b8c4;margin:0}.stage-figure{grid-row:1 / 3;grid-column:2;background:#141423;border-radius:10px;overflow:hidden;aspect-ratio:1376 / 768;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 40px #0006}.stage-figure img,.stage-figure object{width:100%;height:100%;object-fit:contain;display:block;background:#fff}.about-two-col{display:grid;grid-template-columns:1fr 1fr;gap:64px}.about-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}.about-list li{font-size:15px;line-height:1.55;color:#b5b8c4;padding-left:20px;position:relative}.about-list li:before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:#e94560}.about-list strong{color:#f5f5f7;font-weight:600}.about-stack .stack-row{display:flex;flex-wrap:wrap;gap:12px 16px;font-size:14px;color:#b5b8c4;font-variant-numeric:tabular-nums}.about-stack .stack-row span:nth-child(2n){color:#5a5d6b}.about-cta{padding:80px 0 60px;text-align:center}.about-cta-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;font-size:16px;font-weight:600;color:#fff;background:#e94560;border:none;border-radius:10px;cursor:pointer;font-family:inherit;letter-spacing:.01em;box-shadow:0 10px 30px #e9456040;transition:transform .15s ease,box-shadow .15s ease}.about-cta-btn:hover{transform:translateY(-1px);box-shadow:0 14px 40px #e9456059}.about-footer{max-width:1120px;margin:0 auto;padding:40px 24px;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;font-size:13px;color:#6e7180}.about-footer a{color:#9ca0af;text-decoration:none}.about-footer a:hover{color:#f5f5f7}@media(max-width:900px){.stage-card{grid-template-columns:1fr;gap:24px;padding:24px}.stage-figure{grid-row:auto;grid-column:auto;order:-1}.about-two-col{grid-template-columns:1fr;gap:48px}.about-main{padding:56px 20px 80px}.about-hero{padding:24px 0 56px}.about-section{padding:48px 0}.about-footer{flex-direction:column;gap:8px;text-align:center}}.landing-hero{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center;padding:32px 8px 56px;margin-bottom:24px;border-bottom:1px solid var(--border-color)}.hero-copy{max-width:480px}.hero-eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-primary);margin-bottom:18px}.hero-headline{font-family:Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-size:clamp(36px,4.6vw,58px);font-weight:700;line-height:1.05;letter-spacing:-.02em;color:var(--text-primary);margin:0 0 22px}.hero-headline .accent{color:var(--accent-primary)}.hero-sub{font-size:16px;line-height:1.55;color:var(--text-secondary);margin:0 0 28px}.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}.hero-cta{display:inline-flex;align-items:center;gap:6px;padding:12px 22px;font-size:14px;font-weight:600;border-radius:8px;cursor:pointer;font-family:inherit;text-decoration:none;transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease;border:1px solid transparent}.hero-cta.primary{background:var(--accent-primary);color:#fff;border:none;box-shadow:0 6px 24px #e9456040}.hero-cta.primary:hover{transform:translateY(-1px);box-shadow:0 10px 32px #e9456059}.hero-cta.secondary{background:transparent;color:var(--text-primary);border:1px solid var(--border-color)}.hero-cta.secondary:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.hero-frame{position:relative;width:100%;aspect-ratio:1376 / 768;background:#141423;border-radius:14px;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none;cursor:ew-resize;box-shadow:0 20px 60px #00000059}.hero-layer{position:absolute;top:0;right:0;bottom:0;left:0}.hero-layer img,.hero-layer object{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:fill;background:#fff;display:block;pointer-events:none}.hero-label{position:absolute;top:10px;padding:3px 8px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#00000080;border-radius:3px;pointer-events:none}.hero-label-before{left:10px}.hero-label-after{right:10px}.hero-handle{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;z-index:2;pointer-events:none}.hero-handle-line{position:absolute;top:0;bottom:0;left:0;width:2px;background:var(--accent-primary);box-shadow:0 0 0 1px #0000004d}.hero-handle-knob{position:absolute;top:50%;left:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--accent-primary);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0006}@media(max-width:900px){.landing-hero{grid-template-columns:1fr;gap:24px;padding:16px 0 32px}.hero-copy{max-width:none}}.palette-strip{margin:12px 0 4px;padding:12px 16px;background-color:var(--bg-panel);border-radius:8px;border:1px solid var(--border-color)}.palette-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:10px;display:flex;align-items:baseline;gap:10px}.palette-count{font-weight:500;letter-spacing:0;text-transform:none;color:var(--text-secondary);opacity:.7}.palette-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:8px}.palette-swatch{display:flex;flex-direction:column;gap:4px;align-items:stretch;cursor:default}.swatch-chip{width:100%;height:28px;border-radius:4px;border:1px solid rgba(255,255,255,.06);transition:transform .12s ease,box-shadow .12s ease}.palette-swatch:hover .swatch-chip{transform:translateY(-1px);box-shadow:0 4px 12px #0000004d}.swatch-hex{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10px;color:var(--text-primary);text-align:center;text-transform:uppercase;letter-spacing:.02em}.swatch-meta{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9px;color:var(--text-secondary);text-align:center;opacity:.7}@media(max-width:640px){.palette-row{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px}.swatch-chip{height:22px}.swatch-hex{font-size:9px}.swatch-meta{font-size:8px}}.app{display:flex;flex-direction:column;height:100vh;min-height:600px}@media(max-width:768px){.app{height:auto;min-height:100vh}.app-main,.landing{overflow:visible}}.app-header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.header-brand{display:flex;align-items:baseline;gap:12px}.header-title{font-size:24px;font-weight:700;color:var(--text-primary);margin:0}.header-subtitle{font-size:14px;color:var(--text-secondary)}.header-actions{display:flex;gap:8px;align-items:center}.header-link{font-size:13px;color:var(--text-secondary);text-decoration:none;padding:6px 10px;border-radius:4px;transition:color .15s ease,background-color .15s ease}.header-link:hover{color:var(--text-primary);background-color:var(--bg-panel)}@media(max-width:768px){.header-link{font-size:12px;padding:6px 8px}}.app-main{flex:1;display:flex;flex-direction:column;padding:16px 24px;overflow:hidden}.landing{flex:1;display:flex;flex-direction:column;gap:24px;overflow-y:auto;padding-bottom:8px}.upload-section{display:flex;align-items:center;justify-content:center;max-width:600px;margin:0 auto;width:100%;padding-top:24px}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}.toolbar-info{display:flex;align-items:center;gap:12px}.file-name{font-size:14px;font-weight:600;color:var(--text-primary)}.file-dimensions{font-size:12px;color:var(--text-secondary);font-family:monospace;background-color:var(--bg-secondary);padding:4px 8px;border-radius:4px}.comparison-section{flex:1;overflow:hidden}.error-banner{display:flex;align-items:center;gap:12px;padding:12px 16px;margin-bottom:16px;background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px}.error-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background-color:#ef4444;color:#fff;font-weight:700;font-size:14px}.error-message{flex:1;font-size:14px;color:#fca5a5}.error-dismiss{padding:4px 12px;background:transparent;border:1px solid rgba(239,68,68,.3);color:#fca5a5;font-size:12px}.error-dismiss:hover{background-color:#ef444433}.app-footer{display:flex;flex-direction:column;gap:12px;padding:16px 24px;background-color:var(--bg-secondary);border-top:1px solid var(--border-color)}.app-credit{display:flex;justify-content:center;align-items:center;gap:10px;padding:14px 16px 18px;font-size:12px;color:var(--text-secondary);letter-spacing:.02em;flex-wrap:wrap}.app-credit a{color:var(--text-secondary);text-decoration:none;transition:color .15s ease}.app-credit a:hover{color:var(--accent-primary)}.credit-dot{opacity:.5}.vectorize-btn{display:inline-flex;align-items:center;gap:8px;min-width:120px;justify-content:center;position:relative;overflow:hidden}.vectorize-btn.processing{background:linear-gradient(100deg,var(--accent-primary) 0%,var(--accent-primary) 40%,#ff8099 50%,var(--accent-primary) 60%,var(--accent-primary) 100%);background-size:300% 100%;animation:vectorize-shimmer 1.6s linear infinite}.cancel-btn{min-width:120px}.cancel-btn:hover{color:var(--accent-primary)!important;border-color:var(--accent-primary)!important}.cancel-btn .btn-spinner{border-color:#e9456040;border-top-color:var(--accent-primary)}.notfound-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#0b0b17;color:#e8e8ea;font-family:Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;padding:40px 24px}.notfound-inner{max-width:520px;text-align:center}.notfound-eyebrow{font-size:13px;font-weight:700;letter-spacing:.2em;color:var(--accent-primary);margin-bottom:24px}.notfound-title{font-size:clamp(32px,5vw,48px);font-weight:700;line-height:1.1;letter-spacing:-.02em;color:#f5f5f7;margin:0 0 18px}.notfound-sub{font-size:15px;color:#b5b8c4;line-height:1.55;margin:0 0 32px}.notfound-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.notfound-cta{display:inline-flex;align-items:center;gap:6px;padding:12px 24px;font-size:14px;font-weight:600;border-radius:8px;border:1px solid transparent;font-family:inherit;text-decoration:none;cursor:pointer;transition:all .15s ease}.notfound-cta.primary{background:var(--accent-primary);color:#fff;border:none}.notfound-cta.primary:hover{transform:translateY(-1px)}.notfound-cta.secondary{background:transparent;color:#f5f5f7;border-color:#ffffff26}.notfound-cta.secondary:hover{border-color:var(--accent-primary);color:var(--accent-primary)}@keyframes vectorize-shimmer{0%{background-position:300% 0}to{background-position:0 0}}.btn-spinner{width:12px;height:12px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.app-main.processing .panel-card,.app-main.processing .metrics-panel{position:relative}.app-main.processing .panel-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border-radius:8px;box-shadow:inset 0 0 0 1px var(--accent-primary);opacity:0;animation:pulse-border 1.6s ease-in-out infinite}@keyframes pulse-border{0%,to{opacity:0}50%{opacity:.6}}@media(max-width:768px){.app-header{flex-direction:column;gap:12px;padding:12px 16px}.app-main,.app-footer{padding:12px 16px}}