body.chart-focused{overflow:hidden}
body.chart-focused .side-rail,body.chart-focused .topbar,body.chart-focused .mobile-nav,body.chart-focused .footer{display:none}
#chart-editor.focus-mode{position:fixed;inset:0;z-index:100;width:100%;height:100dvh;background:var(--paper);color:var(--ink);overflow:hidden;padding-top:56px}
#chart-editor.focus-mode .chart-actions,#chart-editor.focus-mode .canvas-toolbar,#chart-editor.focus-mode .canvas-footer,#chart-editor.focus-mode .chart-summary{display:none}
#chart-editor.focus-mode .chart-workspace{display:grid;grid-template-columns:minmax(0,1fr) 230px;height:100%;min-height:0}
#chart-editor.focus-mode .canvas-panel{padding:0;min-height:0;overflow:hidden}
#chart-editor.focus-mode .chart-viewport{height:100%;min-height:0;border:0}
#chart-editor.focus-mode .chart-colors{display:flex;flex-direction:column;min-height:0;max-height:none;padding:12px;border-top:0;border-left:1px solid var(--line)}
#chart-editor.focus-mode #colorList{min-height:0;overflow:auto}
.focus-exit:not([hidden]){position:absolute;right:16px;top:8px;z-index:5;height:40px;min-height:40px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:6px}
@media(max-width:720px){#chart-editor.focus-mode{padding-top:calc(56px + env(safe-area-inset-top));padding-bottom:env(safe-area-inset-bottom)}#chart-editor.focus-mode .chart-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 138px}#chart-editor.focus-mode .chart-colors{border-left:0;border-top:1px solid var(--line);padding:8px 12px}#chart-editor.focus-mode .chart-colors h3{margin:4px 0;font-size:14px}#chart-editor.focus-mode #colorList{flex-direction:row;overflow-x:auto}.focus-exit:not([hidden]){top:calc(8px + env(safe-area-inset-top))}}