:root{color-scheme:light;--paper: #f6f7f8;--panel: #ffffff;--ink: #1d2529;--muted: #667278;--line: #d8dee2;--teal: #007f82;--teal-dark: #005f61;--red: #c74332;--yellow: #e4b92f;--shadow: 0 18px 48px rgba(29, 37, 41, .12)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:linear-gradient(90deg,rgba(0,127,130,.06) 1px,transparent 1px),linear-gradient(0deg,rgba(199,67,50,.05) 1px,transparent 1px),var(--paper);background-size:28px 28px;font-family:Aptos,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{min-height:36px;border:1px solid var(--line);border-radius:6px;color:var(--ink);background:#fff;cursor:pointer}button:hover:not(:disabled){border-color:var(--teal)}button:disabled{color:#9aa3a7;cursor:not-allowed;background:#eef1f2}#app{min-height:100vh;padding:16px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;margin-bottom:14px}.brand{display:flex;align-items:center;gap:12px}.brand img{width:42px;height:42px;border-radius:8px;box-shadow:var(--shadow)}.brand h1{margin:0;font-size:24px;line-height:1}.brand p{margin:4px 0 0;color:var(--muted);font-size:13px}.status-pill{max-width:52vw;padding:8px 12px;overflow:hidden;color:#fff;text-overflow:ellipsis;white-space:nowrap;background:var(--teal);border-radius:999px}.status-pill.working{animation:status-breathe 1.2s ease-in-out infinite}.status-pill.error{background:var(--red);animation:none}.workspace{display:grid;grid-template-columns:360px minmax(0,1fr);gap:14px;align-items:start}.controls,.preview-panel{background:#fffffff2;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.controls{display:grid;gap:14px;max-height:calc(100vh - 96px);padding:14px;overflow:auto}.dropzone{display:grid;gap:6px;padding:16px;border:1px dashed #9da9ae;border-radius:8px;background:#f9fbfb;cursor:pointer}.dropzone.dragging{border-color:var(--teal);background:#007f8214}.dropzone input{position:absolute;width:1px;height:1px;opacity:0}.drop-title{font-weight:700}.drop-meta,.privacy{color:var(--muted);font-size:12px}.mode-toggle{grid-template-columns:repeat(2,minmax(0,1fr))}.control-section{display:grid;gap:10px}.control-section h2,.panel-title h2{margin:0;font-size:13px;line-height:1.2;text-transform:uppercase}.select-row{display:grid;gap:6px}.select-row span{color:var(--muted);font-size:12px}select{width:100%;min-height:38px;padding:0 10px;border:1px solid var(--line);border-radius:6px;color:var(--ink);background:#fff}.model-manager{display:grid;gap:8px;padding:10px;border:1px solid #e3e8ea;border-radius:6px;background:#fbfcfc}.model-manager[hidden]{display:none}.model-manager div{display:grid;gap:3px}.model-manager strong{font-size:13px}.model-manager span{color:var(--muted);font-size:12px;line-height:1.3}.segmented{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.segmented button{min-width:0;padding:0 8px;font-size:13px}.segmented button.selected{color:#fff;border-color:var(--teal-dark);background:var(--teal)}#preset-group{grid-template-columns:repeat(2,minmax(0,1fr))}#preset-group button{min-height:40px;line-height:1.15}.batch-actions{display:grid;grid-template-columns:1fr auto;gap:8px}.batch-summary{color:var(--muted);font-size:12px}.batch-list{display:grid;gap:6px;max-height:180px;overflow:auto}.batch-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;min-height:38px;padding:8px 10px;border:1px solid #e3e8ea;border-radius:6px;background:#fbfcfc}.batch-item button{min-height:0;padding:0;overflow:hidden;border:0;color:inherit;text-align:left;text-overflow:ellipsis;white-space:nowrap;background:transparent}.batch-item button:disabled{color:inherit;background:transparent}.batch-state{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums;text-transform:uppercase}.batch-item.running{border-color:#007f8259;background:#007f820f}.batch-item.done .batch-state{color:var(--teal-dark)}.batch-item.error{border-color:#c7433257}.batch-item.error .batch-state{color:var(--red)}.slider-row{display:grid;gap:6px}.slider-row span{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}.slider-row output{color:var(--ink);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--teal)}textarea{width:100%;min-height:76px;resize:vertical;padding:10px;border:1px solid var(--line);border-radius:6px;color:var(--ink);background:#fbfcfc;font-family:Cascadia Mono,Consolas,monospace;font-size:12px}.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.actions .primary{grid-column:1 / -1;color:#fff;border-color:#162224;background:#162224}.preview-area{display:grid;gap:10px;min-height:0}.preview-tabs{display:flex;gap:8px;justify-content:flex-end}.preview-tabs button{min-width:92px}.preview-tabs button.selected{color:#fff;border-color:var(--teal-dark);background:var(--teal)}.preview-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.2fr) minmax(220px,.8fr);gap:14px}.preview-panel{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr);min-height:220px;padding:12px;overflow:hidden}.preview-panel.large{min-height:520px}.preview-panel.small{min-height:250px}.output-panel{border-top:4px solid var(--yellow)}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px;color:var(--muted)}.panel-title span{font-size:12px;font-variant-numeric:tabular-nums}canvas{width:100%;height:100%;min-height:0;border:1px solid #edf0f1;border-radius:6px;background:linear-gradient(45deg,#f0f2f3 25%,transparent 25%),linear-gradient(-45deg,#f0f2f3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f0f2f3 75%),linear-gradient(-45deg,transparent 75%,#f0f2f3 75%),#fff;background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;object-fit:contain}canvas.filled{background:#fff}.conversion-overlay{position:absolute;inset:48px 12px 12px;display:grid;place-items:center;border-radius:6px;background:linear-gradient(180deg,#f6f7f8d1,#f6f7f894),repeating-linear-gradient(0deg,rgba(0,127,130,.08) 0 1px,transparent 1px 18px);pointer-events:none}.conversion-overlay[hidden]{display:none}.conversion-card{display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:16px;width:min(360px,calc(100% - 32px));padding:18px;border:1px solid rgba(0,127,130,.22);border-radius:8px;background:#fffffff0;box-shadow:0 16px 40px #1d252929}.scanbox{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:7px;width:84px;height:70px;padding:10px;overflow:hidden;border:1px solid #cbd7d9;border-radius:6px;background:linear-gradient(90deg,transparent 0 48%,rgba(0,127,130,.12) 49% 51%,transparent 52%),#f9fbfb}.scanbox:after{position:absolute;top:-20%;left:0;width:100%;height:22px;content:"";background:linear-gradient(180deg,transparent,rgba(228,185,47,.52),transparent);animation:scan-pass 1.15s linear infinite}.scanbox span{border-radius:2px;background:#162224;animation:glyph-blink 1.1s steps(2,end) infinite}.scanbox span:nth-child(2){animation-delay:.18s}.scanbox span:nth-child(3){animation-delay:.35s}.scanbox span:nth-child(4){animation-delay:.52s}.conversion-copy{display:grid;gap:6px;min-width:0}.conversion-copy strong{font-size:18px;line-height:1.1}.conversion-copy span{overflow:hidden;color:var(--muted);font-size:13px;text-overflow:ellipsis;white-space:nowrap}.stats-panel{grid-column:3}.compare-view{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;min-height:calc(100vh - 160px)}.compare-view[hidden]{display:none}.compare-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:0 2px}.compare-head h2{margin:0;font-size:13px;line-height:1.2;text-transform:uppercase}.compare-head span{overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.compare-layout{display:grid;grid-template-areas:"detail" "grid";gap:14px;min-height:0}.compare-grid{grid-area:grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;min-height:0}.compare-detail{grid-area:detail;min-height:0;min-width:0}.compare-detail-card{display:grid;gap:14px;padding:14px;border:1px solid var(--line);border-radius:8px;background:#fffffff5;box-shadow:var(--shadow)}.compare-detail-card.empty{min-height:220px;align-content:center;justify-items:center;color:var(--muted);text-align:center}.compare-detail-card.empty h3,.compare-detail-card.empty p{margin:0}.compare-detail-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.compare-detail-head h3{margin:0;overflow:hidden;font-size:17px;text-overflow:ellipsis;white-space:nowrap}.compare-detail-head span{display:block;margin-top:3px;overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.compare-pipeline{margin:-4px 0 0;color:var(--muted);font-size:12px}.compare-apply{min-width:132px;color:#fff;background:var(--teal);border-color:var(--teal-dark)}.compare-stage-grid{display:grid;grid-template-columns:1fr;gap:12px}.compare-stage{display:grid;grid-template-rows:auto minmax(300px,1fr);gap:8px;min-width:0}.compare-stage>span{color:var(--muted);font-size:12px;font-weight:700}.compare-stage-media,.compare-stage .compare-placeholder{width:100%;min-height:300px;border:1px solid #d7dde0;border-radius:6px;background:#f9fbfb}.compare-stage-media{position:relative;display:block;padding:0;overflow:hidden;cursor:zoom-in}.compare-stage-media:hover{border-color:var(--teal)}.compare-stage-media canvas{display:block;border:0;border-radius:0}.stage-open-label{position:absolute;left:10px;bottom:10px;padding:4px 8px;color:#1d3434;font-size:12px;font-weight:700;background:#ffffffe0;border:1px solid rgba(0,127,130,.22);border-radius:999px;pointer-events:none}.compare-tile{display:grid;grid-template-rows:auto minmax(190px,1fr) auto;gap:8px;min-height:300px;padding:10px;border:1px solid var(--line);border-radius:8px;color:inherit;text-align:left;background:#fffffff2;box-shadow:var(--shadow)}.compare-tile.ready:hover{border-color:var(--teal)}.compare-tile.selected{border-color:var(--teal);box-shadow:0 0 0 2px #007f8229,var(--shadow)}.compare-tile:disabled{color:inherit;background:#ffffffbd}.compare-tile.error,.compare-tile.skipped{box-shadow:none}.compare-tile.error{border-color:#c7433257}.compare-tile-head{display:grid;gap:3px}.compare-tile-head strong{overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.compare-tile-head span,.compare-tile-foot{color:var(--muted);font-size:12px}.compare-tile-head .compare-selected-badge{justify-self:start;padding:2px 7px;color:var(--teal-dark);font-weight:700;background:#007f821a;border:1px solid rgba(0,127,130,.22);border-radius:999px}.compare-tile canvas{min-height:190px}.compare-placeholder{display:grid;place-items:center;min-height:190px;border:1px dashed #cbd4d8;border-radius:6px;color:var(--muted);background:#f9fbfb;font-size:12px}@media(min-width:980px){.compare-view{height:calc(100vh - 160px);min-height:560px}.compare-layout{grid-template-areas:"grid detail";grid-template-columns:minmax(280px,.9fr) minmax(460px,1.35fr);align-items:start;overflow:hidden}.compare-grid,.compare-detail{max-height:100%;overflow:auto;padding-right:4px}.compare-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.stage-zoom[hidden]{display:none}.stage-zoom{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:24px}.stage-zoom-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;background:#0e14169e}.stage-zoom-panel{position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;width:min(1180px,96vw);height:min(820px,92vh);padding:14px;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 24px 70px #00000047}.stage-zoom-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.stage-zoom-head h2{margin:0;overflow:hidden;font-size:18px;text-overflow:ellipsis;white-space:nowrap}#stage-zoom-canvas{min-height:0}#stats-list{display:grid;gap:10px;margin:0}#stats-list div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #edf0f1}#stats-list dt{color:var(--muted);font-size:12px}#stats-list dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}@keyframes scan-pass{0%{transform:translateY(0)}to{transform:translateY(98px)}}@keyframes glyph-blink{0%,to{opacity:.28;transform:scaleY(.74)}50%{opacity:1;transform:scaleY(1)}}@keyframes status-breathe{0%,to{box-shadow:0 0 #007f8233}50%{box-shadow:0 0 0 5px #007f821f}}@media(prefers-reduced-motion:reduce){.status-pill.working,.scanbox:after,.scanbox span{animation:none}}@media(max-width:1180px){.workspace,.preview-grid{grid-template-columns:1fr}.controls{max-height:none}.preview-panel.large,.preview-panel.small{min-height:360px}.stats-panel{grid-column:auto}}@media(max-width:640px){#app{padding:10px}.topbar{align-items:flex-start;flex-direction:column}.status-pill{max-width:100%}.segmented,.actions{grid-template-columns:1fr}}
