/* ── VIP Studio Editor ── */
.st-shell  { display:flex; flex-direction:column; height:100vh; overflow:hidden; background:#1e1e1e; }
.st-topbar { display:flex; align-items:center; gap:.75rem; padding:.5rem 1rem; background:#111; color:#e8e0d6; flex-shrink:0; border-bottom:1px solid #2a2a2a; }
.st-topbar-title { font-size:.95rem; font-weight:600; flex:1; color:#e8e0d6; }
.st-main   { display:flex; flex:1; min-height:0; }

.st-panel  { width:72px; background:#161616; border-right:1px solid #2a2a2a; display:flex; flex-direction:column; align-items:center; padding:.5rem 0; gap:.15rem; flex-shrink:0; overflow-y:auto; }
.st-add-btn { width:56px; padding:.35rem .2rem; border-radius:6px; border:none; background:none; color:#888; cursor:pointer; font-size:.62rem; text-align:center; line-height:1.3; display:flex; flex-direction:column; align-items:center; gap:.15rem; transition:background .15s,color .15s; }
.st-add-btn .ico { font-size:1rem; }
.st-add-btn:hover { background:#2a2a2a; color:#e8e0d6; }
.st-panel hr { border:none; border-top:1px solid #2a2a2a; width:44px; margin:.2rem 0; }

.st-viewport { flex:1; overflow:auto; display:flex; align-items:flex-start; justify-content:center; padding:2rem; }
.st-canvas   { position:relative; background:#fff; box-shadow:0 4px 32px rgba(0,0,0,.6); flex-shrink:0; }

.ce-element  { position:absolute; cursor:move; user-select:none; box-sizing:border-box; }
.ce-element.ce-selected { outline:2px solid #f59e0b; outline-offset:1px; }
.ce-resize-handle { position:absolute; width:10px; height:10px; background:#fff; border:2px solid #f59e0b; border-radius:50%; z-index:10; box-sizing:border-box; }
.ce-resize-handle[data-dir="nw"] { top:-5px;left:-5px;cursor:nw-resize; }
.ce-resize-handle[data-dir="n"]  { top:-5px;left:calc(50% - 5px);cursor:n-resize; }
.ce-resize-handle[data-dir="ne"] { top:-5px;right:-5px;cursor:ne-resize; }
.ce-resize-handle[data-dir="e"]  { top:calc(50% - 5px);right:-5px;cursor:e-resize; }
.ce-resize-handle[data-dir="se"] { bottom:-5px;right:-5px;cursor:se-resize; }
.ce-resize-handle[data-dir="s"]  { bottom:-5px;left:calc(50% - 5px);cursor:s-resize; }
.ce-resize-handle[data-dir="sw"] { bottom:-5px;left:-5px;cursor:sw-resize; }
.ce-resize-handle[data-dir="w"]  { top:calc(50% - 5px);left:-5px;cursor:w-resize; }

.st-headline    { font-family:'Georgia',serif; font-size:2.4rem; font-weight:700; line-height:1.15; overflow:hidden; width:100%; height:100%; box-sizing:border-box; }
.st-subheadline { font-family:'Georgia',serif; font-size:1.5rem; font-weight:600; line-height:1.25; overflow:hidden; width:100%; height:100%; box-sizing:border-box; }
.st-byline      { font-size:.88rem; font-style:italic; color:#555; overflow:hidden; width:100%; height:100%; box-sizing:border-box; }
.st-paragraph   { font-size:1rem; line-height:1.75; white-space:pre-wrap; overflow:hidden; width:100%; height:100%; box-sizing:border-box; }
.st-quote-inner { font-family:'Georgia',serif; font-size:1.2rem; font-style:italic; border-left:4px solid #333; padding:.5rem .75rem; background:#f9f7f4; color:#333; overflow:hidden; width:100%; height:100%; box-sizing:border-box; }
.st-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:#f0ebe3; color:#bbb; font-size:.82rem; }

.st-sidebar { width:288px; flex-shrink:0; background:var(--surface,#fff); border-left:1px solid var(--border,#e5e0d8); overflow-y:auto; color:var(--text1,#1a1a1a); }
.st-sec  { padding:.875rem 1rem; border-bottom:1px solid var(--border,#e5e0d8); }
.st-sec h4 { font-size:.72rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text2,#888); margin:0 0 .6rem; }
.st-f  { margin-bottom:.6rem; }
.st-f label { font-size:.8rem; color:var(--text2,#888); display:block; margin-bottom:.2rem; }
.st-f input[type=text],.st-f input[type=number],.st-f textarea,.st-f select { width:100%; box-sizing:border-box; }
.st-f input[type=color] { height:32px; padding:2px 4px; border-radius:4px; border:1px solid var(--border,#e5e0d8); width:100%; box-sizing:border-box; }
.st-row  { display:flex; gap:.4rem; }
.st-row .st-f { flex:1; }
.st-z-row { display:flex; gap:.4rem; margin-bottom:.5rem; }
.st-z-row button { flex:1; padding:.28rem; font-size:.75rem; }
.st-del-btn { width:100%; padding:.35rem; font-size:.8rem; color:#f87171; border:1px solid #f87171; border-radius:4px; background:none; cursor:pointer; margin-top:.5rem; }
.st-del-btn:hover { background:#fff1f1; }