.studio-wrap{max-width:1280px;padding-inline:var(--pad-x);margin:0 auto 40px}.studio{color-scheme:dark;--bg:#0b0c0e;--surface:#17181c;--card:#111215;--text:#ececef;--muted:#8f919a;--line:#ffffff14;--line-strong:#ffffff2e;--green-tint:#34c77b24;--green-ink:#6ee7a0;--amber-tint:#f0a92e24;--amber-ink:#f4c05e;--studio-stage:#060708;--studio-bar:#0e0f12;height:clamp(640px, calc(100svh - var(--header-h) - 48px), 920px);background:var(--bg);color:var(--text);border:1px solid #1e1f24;border-radius:18px;grid-template-columns:minmax(0,1fr) 340px;display:grid;overflow:hidden;box-shadow:0 30px 70px #0a0c1047}.studio__main{border-right:1px solid var(--line);flex-direction:column;min-width:0;min-height:0;display:flex}.studio__bar{border-bottom:1px solid var(--line);background:var(--studio-bar);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:10px 14px;display:flex}.studio__title{min-width:0;font:600 13px/1.3 var(--mono);color:var(--muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.studio__actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.studio .btn{border-color:var(--line-strong);color:var(--text)}.studio .btn:hover{background:var(--surface)}.studio .btn--primary,.studio .btn--primary:hover{background:var(--green);color:var(--on-green);border-color:#0000}.studio .btn:disabled{opacity:.45;cursor:not-allowed}.studio__feedback:empty{display:none}.studio__feedback .image-feedback{border-radius:0;margin:0}.studio__hint{border-top-color:var(--line);background:var(--studio-bar)}.studio-view{background:var(--studio-stage);flex-direction:column;flex:1;min-height:0;display:flex}.studio-view__stage{background:radial-gradient(120% 90% at 50% 40%, #ffffff09, transparent 70%), var(--studio-stage);touch-action:pan-y;user-select:none;outline:none;flex:1;min-height:0;position:relative;overflow:hidden}.studio-view__stage:focus-visible{box-shadow:inset 0 0 0 2px var(--green)}.studio-view__stage.is-zoomed{touch-action:none;cursor:grab}.studio-view__stage.is-zoomed:active{cursor:grabbing}.studio-view__canvas{width:100%;height:100%;position:absolute;inset:0}.studio-view__text{clip-path:inset(50%);white-space:pre;pointer-events:none;width:1px;height:1px;margin:0;position:absolute;overflow:hidden}.studio-view__busy{border:2px solid #fff3;border-top-color:var(--green);border-radius:50%;width:16px;height:16px;animation:.8s linear infinite studio-spin;position:absolute;top:14px;right:14px}@keyframes studio-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.studio-view__busy{animation-duration:2.4s}}.studio-view__tag{font:600 11px/1 var(--mono);color:#fff;pointer-events:none;background:#0000008c;border-radius:6px;padding:4px 8px;position:absolute;top:12px}.studio-view__tag--left{left:12px}.studio-view__tag--right{right:40px}.studio-view__bar{border-top:1px solid var(--line);background:var(--studio-bar);font:12px/1.3 var(--mono);color:var(--muted);align-items:center;gap:12px;padding:8px 12px;display:flex}.studio-view__size{color:var(--amber-ink);flex:none}.studio-view__hint{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.studio-view__tools{align-items:center;gap:6px;margin-left:auto;display:flex}.studio-view__zoom{align-items:center;gap:2px;display:inline-flex}.studio-icon,.studio-chip,.studio-view__percent{border:1px solid var(--line-strong);height:30px;color:var(--text);cursor:pointer;background:0 0;border-radius:8px}.studio-icon{width:30px;font:600 15px/1 var(--mono)}.studio-chip{font:600 12px/1 var(--sans);padding:0 10px}.studio-view__percent{min-width:56px;font:600 12px/1 var(--mono);padding:0 6px}.studio-icon:hover,.studio-chip:hover,.studio-view__percent:hover{background:var(--surface)}.studio-chip.is-active{border-color:var(--green);background:var(--green-tint);color:var(--green-ink)}.studio-chip:disabled{opacity:.4;cursor:not-allowed}.studio-view.is-fullscreen{width:100vw;height:100vh}.studio__panel{overscroll-behavior:contain;background:var(--studio-bar);scrollbar-width:thin;scrollbar-color:#ffffff2e transparent;min-height:0;overflow-y:auto}.studio-section{border-bottom:1px solid var(--line)}.studio-section__title{font:700 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;justify-content:space-between;align-items:center;padding:14px 18px;list-style:none;display:flex}.studio-section__title::-webkit-details-marker{display:none}.studio-section__title:after{content:"";border-bottom:1.5px solid;border-right:1.5px solid;width:7px;height:7px;transition:transform .15s;transform:rotate(45deg)translateY(-2px)}.studio-section:not([open]) .studio-section__title:after{transform:rotate(-45deg)}.studio-section__title:hover{color:var(--text)}.studio-section__body{flex-direction:column;gap:16px;padding:2px 18px 18px;display:flex}.studio .range{gap:4px}.studio .range__head{align-items:center;font-weight:500}.studio .range__head label{color:var(--text)}.studio .range__value{font:500 12px/1.2 var(--mono);color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:4px;padding:2px 4px}.studio .range__value:not(:disabled):hover{background:var(--surface);color:var(--text)}.studio .range__value:disabled{cursor:default}.studio .range.is-disabled label{color:var(--muted)}.studio .range__hint{color:var(--muted);margin:2px 0 0;font-size:12px;line-height:1.5}.studio input[type=range]{accent-color:var(--green)}.studio .toggle{font-size:13px;font-weight:500}.studio .toggle:disabled{opacity:.5}.studio .seg__btn{font-size:12px}.studio-seg .seg__btn.is-active{background:var(--text);color:var(--bg)}.studio .ramp{background:var(--studio-stage);color:var(--green-ink);border-radius:8px;padding:8px 10px}.studio-drop{border-color:var(--line-strong);gap:4px;padding:16px 12px}.studio-drop svg{color:var(--muted)}.studio-drop__meta{color:var(--muted);font-size:11px}.studio-sample{aspect-ratio:auto;border:1px solid var(--line-strong);background:var(--card);width:100%;color:var(--text);text-align:left;cursor:pointer;border-radius:12px;align-items:center;gap:12px;padding:8px;display:flex}.studio-sample.is-active{border-color:var(--green);box-shadow:0 0 0 1px var(--green) inset}.studio-sample img{object-fit:cover;border-radius:6px;flex:none;width:48px;height:57px}.studio-sample__text{gap:3px;min-width:0;display:grid}.studio-sample__label{font:700 10px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.studio-sample__name{font:600 13px/1.3 var(--sans)}.studio-sample__credit{color:var(--muted);font-size:11px;line-height:1.4}.studio-presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.studio-preset{border:1px solid var(--line-strong);background:var(--card);min-width:0;height:40px;color:var(--text);font:600 12px/1.2 var(--sans);text-align:left;cursor:pointer;border-radius:10px;align-items:center;gap:8px;padding:0 10px;display:flex}.studio-preset:hover{border-color:#ffffff52}.studio-preset.is-active{border-color:var(--green);background:var(--green-tint)}.studio-preset__swatch{border-radius:5px;flex:none;width:18px;height:18px;box-shadow:inset 0 0 0 1px #ffffff1f}.studio-preset--cinematic .studio-preset__swatch{background:linear-gradient(135deg,#1b2a4a,#d9a35b 60%,#f3e2c0)}.studio-preset--neon .studio-preset__swatch{background:linear-gradient(135deg,#ff2bd6,#2bf0ff);box-shadow:0 0 10px #ff2bd680}.studio-preset--matrix .studio-preset__swatch{background:linear-gradient(135deg,#00260e,#00d25b)}.studio-preset--blocks .studio-preset__swatch{background:conic-gradient(#e0a24f 25%, #4f7ad8 0 50%, #e0a24f 0 75%, #4f7ad8 0)}.studio-preset--sketch .studio-preset__swatch{background:repeating-linear-gradient(135deg,#ececef 0 2px,#2a2b30 2px 5px)}.studio-preset--halftone .studio-preset__swatch{background:radial-gradient(circle,#ececef 30%,#0000 32%) 0 0/6px 6px,#2a2b30}.studio-palettes{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid}.studio-palette{cursor:pointer;border:2px solid #0000;border-radius:7px;height:26px;box-shadow:inset 0 0 0 1px #ffffff1f}.studio-palette.is-active{border-color:#fff}.studio-custom{gap:6px;display:grid}.studio-custom__input{border-color:var(--line-strong);background:var(--card);height:40px;color:var(--text);font:15px/1 var(--art);letter-spacing:.08em}.studio-export__size{font:12px/1.3 var(--mono);color:var(--muted)}.studio-save--wide{width:100%;height:44px}.studio-reset{width:100%}@media (width<=1099px){.studio{grid-template-columns:minmax(0,1fr) 300px}}@media (width<=899px){.studio-wrap{padding-inline:0}.studio{border-inline:0;border-radius:0;flex-direction:column;height:auto;display:flex;overflow:visible}.studio__main{display:contents}.studio__bar{padding-inline:var(--pad-x);order:1}.studio-view{top:var(--header-h);z-index:4;order:2;position:sticky;box-shadow:0 10px 24px #00000073}.studio__feedback{order:3}.studio__panel{order:4;overflow:visible}.studio__hint{order:5}.studio-view__stage{flex:none;height:clamp(220px,42svh,460px)}.studio-view__hint{display:none}.studio-section__title,.studio-section__body{padding-inline:var(--pad-x)}}@media (width<=480px){.studio__actions{width:100%}.studio-save:not(.studio-save--wide){margin-left:auto}}
