/* Scoped personal onboarding: native modal, one photograph, bounded glass.
 * No video, continuous animations, full-page moving layers or external assets. */
body.sba-onboarding-open { overflow: hidden; }
.sba-onboarding,
.sba-ob-settings {
  --sba-ob-ink: #122640;
  --sba-ob-muted: #536579;
  --sba-ob-accent: #c80e32;
  --sba-ob-line: rgba(38, 65, 89, .15);
  color: var(--sba-ob-ink);
  font: 400 15px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-align: left;
  overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%;
}
.sba-onboarding *, .sba-ob-settings * { box-sizing: border-box; }
dialog.sba-onboarding {
  inset: 0;
  width: min(1120px, calc(100vw - 40px));
  height: min(820px, calc(100vh - 40px));
  height: min(820px, calc(100dvh - 40px));
  max-width: none;
  max-height: none;
  margin: auto;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 30px;
  background: #f4f6f8;
  box-shadow: 0 32px 100px rgba(16, 35, 57, .3), 0 1px 0 rgba(255, 255, 255, .8) inset;
  overflow: hidden;
}
.sba-onboarding::backdrop { background: rgba(12, 27, 42, .56); }
@supports (backdrop-filter: blur(1px)) {
  dialog.sba-onboarding { background: rgba(246, 248, 250, .97); }
  .sba-onboarding::backdrop { backdrop-filter: blur(5px); }
}
.sba-ob-layout { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 1.65fr); height: 100%; }
.sba-ob-scene { position: relative; min-width: 0; overflow: hidden; color: white; background: #344b5a; isolation: isolate; }
.sba-ob-scene > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 65% center; z-index: -2; }
.sba-ob-scene::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13, 34, 48, .62), rgba(13, 34, 48, .05) 36%, rgba(13, 34, 48, .9)); z-index: -1; }
.sba-ob-brand { display: flex; align-items: center; gap: 10px; padding: 30px 24px; font-size: 16px; font-weight: 700; letter-spacing: -.025em; }
.sba-ob-brand img { width: 32px; height: 32px; padding: 4px; border-radius: 9px; background: white; }
.sba-ob-scene-copy { position: absolute; inset: auto 24px 36px; }
.sba-ob-scene-copy > span { font-size: 12px; letter-spacing: .025em; }
.sba-ob-scene-copy p { margin: 14px 0 20px; font-size: clamp(26px, 3vw, 40px); line-height: 1.14; letter-spacing: -.045em; font-weight: 650; }
.sba-ob-scene-copy small { font-size: 14px; line-height: 1.65; color: #eef3f6; }
.sba-ob-main { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; min-width: 0; min-height: 0; margin: 0; }
.sba-ob-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 24px 8px; }
.sba-onboarding .sba-ob-header .sba-ob-button { padding-inline: 8px; font-size: 12px; }
.sba-ob-steps { min-width: 0; padding: 6px 24px 12px; border-bottom: 1px solid var(--sba-ob-line); }
.sba-ob-steps ol { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 3px; margin: 0; padding: 0; list-style: none; }
.sba-ob-steps li { min-width: 0; }
.sba-onboarding .sba-ob-steps button { display: flex; width: 100%; min-height: 62px; flex-direction: column; align-items: center; gap: 5px; position: relative; margin: 0; padding: 5px 1px; color: var(--sba-ob-muted); background: transparent; border: 1px solid transparent; border-radius: 12px; font: inherit; font-size: 10px; line-height: 1.25; cursor: pointer; text-align: center; }
.sba-ob-step-number { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: #e8edf2; font-size: 11px; font-weight: 700; }
.sba-ob-step-number svg { width: 15px; height: 15px; }
.sba-onboarding .sba-ob-steps [aria-current="step"] { color: var(--sba-ob-ink); background: white; border-color: var(--sba-ob-line); }
.sba-onboarding .sba-ob-steps [aria-current="step"] .sba-ob-step-number { background: var(--sba-ob-ink); color: white; }
.sba-ob-step-later { position: absolute; inset: 1px 12px auto auto; font-size: 20px; }
.sba-ob-scroll { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 28px 28px 20px; scroll-padding-block: 20px; }
.sba-ob-content { min-width: 0; }
.sba-onboarding h2 { margin: 10px 0 12px; font-size: clamp(25px, 2.6vw, 34px); line-height: 1.14; font-weight: 700; letter-spacing: -.045em; color: var(--sba-ob-ink); }
.sba-onboarding h3 { margin: 8px 0 6px; font-size: 16px; line-height: 1.3; color: var(--sba-ob-ink); }
.sba-onboarding p { margin: 0 0 16px; }
.sba-ob-eyebrow { color: var(--sba-ob-muted); font-size: 11px; font-weight: 700; letter-spacing: .075em; text-transform: uppercase; }
.sba-ob-intro { color: var(--sba-ob-muted); max-width: 64ch; }
.sba-onboarding .sba-ob-small, .sba-ob-settings .sba-ob-small { font-size: 12px; line-height: 1.6; color: var(--sba-ob-muted); }
.sba-ob-welcome-note { display: flex; align-items: flex-start; gap: 9px; padding: 12px 14px; margin: 20px 0; border: 1px solid #dce6ed; border-radius: 14px; background: #eef4f7; color: #334d60; font-size: 13px; }
.sba-ob-tiles { display: grid; gap: 12px; margin: 20px 0; }
.sba-ob-tile { position: relative; padding: 17px 18px 16px 61px; border: 1px solid rgba(255, 255, 255, .95); border-radius: 19px; background: rgba(255, 255, 255, .8); box-shadow: 0 4px 16px rgba(25, 50, 75, .04), 0 0 0 1px var(--sba-ob-line); }
.sba-ob-tile-icon { display: grid; place-items: center; position: absolute; inset: 19px auto auto 17px; width: 32px; height: 32px; border-radius: 10px; color: #3b5871; background: #edf2f6; }
.sba-ob-tile-icon svg { width: 20px; height: 20px; }
.sba-ob-tile h3 { margin-top: 0; }
.sba-ob-tile p { margin: 0; color: var(--sba-ob-muted); font-size: 13px; }
.sba-ob-tile .sba-ob-link { margin-top: 7px; }
.sba-onboarding .sba-ob-button, .sba-ob-settings .sba-ob-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; min-width: 44px; width: auto; padding: 10px 16px; margin: 0; border: 1px solid #cdd7e1; border-radius: 13px; background: #fff; color: var(--sba-ob-ink); font: inherit; font-size: 13px; font-weight: 600; line-height: 1.4; text-align: center; cursor: pointer; box-shadow: 0 1px 2px rgba(20, 40, 60, .04); white-space: normal; transition: background-color .15s ease, border-color .15s ease; }
.sba-onboarding .sba-ob-button.is-primary { color: white; background: var(--sba-ob-accent); border-color: var(--sba-ob-accent); box-shadow: 0 4px 12px rgba(173, 11, 40, .13); }
.sba-onboarding .sba-ob-button.is-quiet { background: transparent; border-color: transparent; color: var(--sba-ob-muted); box-shadow: none; }
.sba-onboarding button:disabled, .sba-ob-settings button:disabled { opacity: .55; cursor: default; }
.sba-onboarding .sba-ob-link { display: inline-flex; align-items: center; justify-content: flex-start; gap: 8px; min-height: 44px; max-width: 100%; margin: 2px 8px 2px 0; padding: 9px 2px; background: transparent; border: 0; border-radius: 6px; color: #194c70; font: inherit; font-size: 13px; font-weight: 650; line-height: 1.4; text-align: left; cursor: pointer; white-space: normal; }
.sba-ob-link > span { flex: 1; }
.sba-ob-link > svg:last-child { width: 16px; }
.sba-onboarding svg, .sba-ob-settings svg { flex: 0 0 auto; }
.sba-ob-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; border-top: 1px solid var(--sba-ob-line); background: rgba(255, 255, 255, .93); padding: 14px 22px; }
.sba-ob-footer > div { display: flex; align-items: center; gap: 2px; }
.sba-onboarding :is(button, input, textarea, [tabindex]):focus-visible, .sba-ob-settings button:focus-visible { outline: 3px solid #146da1; outline-offset: 3px; }
.sba-onboarding h2:focus { outline: none; }
.sba-onboarding .sba-ob-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0; }
.sba-ob-wide { grid-column: 1 / -1; }
.sba-onboarding .sba-ob-field { display: grid; gap: 8px; margin: 0; min-width: 0; color: var(--sba-ob-ink); font-size: 13px; font-weight: 550; }
.sba-ob-field > span { display: flex; align-items: center; gap: 4px; }
.sba-ob-field output { margin-left: auto; color: var(--sba-ob-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.sba-onboarding .sba-ob-field :is(input:not([type="range"]), textarea) { width: 100%; min-height: 46px; max-width: 100%; padding: 12px; margin: 0; color: var(--sba-ob-ink); background: white; border: 1px solid #b4c2cf; border-radius: 12px; box-shadow: 0 1px 3px rgba(16, 35, 57, .03) inset; font: inherit; font-size: 16px; line-height: 1.4; }
.sba-onboarding .sba-ob-field textarea { resize: vertical; }
.sba-ob-field small { color: var(--sba-ob-muted); font-weight: 400; font-size: 12px; }
.sba-ob-facts { display: grid; gap: 12px; padding: 16px; background: #edf2f5; border: 1px solid #dbe4eb; border-radius: 15px; margin: 18px 0 12px; }
.sba-ob-facts > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px; }
.sba-ob-facts dt { color: var(--sba-ob-muted); font-size: 12px; }
.sba-ob-facts dd { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin: 0; font-size: 13px; }
.sba-ob-tag { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 7px; background: white; border: 1px solid #dce3e9; font-size: 10px; font-weight: 600; color: #40566a; }
.sba-ob-callout { display: flex; gap: 9px; padding: 14px 16px; border-radius: 14px; border: 1px solid #d7e2ec; color: #344e66; background: #eaf1f6; font-size: 12px; line-height: 1.65; }
.sba-ob-callout svg { width: 19px; height: 19px; margin-top: 2px; }
.sba-ob-notice { margin: 0 0 22px; padding: 16px; color: #673812; border: 1px solid #b98e5c; border-radius: 14px; background: #fff7e9; }
.sba-ob-notice p { margin: 4px 0 12px; font-size: 13px; }
.sba-ob-notice-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sba-ob-conflict-values { display: grid; gap: 9px; margin: 10px 0 16px; padding: 0; list-style: none; font-size: 12px; }
.sba-ob-conflict-values li { display: grid; gap: 3px; }
.sba-ob-sharing { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 24px 0; }
.sba-ob-sharing > div { display: grid; justify-items: center; gap: 7px; min-width: 0; padding: 20px 14px; border-radius: 18px; border: 1px solid #d7e1e9; background: #fff; text-align: center; }
.sba-ob-sharing small { color: var(--sba-ob-muted); font-size: 12px; }
.sba-ob-sharing .sba-ob-shared { grid-column: 1 / -1; background: #eaf1f6; }
.sba-ob-summary { display: grid; gap: 0; padding: 0; margin: 24px 0; list-style: none; border: 1px solid var(--sba-ob-line); border-radius: 17px; overflow: hidden; background: #fff; }
.sba-ob-summary li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 14px; border-bottom: 1px solid var(--sba-ob-line); }
.sba-ob-summary li:last-child { border-bottom: 0; }
.sba-ob-summary li > span { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.sba-ob-summary svg { width: 18px; height: 18px; }
.sba-ob-summary button { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; min-height: 44px; padding: 6px 0 6px 8px; border: 0; background: transparent; color: #194c70; font: inherit; font-size: 12px; cursor: pointer; }
.sba-ob-appearance { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .9fr); gap: 24px; margin: 24px 0 8px; }
.sba-onboarding fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
.sba-onboarding legend { float: none; width: auto; margin: 0 0 12px; padding: 0; color: var(--sba-ob-ink); font-size: 13px; font-weight: 600; }
.sba-ob-wallpaper-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 10px; }
.sba-ob-wallpaper { position: relative; display: block; cursor: pointer; min-width: 0; padding: 0; }
.sba-ob-wallpaper > input, .sba-ob-segments label > input { position: absolute; width: 1px; height: 1px; opacity: 0; clip-path: inset(50%); }
.sba-ob-wallpaper > span { display: block; position: relative; aspect-ratio: 1.48; border: 2px solid transparent; border-radius: 13px; overflow: hidden; background: #dce4ec; }
.sba-ob-wallpaper img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sba-ob-wallpaper strong { display: block; margin-top: 5px; font-size: 11px; color: var(--sba-ob-muted); font-weight: 550; }
.sba-ob-wallpaper i { display: none; position: absolute; right: 5px; bottom: 5px; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: white; background: #173957; }
.sba-ob-wallpaper i svg { width: 13px; height: 13px; }
.sba-ob-wallpaper input:checked + span { border-color: #163d5c; box-shadow: 0 0 0 2px #fff inset; }
.sba-ob-wallpaper input:checked + span i { display: grid; }
.sba-ob-wallpaper input:focus-visible + span, .sba-ob-segments input:focus-visible + span { outline: 3px solid #146da1; outline-offset: 3px; }
.sba-ob-wallpapers + p { margin-top: 16px; font-size: 10px; }
.sba-ob-preview-controls { display: grid; align-content: start; gap: 14px; }
.sba-ob-preview-controls > p { margin: 0; }
.sba-ob-preview { position: relative; aspect-ratio: 1.24; width: 100%; border: 1px solid #bccbd7; border-radius: 18px; overflow: hidden; isolation: isolate; background: #acbac7; }
.sba-ob-preview > img { position: absolute; inset: -12px; width: calc(100% + 24px); max-width: none; height: calc(100% + 24px); object-fit: cover; filter: blur(var(--sba-ob-blur, 3px)); z-index: -1; }
.sba-ob-preview[data-movement="gentle"] > img { animation: sba-ob-preview-drift 8s ease-in-out 1 both; }
.sba-ob-preview[data-effects="false"] > img, .sba-onboarding[data-page-hidden="true"] .sba-ob-preview > img { animation: none; }
.sba-ob-preview-chrome { display: grid; gap: 13px; padding: 16px 14px; height: 100%; align-content: start; color: #142b40; font-size: 9px; font-weight: 650; }
.sba-ob-preview-chrome > span { justify-self: start; padding: 4px 7px; border-radius: 6px; background: rgba(255, 255, 255, .93); }
.sba-ob-preview-chrome > div { display: flex; align-items: center; justify-content: flex-start; gap: 8px; padding: 12px; border: 1px solid rgba(255, 255, 255, .94); background: rgba(255, 255, 255, .85); border-radius: 12px; box-shadow: 0 4px 18px rgba(15, 37, 58, .1); }
.sba-ob-preview-chrome > div:last-child { justify-content: center; justify-self: center; gap: 17px; padding: 8px 12px; }
.sba-ob-preview-chrome svg { width: 17px; height: 17px; }
.sba-ob-preview-chrome small { display: block; font-size: 8px; font-weight: 400; }
.sba-ob-preview-label { position: absolute; right: 8px; bottom: 5px; padding: 1px 5px; border-radius: 4px; background: rgba(255, 255, 255, .93); color: #253e56; font-size: 9px; }
.sba-onboarding input[type="range"] { width: 100%; height: 30px; margin: 0; padding: 0; accent-color: #284b68; cursor: pointer; }
.sba-onboarding .sba-ob-segments { display: flex; flex-wrap: wrap; gap: 4px; }
.sba-ob-segments label { flex: 1; position: relative; cursor: pointer; }
.sba-ob-segments label > span { display: grid; place-items: center; min-height: 44px; padding: 9px 12px; border: 1px solid #c2cfda; border-radius: 11px; background: white; color: var(--sba-ob-muted); font-size: 12px; }
.sba-ob-segments input:checked + span { border-color: #294f6e; color: #173852; background: #e6eff5; font-weight: 650; }
.sba-ob-switch { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 44px; font-size: 13px; }
.sba-onboarding .sba-ob-switch input { width: 22px; height: 22px; margin: 0; accent-color: #254e6d; cursor: pointer; }
.sba-ob-settings { display: flex; align-items: center; gap: 18px; padding: 24px; border: 1px solid rgba(255, 255, 255, .94); border-radius: 24px; background: rgba(249, 252, 254, .94); box-shadow: 0 7px 25px rgba(20, 43, 66, .08); }
.sba-ob-settings-icon { display: grid; place-items: center; flex: 0 0 48px; height: 48px; border: 1px solid #dce5ec; border-radius: 15px; background: #edf3f7; }
.sba-ob-settings-copy { flex: 1; min-width: 0; }
.sba-ob-settings h3 { margin: 4px 0 8px; font-size: 19px; line-height: 1.3; color: var(--sba-ob-ink); }
.sba-ob-settings p { margin: 0 0 7px; }
.sba-ob-settings .sba-ob-small { margin: 0; }
@keyframes sba-ob-preview-drift { from { transform: scale(1.015) translateX(-2px); } to { transform: scale(1.025) translateX(2px); } }
@media (hover: hover) {
  .sba-onboarding .sba-ob-button:not(:disabled):hover, .sba-ob-settings .sba-ob-button:not(:disabled):hover { background: #eaf0f5; border-color: #a0b5c7; }
  .sba-onboarding .sba-ob-button.is-primary:not(:disabled):hover { color: white; background: #ac092b; border-color: #ac092b; }
  .sba-onboarding .sba-ob-link:hover { text-decoration: underline; text-underline-offset: 3px; }
}
@media (max-width: 1000px) {
  .sba-ob-layout { grid-template-columns: minmax(200px, .55fr) minmax(0, 1.65fr); }
  .sba-ob-header, .sba-ob-steps { padding-inline: 18px; }
  .sba-ob-scroll { padding: 24px 20px 18px; }
  .sba-ob-footer { padding-inline: 14px; }
  .sba-onboarding .sba-ob-footer .sba-ob-button { padding-inline: 10px; font-size: 12px; }
  .sba-ob-appearance { grid-template-columns: 1fr; }
  .sba-ob-wallpaper-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sba-ob-preview { max-width: 300px; }
}
@media (max-width: 1000px) {
  dialog.sba-onboarding { width: calc(100vw - 20px); height: calc(100vh - 20px); height: calc(100dvh - 20px); border-radius: 24px; }
  .sba-ob-layout { grid-template-columns: 1fr; grid-template-rows: 104px minmax(0, 1fr); }
  .sba-ob-scene > img { object-position: center 42%; }
  .sba-ob-scene::after { background: linear-gradient(90deg, rgba(13, 34, 48, .87), rgba(13, 34, 48, .22)); }
  .sba-ob-brand { padding: 17px 20px; font-size: 15px; }
  .sba-ob-brand img { width: 28px; height: 28px; }
  .sba-ob-scene-copy { inset: 60px auto auto 20px; }
  .sba-ob-scene-copy > span { font-size: 13px; }
  .sba-ob-scene-copy p, .sba-ob-scene-copy small { display: none; }
  .sba-ob-header { padding: 10px 16px 0; }
  .sba-ob-steps { padding: 2px 14px 8px; }
  .sba-onboarding .sba-ob-steps button { min-height: 44px; padding: 8px 0; }
  .sba-ob-steps button > span:nth-child(2) { display: none; }
  .sba-ob-step-later { right: 1px; }
  .sba-ob-scroll { padding: 22px 20px 18px; }
  .sba-onboarding h2 { font-size: 28px; }
  .sba-ob-footer { flex-wrap: wrap; padding: 10px 14px max(10px, env(safe-area-inset-bottom)); }
  .sba-ob-footer > div { flex: 1; justify-content: space-between; }
  .sba-onboarding .sba-ob-footer > .is-primary { flex: 1 0 100%; order: -1; }
  .sba-ob-settings { flex-wrap: wrap; padding: 20px; gap: 14px; }
  .sba-ob-settings-copy { flex-basis: calc(100% - 70px); }
  .sba-ob-settings > button { width: 100%; }
}
@media (max-width: 420px) {
  dialog.sba-onboarding { width: 100%; height: 100vh; height: 100dvh; border-radius: 0; border-width: 0; }
  .sba-ob-layout { grid-template-rows: calc(86px + env(safe-area-inset-top)) minmax(0, 1fr); }
  .sba-ob-brand { padding: calc(12px + env(safe-area-inset-top)) 18px 8px; }
  .sba-ob-scene-copy { top: calc(52px + env(safe-area-inset-top)); left: 18px; }
  .sba-ob-scroll { padding: 20px 18px 16px; }
  .sba-onboarding h2 { font-size: 27px; }
  .sba-onboarding .sba-ob-fields { grid-template-columns: 1fr; }
  .sba-ob-wallpaper-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sba-ob-summary li { padding-inline: 11px; }
  .sba-ob-summary li > span { gap: 7px; font-size: 12px; }
  .sba-ob-facts > div { grid-template-columns: 1fr; gap: 3px; }
}
@media (max-height: 620px) {
  .sba-ob-layout { grid-template-rows: minmax(0, 1fr); }
  .sba-ob-scene { display: none; }
  .sba-ob-layout { grid-template-columns: 1fr; }
  .sba-ob-header { padding-top: max(4px, env(safe-area-inset-top)); }
  .sba-ob-steps { padding-block: 0; }
  .sba-onboarding .sba-ob-steps button { min-height: 44px; }
  .sba-ob-steps button > span:nth-child(2) { display: none; }
  .sba-ob-scroll { padding-top: 14px; }
  .sba-ob-footer { padding-block: 6px max(6px, env(safe-area-inset-bottom)); }
  .sba-onboarding .sba-ob-footer > .is-primary { flex: 0 1 auto; order: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .sba-onboarding *, .sba-ob-settings * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (prefers-reduced-transparency: reduce) {
  dialog.sba-onboarding, .sba-ob-settings, .sba-ob-tile, .sba-ob-footer { background: #f8fafc; }
  .sba-onboarding::backdrop { backdrop-filter: none; }
}
@media (forced-colors: active) {
  dialog.sba-onboarding, .sba-ob-settings, .sba-ob-tile, .sba-ob-notice, .sba-ob-callout { border: 1px solid CanvasText; box-shadow: none; background: Canvas; color: CanvasText; }
  .sba-ob-scene::after { background: Canvas; }
  .sba-ob-brand, .sba-ob-scene-copy { color: CanvasText; }
  .sba-onboarding .sba-ob-steps [aria-current="step"], .sba-ob-wallpaper input:checked + span, .sba-ob-segments input:checked + span { outline: 2px solid Highlight; }
  .sba-ob-preview-chrome > div { background: Canvas; border-color: CanvasText; }
}