.workshop-studio{color:#e9f9ff;max-width:1680px;margin:auto}
.workshop-studio *{box-sizing:border-box}
.workshop-studio__intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 22px;padding:22px 25px;border:1px solid #274554;background:linear-gradient(120deg,#112b3a,#0b1721 65%)}
.workshop-studio__intro small,.workshop-studio__preview-head strong{font:800 11px Consolas,monospace;letter-spacing:.14em;color:#5cdeff}
.workshop-studio__intro h2{font-size:clamp(22px,2.3vw,38px);margin:8px 0 7px;line-height:1.15}
.workshop-studio__intro p{max-width:720px;margin:0;color:#a9c1ce;line-height:1.55;font-size:14px}
.workshop-studio__seal{flex:none;padding:10px 14px;border:1px solid #3b8096;font:800 13px Consolas,monospace;color:#b7eaff}.workshop-studio__seal i{display:block;margin-top:4px;font-style:normal;color:#6fe2bb}
.workshop-studio__layout{display:grid;grid-template-columns:minmax(320px,460px) minmax(0,1fr);gap:18px;align-items:start}
.workshop-studio__controls{display:grid;gap:12px;min-width:0}
.workshop-studio__card,.workshop-studio__preview{border:1px solid #2c4655;background:#0e1b25;min-width:0}
.workshop-studio__card{padding:19px}.workshop-studio__card h3{font-size:15px;margin:0 0 13px}.workshop-studio__card>p{font-size:12px;color:#a6bdc8;line-height:1.5;margin:0 0 13px}
.workshop-studio__modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.workshop-studio__modes button{border:1px solid #2a4757;background:#0a1721;color:#bcd0da;padding:12px 5px;cursor:pointer;font-weight:800}.workshop-studio__modes button[aria-pressed=true]{border-color:#5cdeff;background:#123f50;color:#f1fcff}
.workshop-studio__source{padding:12px 0;border-top:1px solid #243c49}.workshop-studio__source:first-child{border-top:0}.workshop-studio__source.is-dragover{background:#123445}.workshop-studio__source-head{display:flex;align-items:center;gap:8px}.workshop-studio__number{display:inline-grid;place-items:center;width:24px;height:24px;background:#16485b;color:#8fe9ff;font:800 12px Consolas,monospace}.workshop-studio__source-name{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.workshop-studio__source-head button{display:grid;place-items:center;flex:none;width:40px;height:40px;border:1px solid #3b8096;background:#102f3d;color:#dff8ff;cursor:pointer}.workshop-studio__source-head button:hover{background:#17516a}.workshop-studio__pick svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.workshop-studio__grade{margin-top:10px;border:1px solid #254450}.workshop-studio__grade summary{cursor:pointer;padding:9px 11px;font-size:12px;font-weight:700;color:#b7d3df}.workshop-studio__sliders{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px;padding:2px 11px 12px}.workshop-studio__sliders label{display:grid;grid-template-columns:1fr auto;gap:3px;font-size:10px;color:#abc3cf}.workshop-studio__sliders output{color:#69dcff}.workshop-studio__sliders input{grid-column:1/-1;width:100%;accent-color:#5cdeff}.workshop-studio__trim{margin-top:10px}.workshop-studio__trim label,.workshop-studio__finish label{display:grid;gap:4px;color:#a9c0cc;font-size:11px}.workshop-studio__trim input,.workshop-studio__finish select{width:100%;padding:8px;background:#08141d;border:1px solid #2c4655;color:#e9f9ff}.workshop-studio__trim[hidden]{display:none}
.workshop-studio__finish{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.workshop-studio__outline{display:flex;align-items:center;gap:8px;margin:15px 0;color:#bcd4df;font-size:12px}.workshop-studio__outline input{accent-color:#5cdeff}.workshop-studio__card .btn{width:100%;min-height:44px}.workshop-studio__card #workshopStatus{margin:10px 0 0;min-height:18px;overflow-wrap:anywhere}.workshop-studio__card #workshopStatus[data-kind=bad]{color:#ffad9d}.workshop-studio__card #workshopStatus[data-kind=ok]{color:#6fe2bb}.workshop-studio__card progress{display:block;width:100%;height:8px;margin-top:12px;accent-color:#5cdeff}.workshop-studio__card progress[hidden]{display:none}.workshop-studio__card #workshopDownload{display:inline-block;margin-top:10px;color:#72e2ff}.workshop-studio__card #workshopDownload[hidden]{display:none}
.workshop-studio__preview{overflow:hidden}.workshop-studio__preview-head,.workshop-studio__preview-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px}.workshop-studio__preview-head span,.workshop-studio__preview-foot span{color:#8daebc;font-size:11px}
.workshop-studio__preview-rows{max-width:750px;margin:0 auto;background:#07121a}.workshop-studio__preview-row{margin:0;border-top:1px solid #285065}.workshop-studio__preview-row:first-child{border-top:0}.workshop-studio__preview-row figcaption{padding:9px 12px;font:700 11px Consolas,monospace;color:#8dd9ee;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workshop-studio__preview-row img,.workshop-studio__preview-row video{display:block;width:100%;height:auto;max-height:none;object-fit:contain}.workshop-studio__preview-empty{display:grid;place-items:center;min-height:160px;color:#8daebc;background:linear-gradient(130deg,#0b1c28,#102b38)}
.workshop-studio__card #workshopFreeNote{margin:0 0 12px;padding:9px 10px;border-left:2px solid #67b9d2;background:#0b2634;color:#b1cdd9;font-size:11px;line-height:1.45}.workshop-studio__card #workshopFreeNote[hidden]{display:none}
.workshop-studio__types{grid-template-columns:repeat(2,minmax(0,1fr))}.workshop-studio__types button{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.workshop-studio__type-icon{display:inline-flex;gap:2px}.workshop-studio__type-icon i{width:7px;height:7px;background:currentColor;opacity:.75}
.workshop-studio__rows-choice{margin-top:14px}.workshop-studio__rows-choice[hidden]{display:none}.workshop-studio__label{margin:0 0 8px;font-size:11px;font-weight:700;color:#a9c0cc}
.workshop-studio__preview-rows.is-squares{max-width:900px}
.workshop-squares{margin:0;padding:14px}
.workshop-squares__stage{position:relative;aspect-ratio:830/330;overflow:hidden;background:#050d13;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.workshop-squares__stage.is-dragging{cursor:grabbing}
.workshop-squares__media{position:absolute;display:block;max-width:none;max-height:none;pointer-events:none;user-select:none}
.workshop-squares__window{position:absolute;left:4.8193%;top:27.2727%;width:90.3614%;height:45.4545%;box-shadow:0 0 0 2000px rgba(3,8,12,.7);outline:1px solid #5cdeff;pointer-events:none}
.workshop-squares__window i{position:absolute;top:0;bottom:0;width:4px;margin-left:-2px;background:#000}
.workshop-squares__empty{position:absolute;inset:0;display:grid;place-items:center;color:#8daebc;font-size:12px}
.workshop-squares__tools{display:flex;align-items:center;gap:12px;margin-top:12px}.workshop-squares__tools label{display:flex;align-items:center;gap:10px;flex:1;min-width:0;font-size:11px;color:#a9c0cc}.workshop-squares__tools input{flex:1;min-width:0;accent-color:#5cdeff}.workshop-squares__tools .btn{flex:none;min-height:36px;padding:0 14px}
.workshop-squares__fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.workshop-studio__fx[hidden]{display:none}.workshop-studio__outline[hidden]{display:none}
.sqfx__label{margin:14px 0 8px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8fb2c2}.sqfx__label:first-child{margin-top:0}
.sqfx__styles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.sqfx__style{display:grid;justify-items:center;gap:5px;padding:9px 4px 8px;border:1px solid #2a4757;background:#0a1721;color:#bcd0da;cursor:pointer;text-align:center}
.sqfx__style b{font-size:11px;line-height:1.2}.sqfx__style small{font-size:9px;color:#d59bff;letter-spacing:.04em}
.sqfx__style[aria-checked=true]{border-color:#5cdeff;background:#123f50;color:#f1fcff}
.sqfx__swatch{display:flex;gap:3px}.sqfx__swatch i{width:16px;height:16px;box-sizing:border-box;background:#132b38}
.sqfx__style[data-style=none] .sqfx__swatch i{border:1px dashed #3d5d6c}
.sqfx__style[data-style=solid] .sqfx__swatch i{border:2px solid #8de9ff}
.sqfx__style[data-style=double] .sqfx__swatch i{border:2px solid #8de9ff;outline:1px solid #8a62ff;outline-offset:-5px}
.sqfx__style[data-style=corners] .sqfx__swatch i{background:linear-gradient(#8de9ff,#8de9ff) 0 0/5px 2px no-repeat,linear-gradient(#8de9ff,#8de9ff) 0 0/2px 5px no-repeat,linear-gradient(#8de9ff,#8de9ff) 100% 100%/5px 2px no-repeat,linear-gradient(#8de9ff,#8de9ff) 100% 100%/2px 5px no-repeat,#132b38}
.sqfx__style[data-style=neon] .sqfx__swatch i{border:2px solid #c9f6ff;box-shadow:0 0 6px #5cdeff,inset 0 0 4px #5cdeff}
.sqfx__style[data-style=rgb] .sqfx__swatch i{border:2px solid transparent;background:linear-gradient(#132b38,#132b38) padding-box,linear-gradient(90deg,#ff3b3b,#ffd93b,#3bff7a,#3bd8ff,#8a3bff,#ff3bd2) border-box;background-size:auto,300% 100%;animation:sqfx-rgb 2.4s linear infinite}
.sqfx__style[data-style=comet] .sqfx__swatch i{border:2px solid #2b5a6c;box-shadow:inset 3px 3px 0 -1px #fff,0 0 5px #5cdeff}
.sqfx__style[data-style=pulse] .sqfx__swatch i{border:2px solid #c9f6ff;animation:sqfx-pulse 1.4s ease-in-out infinite alternate}
.sqfx__style[data-style=dashes] .sqfx__swatch i{border:2px dashed #8de9ff}
@keyframes sqfx-rgb{to{background-position:0 0,300% 0}}@keyframes sqfx-pulse{from{box-shadow:0 0 1px #5cdeff}to{box-shadow:0 0 9px #5cdeff,inset 0 0 5px #5cdeff}}
.sqfx__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin-top:12px}
.sqfx__range{display:grid;grid-template-columns:1fr auto;gap:3px;font-size:10px;color:#abc3cf}.sqfx__range output{color:#69dcff}.sqfx__range input{grid-column:1/-1;width:100%;accent-color:#5cdeff}
.sqfx__color{display:flex;align-items:center;gap:8px;font-size:11px;color:#abc3cf}.sqfx__color input{flex:none;width:34px!important;min-width:0!important;height:28px!important;padding:0!important;border:1px solid #2c4655;background:#08141d;cursor:pointer}
.sqfx__target{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px;font-size:11px;color:#abc3cf}.sqfx__target span{margin-right:4px}.sqfx__target button{padding:6px 10px;border:1px solid #2a4757;background:#0a1721;color:#bcd0da;cursor:pointer;font-size:11px;font-weight:700}.sqfx__target button[aria-pressed=true]{border-color:#5cdeff;background:#123f50;color:#f1fcff}
.sqfx__select{width:100%;padding:9px;background:#08141d;border:1px solid #2c4655;color:#e9f9ff}
.sqfx__note{margin:12px 0 0;padding:9px 10px;border-left:2px solid #d59bff;background:#1a1530;color:#d9ccef;font-size:11px;line-height:1.45}
@media(prefers-reduced-motion:reduce){.sqfx__swatch i{animation:none!important}}
.workshop-squares__stage:focus-visible{outline:2px solid #5cdeff;outline-offset:2px}
.workshop-studio button:focus-visible,.workshop-studio input:focus-visible,.workshop-studio select:focus-visible,.workshop-studio summary:focus-visible{outline:2px solid #5cdeff;outline-offset:2px}
@media(max-width:1000px){.workshop-studio__layout{grid-template-columns:1fr}.workshop-studio__intro{padding:18px}.workshop-studio__seal{display:none}}
@media(max-width:560px){.workshop-studio__intro h2{font-size:24px}.workshop-studio__card{padding:15px}.workshop-studio__preview-head,.workshop-studio__preview-foot{padding:12px}.workshop-studio__preview-head span{display:none}.workshop-studio__grade{gap:9px}}
/* Process tab: styled/animated Workshop outline (process-frame-fx.js) */
.workshop-outline__fx{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:end;gap:10px 14px}.workshop-outline__fx .field{margin:0;min-width:150px}.workshop-outline__fx [hidden]{display:none!important}
.workshop-outline__fx select{min-height:36px}.workshop-outline__speed input{width:100%}
.workshop-outline__fxnote{flex:1 1 100%;margin:0;padding:8px 10px;border-left:2px solid #d59bff;background:rgba(138,98,255,.08);color:#d9ccef;font-size:11px;line-height:1.45}
.page-tools .top-chrome .nav button[data-tab="workshop"]{--tool-icon:url('/static/img/tool-icons/workshop.svg')}
.sqfx__presets{display:flex;flex-wrap:wrap;gap:6px}
.sqfx__preset{padding:7px 11px;border:1px solid #2a4757;background:#0a1721;color:#cfe3ec;font-size:11px;font-weight:700;cursor:pointer}
.sqfx__preset:hover,.sqfx__preset:focus-visible{border-color:#5cdeff;color:#f1fcff}
