/* Canonical homepage lockup, with inherited contrast for light/dark scenes. */
.topbar:has(.scene-brand){gap:20px}
.scene-brand{display:inline-flex;align-items:center;gap:10px;width:max-content;flex-shrink:0;color:inherit;line-height:normal;letter-spacing:normal}
.scene-brand .brand-mark{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;width:40px;height:40px;border:1.5px solid currentColor;border-radius:50%;font-size:12px;font-weight:800;letter-spacing:-.04em}
.scene-brand .brand-mark::after{content:"";position:absolute;box-sizing:border-box;border:0;width:7px;height:7px;right:-1px;top:-1px;border-radius:50%;background:#d8ff57;box-shadow:0 0 0 3px var(--scene-brand-surface)}
.scene-brand .brand-text{display:grid;gap:4px;min-width:max-content;line-height:1;text-transform:uppercase}
.scene-brand .brand-text strong{font-size:10px;letter-spacing:.16em;font-weight:800}
.scene-brand .brand-text small{font-size:8.2px;letter-spacing:.19em;font-weight:700}
.scene-brand .brand-accent{display:block;flex:none;width:3px;height:40px;margin-left:2px;background:#d8ff57}
@media(max-width:680px){.scene-brand .brand-text{display:none}.scene-brand .brand-accent{height:34px;margin-left:0}}