body { background:var(--bf-background); }
.intro { background:var(--bf-muted-surface); color:var(--bf-text); border-right:1px solid var(--bf-border); }
.eyebrow { color:var(--bf-accent); }
.intro p:not(.eyebrow),.intro-foot { color:var(--bf-muted); }
.form-side { background:var(--bf-background); }
input { background:var(--bf-raised); border-color:var(--bf-control-border); }
input:focus-visible { outline:2px solid var(--bf-accent); }
button.primary { background:var(--bf-accent); color:var(--bf-on-accent); }
button.primary:hover { background:var(--bf-accent-hover); }
.tabs button.active { background:var(--bf-accent-soft); color:var(--bf-accent); border-color:var(--bf-control-border); }
.error { background:var(--bf-danger-soft); color:var(--bf-danger); }
.notice { background:var(--bf-accent-soft); }
.link { color:var(--bf-accent); }
@media(max-width:760px) { .intro { border-right:0; border-bottom:1px solid var(--bf-border); } }