html,body{height:100%;overflow:hidden}.editor-shell{height:100vh;display:grid;grid-template-columns:220px minmax(0,1fr) 250px;grid-template-rows:56px minmax(0,1fr);background:#05080c}.editor-topbar{grid-column:1/-1;display:flex;align-items:center;gap:16px;padding:8px 12px;border-bottom:1px solid #202a33;background:#080d12;z-index:10}.editor-brand{display:flex;align-items:center;gap:8px;min-width:220px}.editor-brand img{width:34px;height:34px;object-fit:contain}.editor-brand b{display:block;font-size:11px}.editor-brand span{display:block;color:#65727e;font-size:7px;letter-spacing:.12em}.editor-viewport{display:flex;align-items:center;gap:4px;margin:auto}.editor-viewport button,.editor-actions button,.inspector-tabs button{height:30px;border:1px solid #28343e;border-radius:7px;background:#0a1117;color:#77848f;padding:0 10px;font-size:8px}.editor-viewport button.active,.inspector-tabs button.active{border-color:#703315;color:#ff9b65;background:#160f0b}.editor-actions{display:flex;align-items:center;gap:5px}.editor-actions button.primary{background:#e95b14;border-color:#a34217;color:#fff}.editor-actions button.danger{color:#e57f87;border-color:#4d272b}.editor-tree,.editor-inspector{min-height:0;overflow:auto;background:#080d12}.editor-tree{border-right:1px solid #1e2831;padding:10px}.editor-inspector{border-left:1px solid #1e2831;padding:10px}.editor-panel-head{padding:4px 3px 10px;border-bottom:1px solid #192229}.editor-panel-head b{display:block;font-size:10px}.editor-panel-head span{display:block;margin-top:2px;color:#66737e;font-size:7px}.tree-section{margin-top:13px}.tree-section>small{display:block;margin:0 3px 6px;color:#596672;font-size:7px;font-weight:900;letter-spacing:.12em}.tree-list{display:grid;gap:4px}.tree-item{display:grid;grid-template-columns:14px minmax(0,1fr) 16px;align-items:center;gap:5px;min-height:34px;padding:5px 7px;border:1px solid #202a33;border-radius:7px;background:#0b1117;color:#8c99a4;cursor:pointer}.tree-item:hover,.tree-item.selected{border-color:#60331f;background:#120f0d;color:#e6ecef}.tree-item.dragging{opacity:.45}.tree-grip{color:#48545e;cursor:grab}.tree-item b{display:block;font-size:8px}.tree-item small{display:block;color:#5c6974;font-size:7px}.tree-eye{font-size:9px;color:#53606b}.editor-canvas{position:relative;min-width:0;min-height:0;overflow:auto;display:grid;place-items:center;padding:24px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 18px),repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 18px),#05080c}.canvas-viewport{position:relative;background:#020406;border:1px solid #2b3741;border-radius:12px;box-shadow:0 26px 80px rgba(0,0,0,.55);overflow:hidden;transition:width .18s,height .18s}.canvas-viewport.desktop{width:1440px;height:900px}.canvas-viewport.tablet{width:820px;height:min(1080px,calc(100vh - 104px))}.canvas-viewport.mobile{width:390px;height:min(844px,calc(100vh - 104px));border-radius:22px}.canvas-viewport.fit{width:100%;height:100%}.canvas-viewport iframe{width:100%;height:100%;border:0;background:#05080c}.editor-status{position:absolute;left:50%;bottom:7px;transform:translateX(-50%);padding:5px 9px;border:1px solid #26323b;border-radius:999px;background:#080d12;color:#687681;font-size:7px;pointer-events:none}.inspector-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:10px 0}.inspector-body{display:block}.selected-component{padding:10px;border:1px solid #202b34;border-radius:8px;background:#0a1015;margin-bottom:10px}.selected-component span{display:block;color:#e1e7eb;font-size:10px;font-weight:800}.selected-component small{display:block;margin-top:3px;color:#63707b;font-size:7px}.editor-inspector label{display:grid;gap:5px;color:#74818c;font-size:8px}.editor-inspector input[type=range]{width:100%;accent-color:#ff650f}.editor-inspector input[type=color]{width:100%;height:34px;padding:2px;border:1px solid #28343e;border-radius:7px;background:#070d12}.toggle-line{display:flex!important;align-items:center;justify-content:space-between}.toggle-line input{accent-color:#ff650f}.editor-inspector .stack{display:grid;gap:11px}.editor-inspector label b{color:#c9d1d7;font-size:8px}.editor-inspector .btn{width:100%}
@media(max-width:1050px){.editor-shell{grid-template-columns:180px minmax(0,1fr);grid-template-rows:56px minmax(0,1fr)}.editor-inspector{position:fixed;right:0;top:56px;bottom:0;width:250px;z-index:12;box-shadow:-20px 0 50px rgba(0,0,0,.35)}.editor-brand{min-width:170px}.editor-actions button:nth-child(1),.editor-actions button:nth-child(2){display:none}}

.tree-zone{justify-self:end;max-width:72px;color:#ff955c;font-size:6px;font-weight:900;letter-spacing:.05em;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-item[data-key="workspace"] .tree-zone{color:#7edfd4}

.canvas-viewport[data-scale]::after{content:"DESKTOP 1440×900 · " attr(data-scale);position:absolute;right:8px;top:7px;z-index:4;padding:4px 6px;border:1px solid #303a43;border-radius:999px;background:rgba(5,8,12,.82);color:#77848f;font-size:6px;font-weight:900;letter-spacing:.08em;pointer-events:none}

/* 0.13.6 explicit component visibility controls */
.tree-item{grid-template-columns:14px minmax(0,1fr) auto 40px}
.tree-visibility,.tree-visibility-spacer{width:40px}
.tree-visibility{
  height:22px;padding:0;border:1px solid #303a43;border-radius:6px;
  background:#090f14;color:#7d8a95;font-size:6px;font-weight:900;letter-spacing:.08em;
  cursor:pointer
}
.tree-visibility:hover{border-color:#8b431f;color:#ff9b65;background:#15100d}
.tree-item.is-hidden{opacity:.72;border-style:dashed;background:#090d11}
.tree-item.is-hidden .tree-zone{color:#5c6670}
.tree-item.is-hidden .tree-visibility{border-color:#6c361d;color:#ff8e54;background:#160e0a}
.tree-item.is-hidden small{color:#8a5d49}
.protected-control{opacity:.45}
.protected-control span::after{content:" · PROTECTED";color:#69747e;font-size:6px;font-weight:900;letter-spacing:.08em}