.openrouter-panel[data-v-a19929c1]{background:var(--bg-2);border-radius:var(--radius-sm);padding:16px;border:1px solid var(--stroke);margin-top:16px}.openrouter-panel h3[data-v-a19929c1]{margin:0 0 8px;font-size:.9rem;font-weight:600;color:var(--ink-secondary)}.panel-description[data-v-a19929c1]{margin:0 0 16px;color:var(--muted);font-size:.8rem;line-height:1.5}.control[data-v-a19929c1]{margin-bottom:12px}.control label[data-v-a19929c1]{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;font-size:.8rem;color:var(--muted)}.toggle-visibility[data-v-a19929c1]{padding:2px 8px;font-size:.7rem;background:var(--bg-3);border:1px solid var(--stroke);border-radius:4px;cursor:pointer}.control input[type=text][data-v-a19929c1],.control input[type=password][data-v-a19929c1]{width:100%;padding:10px 14px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-1);color:var(--ink);font-size:.85rem}.control input[data-v-a19929c1]:focus{outline:none;border-color:var(--accent)}.control textarea[data-v-a19929c1]{width:100%;padding:10px 14px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-1);color:var(--ink);font-size:.85rem;font-family:inherit;resize:vertical}.control textarea[data-v-a19929c1]:focus{outline:none;border-color:var(--accent)}.control select[data-v-a19929c1]{width:100%;padding:10px 14px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-1);color:var(--ink);font-size:.85rem;cursor:pointer}.hint[data-v-a19929c1]{display:block;margin-top:4px;font-size:.7rem;color:var(--muted)}.hint a[data-v-a19929c1]{color:var(--accent);text-decoration:none}.hint a[data-v-a19929c1]:hover{text-decoration:underline}.generate-btn[data-v-a19929c1]{width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.spinner-small[data-v-a19929c1]{width:14px;height:14px;border:2px solid rgba(0,0,0,.2);border-top-color:var(--bg-0);border-radius:50%;animation:spin-a19929c1 .8s linear infinite}@keyframes spin-a19929c1{to{transform:rotate(360deg)}}.error-message[data-v-a19929c1]{margin-top:12px;padding:10px 14px;background:#f871711a;border:1px solid var(--error);border-radius:var(--radius-xs);color:var(--error);font-size:.8rem}.generated-images[data-v-a19929c1]{margin-top:16px;padding-top:16px;border-top:1px solid var(--stroke)}.generated-images h4[data-v-a19929c1]{margin:0 0 12px;font-size:.85rem;font-weight:600;color:var(--ink-secondary)}.image-grid[data-v-a19929c1]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.generated-image-card[data-v-a19929c1]{position:relative;border-radius:var(--radius-xs);overflow:hidden;border:1px solid var(--stroke);cursor:pointer;transition:all .2s}.generated-image-card[data-v-a19929c1]:hover{border-color:var(--accent);transform:translateY(-2px)}.generated-image-card img[data-v-a19929c1]{width:100%;height:auto;display:block}.image-info[data-v-a19929c1]{position:absolute;bottom:0;left:0;right:0;padding:8px;background:linear-gradient(transparent,#000c);display:flex;justify-content:space-between;align-items:center}.image-time[data-v-a19929c1]{font-size:.7rem;color:var(--muted)}.use-btn[data-v-a19929c1]{font-size:.75rem;font-weight:600;color:var(--accent)}:root{color-scheme:dark;--bg-0: #09090b;--bg-1: #0f0f12;--bg-2: #18181b;--bg-3: #1f1f23;--panel: rgba(24, 24, 27, .95);--panel-elevated: rgba(31, 31, 35, .98);--stroke: rgba(255, 255, 255, .08);--stroke-hover: rgba(255, 255, 255, .15);--ink: #fafafa;--ink-secondary: #e4e4e7;--muted: #71717a;--accent: #a78bfa;--accent-hover: #c4b5fd;--accent-2: #22d3ee;--success: #4ade80;--warning: #fbbf24;--error: #f87171;--shadow: rgba(0, 0, 0, .5);--shadow-lg: rgba(0, 0, 0, .7);--radius: 16px;--radius-sm: 10px;--radius-xs: 6px;--checker-a: rgba(255, 255, 255, .06);--checker-b: rgba(255, 255, 255, .02);--transition: .2s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,SF Pro Display,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg-0);min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.bg-orbit{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(167,139,250,.15),transparent),radial-gradient(ellipse 60% 40% at 100% 0%,rgba(34,211,238,.1),transparent);pointer-events:none;z-index:0}.app{position:relative;z-index:1;padding:32px 24px 64px;max-width:1600px;margin:0 auto}@media(min-width:768px){.app{padding:48px 40px 80px}}.hero{display:flex;flex-direction:column;gap:16px;margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid var(--stroke)}@media(min-width:768px){.hero{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:32px}}.title-block h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;margin:0 0 8px;letter-spacing:-.02em;background:linear-gradient(135deg,var(--ink) 0%,var(--muted) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.title-block p{max-width:480px;color:var(--muted);font-size:.9rem;margin:0;line-height:1.6}.eyebrow{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;font-weight:600;color:var(--accent);margin-bottom:4px}.eyebrow:before{content:"";width:8px;height:8px;background:var(--accent);border-radius:50%}.stat-block{display:flex;gap:24px;padding:16px 20px;background:var(--bg-2);border:1px solid var(--stroke);border-radius:var(--radius-sm)}.stat{display:flex;flex-direction:column;gap:2px}.stat-label{text-transform:uppercase;letter-spacing:.08em;font-size:.65rem;font-weight:500;color:var(--muted)}.stat-value{font-size:.85rem;font-weight:600;font-family:SF Mono,Fira Code,monospace}.grid{display:grid;grid-template-columns:1fr;gap:24px}@media(min-width:1024px){.grid{grid-template-columns:340px 1fr;gap:32px}}.panel{background:var(--panel);border-radius:var(--radius);border:1px solid var(--stroke);padding:24px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.panel h2{font-size:1rem;font-weight:600;margin:0 0 20px;color:var(--ink-secondary);display:flex;align-items:center;gap:8px}.panel h2:before{content:"";width:3px;height:16px;background:var(--accent);border-radius:2px}.controls{display:flex;flex-direction:column;gap:16px}.file-drop{border:2px dashed var(--stroke);border-radius:var(--radius-sm);padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--bg-2);cursor:pointer;transition:all var(--transition);text-align:center;min-height:100px}.file-drop:hover{border-color:var(--accent);background:#a78bfa0d}.file-drop.dragging{border-color:var(--accent);background:#a78bfa1a;transform:scale(1.01)}.file-drop strong{font-size:.9rem;font-weight:600;color:var(--ink-secondary)}.file-drop span{color:var(--muted);font-size:.8rem}.file-drop input{display:none}.control{display:flex;flex-direction:column;gap:6px}.control label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.8rem;font-weight:500;color:var(--muted)}.control input[type=range]{width:100%;height:6px;border-radius:3px;background:var(--bg-3);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;transition:transform var(--transition)}.control input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}.control input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent);border:none;cursor:pointer}.control.mini{gap:4px}.control.mini label{font-size:.75rem}.control input[type=text]{width:100%;padding:10px 14px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-2);color:var(--ink);font-size:.85rem;transition:border-color var(--transition)}.control input[type=text]:focus{outline:none;border-color:var(--accent)}.control input[type=text]::placeholder{color:var(--muted)}.control select{width:100%;padding:10px 14px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-2);color:var(--ink);font-size:.85rem;cursor:pointer;transition:border-color var(--transition)}.control select:focus{outline:none;border-color:var(--accent)}.control select option{color:var(--ink);background-color:var(--bg-2)}.preview-controls select{min-width:120px;padding:8px 12px;border-radius:var(--radius-xs);border:1px solid var(--stroke);background:var(--bg-2);color:var(--ink);font-size:.8rem;cursor:pointer}.preview-controls select option{color:var(--ink);background-color:var(--bg-2)}.inline-toggle{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.8rem;cursor:pointer}.inline-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.preview-toggle{align-self:flex-end;margin-top:-4px;margin-bottom:8px;justify-content:flex-end}.preview-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:8px}.preview-controls label{display:flex;flex-direction:column;gap:4px;font-size:.75rem;color:var(--muted)}.preview-controls .inline-toggle{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.8rem}.value{font-variant-numeric:tabular-nums;color:var(--ink);font-family:SF Mono,Fira Code,monospace;font-size:.8rem}.control-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.control-row label{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:.8rem}.control-row input[type=color]{width:44px;height:36px;border:2px solid var(--stroke);border-radius:var(--radius-xs);background:transparent;cursor:pointer;padding:2px}.control-row input[type=color]::-webkit-color-swatch-wrapper{padding:0}.control-row input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}button{border:1px solid var(--stroke);padding:10px 20px;border-radius:var(--radius-xs);font-weight:600;font-size:.85rem;cursor:pointer;background:var(--bg-3);color:var(--ink);transition:all var(--transition)}button:hover{background:var(--bg-2);border-color:var(--stroke-hover)}button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg-0)}button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}button.primary:disabled{opacity:.4;cursor:not-allowed}button.primary:disabled:hover{background:var(--accent)}button.ghost{background:transparent;border-color:var(--stroke)}button.ghost:hover{background:var(--bg-3)}.actions{justify-content:space-between;padding-top:8px}.tips{background:var(--bg-2);border-radius:var(--radius-sm);padding:14px 16px;border:1px solid var(--stroke)}.tips h3{margin:0 0 6px;font-size:.85rem;font-weight:600;color:var(--ink-secondary)}.tips p{margin:0;color:var(--muted);font-size:.8rem;line-height:1.5}.metrics{background:var(--bg-2);border-radius:var(--radius-sm);padding:14px 16px;border:1px solid var(--stroke);display:flex;flex-direction:column;gap:8px}.metrics h3{margin:0 0 4px;font-size:.85rem;font-weight:600;color:var(--ink-secondary)}.metric{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--muted);padding:4px 0;border-bottom:1px solid var(--stroke)}.metric:last-of-type{border-bottom:none}.metric strong{color:var(--ink);font-variant-numeric:tabular-nums;font-family:SF Mono,Fira Code,monospace;font-size:.8rem}.metric[data-state=good] strong{color:var(--success)}.metric[data-state=warn] strong{color:var(--warning)}.metric[data-state=bad] strong{color:var(--error)}.metric-note{margin:4px 0 0;font-size:.7rem;color:var(--muted);font-style:italic}.previews{display:flex;flex-direction:column;gap:20px}.preview-grid{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:768px){.preview-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}}.preview-card{background:var(--bg-2);border-radius:var(--radius);padding:16px;border:1px solid var(--stroke);display:flex;flex-direction:column;gap:12px}.preview-card header{display:flex;justify-content:space-between;align-items:center;gap:12px}.preview-card header span{color:var(--muted);font-size:.75rem;font-family:SF Mono,Fira Code,monospace}.preview-card h3{color:var(--ink-secondary);font-size:.9rem;font-weight:600;margin:0}.canvas-wrap{position:relative;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--stroke);background:var(--bg-0);min-height:200px;display:grid;place-items:center}.canvas-wrap.checker{background-image:linear-gradient(45deg,var(--checker-a) 25%,transparent 25%),linear-gradient(-45deg,var(--checker-a) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker-a) 75%),linear-gradient(-45deg,transparent 75%,var(--checker-a) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.canvas-wrap.bg-white{background:#f5f5f5}.canvas-wrap.bg-mid{background:#71717a}.canvas-wrap.bg-dark{background:#18181b}.canvas-wrap.bg-color{background:linear-gradient(135deg,#a78bfa,#22d3ee)}.preview-card.qa-strip h3{margin:0 0 12px}.qa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.qa-card{border-radius:var(--radius-sm);border:1px solid var(--stroke);padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--bg-3);cursor:pointer;transition:all var(--transition)}.qa-card span{font-size:.7rem;font-weight:500;color:var(--muted)}.qa-card:hover{border-color:var(--stroke-hover);transform:translateY(-2px)}.qa-card canvas{width:100%;height:auto;display:block;border-radius:var(--radius-xs);background:transparent}.size-preview{background:var(--bg-2)}.size-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media(max-width:768px){.size-grid{grid-template-columns:repeat(2,1fr)}}.size-chip{border-radius:var(--radius-sm);border:1px solid var(--stroke);padding:10px;background:var(--bg-3);display:flex;flex-direction:column;gap:6px;align-items:center}.size-chip span{font-size:.7rem;font-weight:500;color:var(--muted)}.size-chip canvas{width:auto;height:auto;max-width:100%;image-rendering:auto;background:repeating-conic-gradient(from 0deg,var(--checker-a) 0deg 25%,transparent 0deg 50%) 0 0 / 12px 12px;border-radius:var(--radius-xs)}.qa-light{background:#f5f5f5!important}.qa-mid{background:#71717a!important}.qa-light span,.qa-mid span{color:#3f3f46}.qa-color{background:linear-gradient(135deg,#a78bfa,#22d3ee)!important}.qa-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:24px;z-index:100}.qa-modal.open{display:flex}.qa-modal-content{width:min(90vw,640px);border-radius:var(--radius);padding:20px;background:var(--bg-1);border:1px solid var(--stroke);box-shadow:0 24px 48px var(--shadow-lg);display:flex;flex-direction:column;gap:16px}.qa-modal-content.qa-light{background:#f5f5f5}.qa-modal-content.qa-mid{background:#71717a}.qa-modal-content.qa-color{background:linear-gradient(135deg,#a78bfa,#22d3ee)}.qa-modal-header{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;font-weight:600}.qa-modal-header button{background:#0003;border-color:#0000001a;color:inherit;padding:8px 16px;font-size:.8rem}.qa-modal canvas{width:100%;max-width:600px;height:auto;border-radius:var(--radius-sm);background:transparent;align-self:center}canvas{max-width:100%;width:100%;height:auto}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#09090bd9;display:none;align-items:center;justify-content:center;z-index:10;border-radius:inherit}.loading-overlay.active{display:flex}.spinner{width:40px;height:40px;border:3px solid var(--stroke);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.processing-bar{position:fixed;top:0;left:0;right:0;height:3px;background:var(--bg-2);z-index:1000;opacity:0;transition:opacity .2s}.processing-bar.active{opacity:1}.processing-bar:after{content:"";position:absolute;top:0;left:0;height:100%;width:30%;background:linear-gradient(90deg,var(--accent),var(--accent-2));animation:progress 1s ease-in-out infinite}@keyframes progress{0%{left:-30%}to{left:100%}}@media(max-width:980px){.grid,.preview-grid{grid-template-columns:1fr}.preview-controls,.hero{flex-direction:column;align-items:flex-start}.qa-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:720px){.size-grid{grid-template-columns:repeat(2,1fr)}.qa-grid{grid-template-columns:1fr}}
