@import url('./gallery.css');
body{min-height:100vh;display:flex;flex-direction:column}.demo-nav{max-width:none;width:100%;height:auto;min-height:44px;padding:6px 16px;gap:18px;flex-wrap:wrap}.demo-nav h1{font-size:18px;letter-spacing:-.03em;margin:0}.demo-nav a{font-size:13px}.demo-nav .links{display:flex;gap:20px}.demo-main{max-width:none;width:100%;padding:8px 16px;display:flex;flex:1;flex-direction:column}.description{margin:0 0 6px;color:var(--muted);font-size:14px}.terminal-shell{position:relative;flex:1;min-height:430px;height:65vh;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#1e1e1e}#terminal-container{position:absolute;inset:0;padding:6px}#status{position:absolute;top:18px;left:18px;right:18px;background:#18252bf2;padding:12px 18px;border-radius:6px;margin:0;z-index:2}#status[hidden]{display:none}.controls{display:flex;gap:12px 24px;flex-wrap:wrap;font-size:13px;color:var(--muted);padding:15px 0 0}.demo-foot{font-size:12px;color:var(--muted);margin-bottom:0}@media(max-width:680px){.demo-nav{padding:6px 12px}.demo-main{padding:8px}.terminal-shell{min-height:350px}.controls{gap:10px}}

/* Terminal Actions: the scene's keys as touch controls. Booba's defaults sit in @layer booba, so these plain rules win. */
.actions{padding-bottom:10px}
.actions:not(:has(.booba-action)){display:none}
.booba-action-bar,.booba-action-group{gap:8px}
.booba-action{min-height:34px;min-width:34px;padding:5px 12px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--text);font:600 13px/1.2 system-ui,-apple-system,sans-serif;cursor:pointer;transition:border-color .12s,color .12s}
.booba-action:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.booba-action:active:not(:disabled){background:#25363c}
.booba-action:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.booba-action:disabled{opacity:.4;cursor:default}
.booba-action--toggle,.booba-action--keyboard{font-weight:500}
.booba-action--toggle[aria-expanded="true"]{border-color:var(--accent);color:var(--accent);background:#25363c}
.booba-action--keyboard{margin-inline-start:auto}
@media(pointer:coarse){.booba-action{min-height:44px;min-width:44px}}