/* Additional surfaces: styles gallery cards, table grid popovers, color bars,
   backstage thumbnails, print preview stack, mini-docs, kbd rows, toasts. */

/* styles gallery strip & dropdown */
.gallery-preview.styles-strip { display:flex; gap:4px; align-items:center; padding:3px 4px; }
.style-mini { padding:1px 2px; white-space:nowrap; }
.styles-gallery-drop { min-width: 520px; max-width: 620px; }
.style-grid { display:grid; grid-template-columns:repeat(4,150px); gap:8px; padding:8px 10px 12px; }
.style-card { border:1px solid #e2e0de; border-radius:5px; background:#fff; padding:9px 10px; cursor:default; transition: box-shadow .12s, border-color .12s; }
.style-card:hover { border-color:#a8c4e8; box-shadow:0 0 0 1.5px rgba(24,90,189,.35), 0 2px 6px rgba(0,0,0,.08); }
.style-card .sc-aabbc { line-height:1.05; margin-bottom:7px; overflow:hidden; height:26px; }
.style-card .sc-name { font-size:11.5px; color:#666; }

/* color underline chips on split buttons */
.color-underbar { display:block; width:16px; height:3px; border-radius:1px; margin:-3px auto 0; box-shadow: 0 0 0 .5px rgba(0,0,0,.25); }
.color-underbar.hlbar { outline:0; }

/* table gallery pop */
.table-grid-preview { display:grid; grid-template-columns:repeat(6,10px); grid-auto-rows:9px; gap:1px; padding:4px; background:#fff; }
.table-grid-preview span { background:#eef3fb; border:.7px solid #c9d7ec; }
.table-grid-pop { display:grid; grid-template-columns:repeat(8,17px); grid-auto-rows:15px; gap:2px; padding:9px; }
.table-grid-pop span { background:#fff; border:1px solid #cfd8e3; border-radius:1px; cursor:default; }
.table-grid-pop span.hot { background:#cfe1f7; border-color:#94b6de; }

/* pane-dialog / dialogs already in surfaces.css */

/* backstage thumbnails */
.thumb-frame .thumb-pages, .mini-page { position:absolute; inset:0; }
.mini-page { overflow:hidden; background:#fff; }

.print-preview-stack { display:flex; flex-direction:column; gap:18px; max-height:calc(100vh - 210px); overflow:auto; padding:14px; background:#eceae8; border-radius:8px; }
.printer-page { transform-origin: top center; width:816px; }
.print-preview-stack .printer-page { position:relative; }

.legend-t > span:first-child { display:block; font-size:11.5px; color:#777; margin-bottom:7px; letter-spacing:.2px;}

.recent-icon { background:#f2f0ee; }

/* toolbar hint row under groups? none */

/* toasts (honest capability notes) */
.toast-stack { position:fixed; left:50%; bottom:44px; transform:translateX(-50%); z-index:600; display:flex; flex-direction:column; gap:8px; pointer-events:none;}
.toast {
  background:#262524; color:#f3f2f1; font-size:12.5px;
  padding:10px 18px;border-radius:18px;box-shadow:0 6px 18px rgba(0,0,0,.35);
  animation: toastIn .22s ease-out, toastOut .3s ease-in 3.4s forwards;
  max-width:70vw;text-align:center;
}
@keyframes toastIn { from{opacity:0;transform:translateY(10px);} to{opacity:1;} }
@keyframes toastOut { to{opacity:0;transform:translateY(8px);} }

/* stats modal bits reused */
.stats-grid td { padding:3px 30px 3px 0; font-size:12.5px; }
.stats-grid td.k { color:#777; }

/* ctx suggestion font buttons inside menus keep menu widths sane */
.menu-item .suggest-word { font-size:14px; }

/* narrow responsive affordances (documented desktop-first) */
@media (max-width: 1320px) { .searchbox { width:150px; } .searchbox span { display:none; } }
@media (max-width: 1080px) {
  .account-chip span:last-child { display:none; }
  .tb-center { min-width:220px; }
}
.tab-strip .app-tabs { overflow-x:auto; scrollbar-width:none; }
.tab-strip .app-tabs::-webkit-scrollbar{display:none;}