/* Approved pixel identity. Synced to the browser app by build-brand-icons.mjs. */
.brand,.wordmark{display:inline-flex;align-items:center;gap:9px;flex-shrink:0;white-space:nowrap;text-decoration:none;line-height:1}
.brand:hover,.wordmark:hover{text-decoration:none}
.brand-logo{display:block;width:203px;height:auto;flex:0 0 203px;object-fit:contain}
.brand-logo-dark{display:none}
:root[data-theme=dark] .brand-logo-light{display:none}
:root[data-theme=dark] .brand-logo-dark{display:block}
.brand .badge{margin-left:3px}
.wordmark .brand-logo{width:232px;height:auto;flex-basis:232px}
.site-footer .brand-logo{width:174px;height:auto;flex-basis:174px}
@media(max-width:1150px){.brand .badge{display:none}}
@media(max-width:1100px) and (min-width:761px){.wordmark .brand-logo{width:203px;height:auto;flex-basis:203px}}
@media(max-width:760px){.brand-logo,.wordmark .brand-logo{width:174px;height:auto;flex-basis:174px}}
@media(max-width:389px){.brand-logo,.wordmark .brand-logo{width:145px;height:auto;flex-basis:145px}}
@media(max-width:359px){.brand-logo,.wordmark .brand-logo{width:116px;height:auto;flex-basis:116px}}

/* Compact, theme-aware action mark from the approved 10 × 14 cursor grid. */
.cursor-mark{position:relative;display:inline-block;width:10px;height:14px;flex:0 0 10px;vertical-align:-2px;margin-inline-start:.2em;font-style:normal}
.cursor-mark::before{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:url("/assets/brand/takeoff-cursor.svg") center/contain no-repeat;mask:url("/assets/brand/takeoff-cursor.svg") center/contain no-repeat}
.cursor-mark::after{content:"";position:absolute;top:0;left:0;width:3px;height:3px;background:var(--cursor-accent,var(--orange,#d97757))}
.button .cursor-mark,.header-cta .cursor-mark,.feature-points .cursor-mark{margin-inline-start:0}
.primary .cursor-mark{--cursor-accent:currentColor}
.feature-points .cursor-mark{margin-top:1px}
.welcome-notes .cursor-mark{margin-inline:0 10px}
@media(max-width:480px){.header-inner>.wordmark{flex-shrink:1;min-width:0}.header-inner>.wordmark .brand-logo{min-width:0;flex-shrink:1}}
@media(forced-colors:active){.cursor-mark{forced-color-adjust:none;color:ButtonText;--cursor-accent:ButtonText}}
