[hidden] {
  display: none !important;
}
.app-tools {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.app-tools a,
.app-tools button {
  min-height: 44px;
  font-size: 14px;
  padding: 10px 14px;
}
.app-tools button {
  background: var(--surface, #23252a);
  color: var(--fg, #f2f3f5);
  border: 1px solid var(--control, #797f8a);
}
.app-tools kbd {
  font: 12px system-ui;
  margin-left: 8px;
  color: var(--muted, #afb3bb);
}
@media (max-width: 740px) {
  .app-tools {
    width: 100%;
    justify-content: space-between;
    gap: 8px;
  }
  .app-tools a,
  .app-tools button {
    padding: 8px 10px;
  }
}

html{scrollbar-gutter:stable}@media(max-width:600px){}

/* Composer is a recognisable home link; the mini-app keeps its own identity. */
header .composer-return{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:6px 0;text-decoration:none;color:var(--fg,#f2f3f5);font:600 15px/1.2 Space,system-ui,sans-serif;letter-spacing:-.02em;white-space:nowrap;flex-shrink:0}
header .composer-return img{display:block;flex-shrink:0;width:28px;height:28px}
header .composer-return:hover span{color:var(--accent,#ed936c)}
header .composer-return:focus-visible{outline:3px solid var(--accent,#ff9b55);outline-offset:4px;border-radius:4px}
header .composer-return>span{font:inherit;color:inherit;margin:0}
header .composer-return .composer-name{display:block;font:inherit;color:inherit;margin:0}
header .composer-return .composer-context{display:block;margin-top:3px;font:12px/1.3 system-ui,sans-serif;letter-spacing:0;color:var(--muted,#afb3bb)}

/* Grid3x3 geometry from Lucide (ISC), matching Composer’s launcher. */
.app-tools [data-open-apps]{display:inline-flex;align-items:center;gap:8px}.app-tools [data-open-apps] svg{flex-shrink:0}.app-tools [data-open-apps] kbd{margin-left:0}

@media(max-width:740px){header{gap:12px}header .composer-return--secondary{margin-left:auto;font-size:14px;gap:7px}header .app-tools kbd{display:none}header .app-tools a{display:none}header .app-tools button{font-size:14px}header .app-tools{justify-content:flex-start}}
@media(max-width:360px){header .composer-return--secondary>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}header .composer-return--secondary{min-width:44px;justify-content:center}}

/* Keep public app identity and everyday controls in one compact row. */
header.app-header{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
header.app-header .app-tools{width:auto;flex-wrap:nowrap;margin-left:auto;gap:4px;justify-content:flex-end}
header.app-header>nav:not(.app-tools){order:3;width:100%;gap:8px 20px}
@media(max-width:700px){header.app-header{padding-block:12px}header.app-header>.brand,header.app-header>strong,header.app-header>a>strong{font-size:20px}header.app-header .brand img{width:28px;height:28px}header.app-header .app-tools [data-open-apps]{padding-inline:10px}}

@media(max-width:700px){header.app-header .app-tools kbd{display:none}}

/* The standalone collection keeps its own optical identity beside its title. */
header .guestbook-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font: 600 20px/1.2 Space, system-ui, sans-serif;
}
header .guestbook-brand img { display: block; flex-shrink: 0; width: 36px; height: 36px; }
header .guestbook-brand strong { font: inherit; overflow-wrap: anywhere; }