#outfit-swap{padding:28px 34px 48px;overflow-x:hidden}
.outfit-swap-dashboard{display:grid;grid-template-columns:minmax(360px,.9fr) minmax(440px,1.1fr);gap:18px;align-items:start}
.outfit-input-panel,.outfit-progress-panel{min-width:0;border:1px solid rgba(0,242,254,.2);border-radius:18px;background:linear-gradient(145deg,rgba(8,25,43,.95),rgba(4,15,29,.93));box-shadow:0 18px 45px rgba(0,0,0,.2)}
.outfit-input-panel{padding:20px}.outfit-progress-panel{padding:20px}
.outfit-input-panel .minimax-field{display:grid;gap:7px}.outfit-input-panel .minimax-field>span{font-size:11px;color:#cbd5e1;font-weight:700}
.outfit-input-panel input[type=file]{box-sizing:border-box;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.outfit-input-panel textarea{box-sizing:border-box;min-height:92px!important;line-height:1.55}
#swapCharPreviewBox,#swapOutfitPreviewBox{height:150px!important;max-height:none!important;background:radial-gradient(circle at 50% 30%,rgba(0,242,254,.07),rgba(0,0,0,.22));display:none;align-items:center;justify-content:center}
#swapCharPreviewBox[style*="display: block"],#swapOutfitPreviewBox[style*="display: block"]{display:flex!important}
#swapCharPreview,#swapOutfitPreview{max-height:140px!important;border-radius:8px}
#swapProgressPanel{margin-top:0!important}
#swapStatusLogs{box-sizing:border-box;max-height:340px!important;min-height:220px!important;overflow-x:hidden!important;scrollbar-gutter:stable}
#swapStatusLogs .swap-log-item{min-width:0;align-items:flex-start}
#swapStatusLogs .swap-log-item span{min-width:0;overflow-wrap:anywhere;word-break:break-word;line-height:1.45}
.outfit-cinema{margin-top:22px;border:1px solid rgba(0,242,254,.2);border-radius:20px;overflow:hidden;background:linear-gradient(180deg,rgba(5,13,25,.98),rgba(1,6,13,.99));box-shadow:0 28px 70px rgba(0,0,0,.42)}
.outfit-cinema-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 20px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(9,22,38,.88)}
.outfit-cinema-header span{font-size:9px;letter-spacing:.18em;color:#00f2fe;font-weight:800}.outfit-cinema-header h3{margin:4px 0;color:#fff;font-size:17px}.outfit-cinema-header h3 i{color:#00f2fe}.outfit-cinema-header p{margin:0;color:#78879a;font-size:10px}
.outfit-cinema-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.outfit-cinema-actions button{border:1px solid rgba(0,242,254,.2);border-radius:8px;background:rgba(0,242,254,.06);color:#dffcff;padding:8px 10px;font-size:10px;cursor:pointer}
.outfit-cinema-actions button:hover:not(:disabled),.outfit-cinema-actions button[aria-pressed=true]{background:rgba(0,242,254,.14);border-color:rgba(0,242,254,.55)}
.outfit-cinema-actions button:disabled{opacity:.4;cursor:not-allowed}
.outfit-cinema-screen{position:relative;display:flex;align-items:center;justify-content:center;min-height:540px;height:min(68vh,760px);padding:26px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 48px),radial-gradient(ellipse at center,rgba(23,74,111,.25),rgba(0,3,9,.95) 70%)}
.outfit-cinema-screen:fullscreen{height:100vh;padding:30px;background:#000}.outfit-cinema-screen:fullscreen .outfit-cinema-stage{height:calc(100vh - 60px)}
.outfit-cinema-glow{position:absolute;inset:10% 16%;background:radial-gradient(ellipse,rgba(0,242,254,.1),transparent 68%);filter:blur(30px);pointer-events:none}
.outfit-cinema-empty{position:relative;z-index:1;min-height:300px!important;border:0!important;background:transparent!important}.outfit-cinema-empty i{font-size:58px;color:rgba(0,242,254,.34)}
.outfit-cinema-stage{position:relative;z-index:2;width:100%;height:100%;min-height:0!important;border:0!important;background:transparent!important;display:flex;align-items:center;justify-content:center;overflow:visible!important}
.outfit-cinema-stage[hidden]{display:none!important}.outfit-cinema-stage img{width:100%;height:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 24px 35px rgba(0,0,0,.6));transition:object-fit .2s}
.outfit-cinema-stage.is-cover img{object-fit:cover}
.outfit-cinema-badge{position:absolute;left:14px;top:14px;padding:7px 10px;border-radius:999px;background:rgba(16,185,129,.92);color:#fff;font-size:10px;font-weight:800;box-shadow:0 8px 22px rgba(16,185,129,.22)}
.outfit-cinema-footer{display:flex;justify-content:space-between;gap:15px;padding:11px 18px;border-top:1px solid rgba(255,255,255,.06);color:#718096;font-size:10px}.outfit-cinema-footer i{color:#10b981}
@media(max-width:1050px){.outfit-swap-dashboard{grid-template-columns:1fr}.outfit-cinema-screen{height:min(62vh,680px)}}
@media(max-width:700px){#outfit-swap{padding:18px}.outfit-cinema-header{align-items:flex-start;flex-direction:column}.outfit-cinema-actions{justify-content:flex-start}.outfit-cinema-screen{height:56vh;min-height:400px;padding:14px}.outfit-cinema-footer{flex-direction:column}}