.bw {
  --sf-page:#2b3a33;
  --sf-card:#1f232a;
  --sf-raise:#30353f;
  --sf-track:#262a31;
  --sf-fill:#2a2e36;
  --sf-ink:#dfe3e8;
  --sf-ink-3:#939ba4;
  --sf-muted:#8a919c;
  --sf-meta:#737a86;
  --sf-line:#2a2f37;
  --sf-border:#363c46;
  --sf-btn-border:#555b62;
  --sf-btn-border-hover:#939ba4;
  --sf-accent:#4b96f1;
  --sf-solid:#0d6bde;
  --sf-solid-hover:#0c60c8;
  --sf-tint:#1a2a52;
  --sf-tint-line:#2057b1;
  --sf-live:#ff6682;
  --sf-ok:#48ad67;
  --sf-shadow-card:0 0 0 1px #ffffff0a,0 2px 12px #00000059;
  --sf-shadow-card-hover:0 0 0 1px #ffffff14,0 8px 24px #0000008c;
  --sf-shadow-thumb:0 1px 2px #00000080,inset 0 0 0 1px #ffffff0f;
}
.frame.s-board,
.frame.s-move {
  background: #2b3a33;
}
.bw-card {
  background: var(--sf-card);
}
.bw-card .c-btn {
  background: transparent;
}
.bw-card .c-btn:hover,
.bw-card .c-btn:focus-visible {
  background: #262a31;
}
.bw-card .c-t:after {
  color: var(--sf-accent);
}
.bw-toast {
  color: var(--sf-ink-3);
}
.c-st.q {
  background: #3a2e14;
  color: #e3b341;
}
.c-st.r {
  background: #1a2a52;
  color: #a8ccf8;
}
.c-st.d {
  background: #1d2e26;
  color: #6db590;
}
.bw.guided .bw-seg > span {
  color: var(--sf-muted);
}
.bw.guided .bw-seg > span.on {
  background: var(--sf-raise);
  color: var(--sf-ink);
  box-shadow: var(--sf-shadow-thumb);
}
.pick-dialog {
  background: #2b3a33;
  color: #dfe3e8;
  box-shadow: 0 0 0 1px #ffffff0d, 0 24px 70px #000000a6;
}
.send-list {
  background: #1f232a;
  box-shadow: 0 0 0 1px #ffffff0a, 0 2px 12px #00000059;
}
.send-session {
  color: #dfe3e8;
}
.pick-dialog .send-session-row:is(:hover, :focus-within, .sent) {
  background: #1a2a52;
}
.pick-dialog .send-dot:not(.old) {
  background: #48ad67;
}
.pick-dialog::backdrop {
  background: #000000a6;
}
.frame .stage .zc-panel {
  background: #2b3a33;
  color: #dfe3e8;
}
.frame .stage .zc-brand {
  color: #dfe3e8;
}
.frame .stage .zc-meta {
  color: #939ba4;
  border-bottom-color: #2a2f37;
}
.frame .stage .zc-meta b {
  background: #1f232a;
  color: #dfe3e8;
  border-color: #363c46;
}
.frame .stage .zc-meta b:before {
  background: #ff6682;
}
.frame .stage .zc-seg {
  background: #262a31;
}
.frame .stage .zc-seg span {
  color: #939ba4;
}
.frame .stage .zc-seg .zc-on {
  background: #30353f;
  color: #dfe3e8;
}
.frame .stage .zc-col h4 {
  color: #4b96f1;
  border-bottom-color: #2a2f37;
}
.frame .stage .zc-card {
  background: #1f232a;
  color: #dfe3e8;
}
.frame .stage .zc-t {
  color: #dfe3e8;
}
.frame .stage .zc-dots {
  color: #4b96f1;
}
.frame .stage .zc-who {
  color: #939ba4;
}
.frame .stage .zc-id {
  color: #737a86;
}
.bw-card .c-who {
  color: var(--sf-ink-3);
}
.bw-card .c-to {
  color: var(--sf-ink-3);
}
.frame .stage .zc-col {
  border: calc(1.5 * var(--u)) dashed #b9c4bd;
  border-radius: calc(12 * var(--u));
  padding: calc(9 * var(--u));
}
.frame .stage .zc-col h4 {
  border-bottom: 0;
  padding-bottom: 0;
}
.bw-col {
  border: 1.5px dashed #b9c4bd;
  border-radius: 12px;
  padding: 10px;
}
.bw-col h5 {
  border-bottom: 0;
  padding-bottom: 0;
  margin: 2px 2px 10px;
}
.frame .stage .zc-col {
  background: #14161b;
}
.bw-col {
  background: #14161b;
}
.bw {
  --sf-accent:#8fa9c2;
  --sf-solid:#3f5f7a;
  --sf-solid-hover:#4a6c89;
  --sf-tint:#23303c;
  --sf-tint-line:#3f5f7a;
}
.c-st.r {
  background: #23303c;
  color: #b7c9da;
}
.pick-dialog .send-session-row:is(:hover, :focus-within, .sent) {
  background: #23303c;
}
.pick-dialog .send-session-row:has(.send-session:focus-visible) {
  box-shadow: inset 0 0 0 2px #3f5f7a;
}
.ghost .rip {
  border-color: #8fa9c2;
}
.frame .stage .zc-col h4,
.frame .stage .zc-dots {
  color: #8fa9c2;
}
.frame .stage .zc-stage .zc-hot {
  border-color: #3f5f7a;
  background: #3f5f7a;
}
@keyframes zc-c1 {
  0%, 15% {
    opacity: 0;
    transform: scale(.92);
    box-shadow: 0 0 0 0 rgba(63, 95, 122, 0);
  }
  16% {
    opacity: 1;
    transform: scale(1.06);
    box-shadow: 0 0 0 calc(8 * var(--u)) rgba(63, 95, 122, .6);
  }
  19%, 94% {
    opacity: 1;
    transform: none;
    box-shadow: 0 calc(1 * var(--u)) calc(1 * var(--u)) #1d21290a, 0 calc(2 * var(--u)) calc(10 * var(--u)) #1d21290d;
  }
  97%, 100% {
    opacity: 0;
    transform: scale(.92);
  }
}
@keyframes zc-c2 {
  0%, 51% {
    opacity: 0;
    transform: scale(.92);
    box-shadow: 0 0 0 0 rgba(63, 95, 122, 0);
  }
  52% {
    opacity: 1;
    transform: scale(1.06);
    box-shadow: 0 0 0 calc(8 * var(--u)) rgba(63, 95, 122, .6);
  }
  55%, 94% {
    opacity: 1;
    transform: none;
    box-shadow: 0 calc(1 * var(--u)) calc(1 * var(--u)) #1d21290a, 0 calc(2 * var(--u)) calc(10 * var(--u)) #1d21290d;
  }
  97%, 100% {
    opacity: 0;
    transform: scale(.92);
  }
}
@keyframes zc-c3 {
  0%, 75% {
    opacity: 0;
    transform: scale(.92);
    box-shadow: 0 0 0 0 rgba(63, 95, 122, 0);
  }
  76% {
    opacity: 1;
    transform: scale(1.06);
    box-shadow: 0 0 0 calc(8 * var(--u)) rgba(63, 95, 122, .6);
  }
  79%, 94% {
    opacity: 1;
    transform: none;
    box-shadow: 0 calc(1 * var(--u)) calc(1 * var(--u)) #1d21290a, 0 calc(2 * var(--u)) calc(10 * var(--u)) #1d21290d;
  }
  97%, 100% {
    opacity: 0;
    transform: scale(.92);
  }
}