/* The portal at b-brain.uk/ (Isamu, 11 Oct 2026). The pages are drawn in the brain's own grammar on demo/theme.css
   (header bar, banner, .pg grid, .blk cards); this file adds only the row of buttons inside a prose card. */
.blk .cta{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 0}
/* the front door's right-hand stack (the main message above Get in early) takes its natural height on phones, as the
   brain does for its key facts stack (site.css #facts-profile) */
@media (max-width:699px){.pg>.stack#main>.blk:last-child,.pg>.stack#main>.blk:last-child>.bb{flex:0 0 auto;min-height:0}}
/* S85 (Nervi, docs/23): screenshot tiles, each card one link to the page it shows (the link's ::after covers the card) */
.blk[data-as="portal_shot"] .bb{gap:6px}
.shot-a{display:block;color:inherit}
.shot-a::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1}
.shot-a img{display:block;width:100%;height:auto;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--paper)}
.blk[data-as="portal_shot"]:hover{border-color:var(--slate)}
.blk[data-as="portal_shot"]:hover .shot-a img{border-color:var(--slate)}
.blk[data-as="portal_shot"]:focus-within{outline:2px solid var(--brain-pink);outline-offset:2px}
.shot-a:focus-visible{outline:0}
.shot-cap{margin:4px 0 0;font-size:var(--fs-text);line-height:1.5}
.shot-do{margin:0;font-size:var(--fs-small);color:var(--muted)}
/* a worked example's chat, drawn as the Ask B panel draws it (site.css .ab-thread) */
.pchat{display:grid;gap:8px}
.pc-where{margin:0;font-size:var(--fs-small);color:var(--muted)}
.pc-steps{margin:0 0 8px;padding:0 0 6px;border-bottom:1px solid var(--border);font-size:var(--fs-small);color:var(--muted)}
.pc-steps span{font-weight:600}
.pc-src{margin-top:8px;font-size:var(--fs-2)}
.pc-src ul{margin:4px 0 0;padding-left:20px}
.pchat .ab-b h3,.pchat .ab-b h4,.pchat .ab-b h5{font-size:var(--fs-text);margin:10px 0 4px}
.pchat .ab-b .tbl{overflow-x:auto}
/* the slide and page renders of one example: thumbnails that open the full render */
.pgal{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.pgal li{display:grid;gap:4px;min-width:0}
.pgal a{display:block}
.pgal img{display:block;width:100%;height:auto;border:1px solid var(--border);border-radius:6px;background:#fff}
.pgal a:hover img{border-color:var(--slate)}
.pgal span{font-size:var(--fs-small);color:var(--muted)}