.families{display:flex;align-items:center;justify-content:center;gap:7px;min-height:38px;flex-shrink:0;padding:4px 12px;background:#252b48;color:#f5f7ff;border-bottom:1px solid #3b466b;font-family:Nunito,"Segoe UI",sans-serif}
.families>span{font-size:8px;letter-spacing:1.5px;font-weight:900;margin-right:6px}
.families a{padding:4px 15px;border-radius:7px;color:#f5f7ff;font-size:11px;font-weight:900;text-decoration:none;white-space:nowrap}
.families a:hover{background:#354364}
.families a[aria-current=page]{background:#f4c542;color:#171827}
.families a:focus-visible{outline:3px solid #f4c542;outline-offset:2px}
.viewer:has(>.toolbar) {grid-template-rows:auto auto minmax(0,1fr) auto auto}
@media(max-width:380px){.families{gap:4px;padding-inline:8px}.families a{padding-inline:12px}.families>span{font-size:7px;margin-right:3px}}

/* Shared printed lettermark: preserve the custom contours, change the ink. */
h1 svg.gruboli-mark{overflow:visible;width:164px;height:auto;flex-shrink:0}
@media(max-width:900px){h1 svg.gruboli-mark{width:128px}}
@media(max-width:380px){h1 svg.gruboli-mark{width:103px}}