/* Shared typography and surfaces from the approved reference. */
body,#authDialog,.auth-return,#userInformation,.boom-survey-banner,.boom-survey-dialog,.boom-statistics-control{font-family:var(--bc-ui-font)}
button,.button,input,textarea,select,#authDialog button,#authDialog input,#support button,.boom-survey-banner button,.boom-survey-dialog button{font-family:var(--bc-ui-font)}
button,.button{font-weight:650}
h1,h2,h3,#home .hero h1,#authDialog h2,.information-heading h1,#deviceDialog h2,#transferDialog h2,#support h1,.auth-result-card h1{font-family:var(--bc-title-font);font-weight:700;letter-spacing:-.04em}
#home .hero h1{letter-spacing:-.045em}
#home .hero .lead{font-family:var(--bc-ui-font)}
.brand,.brand-picture .brand-word,.auth-brand{font-family:var(--bc-title-font);font-weight:700;letter-spacing:-.055em}
.eyebrow,.section-intro .eyebrow{font-family:var(--bc-ui-font);font-weight:650}
/* Punctuation stays in the original text node; no generated decorative dots. */
h1,h2,h3{text-wrap:pretty;word-break:normal;overflow-wrap:normal}
:root{--bg:#0d0b14;--lime:#d9ff32;--muted:#b3aebf;--line:#a39ab724}
body{background:#0d0b14;color:#f5f3f8}
body:before{background-image:linear-gradient(#bdb4d70d 1px,transparent 1px),linear-gradient(90deg,#bdb4d70d 1px,transparent 1px);background-size:40px 40px}
body:after{background:radial-gradient(ellipse at 72% 24%,#68419910,transparent 55%)}
header{background:#0d0b14f2;border-color:#a39ab720;box-shadow:none}
button,.button{border-radius:8px}
button:not(.secondary),.button:not(.secondary),.hero .button,.hero .button:hover{box-shadow:none}
.secondary{background:#19151f;border-color:#75668440}
.secondary:hover{background:#231d2e;border-color:#a58abb80}
.hero .eyebrow{background:transparent;border-color:#8b749540}
.scene-native:before,.product-scene:before{background:radial-gradient(ellipse,#7650a718,transparent 70%)}
.scene-grid,.scene-orbit{opacity:.45}
.native-card{background:#17121ff5;border-color:#76638865;box-shadow:0 15px 32px #0004}
.native-edit-simple{background:#15111d}
.native-phone{background:#100d17;border-color:#62576f;box-shadow:0 15px 32px #0004}
.panel,.plan-card,.steps article,.craft-demo{background:#17131f;border-color:#8a749630;box-shadow:none}
.plan-card.featured{background:#21182e;border-color:#9b76c1;box-shadow:none}
.providers>div{background:#110e18}
.craft-preview{background:linear-gradient(140deg,#21172f,#100d18)}
.craft-preview:before{opacity:.35}
.craft-demo .craft-heading,.native-title{font-family:var(--bc-ui-font)}
.craft-preview strong,.native-edit h3{font-family:var(--bc-title-font);font-weight:700}
dialog{background:#181320;border-color:#62516e;box-shadow:0 24px 80px #0006}
#authDialog,#deviceDialog,#transferDialog,.auth-result-card{background:#181320}
footer{background:#0b0911;border-color:#a39ab720}
@media(prefers-reduced-motion:reduce){button,.button{transition:none}}

/* Shared dark scrollbars for account, support, devices and control panels. */

html,body{color-scheme:dark;scrollbar-color:#695b79 transparent;scrollbar-width:thin}
html:has(body dialog[open]),body:has(dialog[open]){overflow:hidden}
body *{scrollbar-width:thin;scrollbar-color:#695b79 transparent}
@supports selector(::-webkit-scrollbar){html,body,body *{scrollbar-width:auto;scrollbar-color:auto}}
html::-webkit-scrollbar,body ::-webkit-scrollbar{width:8px;height:8px;background:transparent}
html::-webkit-scrollbar-track,html::-webkit-scrollbar-corner,body ::-webkit-scrollbar-track,body ::-webkit-scrollbar-corner{background:transparent}
html::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-thumb{background:#695b79;border:2px solid transparent;border-radius:8px;background-clip:padding-box}
html::-webkit-scrollbar-thumb:hover,body ::-webkit-scrollbar-thumb:hover{background-color:#a38ab8}
html::-webkit-scrollbar-button,body ::-webkit-scrollbar-button{display:none;width:0;height:0}
body :is(dialog,[role="dialog"],[role="menu"])::-webkit-scrollbar-track:vertical{margin-block:12px}
body :is(dialog,[role="dialog"],[role="menu"])::-webkit-scrollbar-track:horizontal{margin-inline:12px}
@media(forced-colors:active){html,body,body *{scrollbar-color:auto;scrollbar-width:auto}html::-webkit-scrollbar,body ::-webkit-scrollbar{width:revert;height:revert}html::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-thumb{background:ButtonText}}
