/* Layout for the tool pages only (split, merge, clean ...). site.css was written for the viewer and hides or collapses
   the tool shell; these rules put the normal tool layout back. Loaded only by live tool pages, after site.css. */
body[data-page="tool"] #app .tool-shell{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0;border:1px solid var(--line-strong);border-radius:16px;background:var(--paper);overflow:hidden;box-shadow:7px 7px 0 var(--offset)}
body[data-page="tool"] #app .tool-main{display:block;padding:20px;min-width:0}
body[data-page="tool"] #app .tool-aside{border-left:1px solid var(--line);background:var(--bg);padding:18px 18px 22px;display:flex;flex-direction:column;gap:16px;min-width:0}
body[data-page="tool"] #app .tool-aside .tk-hint{flex:none;margin:6px 0 0;max-width:none;white-space:normal;overflow:visible;text-overflow:clip}
body[data-page="tool"] #app .tool-aside .tk-primary,body[data-page="tool"] #app .tool-aside .tk-btn-ghost{white-space:normal;text-align:center}
@media (max-width:860px){
  body[data-page="tool"] #app .tool-shell{grid-template-columns:minmax(0,1fr)}
  body[data-page="tool"] #app .tool-aside{border-left:0;border-top:1px solid var(--line)}
}