#compositionWorkspace{position:fixed;inset:0;z-index:120;background:var(--ui-bg);color:var(--ui-text);display:flex;flex-direction:column}#compositionWorkspace[hidden]{display:none}#compositionWorkspace>header{height:58px;display:flex;align-items:center;gap:12px;padding:env(safe-area-inset-top) 12px 0;border-bottom:1px solid var(--ui-line);background:var(--ui-surface)}#compositionWorkspace header strong{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#compositionWorkspace button{min-height:44px;border:1px solid var(--ui-line-2);border-radius:10px;background:var(--ui-surface-3);color:inherit;padding:0 13px}.cmp-body{min-height:0;flex:1;display:grid;grid-template-columns:220px minmax(0,1fr) 230px}.cmp-sources,.cmp-inspector{padding:16px;overflow:auto;background:var(--ui-surface)}.cmp-source{padding:10px 0;border-bottom:1px solid var(--ui-line)}.cmp-source small{display:block;opacity:.55;margin-top:3px}.cmp-source>div{display:flex;gap:4px;margin-top:6px}.cmp-source>div button{min-height:32px;padding:0 10px}.cmp-code-wrap{width:100%;height:100%;display:flex;flex-direction:column}.cmp-code-wrap[hidden]{display:none}.cmp-code-wrap>div{display:flex;align-items:center;gap:10px;margin-bottom:8px}.cmp-code-wrap .cmp-code{flex:1}.cmp-inspector select{display:block;width:100%;min-height:40px;margin-top:6px;background:var(--ui-surface-3);color:var(--ui-text);border:1px solid var(--ui-line-2);border-radius:8px;padding:7px}.cmp-stage{min-width:0;min-height:0;padding:18px;background:var(--ui-surface-2)}.cmp-stage iframe,.cmp-code{width:100%;height:100%;border:0;border-radius:8px;background:white}.cmp-code{resize:none;padding:14px;background:var(--ui-bg);color:var(--ui-text);font:13px/1.5 monospace}.cmp-inspector label{display:block;font:12px monospace;margin:14px 0;color:var(--ui-text-2)}.cmp-inspector input{display:block;width:100%;min-height:40px;margin-top:6px;background:var(--ui-surface-3);color:var(--ui-text);border:1px solid var(--ui-line-2);border-radius:8px;padding:7px}@media(max-width:720px){.cmp-body{display:block;position:relative}.cmp-sources{height:auto;max-height:112px;display:flex;gap:12px;overflow:auto;padding:8px 12px}.cmp-sources h3{display:none}.cmp-source{min-width:140px;border:0}.cmp-stage{height:calc(100% - 112px);padding:8px}.cmp-inspector{position:absolute;left:0;right:0;bottom:0;max-height:42vh;border-radius:18px 18px 0 0;border-top:1px solid var(--ui-line-2);display:grid;grid-template-columns:1fr 1fr;gap:0 12px;padding-bottom:calc(12px + env(safe-area-inset-bottom));transform:translateY(calc(100% - 48px));transition:.2s}.cmp-inspector:hover,.cmp-inspector:focus-within{transform:none}.cmp-inspector h3{grid-column:1/-1;margin:0 0 10px}.cmp-inspector label{margin:5px 0}}