html,body{height:100%;overflow:hidden;overscroll-behavior:none}
body{height:100dvh;min-height:0;display:flex;flex-direction:column;padding:0;margin:0}
.command-dock{top:6px;left:auto;right:8px;transform:none;max-width:calc(100vw - 160px);border-radius:10px}
.command-dock .dock-toggle{width:auto;min-width:114px;min-height:34px;padding:7px 9px;font-size:10px;gap:6px}
.command-dock .dock-key,.command-dock .dock-toggle>[data-icon]{display:none}
.command-dock.expanded{width:min(380px,calc(100vw - 16px));max-width:calc(100vw - 16px)}
.command-dock.expanded .dock-toggle{width:100%}
.command-dock.expanded .dock-toggle>[data-icon]{display:grid}
.command-dock .dock-content{padding:12px}
.phone-header{height:43px;flex:0 0 43px;padding:4px 12px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e8ecdf;background:#fff;color:#456042}
.phone-brand{display:flex;align-items:center;gap:5px;font-size:12px;letter-spacing:.1px}
.phone-brand svg{width:16px;height:16px}.phone-brand b{font-weight:600}
#phonePageTitle{font-size:11px;color:#87947c;border-left:1px solid #e6eadf;padding-left:8px}
.phone-header>small{margin-left:auto;padding-right:120px;font-size:9px;color:#94a187;white-space:nowrap}
.workbench.phone-workbench{position:relative;display:block;flex:1 1 auto;min-width:0;width:100%;height:auto;min-height:0;max-height:none;overflow:hidden;grid-template-columns:none}
.phone-workbench>.phone-panel,.phone-workbench>#editorPanel,.phone-workbench>#libraryPanel,.phone-workbench>#inspectorPanel{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;max-height:none;margin:0;transform:translateX(8px);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:0}
.phone-workbench>#libraryPanel{display:flex;flex-direction:column;order:initial;border:0}
.phone-workbench>#editorPanel{display:flex;flex-direction:column;order:initial;border:0}
.phone-workbench>#inspectorPanel{display:block;order:initial;border:0;overflow-y:auto;overscroll-behavior:contain}
.phone-workbench>#editorPanel.phone-panel-active,.phone-workbench>#libraryPanel.phone-panel-active,.phone-workbench>#inspectorPanel.phone-panel-active{transform:none;visibility:visible;opacity:1;pointer-events:auto;z-index:1}
.phone-workbench>.library .panel-heading{flex:0 0 auto;padding:10px 14px 9px}
.phone-workbench>.library .library-tabs{flex:0 0 auto;margin-top:0;margin-bottom:9px}
.phone-workbench>.library .library-controls{flex:0 0 auto}
.phone-workbench>.library .asset-grid{flex:1 1 auto;min-height:0;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:0 12px 10px;overscroll-behavior:contain}
.phone-workbench>.library .asset-card{height:83px;padding:5px}
.phone-workbench>.library .asset-card img{height:57px}
.phone-workbench>.library .asset-card small{font-size:8px}
.phone-workbench>.library .library-footer{flex:0 0 auto;height:32px;padding:6px;font-size:9px}
.phone-workbench>.editor .editor-toolbar{position:relative;inset:auto;height:38px;flex:0 0 38px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;pointer-events:auto;background:#fafbf7;border-bottom:1px solid #e6e9e1}
.phone-workbench>.editor .editor-toolbar .tools{position:static;display:flex;gap:2px;padding:2px;border:0;box-shadow:none;background:transparent;pointer-events:auto}
.phone-workbench>.editor .editor-toolbar>#previewToggle{position:static;display:inline-flex;gap:4px;padding:6px 8px;background:transparent;border:0;box-shadow:none;pointer-events:auto;font-size:10px}
.phone-workbench>.editor .canvas-area{position:relative;flex:1 1 auto;min-height:0;height:auto;overflow:hidden}
.phone-workbench>.editor .canvas-caption{top:12px;left:13px;font-size:9px}
.phone-workbench>.editor .canvas-viewport{inset:34px 3px 65px;align-items:center;justify-content:center}
.phone-workbench>.editor .drop-instruction{bottom:57px;font-size:9px}
.phone-workbench>.editor .zoom-bar{bottom:10px}
.phone-workbench>.editor .editor-bottom{height:28px;min-height:28px;flex:0 0 28px;padding:0 9px;font-size:8px}
.phone-workbench>.inspector .reference-section{padding:11px 14px 10px;border-bottom:1px solid #e5e9df}
.phone-workbench>.inspector .section-heading{margin-bottom:8px}
.phone-workbench>.inspector .section-heading h2{font-size:12px}
.phone-workbench>.inspector .reference-tabs{gap:14px;margin-bottom:7px}
.phone-workbench>.inspector .reference-preview{height:clamp(150px,24dvh,215px);min-height:150px;touch-action:none;cursor:grab;overflow:hidden;background:#e9ece5}
.phone-workbench>.inspector .reference-preview:active{cursor:grabbing}
.phone-workbench>.inspector .reference-preview>img{object-fit:contain;user-select:none;pointer-events:none;will-change:transform}
.phone-workbench>.inspector .reference-caption{font-size:8px;padding:18px 9px 7px}
.phone-workbench>.inspector .expand-reference{right:6px;top:6px;padding:5px}
.phone-workbench>.inspector .reference-nav{gap:4px;margin-top:7px;font-size:8px;flex-wrap:nowrap}
.phone-workbench>.inspector .reference-zoom-controls{flex-shrink:0;gap:3px}
.phone-workbench>.inspector .reference-zoom-controls button{height:27px;width:27px}
.phone-workbench>.inspector .reference-zoom-controls output{font-size:8px;min-width:30px}
.phone-workbench>.inspector .properties-section{padding:0 13px 12px;min-height:150px}
.phone-workbench>.inspector .inspector-tabs{height:39px}
.phone-workbench>.inspector .inspector-tabs button{font-size:11px}
.phone-workbench>.inspector .empty-properties{padding:16px 0 12px}
.phone-workbench>.inspector .selected-asset{margin-bottom:9px}
.phone-workbench>.inspector .property-row{margin-top:8px}
.phone-workbench>.inspector input[type=range]{margin:7px 0 4px}
.phone-workbench>.inspector .transform-buttons{margin-top:6px}
.phone-workbench>.inspector .view-options{padding:12px 14px}
.phone-workbench>.inspector .view-options label{margin-bottom:10px}
.phone-workbench>.inspector .layer-list{max-height:28dvh}
.phone-tabs{height:calc(59px + env(safe-area-inset-bottom,0px));flex:0 0 calc(59px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:repeat(3,1fr);padding:3px 6px env(safe-area-inset-bottom,0px);background:#fffffff5;border-top:1px solid #e4e9dd;z-index:4}
.phone-tabs button{border:0;background:transparent;color:#8d9881;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:8px}
.phone-tabs button svg{height:18px;width:18px}.phone-tabs button small{font-size:9px}
.phone-tabs button.selected{background:#f0f4e9;color:#3d6245;font-weight:600}
.phone-tabs button.selected svg{color:#57784a}
.phone-workbench .reference-dialog{width:calc(100vw - 16px);height:90dvh}
.phone-workbench .reference-large{height:calc(100% - 120px)}
@media(max-width:350px){.phone-header>small{padding-right:105px}.phone-brand{font-size:11px}.phone-workbench>.inspector .reference-nav{flex-wrap:wrap;row-gap:7px}.phone-workbench>.inspector .reference-nav>span{width:100%}.phone-workbench>.inspector .reference-zoom-controls{margin-left:0}}
@media(prefers-reduced-motion:reduce){.phone-workbench>.phone-panel{transition:none}}