.studio{width:100%}.studio-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-5);min-height:380px;justify-content:center}.studio-drop{border:2px dashed var(--color-border);border-radius:var(--radius-xl);background:var(--color-bg-alt);padding:var(--space-10) var(--space-5);text-align:center;transition:border-color var(--transition-normal),background var(--transition-normal)}.studio-drop--active{border-color:var(--color-accent);background:var(--color-accent-bg)}.studio-drop-icon{width:40px;height:40px;color:var(--color-accent);margin:0 auto var(--space-4)}.studio-drop-title{font-size:var(--text-lg);font-weight:700;color:var(--color-text)}.studio-drop-sub{font-size:var(--text-sm);color:var(--color-text-secondary);margin-top:var(--space-1)}.studio-upload-btn{display:inline-block;margin-top:var(--space-5);background:var(--color-accent);color:#fff;font-weight:600;font-size:var(--text-base);padding:var(--space-3) var(--space-8);border-radius:var(--radius-full);cursor:pointer;transition:background var(--transition-fast),transform var(--transition-fast)}.studio-upload-btn:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.studio-file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.studio-file-input:focus-visible+*,.studio-upload-btn:focus-within{outline:3px solid var(--color-accent-light);outline-offset:2px}.studio-formats{margin-top:var(--space-4);font-size:var(--text-xs);color:var(--color-text-muted)}.studio-processing{text-align:center;padding:var(--space-8) var(--space-4)}.studio-processing-thumb{width:96px;height:96px;object-fit:cover;border-radius:var(--radius-lg);margin:0 auto var(--space-5);opacity:.55;filter:saturate(.6)}.studio-processing-title{font-size:var(--text-lg);font-weight:700}.studio-processing-sub{font-size:var(--text-sm);color:var(--color-text-secondary);max-width:380px;margin:var(--space-2) auto 0}.studio-progress{margin:var(--space-6) auto 0;max-width:320px;height:6px;border-radius:var(--radius-full);background:var(--color-border-light);overflow:hidden}.studio-progress-bar{display:block;width:40%;height:100%;border-radius:var(--radius-full);background:var(--color-accent);animation:studio-indeterminate 1.4s ease-in-out infinite}@keyframes studio-indeterminate{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media(prefers-reduced-motion:reduce){.studio-progress-bar{animation:none;width:100%;opacity:.5}}.studio-compare{display:flex;align-items:center;justify-content:center;gap:var(--space-4)}.studio-compare-item{flex:1 1 0;min-width:0;text-align:center}.studio-compare-item img{width:100%;height:220px;object-fit:contain;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg-alt)}.studio-compare-item figcaption{margin-top:var(--space-2);font-size:var(--text-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted)}.studio-compare-item--out figcaption{color:var(--color-success)}.studio-compare-arrow{font-size:var(--text-2xl);color:var(--color-text-muted);flex:0 0 auto}.studio-checkerboard{background-color:#fff;background-image:linear-gradient(45deg,#e9ecf2 25%,transparent 25%),linear-gradient(-45deg,#e9ecf2 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e9ecf2 75%),linear-gradient(-45deg,transparent 75%,#e9ecf2 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.studio-result-actions{display:flex;gap:var(--space-3);margin-top:var(--space-6)}.studio-btn{flex:1 1 auto;padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);font-size:var(--text-base);font-weight:600;transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.studio-btn--primary{background:var(--color-accent);color:#fff}.studio-btn--primary:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.studio-btn--ghost{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text)}.studio-btn--ghost:hover{border-color:var(--color-accent);color:var(--color-accent)}.studio-error{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:1px solid var(--color-error);background:#ef44440f;border-radius:var(--radius-lg);font-size:var(--text-sm);color:#991b1b}.studio-error-icon{flex:0 0 auto;width:20px;height:20px;border-radius:var(--radius-full);background:var(--color-error);color:#fff;font-weight:800;display:grid;place-items:center;font-size:var(--text-xs)}.studio-error-text{flex:1 1 auto}.studio-error-retry{flex:0 0 auto;font-weight:700;color:#991b1b;text-decoration:underline;font-size:var(--text-sm)}.studio-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;padding-top:var(--space-4);border-top:1px solid var(--color-border-light)}.studio-usage{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500;color:var(--color-text-secondary)}.studio-usage-dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--color-success)}.studio-usage--spent .studio-usage-dot{background:var(--color-text-muted)}.studio-usage-note{color:var(--color-text-muted)}.studio-usage-cta{font-size:var(--text-sm);font-weight:700;color:var(--color-accent)}.studio-usage-cta:hover{color:var(--color-accent-hover);text-decoration:underline}.studio-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:640px){.studio-panel{padding:var(--space-4);border-radius:var(--radius-xl);min-height:0}.studio-drop{padding:var(--space-8) var(--space-4)}.studio-upload-btn{display:block;width:100%;padding:var(--space-4)}.studio-compare{flex-direction:column;gap:var(--space-2)}.studio-compare-item img{height:180px}.studio-compare-arrow{transform:rotate(90deg)}.studio-result-actions{flex-direction:column}.studio-footer{justify-content:center;text-align:center}}