.deployment-main{max-width:1480px;margin:0 auto;padding:30px clamp(16px,3vw,42px) 45px}
.deployment-intro{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}
.deployment-intro h1{font-size:clamp(30px,3.5vw,48px);font-weight:500;letter-spacing:-.035em;margin:0 0 10px}
.deployment-intro p{color:#555;max-width:680px;margin:0;line-height:1.5}
.deployment-intro a{white-space:nowrap;font-size:14px;color:#333;text-underline-offset:5px}
.deployment-viewer{border:1px solid #444;background:#080808;color:#eee}
.deployment-viewport{position:relative;isolation:isolate;height:clamp(440px,66vh,780px);overflow:hidden}
#deployment-canvas{width:100%;height:100%;display:block;touch-action:none;outline-offset:-3px}
.deployment-badge{position:absolute;top:16px;left:16px;padding:8px 12px;background:#111b;color:#deded8;font-size:12px;letter-spacing:.06em;pointer-events:none}
.deployment-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;padding:14px 16px;border-top:1px solid #444}
.deployment-toolbar label{display:flex;align-items:center;gap:9px;font-size:14px}
.deployment-toolbar button{font:inherit;font-size:13px;border:1px solid #555;color:#eee;background:#151515;padding:8px 12px;cursor:pointer}
.deployment-toolbar button:hover{background:#303030}
.deployment-toolbar input{accent-color:#eee}
.deployment-toolbar [hidden]{display:none}
.deployment-turn{display:flex;gap:6px;margin-left:auto}
.deployment-help{font-size:13px;color:#555;line-height:1.6;margin:12px 0 22px}
.deployment-load{display:flex;flex-wrap:wrap;gap:14px 36px;font-size:14px;color:#444;border-top:1px solid #bbb;padding-top:18px}
.deployment-load strong{font-weight:500;color:#111}
#deployment-fallback{position:absolute;top:45%;left:12%;right:12%;text-align:center}
@media(max-width:650px){.deployment-intro{display:block}.deployment-intro a{display:inline-block;margin-top:14px}.deployment-viewport{height:58vh;min-height:380px}.deployment-toolbar{gap:12px}.deployment-turn{margin-left:0}.deployment-badge{font-size:10px;top:10px;left:10px}}

.deployment-playback{padding:16px;border-top:1px solid #444;background:#101010}
.deployment-play-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.deployment-play-actions button,.deployment-play-actions select{font:inherit;font-size:14px;color:#eee;border:1px solid #555;background:#171717;padding:9px 14px}
.deployment-play-actions button{cursor:pointer}.deployment-play-actions button:hover{background:#333}
#deployment-play{background:#e5e5df;color:#111;border-color:#e5e5df}
.deployment-play-actions label{display:flex;align-items:center;gap:10px;font-size:13px;margin-left:auto}
.deployment-progress{display:flex;align-items:center;gap:15px;margin-top:16px;font-size:12px;color:#bababa}
.deployment-progress input{flex:1;min-width:70px;accent-color:#eee}
.deployment-progress output{font-variant-numeric:tabular-nums;min-width:90px;text-align:right}
#deployment-stage{margin:10px 0 0;color:#eee;font-size:13px}
@media(max-width:650px){.deployment-play-actions label{margin-left:0}.deployment-progress{flex-wrap:wrap}.deployment-progress label{width:100%}}