/* Keep icon and label tracks identical, including the text-based tool icons. */
.tool-rail .tool-button:not(.tool-rail-toggle) {
  flex:0 0 auto;
  min-width:0;
  min-height:64px;
  padding:4px 2px;
  display:grid;
  grid-template-rows:24px minmax(28px,auto);
  align-content:center;
  justify-items:center;
  gap:4px;
  font-family:inherit;
  font-size:11px;
  line-height:14px;
}
.tool-rail .tool-button > .tool-icon {width:24px;height:24px;margin:0;align-self:center;justify-self:center;flex:none;}
.tool-rail .tool-button > span.tool-icon {display:flex;align-items:center;justify-content:center;line-height:24px;font-size:26px;}
.tool-rail .tool-button > span:not(.tool-icon) {display:flex;align-items:center;justify-content:center;min-height:28px;max-width:100%;text-align:center;line-height:14px;white-space:normal;overflow-wrap:anywhere;}
.tool-rail .tool-rail-toggle {align-items:center;justify-content:center;gap:7px;}
.tool-rail.is-collapsed .tool-button:not(.tool-rail-toggle) {display:none;}
.canvas-controls {width:100%;min-width:0;max-width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:5px;padding:7px;overflow:visible;}
.canvas-controls > button,
.canvas-controls > .grid-color-settings > summary {min-height:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 9px;font-family:inherit;font-size:12px;line-height:1.3;white-space:nowrap;}
.canvas-controls > .control-divider {height:24px;flex:0 0 1px;}
.focus-toolbar-actions {align-items:stretch;}
.site-announcement p {overflow-wrap:anywhere;line-height:1.7;}
.view-toolbar-stack,.view-tabs {min-width:0;max-width:100%;}
.view-tabs {overflow-x:auto;justify-content:flex-start;}
.view-tabs > button {flex:0 0 auto;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;}
.app-shell.is-focus-mode .workbench {display:grid;grid-template-columns:68px minmax(0,1fr);}
.app-shell.is-focus-mode .workbench > .tool-rail {grid-column:1;grid-row:1;order:0;}
.app-shell.is-focus-mode .workbench > .workspace {grid-column:2;grid-row:1;order:1;}
.app-shell.is-focus-mode .workbench.focus-tools-hidden {grid-template-columns:minmax(0,1fr);}
.app-shell.is-focus-mode .workbench.focus-tools-hidden > .workspace {grid-column:1;}
@media(min-width:821px) {
  .workbench:not(.is-focus-mode) {grid-template-columns:68px minmax(0,1fr) minmax(240px,300px);}
  .workbench:not(.is-focus-mode) > .tool-rail {grid-column:1;grid-row:1;order:0;min-height:0;}
  .workbench:not(.is-focus-mode) > .workspace {grid-column:2;grid-row:1;order:0;}
  .workbench:not(.is-focus-mode) > .inspector {grid-column:3;grid-row:1;order:0;min-width:0;}
}
@media(max-width:820px) {
  .tool-rail .tool-button.adjustment-tool {display:none;}
  .workbench:not(.is-focus-mode) > .tool-rail:not(.is-collapsed) {grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:minmax(76px,auto);align-items:stretch;gap:5px;padding:7px;}
  .workbench:not(.is-focus-mode) > .tool-rail .tool-button:not(.tool-rail-toggle) {min-height:76px;padding:7px 2px;}
  .tool-rail .tool-rail-toggle {display:flex;grid-column:1/-1;min-height:44px;height:44px;padding:5px 8px;}
  .tool-rail.is-collapsed {grid-auto-rows:auto;}
  .canvas-controls > button,
  .canvas-controls > .grid-color-settings > summary {min-height:44px;height:44px;}
  .canvas-controls > .control-divider {display:none;}
  /* Focus mode is a narrow vertical rail, not a five-column phone palette. */
  .app-shell.is-focus-mode .workbench > .tool-rail {grid-column:1;grid-row:1;order:0;position:sticky;top:8px;bottom:auto;align-self:start;display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:auto;min-height:0;max-height:calc(100dvh - 16px);overflow-x:hidden;overflow-y:auto;padding:4px;gap:4px;}
  .app-shell.is-focus-mode .workbench > .workspace {grid-column:2;grid-row:1;order:1;min-width:0;}
  .app-shell.is-focus-mode .workbench.focus-tools-hidden > .workspace {grid-column:1;}
  .app-shell.is-focus-mode .workbench.focus-tools-hidden > .tool-rail {display:none;}
  .app-shell.is-focus-mode .tool-rail .rail-spacer {display:none;}
  .app-shell.is-focus-mode .tool-rail .tool-rail-toggle {height:auto;min-height:44px;flex-direction:column;gap:3px;padding:5px 1px;}
}
@media(max-width:600px) {
  .canvas-controls {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;}
  .canvas-controls > button,
  .canvas-controls > .grid-color-settings > summary {min-width:0;width:100%;padding:0 3px;font-size:11px;gap:4px;}
  .canvas-controls > .grid-color-settings {min-width:0;}
  .app-shell.is-focus-mode .workbench:not(.focus-tools-hidden) .canvas-controls {grid-template-columns:repeat(2,minmax(0,1fr));}
}
