/* css/demo.css */
.bb-demo { margin: 0; position: relative; }
.bb-viewport {
  position: relative; overflow: hidden; border-radius: 14px; background: #fafafa;
  box-shadow: 0 1px 2px rgba(13, 23, 35, .06), 0 18px 50px -12px rgba(13, 23, 35, .22);
  border: 1px solid rgba(13, 23, 35, .08);
  transform: translateZ(0);
}
.bb-stage { position: absolute; left: 0; top: 0; transform-origin: 0 0; will-change: transform; opacity: 0; transition: opacity .35s ease; }
.bb-demo.is-ready .bb-stage { opacity: 1; }

.bb-controls { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 12px; min-height: 34px; }
.bb-toggle {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 11px;
  font: 500 13px/1 'Inconsolata', ui-monospace, monospace; letter-spacing: .02em; text-transform: uppercase;
  color: #0d1723; background: #fff; border: 1px solid rgba(13, 23, 35, .16); border-radius: 999px; cursor: pointer;
}
.bb-toggle svg { width: 13px; height: 13px; }
.bb-toggle:hover { border-color: #319a94; color: #016454; }
.bb-toggle:focus-visible { outline: 3px solid #319a94; outline-offset: 3px; }
.bb-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }


.bb-cursor { position: absolute; left: 0; top: 0; z-index: 60; opacity: 0; pointer-events: none; transition: opacity .25s; }
.bb-cursor.is-on { opacity: 1; }
.bb-cursor svg { display: block; transform: scale(var(--inv, 1)); transform-origin: 4px 2px; filter: drop-shadow(0 2px 3px rgba(0,0,0,.25)); }
.bb-click-ring {
  position: absolute; left: -16px; top: -16px; width: 40px; height: 40px; border-radius: 50%;
  border: 3px solid rgba(49, 154, 148, .9); opacity: 0; transform: scale(calc(.3 * var(--inv, 1)));
}
.bb-cursor.is-click .bb-click-ring { animation: bb-ring .45s ease-out; }
.bb-cursor.is-click svg { animation: bb-press .22s ease-out; }
@keyframes bb-ring { 0% { opacity: .9; transform: scale(calc(.3 * var(--inv, 1))); } 100% { opacity: 0; transform: scale(calc(1.6 * var(--inv, 1))); } }
@keyframes bb-press { 50% { transform: scale(calc(.86 * var(--inv, 1))); } }

.bb-caret { display: inline-block; width: 2px; height: 1.1em; margin-left: 1px; vertical-align: -0.15em; background: currentColor; animation: bb-blink 1s steps(1) infinite; }
@keyframes bb-blink { 50% { opacity: 0; } }
.bb-w { opacity: 0; transition: opacity .28s ease; }
.bb-w.is-on { opacity: 1; }

.is-paused .bb-stage *, .is-paused .bb-stage *::before, .is-paused .bb-stage *::after { animation-play-state: paused !important; }
.bb-instant .bb-stage, .bb-instant .bb-stage *, .bb-instant .bb-stage *::before, .bb-instant .bb-stage *::after { transition: none !important; animation: none !important; }

@media (prefers-reduced-motion: reduce) {
  .bb-stage, .bb-stage * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
.bb-status-desc { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }


.bb-endcap {
  position: absolute; inset: 0; z-index: 40; display: flex; align-items: center; justify-content: center;
  background: rgba(13, 23, 35, .42); opacity: 0; pointer-events: none; transition: opacity .6s ease;
}
.bb-demo.is-ended .bb-endcap { opacity: 1; pointer-events: auto; }
.bb-endcap-btn {
  display: inline-flex; align-items: center; gap: 12px; padding: 16px 28px 16px 22px; border: 0; border-radius: 999px;
  background: #fff; color: #0d1723; font: 700 18px/1 'DM Sans', system-ui, sans-serif; cursor: pointer;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28); transform: scale(.94); transition: transform .35s cubic-bezier(.2,.8,.2,1), background-color .15s;
}
.bb-demo.is-ended .bb-endcap-btn { transform: scale(1); }
.bb-endcap-btn:hover { background: #fff5e1; }
.bb-endcap-btn:focus-visible { outline: 3px solid #fdc005; outline-offset: 4px; }
.bb-endcap-btn svg { width: 24px; height: 24px; color: #016454; }
.bb-toggle[hidden] { display: none; }
/* css/buzz-ui.css */
.bz-screen {
  position: relative; width: 1880px; height: 1044px; overflow: hidden;
  font-family: Roboto, Roboto, Arial, sans-serif; color: #212121; background: #fafafa;
  -webkit-font-smoothing: antialiased;
}
.bz-screen *, .bz-screen *::before, .bz-screen *::after { box-sizing: border-box; }
.bz-screen svg { display: block; }
.bz-screen :is(h1, h2, h3, h4, p, button, input) { font-family: inherit; letter-spacing: normal; }
.bz-ico { width: 30px; height: 30px; fill: #1b1b1b; }


.bz-top { position: absolute; left: 0; top: 0; right: 0; height: 70px; background: #3d9d85; z-index: 5; }
.bz-top .bz-back { position: absolute; left: 24px; top: 21px; width: 30px; height: 30px; }
.bz-top .bz-logo { position: absolute; left: 72px; top: 8px; width: 54px; height: 54px; border-radius: 50%; }
.bz-top .bz-title { position: absolute; left: 134px; top: 5px; font-size: 23px; line-height: 26px; color: #101010; white-space: nowrap; }
.bz-top .bz-crumbs { position: absolute; left: 140px; top: 36px; display: flex; align-items: center; gap: 12px; font-size: 18px; line-height: 24px; color: #101010; white-space: nowrap; }
.bz-crumbs .bz-ico { width: 26px; height: 26px; }
.bz-crumbs .bz-crumb-text { margin-left: 12px; }
.bz-top .bz-tools { position: absolute; top: 5px; right: 0; height: 60px; }
.bz-tool { position: absolute; top: 0; width: 60px; height: 60px; margin-left: -30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.bz-tool .bz-ico { width: 28px; height: 28px; }
.bz-tool.is-sparkle { transition: background-color .18s ease; }
.bz-tool.is-sparkle.is-active { background: #fdc005; }
.bz-tooltip {
  position: absolute; top: 74px; left: 50%; transform: translate(-50%, -4px); white-space: nowrap;
  background: #616161; color: #fff; font-size: 14px; line-height: 20px; padding: 4px 9px; border-radius: 4px;
  opacity: 0; transition: opacity .15s ease, transform .15s ease; pointer-events: none;
}
.bz-tooltip.is-on { opacity: .95; transform: translate(-50%, 0); }
.bz-user { position: absolute; top: 9px; left: 1686px; font-size: 19.5px; line-height: 21px; color: #101010; }
.bz-avatar { position: absolute; top: 5px; left: 1775px; width: 60px; height: 60px; border-radius: 50%; object-fit: cover; }
.bz-avatar-caret { position: absolute; left: 1825px; top: 56px; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #101010; }


.bz-jump { position: absolute; left: 0; right: 0; top: 70px; height: 61px; background: #f9f9f9; box-shadow: 0 1px 2px rgba(0,0,0,.18); z-index: 4; }
.bz-jump .bz-jump-label { position: absolute; left: 10px; top: 19px; font-size: 17px; line-height: 22px; color: #1b1b1b; }
.bz-btn-out { position: absolute; top: 8px; height: 45px; display: flex; align-items: center; gap: 9px; padding: 0 18px 0 19px; border: 1px solid #d9d9d9; border-radius: 4px; background: #f9f9f9; font-size: 17px; font-weight: 500; color: #1b1b1b; white-space: nowrap; }
.bz-btn-out .bz-ico { width: 23px; height: 23px; }


.bz-body { position: absolute; left: 0; top: 131px; bottom: 0; right: 0; display: flex; }
.bz-content {
  position: relative; flex: 1 1 auto; min-width: 0; overflow: hidden;
  background: #2c3a22 url('https://cdn.prod.website-files.com/63e3df066454cf5d1a3762bf/6ad19054ba06678b8b5b33d2_busybee-forest-closed.webp') left top / 1880px 913px no-repeat;
}

.bz-content::before {
  content: ''; position: absolute; inset: 0; opacity: 0; transition: opacity .3s ease;
  background: url('https://cdn.prod.website-files.com/63e3df066454cf5d1a3762bf/6ad19054ac198c0c68c315d8_busybee-forest-bg.webp') left top / 1365px 913px no-repeat;
}
.bz-body.is-panel-open .bz-content::before { opacity: 1; }
.bz-scrolltrack { position: absolute; top: 0; right: 0; bottom: 0; width: 15px; background: #f1f1f1; border-left: 1px solid #e6e6e6; }
.bz-scrolltrack::after { content: ''; position: absolute; left: 3px; right: 3px; top: 4px; height: 210px; border-radius: 8px; background: #c1c1c1; }
.bz-article {
  position: absolute; top: 24px; bottom: -400px; left: calc(50% - 8px); width: 1125px; margin-left: -562px;
  background: #fff; padding: 21px 20px 40px; color: #222;
  font-family: 'Open Sans', Arial, sans-serif;
}
.bz-article .bz-task { font: 700 17px/22px Arial, Helvetica, sans-serif; color: #222; margin: 0 0 21px; }
.bz-article p { font-size: 20.4px; line-height: 27px; margin: 0 0 22px; }
.bz-article h2 { font-size: 36px; line-height: 42px; font-weight: 400; margin: 18px 0 25px; color: #1d1d1d; }
.bz-article .bz-link { color: #d4a52b; }


.bz-panel {
  position: relative; flex: 0 0 auto; width: 0; overflow: hidden; background: #fdfdfd;
  transition: width .3s cubic-bezier(.3,.7,.3,1);
}
.bz-panel.is-open { width: 500px; }
.bz-panel-inner { position: absolute; left: 0; top: 0; width: 500px; height: 100%; box-shadow: inset 7px 0 6px -6px rgba(0,0,0,.18); }
.bz-panel-head { position: absolute; left: 15px; right: 15px; top: 0; height: 72px; padding-top: 10px; border-bottom: 1px solid #e4e4e4; display: flex; align-items: center; }
.bz-panel-head .bz-spark-outline { width: 26px; height: 26px; margin: 2px 13px 0 11px; }
.bz-panel-head .bz-panel-title { font-size: 25px; font-weight: 500; line-height: 30px; color: #212121; }
.bz-panel-head .bz-close { width: 28px; height: 28px; margin-left: auto; margin-right: 14px; }
.bz-panel-head .bz-panel-back { width: 28px; height: 28px; margin: 0 22px 0 18px; }
.bz-hello { position: absolute; left: 26px; top: 105px; font-size: 27px; line-height: 34px; font-weight: 700; font-style: italic; color: #1b1b1b; }
.bz-hello-sub { position: absolute; left: 26px; top: 148px; font-size: 18px; line-height: 24px; color: #616161; }
.bz-toolcard {
  position: absolute; left: 18px; width: 464px; height: 98px; border-radius: 18px; background: #f9f9f9;
  display: flex; align-items: center; transition: background-color .15s ease;
}
.bz-toolcard.is-hover { background: #f1f1f1; }
.bz-toolcard .bz-ring { width: 64px; height: 64px; margin-left: 21px; border-radius: 50%; border: 2px solid currentColor; display: flex; align-items: center; justify-content: center; flex: none; }
.bz-toolcard .bz-ring svg { width: 34px; height: 34px; }
.bz-toolcard .bz-tc-text { margin-left: 17px; }
.bz-toolcard .bz-tc-title { font-size: 18px; line-height: 22px; font-weight: 500; color: #1b1b1b; }
.bz-toolcard .bz-tc-sub { font-size: 14.5px; line-height: 19px; color: #616161; margin-top: 1px; }
.bz-toolcard .bz-chev { width: 26px; height: 26px; margin-left: auto; margin-right: 18px; fill: #424242; }
.bz-c-help { color: #13877e; }
.bz-c-check { color: #7568c8; }
.bz-c-review { color: #c26a24; }
.bz-c-family { color: #3d8b49; }
/* css/demos/chats.css */
.bb-demo--chats .ch-screen {
  position: relative; width: 2000px; height: 1122px; overflow: hidden; background: #eeeeee;
  font-family: Roboto, Roboto, Arial, sans-serif; color: #212121; -webkit-font-smoothing: antialiased;
}
.bb-demo--chats .ch-screen *, .bb-demo--chats .ch-screen *::before, .bb-demo--chats .ch-screen *::after { box-sizing: border-box; }
.bb-demo--chats .ch-screen svg { display: block; }
.bb-demo--chats .ch-screen p { margin: 0; }


.bb-demo--chats .ch-layer { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility 0s linear .3s; }
.bb-demo--chats .ch-layer.is-on { opacity: 1; visibility: visible; transition: opacity .3s ease; }
.bb-demo--chats .ch-picker { background: #eeeeee; z-index: 1; }
.bb-demo--chats .ch-editor { background: #eeeeee; z-index: 2; }
.bb-demo--chats .ch-student { background: #fff; z-index: 3; }


.bb-demo--chats .ch-x { position: absolute; left: 23px; top: 18px; width: 30px; height: 30px; fill: #212121; }
.bb-demo--chats .ch-btn {
  position: absolute; height: 42px; min-width: 77px; padding: 0 18px; border: 1px solid #e2e2e2; border-radius: 4px;
  background: #fff; font-size: 16.8px; font-weight: 500; line-height: 40px; color: #212121; text-align: center; white-space: nowrap;
  transition: background-color .15s ease;
}
.bb-demo--chats .ch-btn.is-hover { background: #f2f2f2; }
.bb-demo--chats .ch-btn--blue { background: #1877d0; border-color: #1877d0; color: #fff; box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12); }
.bb-demo--chats .ch-btn--blue.is-hover { background: #1462b4; border-color: #1462b4; }
.bb-demo--chats .ch-ring {
  position: absolute; width: 57px; height: 57px; border-radius: 50%; border: 1.5px solid #8db3a3;
  display: flex; align-items: center; justify-content: center; color: #4f8f76; --bot-fill: #e0f4e9;
}
.bb-demo--chats .ch-ring svg { width: 31px; height: 25px; }


.bb-demo--chats .ch-dlg-top {
  position: absolute; left: 0; right: 0; top: 0; height: 67px; background: #fff; z-index: 2;
  box-shadow: 0 2px 5px -1px rgba(0,0,0,.24), 0 5px 7px 0 rgba(0,0,0,.12), 0 1px 12px 0 rgba(0,0,0,.1);
}
.bb-demo--chats .ch-dlg-title { position: absolute; left: 67px; top: 18px; font-size: 24px; font-weight: 500; line-height: 30px; white-space: nowrap; }

.bb-demo--chats .ch-search { position: absolute; left: 19px; top: 92px; width: 1797px; height: 67px; border: 1px solid #a2a2a2; border-radius: 5px; }
.bb-demo--chats .ch-search-label { position: absolute; left: 13px; top: -10px; padding: 0 5px; background: #eeeeee; font-size: 13.4px; line-height: 18px; color: #3a3a3a; }
.bb-demo--chats .ch-search-ico { position: absolute; left: 13px; top: 18px; width: 29px; height: 29px; fill: #212121; }

.bb-demo--chats .ch-views { position: absolute; left: 1828px; top: 105px; width: 153px; height: 37px; border-radius: 5px; border: 1px solid #e0e0e0; background: #fff; overflow: hidden; display: flex; }
.bb-demo--chats .ch-view { display: flex; align-items: center; justify-content: center; height: 100%; flex: 0 0 58px; }
.bb-demo--chats .ch-view.is-on { flex-basis: 94px; background: #d4d4d4; gap: 13px; padding-left: 2px; }
.bb-demo--chats .ch-view svg { width: 26px; height: 26px; fill: #1b1b1b; }
.bb-demo--chats .ch-view .ch-view-check { width: 25px; height: 25px; }

.bb-demo--chats .ch-chips { position: absolute; left: 19px; top: 184px; display: flex; gap: 10.5px; }
.bb-demo--chats .ch-chip { display: flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 18px; background: #d4d4d4; font-size: 16.8px; line-height: 36px; white-space: nowrap; }
.bb-demo--chats .ch-chip.is-on { background: #ffc004; padding-left: 11px; }
.bb-demo--chats .ch-chip svg { width: 26px; height: 26px; margin-right: 10px; fill: #212121; }

.bb-demo--chats .ch-starred { position: absolute; left: 1879px; top: 190px; display: flex; align-items: center; font-size: 16.8px; line-height: 24px; color: #212121; }
.bb-demo--chats .ch-switch { position: relative; width: 37px; height: 17px; margin-left: 6px; margin-right: 5px; border-radius: 9px; background: #d2d2d2; }
.bb-demo--chats .ch-knob { position: absolute; left: -6px; top: -3.5px; width: 24px; height: 24px; border-radius: 50%; background: #9a9a9a; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.bb-demo--chats .ch-knob::after { content: ''; position: absolute; left: 6px; top: 11px; width: 12px; height: 2px; background: #fff; }


.bb-demo--chats .ch-grid-wrap { position: absolute; left: 0; top: 245px; width: 2000px; height: 857px; overflow: hidden; }
.bb-demo--chats .ch-spinner {
  position: absolute; left: 964px; top: 220px; width: 44px; height: 44px; border-radius: 50%;
  border: 4px solid #1976d2; border-color: #1976d2 #1976d2 transparent transparent; animation: ch-spin .8s linear infinite;
  transition: opacity .2s ease;
}
.bb-demo--chats .ch-spinner.is-off { display: none; }
@keyframes ch-spin { to { transform: rotate(360deg); } }
.bb-demo--chats .ch-card {
  position: absolute; width: 473px; height: 323px; background: #fff; border-radius: 4px;
  box-shadow: 0 2px 1px -1px rgba(0,0,0,.18), 0 1px 1px 0 rgba(0,0,0,.12), 0 1px 3px 0 rgba(0,0,0,.1);
  opacity: 0; transform: translateY(22px) scale(.985);
  transition: opacity .35s ease, transform .5s cubic-bezier(.2,.75,.3,1);
  transition-delay: calc(var(--i) * 70ms);
}
.bb-demo--chats .ch-grid.is-on .ch-card { opacity: 1; transform: none; }
.bb-demo--chats .ch-card .ch-ring { left: 28px; top: 27px; }
.bb-demo--chats .ch-card-title { position: absolute; left: 103px; top: 27px; font-size: 24px; font-weight: 500; line-height: 30px; white-space: nowrap; }
.bb-demo--chats .ch-star { position: absolute; left: 421px; top: 25px; width: 26px; height: 26px; fill: #212121; }
.bb-demo--chats .ch-tag { position: absolute; left: 22px; top: 108px; height: 37px; padding: 0 13.5px; border-radius: 19px; background: #e0e0e0; font-size: 16.8px; line-height: 37px; }
.bb-demo--chats .ch-desc { position: absolute; left: 21px; top: 150px; width: 431px; font-size: 16.8px; line-height: 24px; }
.bb-demo--chats .ch-card .ch-learn { left: 19px; top: 261px; }
.bb-demo--chats .ch-card .ch-add { right: 20px; top: 261px; }
.bb-demo--chats .ch-grid-scroll { position: absolute; left: 1966px; top: 0; width: 14px; height: 857px; background: #fafafa; }
.bb-demo--chats .ch-grid-scroll::after { content: ''; position: absolute; left: 4px; top: 3px; width: 8px; height: 722px; border-radius: 4px; background: #c6c6c6; }


.bb-demo--chats .ch-scrim { position: absolute; inset: 0; z-index: 5; background: rgba(0,0,0,.32); opacity: 0; transition: opacity .25s ease; }
.bb-demo--chats .ch-scrim.is-on { opacity: 1; }
.bb-demo--chats .ch-modal {
  position: absolute; left: 642px; top: 336px; width: 717px; height: 450px; z-index: 6; background: #fff; border-radius: 4px;
  box-shadow: 0 11px 15px -7px rgba(0,0,0,.2), 0 24px 38px 3px rgba(0,0,0,.14), 0 9px 46px 8px rgba(0,0,0,.12);
  opacity: 0; transform: scale(.94); transition: opacity .25s ease, transform .3s cubic-bezier(.2,.75,.3,1);
}
.bb-demo--chats .ch-modal.is-on { opacity: 1; transform: none; }
.bb-demo--chats .ch-modal .ch-ring { left: 27px; top: 23px; }
.bb-demo--chats .ch-modal-title { position: absolute; left: 95px; top: 37px; font-size: 24px; font-weight: 500; line-height: 30px; }
.bb-demo--chats .ch-modal p { position: absolute; left: 27px; width: 664px; font-size: 18px; line-height: 28.8px; }
.bb-demo--chats .ch-modal p:nth-of-type(1) { top: 90px; }
.bb-demo--chats .ch-modal p:nth-of-type(2) { top: 276px; }
.bb-demo--chats .ch-modal-sub { position: absolute; left: 27px; top: 228px; font-size: 20.9px; font-weight: 500; line-height: 26px; }
.bb-demo--chats .ch-modal .ch-close { left: 541px; top: 397px; height: 43px; line-height: 41px; }
.bb-demo--chats .ch-modal .ch-modal-add { left: 631px; top: 397px; height: 43px; line-height: 41px; min-width: 76px; }


.bb-demo--chats .ch-ed-top { position: absolute; left: 0; right: 0; top: 0; height: 67px; background: #fff; z-index: 3; }
.bb-demo--chats .ch-ed-top .ch-btn { top: 12px; height: 44px; line-height: 42px; }
.bb-demo--chats .ch-ed-groups { left: 1653px; width: 145px; display: flex; align-items: center; padding-left: 12px; }
.bb-demo--chats .ch-ed-groups svg { width: 24px; height: 24px; margin-right: 13px; fill: #212121; }
.bb-demo--chats .ch-ed-preview { left: 1808px; width: 96px; }
.bb-demo--chats .ch-ed-save { left: 1914px; width: 77px; }
.bb-demo--chats .ch-tabs { position: absolute; left: 0; right: 0; top: 67px; height: 44px; display: flex; border-bottom: 1px solid #d6d6d6; background: #eeeeee; z-index: 3; }
.bb-demo--chats .ch-tab { position: relative; padding: 0 29px; font-size: 16.8px; font-weight: 500; line-height: 42px; color: #5f5f5f; }
.bb-demo--chats .ch-tab.is-on { color: #b4530d; }
.bb-demo--chats .ch-tab.is-on::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2.4px; background: #b4570f; }

.bb-demo--chats .ch-ed-scroll { position: absolute; left: 0; right: 0; top: 111px; bottom: 0; overflow: hidden; }
.bb-demo--chats .ch-ed-inner { position: relative; height: 2473px; }
.bb-demo--chats .ch-ed-track { position: absolute; right: 2px; top: 111px; bottom: 0; width: 14px; background: #f3f3f3; border-left: 1px solid #e6e6e6; }
.bb-demo--chats .ch-ed-thumb { position: absolute; left: 3px; top: 2px; width: 8px; height: 413px; border-radius: 4px; background: #c1c1c1; }
.bb-demo--chats .ch-ed-card {
  position: absolute; left: 479px; width: 1028px; background: #fff; border-radius: 4px;
  box-shadow: 0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
}
.bb-demo--chats .ch-ed-bot { position: absolute; left: 48px; top: 61px; width: 119px; height: 95px; color: #2f6d5f; }
.bb-demo--chats .ch-badge {
  position: absolute; left: 163px; top: 155px; width: 46px; height: 46px; border-radius: 50%; background: #fdbe08;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12);
}
.bb-demo--chats .ch-badge svg { width: 30px; height: 30px; fill: #111; }
.bb-demo--chats .ch-ed-h { position: absolute; left: 18px; margin-top: -15px; font-size: 24px; font-weight: 500; line-height: 30px; }
.bb-demo--chats .ch-ed-sub { position: absolute; left: 18px; margin-top: -12px; font-size: 16.8px; font-weight: 500; line-height: 24px; color: #6f6f6f; white-space: nowrap; }
.bb-demo--chats .ch-ed-btn { left: 28px; height: 42px; }
.bb-demo--chats .ch-rule { position: absolute; left: 18px; width: 989px; height: 1px; background: #e2e2e2; }


.bb-demo--chats .ch-rte { position: absolute; left: 18px; top: 75px; width: 989px; height: 338px; border: 1px solid #dcdcdc; border-radius: 10px; }
.bb-demo--chats .ch-tb, .bb-demo--chats .ch-tb-ico { position: absolute; transform: translate(-50%, -50%); color: #222; fill: #222; }
.bb-demo--chats .ch-tb { font-size: 20px; line-height: 24px; white-space: nowrap; }
.bb-demo--chats .ch-tb b { font-weight: 500; }
.bb-demo--chats .ch-tb-i { font-family: Georgia, serif; font-size: 21px; }
.bb-demo--chats .ch-tb sub, .bb-demo--chats .ch-tb sup { font-size: 12px; font-weight: 700; }
.bb-demo--chats .ch-tb-text { transform: translateY(-50%); font-size: 16.8px; }
.bb-demo--chats .ch-tb-aa { font-size: 20px; letter-spacing: -1px; }
.bb-demo--chats .ch-tb-aa small { font-size: 15px; }
.bb-demo--chats .ch-tb-small { font-size: 16px; }
.bb-demo--chats .ch-tb-ico { width: 24px; height: 24px; }
.bb-demo--chats .ch-tb-ico.is-off { fill: #cfcfcf; }
.bb-demo--chats .ch-tb-ico.ch-flip { transform: translate(-50%, -50%) scaleX(-1); }
.bb-demo--chats .ch-tb-drop { position: absolute; width: 20px; height: 20px; fill: #222; }
.bb-demo--chats .ch-tb-hr { position: absolute; width: 18px; height: 2px; margin: -1px 0 0 -9px; background: #222; }
.bb-demo--chats .ch-rte-rule { position: absolute; left: 13px; right: 13px; top: 117px; height: 1px; background: #ececec; }


.bb-demo--chats .ch-field { position: absolute; left: 18px; width: 990px; height: 66px; border: 1px solid #c4c4c4; border-radius: 5px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; }
.bb-demo--chats .ch-label {
  position: absolute; left: 13px; top: 21px; padding: 0 4px; font-size: 18px; line-height: 22px; color: #474747; white-space: nowrap;
  transform-origin: 0 50%; transition: transform .2s cubic-bezier(0,0,.2,1), background-color 0s;
}
.bb-demo--chats .ch-value { position: absolute; left: 17px; top: 21px; font-size: 18px; line-height: 22px; color: #212121; white-space: nowrap; }
.bb-demo--chats .ch-field.is-focus, .bb-demo--chats .ch-field.is-open { border-color: #b05000; box-shadow: inset 0 0 0 1px #b05000; }
.bb-demo--chats .ch-field.is-focus .ch-label, .bb-demo--chats .ch-field.is-filled .ch-label { transform: translate(1px, -33px) scale(.75); background: #fff; }
.bb-demo--chats .ch-value .bb-caret { background: #b35100; width: 1.5px; }
.bb-demo--chats .ch-caret { position: absolute; right: 11px; top: 50%; width: 28px; height: 28px; margin-top: -14px; fill: #757575; transition: transform .2s ease; }
.bb-demo--chats .ch-field.is-open .ch-caret { transform: rotate(180deg); fill: #b35100; }
.bb-demo--chats .ch-area { height: 237px; }
.bb-demo--chats .ch-grip { position: absolute; right: 13px; bottom: 13px; width: 9px; height: 9px; background: linear-gradient(135deg, transparent 45%, #9a9a9a 45%, #9a9a9a 55%, transparent 55%, transparent 75%, #9a9a9a 75%, #9a9a9a 85%, transparent 85%); }
.bb-demo--chats .ch-check { position: absolute; left: 30px; display: flex; align-items: center; font-size: 16.8px; line-height: 21px; }
.bb-demo--chats .ch-box { width: 21px; height: 21px; margin-right: 20px; border: 2px solid #6e6e6e; border-radius: 3px; }


.bb-demo--chats .ch-menu {
  position: absolute; left: 18px; width: 990px; height: 362px; padding-top: 16px; z-index: 5; background: #fff; border-radius: 4px; overflow: hidden;
  box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);
  opacity: 0; transform: scale(.75, .56); transform-origin: 50% 0; visibility: hidden;
  transition: opacity .2s ease, transform .25s cubic-bezier(.2,.75,.3,1), visibility 0s linear .25s;
}
.bb-demo--chats .ch-menu.is-on { opacity: 1; transform: none; visibility: visible; transition: opacity .2s ease, transform .25s cubic-bezier(.2,.75,.3,1); }
.bb-demo--chats .ch-opt { position: relative; width: calc(100% - 14px); height: 57.4px; padding-left: 18px; font-size: 18px; line-height: 57.4px; transition: background-color .12s ease; }
.bb-demo--chats .ch-opt.is-hover { background: #f2f2f2; }
.bb-demo--chats .ch-opt.is-sel { background: #e0e0e0; }
.bb-demo--chats .ch-opt svg { position: absolute; right: 14px; top: 50%; width: 29px; height: 29px; margin-top: -14.5px; fill: #b35100; opacity: 0; }
.bb-demo--chats .ch-opt.is-sel svg { opacity: 1; }
.bb-demo--chats .ch-menu-scroll { position: absolute; right: 3px; top: 210px; width: 8px; height: 97px; border-radius: 4px; background: #c1c1c1; }


.bb-demo--chats .ch-st-top .bz-logo { object-fit: cover; }
.bb-demo--chats .ch-st-top .bz-crumbs { gap: 14px; }
.bb-demo--chats .ch-st-top .bz-crumb-text { margin-left: 3px; }
.bb-demo--chats .ch-st-user { left: 1806px; }
.bb-demo--chats .ch-st-avatar { left: 1895px; }
.bb-demo--chats .ch-st-caret { left: 1945px; }
.bb-demo--chats .ch-st-desc { position: absolute; left: 16px; top: 84px; font-size: 16.8px; line-height: 22px; white-space: nowrap; }
.bb-demo--chats .ch-st-rule { position: absolute; left: 16px; right: 0; top: 126px; height: 1px; background: #e0e0e0; }
.bb-demo--chats .ch-st-h { position: absolute; left: 16px; top: 169px; font-size: 16.8px; font-weight: 700; line-height: 22px; }
.bb-demo--chats .ch-st-char {
  position: absolute; left: 0; right: 0; height: 64px; padding-left: 35px; display: flex; align-items: center;
  font-size: 17.8px; line-height: 22px; transition: background-color .15s ease;
}
.bb-demo--chats .ch-st-char img { width: 48px; height: 48px; border-radius: 50%; margin-right: 20px; flex: none; }
.bb-demo--chats .ch-st-char.is-hover { background: rgba(0,0,0,.045); }
/* css/demos/check-understanding.css */
.cmu-panel { background: #fff; }


.cmu-head { position: absolute; left: 0; top: 0; width: 500px; height: 73px; }
.cmu-head::after { content: ''; position: absolute; left: 14px; top: 72px; width: 474px; height: 1px; background: #e4e4e4; }
.cmu-head-ico { position: absolute; left: 0; top: 0; width: 500px; height: 72px; }
.cmu-head-title { position: absolute; left: 74px; top: 26px; font-size: 25px; line-height: 30px; font-weight: 500; color: #212121; white-space: nowrap; }


.cmu-scroll { position: absolute; left: 0; top: 73px; width: 500px; bottom: 0; overflow: hidden; }
.cmu-scroll-inner { position: relative; }
.cmu-track { position: absolute; left: 473px; top: 84px; width: 15px; bottom: 0; background: #fafafa; border-left: 1px solid #ececec; display: none; }
.cmu-panel.is-scrolling .cmu-track { display: block; }
.cmu-thumb { position: absolute; left: 3px; top: 2px; width: 7px; height: 200px; border-radius: 4px; background: #c1c1c1; }


.cmu-q { display: none; padding: 21.35px 12px 48px 14px; font-size: 17.5px; line-height: 25px; color: #212121; }
.cmu-q.is-current { display: block; }
.cmu-q.is-checked { padding-top: 33.35px; }
.cmu-q.is-tall { padding-right: 27px; }
.cmu-q p { margin: 0; }

.cmu-qhead { display: flex; align-items: flex-start; }
.cmu-qmark { display: none; flex: none; width: 30px; height: 25px; }
.cmu-qmark svg { width: 30px; height: 25px; }
.cmu-q.is-checked .cmu-qmark { display: block; }
.cmu-qtext { flex: 1 1 auto; min-width: 0; }


.cmu-opts { display: grid; grid-template-columns: auto auto minmax(0, 1fr); grid-auto-rows: minmax(31px, auto); row-gap: 27px; margin-top: 20px; }
.cmu-q[data-type="checkbox"] .cmu-opts { margin-top: 21px; }
.cmu-opt { display: contents; }
.cmu-lbl { grid-column: 1; display: none; text-align: right; font-size: 15px; line-height: 25px; white-space: nowrap; }
.cmu-q.is-checked .cmu-lbl { display: block; }
.cmu-ctl { grid-column: 2; position: relative; flex: none; margin: 1.65px 12px 0 14px; width: 24px; height: 24px; border: 2px solid #757575; border-radius: 50%; background: #fff; }
.cmu-txt { grid-column: 3; min-width: 0; }


.cmu-ctl::after { content: ''; position: absolute; left: 4px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: transparent; }
.cmu-opt.is-selected .cmu-ctl { border-color: #d45c01; }
.cmu-opt.is-selected .cmu-ctl::after { background: #d45c01; }


.cmu-q[data-type="checkbox"] .cmu-ctl { width: 23px; height: 23px; margin-right: 23px; border-color: #808080; border-radius: 2px; }
.cmu-q[data-type="checkbox"] .cmu-ctl::after { display: none; }
.cmu-q[data-type="checkbox"] .cmu-ctl svg { position: absolute; left: -2px; top: -2px; width: 23px; height: 23px; opacity: 0; }
.cmu-q[data-type="checkbox"] .cmu-opt.is-selected .cmu-ctl { background: #ffc106; border-color: #ffc106; }
.cmu-q[data-type="checkbox"] .cmu-opt.is-selected .cmu-ctl svg { opacity: 1; }


.cmu-q.is-checked .cmu-ctl { margin-left: 17px; border-color: #ababab; }
.cmu-q.is-checked .cmu-opt.is-selected .cmu-ctl::after { background: #ababab; }
.cmu-q.is-checked[data-type="checkbox"] .cmu-ctl { margin-left: 16px; margin-right: 24px; }
.cmu-q.is-checked[data-type="checkbox"] .cmu-opt.is-selected .cmu-ctl { background: #ababab; border-color: #ababab; }
.cmu-q.is-checked[data-type="checkbox"] .cmu-opt.is-selected .cmu-ctl svg path { stroke: #fff; }

.cmu-l { display: inline-flex; align-items: baseline; gap: 6px; }
.cmu-l svg { flex: none; overflow: visible; }
.cmu-l-ok { color: #026602; }
.cmu-l-no { color: #b21501; }
.cmu-l-no { gap: 6.5px; }
.cmu-l-no svg { position: relative; top: 1px; }
.cmu-l-miss { position: relative; top: -7px; color: #b21501; align-items: center; line-height: 15px; text-align: left; }
.cmu-l-miss svg { margin-top: 2px; }

.cmu-fb, .cmu-expl { display: none; background: #dff0ff; color: #1e2225; border-radius: 14px; }
.cmu-fb { margin: 7.65px 0 -7.65px !important; padding: 12.35px 13px 12.65px; }
.cmu-q.is-checked .cmu-opt.is-selected .cmu-fb { display: block; }
.cmu-expl { margin: 19.65px 0 0 !important; padding: 12.35px 12px 12.65px; }
.cmu-q.is-checked .cmu-expl { display: block; }

.cmu-actions { display: flex; justify-content: flex-end; padding-right: 1px; margin-top: 18.65px; }
.cmu-q[data-type="checkbox"] .cmu-actions { margin-top: 17.65px; }
.cmu-q.is-checked .cmu-actions { margin-top: 11px; }
.cmu-btn { display: inline-flex; align-items: center; height: 44px; padding: 0 18px 0 19px; border: 1px solid #e4e4e4; border-radius: 4px; background: #fff; font-weight: 500; white-space: nowrap; transition: background-color .15s ease; }
.cmu-another, .cmu-q.is-checked .cmu-check { display: none; }
.cmu-q.is-checked .cmu-another { display: inline-flex; }
.cmu-btn.is-hover { background: #f5f5f5; }
/* css/demos/get-help.css */
.bb-demo--get-help .gh-view {
  position: absolute; inset: 0; opacity: 0; visibility: hidden;
  transition: opacity .22s ease, visibility 0s linear .22s;
}
.bb-demo--get-help .gh-view.is-on { opacity: 1; visibility: visible; transition: opacity .22s ease; }
.bb-demo--get-help .gh-chat { background: #fff; color: #212121; }



.bb-demo--get-help .gh-head { height: 73px; padding-top: 11px; }
.bb-demo--get-help .gh-head .bz-ico { fill: #252525; }
.bb-demo--get-help .gh-head .bz-panel-back { width: 28px; height: 28px; margin: 0 0 0 14px; flex: none; }
.bb-demo--get-help .gh-head .bz-panel-title { margin-left: 17px; color: #252525; }
.bb-demo--get-help .gh-head .bz-close { width: 28px; height: 28px; margin-right: 14px; }


.bb-demo--get-help .gh-scroll { position: absolute; left: 14px; top: 98px; width: 474px; height: 682px; overflow: hidden; }
.bb-demo--get-help .gh-thread { display: flow-root; padding: 0 13px 0 0; } 

.bb-demo--get-help .gh-scroll.is-overflow .gh-thread { padding-right: 28px; }
.bb-demo--get-help .gh-sbar { position: absolute; top: 0; right: 0; width: 15px; height: 100%; background: #fafafa; border-left: 1px solid #e8e8e8; border-right: 1px solid #ededed; opacity: 0; }
.bb-demo--get-help .gh-scroll.is-overflow .gh-sbar { opacity: 1; }
.bb-demo--get-help .gh-thumb { position: absolute; left: 2px; top: 0; width: 8px; height: 40px; border-radius: 4px; background: #c1c1c1; }


.bb-demo--get-help .gh-time { margin: 0 0 2px; font-size: 14px; line-height: 20px; color: #9b9b9b; text-align: center; letter-spacing: -.22px; }
.bb-demo--get-help .gh-msg { display: flex; align-items: flex-start; margin: 0 0 13px; }
.bb-demo--get-help .gh-ava { position: relative; flex: 0 0 60px; height: 50px; }
.bb-demo--get-help .gh-ava img { position: absolute; display: block; }
.bb-demo--get-help .gh-bee .gh-ava img { left: 4px; top: -1px; width: 52px; height: 48px; }
.bb-demo--get-help .gh-leo .gh-ava img { left: 5px; top: 0; width: 50px; height: 50px; }
.bb-demo--get-help .gh-bubble {
  flex: 1 1 auto; min-width: 0; padding: 16px 17px 19px; border-radius: 5px 26px 26px 26px;
  background: #ededed; font-size: 18px; line-height: 25px; color: #212121; letter-spacing: -.21px;
}
.bb-demo--get-help .gh-leo .gh-bubble { flex: 0 1 auto; padding: 18px 16px 17px 17px; background: #dff0ff; }
.bb-demo--get-help .gh-bubble p { margin: 0; letter-spacing: inherit; }
.bb-demo--get-help .gh-bubble p + p { margin-top: 17.5px; }
.bb-demo--get-help .gh-bubble b { font-weight: 700; }


.bb-demo--get-help [data-turn]:not(.is-on) { display: none; }


.bb-demo--get-help .gh-bubble .bb-w { display: none; opacity: 1; transition: none; }
.bb-demo--get-help .gh-bubble .bb-w.is-on { display: inline; animation: gh-word .28s ease both; }
.bb-demo--get-help .gh-bubble p:has(.bb-w):not(:has(.bb-w.is-on)) { display: none; }
@keyframes gh-word { from { opacity: 0; } }


.bb-demo--get-help .gh-composer { position: absolute; left: 14px; top: 793px; width: 414px; height: 60px; border-radius: 30px; background: #dff0ff; }
.bb-demo--get-help .gh-ph,
.bb-demo--get-help .gh-field { position: absolute; left: 24px; top: 15px; height: 26px; font-size: 18px; line-height: 26px; white-space: nowrap; letter-spacing: -.21px; }
.bb-demo--get-help .gh-ph { color: #757575; }

.bb-demo--get-help .gh-field { width: 340px; display: flex; justify-content: flex-end; overflow: hidden; color: #212121; visibility: hidden; }
.bb-demo--get-help .gh-typed { flex: none; white-space: pre; }
.bb-demo--get-help .gh-fill { flex: 1 1 0; }
.bb-demo--get-help .gh-composer.is-typing .gh-ph { visibility: hidden; }
.bb-demo--get-help .gh-composer.is-typing .gh-field { visibility: visible; }
.bb-demo--get-help .gh-composer.is-focus:not(.is-typing) .gh-ph::before {
  content: ''; position: absolute; left: -1px; top: 3px; width: 2px; height: 20px; background: #212121;
  animation: bb-blink 1s steps(1) infinite;
}
.bb-demo--get-help .gh-send { position: absolute; left: 372px; top: 19px; width: 24px; height: 22px; }
.bb-demo--get-help .gh-dots { position: absolute; left: 454px; top: 812.5px; width: 6px; height: 22px; }
.bb-demo--get-help .gh-safety {
  position: absolute; left: 22px; right: 22px; top: 856px; margin: 0;
  font-size: 14px; line-height: 22px; font-style: italic; color: #717171; text-align: center; letter-spacing: .3px;
}
/* css/demos/grading.css */
.gr-screen {
  position: relative; width: 2053px; height: 1127px; overflow: hidden; background: #fff;
  font-family: Roboto, Roboto, Arial, sans-serif; color: #212121; -webkit-font-smoothing: antialiased;
}
.gr-screen *, .gr-screen *::before, .gr-screen *::after { box-sizing: border-box; }
.gr-screen svg { display: block; }
.gr-screen p { margin: 0; }
.gr-t { position: absolute; white-space: nowrap; line-height: 1; }
.gr-ico { position: absolute; fill: currentColor; }
.gr-ink { color: #212121; }
.gr-grey { color: #808080; }
.gr-tool { color: #333; }
.gr-green-ico { color: #0a6b0a; }
.gr-f14 { font-size: 14px; color: #252525; }
.gr-f16 { font-size: 16px; color: #252525; }
.gr-f174 { font-size: 17.4px; color: #212121; }
.gr-f18 { font-size: 18px; color: #232323; }

.gr-layer { position: absolute; left: 0; top: 0; width: 2053px; height: 1127px; }


.gr-nav { position: absolute; left: 0; top: 0; width: 2053px; height: 70px; background: #0e47a1; z-index: 5;
  box-shadow: 0 1px 2px rgba(0,0,0,.22), 0 3px 7px rgba(0,0,0,.14); }
.gr-nav .gr-ico { color: #fff; }
.gr-nav-title { font-size: 25px; font-weight: 700; color: #fff; }
.gr-badge { position: absolute; left: 1653px; top: 7.5px; width: 24px; height: 24px; border-radius: 50%; background: #ffc106;
  color: #111; font-size: 16px; font-weight: 500; line-height: 24px; text-align: center; }
.gr-user { font-size: 20px; font-weight: 700; line-height: 23px; color: #fff; }
.gr-acct { position: absolute; left: 1973px; top: 5px; width: 60px; height: 60px; border-radius: 50%; background: #c7c7c7; overflow: hidden; }
.gr-acct svg { position: absolute; left: -6px; top: 3px; width: 72px; height: 72px; fill: #fff; }
.gr-acct-caret { position: absolute; left: 2028px; top: 59px; width: 0; height: 0; border-left: 4.5px solid transparent; border-right: 4.5px solid transparent; border-top: 5px solid #fff; }


.gr-side { position: absolute; left: 0; top: 0; width: 2053px; height: 1127px; }
.gr-side::before { content: ''; position: absolute; left: 0; top: 70px; width: 400px; height: 1057px; background: #fafafa; border-right: 1px solid #ededed; }
.gr-filter { position: absolute; left: 13px; top: 89px; width: 375px; height: 70px; border: 1px solid #a4a4a4; border-radius: 4px; }
.gr-filter-label { font-size: 14px; color: #232323; background: #fafafa; padding: 0 5px; margin-left: -5px; }
.gr-row { position: absolute; left: 0; width: 386px; height: 128px; border-radius: 5px; transition: background-color .25s ease; }
.gr-row.is-sel { background: #fff9c4; }
.gr-row-dot { position: absolute; left: 19px; top: 42px; width: 44px; height: 44px; border-radius: 50%; background: #fff; }
.gr-row-dot svg { position: absolute; left: 13px; top: 9px; width: 18px; height: 25px; color: #2d7163; }
.gr-row-title { font-size: 18.7px; color: #222; }
.gr-row-sub { font-size: 17.4px; color: rgba(0,0,0,.5); }
.gr-thumb { position: absolute; width: 8px; border-radius: 4px; background: #c1c1c1; }
.gr-track { position: absolute; top: 72px; width: 15px; height: 1055px; background: #fafafa; border-left: 1px solid #e8e8e8; }


.gr-work, .gr-grade { position: absolute; left: 0; top: 0; width: 2053px; height: 1127px; }
.gr-grade::before { content: ''; position: absolute; left: 1205px; top: 70px; width: 1px; height: 1057px; background: #e4e4e4; }
.gr-avatar { position: absolute; left: 413px; top: 86px; width: 62px; height: 61px; }
.gr-name { font-size: 30px; color: #212121; }
.gr-link { font-size: 18px; color: #337ab7; }
.gr-tab { font-size: 17.7px; font-weight: 500; color: #666; }
.gr-tab.is-current { color: #b04c00; }
.gr-tabline { position: absolute; left: 412px; top: 285.5px; width: 122px; height: 2px; background: #b04c00; }
.gr-h { font-size: 22px; font-weight: 700; color: #212121; }
.gr-comments { position: absolute; left: 475px; top: 345px; width: 690px; height: 378px; background: #f5f5f5; border: 1px solid #dadada; border-radius: 4px; }
.gr-para { position: absolute; font-size: 17.4px; line-height: 25px; white-space: nowrap; color: #222; }
.gr-field { position: absolute; background: #f6f6f6; border-bottom: 1px solid #7b7b7b; font-size: 20px; line-height: 51px; white-space: nowrap; color: #232323; }
.gr-rubric-field { left: 633px; top: 799px; width: 156px; height: 52px; text-align: right; padding-right: 20px; }
.gr-score-field { left: 1218px; top: 134px; width: 175px; height: 51px; line-height: 50px; text-align: right; padding-right: 19px; }
.gr-score-field .gr-draft { color: #0a6b0a; }
.gr-level { position: absolute; top: 873px; width: 185px; height: 254px; }
.gr-level-head { height: 51px; font-size: 18px; font-weight: 700; line-height: 25px; text-align: center; color: #000; }
.gr-level-1 .gr-level-head { background: #c1d5eb; }
.gr-level-2 .gr-level-head { background: #e6c1eb; }
.gr-level-3 .gr-level-head { background: #f8d1b4; }
.gr-level-4 .gr-level-head { background: #daecc0; }
.gr-level-body { height: 203px; padding-left: 9px; border-left: 1px solid #cdcdcd; font-size: 17.4px; line-height: 25px; white-space: nowrap; color: #414141;
  transition: background-color .45s ease .15s; }
.gr-level-4 .gr-level-body { border-right: 1px solid #cdcdcd; }
.gr-level-body span { background: #fff; }


.gr-label { font-size: 18px; font-weight: 700; color: #252525; }
.gr-btn { position: absolute; height: 45px; display: flex; align-items: center; justify-content: center; background: #fff;
  border: 1px solid #e4e4e4; border-radius: 4px; font-size: 16px; font-weight: 500; color: #252525; white-space: nowrap; }
.gr-btn--lg { font-size: 18px; }
.gr-scaled { font-size: 14px; color: #252525; }
.gr-scaled i { color: #757575; }
.gr-green { color: #0a6b0a; }
.gr-submit { position: absolute; left: 1346px; top: 331px; width: 193px; height: 45px; border-radius: 4px; background: #1976d2; color: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: background-color .15s ease, box-shadow .15s ease; }
.gr-submit.is-press { background: #1257a6; box-shadow: 0 0 0 4px rgba(25,118,210,.22); }
.gr-submit-main { position: absolute; left: 0; top: 0; width: 142px; height: 45px; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 600; }
.gr-submit-menu { position: absolute; left: 142px; top: 0; width: 51px; height: 45px; border-left: 1px solid #1569bb; box-shadow: -2px 0 3px -1px rgba(0,0,0,.18); }
.gr-submit-menu::after { content: ''; position: absolute; left: 20px; top: 19.5px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #fff; }
.gr-editor { position: absolute; left: 1228px; top: 510px; width: 803px; height: 320px; border: 1px solid #ccc; border-radius: 12px; }
.gr-editor::after { content: ''; position: absolute; left: 11px; right: 11px; top: 60px; height: 1px; background: #eee; }
.gr-tb { position: absolute; top: 528px; line-height: 28px; font-size: 24px; color: #333; transform: translateX(-50%); }
.gr-tb-b { font-weight: 500; }
.gr-tb-i { font-style: italic; font-family: Georgia, 'Times New Roman', serif; font-size: 25px; }
.gr-tb-u { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; font-size: 23px; }
.gr-tb-m { font-size: 16px; font-weight: 500; letter-spacing: -1px; top: 526px; }
.gr-notpl { font-size: 18px; font-style: italic; color: #252525; transform: translateX(-50%); }
.gr-hidden { font-size: 18px; font-weight: 500; color: #808080; }


.gr-in { opacity: 0; transform: translateY(8px); transition: opacity .45s ease, transform .45s cubic-bezier(.3,.7,.3,1); }
.gr-screen.is-open .gr-in { opacity: 1; transform: none; }
.gr-in-2 { transition-delay: .08s; }
.gr-in-3 { transition-delay: .16s; }
.gr-in-4 { transition-delay: .26s; }
.gr-in-5 { transition-delay: .42s; }


.gr-draft { opacity: 0; transition: opacity .4s ease; }
.gr-screen.has-draft .gr-draft { opacity: 1; }
.gr-d-1 { transition-delay: .15s; }
.gr-d-2 { transition-delay: .3s; }
.gr-screen.has-draft .gr-level--excellent .gr-level-body { background: #fff9c4; }
.gr-feedback { position: absolute; width: 772px; font-family: Helvetica, Arial, sans-serif; font-size: 17.4px; line-height: 28px; color: #414141; visibility: hidden; }
.gr-screen.is-drafting .gr-feedback { visibility: visible; }


.gr-bee { opacity: 0; transition: opacity .35s ease; }
.gr-screen.has-flag .gr-bee { opacity: 1; }
.gr-bee::before { content: ''; position: absolute; left: 1556px; top: 290px; width: 197px; height: 25px; border-radius: 13px;
  background: rgba(255,213,0,.52); box-shadow: inset 0 0 0 1.5px rgba(214,150,0,.85), 0 0 14px 2px rgba(253,192,5,.55);
  opacity: 0; transform: scale(.9); transition: opacity .5s ease, transform .45s cubic-bezier(.3,1.5,.5,1); }
.gr-screen.is-flaghi .gr-bee::before { opacity: 1; transform: none; }
.gr-screen.is-live.has-flag .gr-bee .gr-ico { animation: gr-pop .9s ease-out .15s 1 both; transform-origin: 50% 50%; }
@keyframes gr-pop { 0% { transform: scale(1); } 35% { transform: scale(1.5) rotate(12deg); } 100% { transform: scale(1); } }


.gr-caret0 { display: none; width: 2px; height: 1.15em; margin-right: -2px; vertical-align: -.2em; background: #222; }
.gr-edit.is-focus .gr-caret0 { display: inline-block; animation: bb-blink 1s steps(1) infinite; }
.gr-edit.is-selecting .gr-caret0 { display: none; }
.gr-old { background: linear-gradient(#b4d5fe, #b4d5fe) left center / 0% 100% no-repeat; }
.gr-old.is-selected { background-size: 100% 100%; transition: background-size .65s cubic-bezier(.45,.05,.25,1); }
.gr-edit.is-replaced .gr-old { display: none; }
.gr-new .bb-caret { width: 2px; background: #222; }


.gr-st-before, .gr-st-after { transition: opacity .3s ease; }
.gr-st-after { opacity: 0; }
.gr-screen.is-returned .gr-st-before { opacity: 0; }
.gr-screen.is-returned .gr-st-after { opacity: 1; }
.gr-screen.is-returned .gr-bee { opacity: 0; }

.gr-swap::before, .gr-swap::after { content: ''; position: absolute; left: 1325px; top: 290px; width: 191px; height: 25px; border-radius: 7px; opacity: 0; }
.gr-swap::before { background: rgba(25,118,210,.16); box-shadow: inset 0 0 0 1.5px rgba(25,118,210,.8), 0 0 14px 2px rgba(25,118,210,.3);
  transform: scale(.9); transition: opacity .4s ease, transform .45s cubic-bezier(.3,1.5,.5,1); }
.gr-screen.is-rethi .gr-swap::before { opacity: 1; transform: none; }
.gr-swap::after { box-shadow: inset 0 0 0 2px rgba(25,118,210,.6); }
.gr-screen.is-live.is-rethi .gr-swap::after { animation: gr-ring 1s ease-out .2s 2 both; }
@keyframes gr-ring { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.18, 1.6); } }
/* css/demos/help-my-student.css */
.bb-demo[data-demo="help-my-student"] { --hms-green: #16893f; }


.bb-demo[data-demo="help-my-student"] .bz-top :is(.bz-title, .bz-crumbs, .bz-user) { color: #fff; }
.bb-demo[data-demo="help-my-student"] .bz-top .bz-ico { fill: #fff; color: #fff; }
.bb-demo[data-demo="help-my-student"] .bz-top .bz-tool.is-sparkle.is-active .bz-ico { fill: #1b1b1b; color: #1b1b1b; }
.bb-demo[data-demo="help-my-student"] .bz-tool:has(use[href="#bz-i-send"]),
.bb-demo[data-demo="help-my-student"] .bz-tool:has(use[href="#bz-i-note"]) { display: none; }
.bb-demo[data-demo="help-my-student"] .bz-tool:has(use[href="#bz-i-access"]) { left: 1561px !important; }
.bb-demo[data-demo="help-my-student"] .bz-tool.is-sparkle { left: 1621px !important; }
.bb-demo[data-demo="help-my-student"] .bz-tool:has(use[href="#bz-i-help"]) { left: 1682px !important; }
.bb-demo[data-demo="help-my-student"] .bz-user { left: 1723px; }
.bb-demo[data-demo="help-my-student"] .bz-avatar { left: 1808px; }
.bb-demo[data-demo="help-my-student"] .bz-avatar-caret { left: 1858px; border-top-color: #fff; }


.bb-demo[data-demo="help-my-student"] .bz-btn-out:has(use[href="#bz-i-upload"]) { display: none; }
.bb-demo[data-demo="help-my-student"] .bz-btn-out:has(use[href="#bz-i-link"]) { left: 89px !important; }
.hms-jump-status { position: absolute; left: 0; top: 70px; width: 1880px; height: 61px; z-index: 6; pointer-events: none; }
.hms-jump-status svg { position: absolute; }
.hms-js-check { left: 1814px; top: 22px; width: 20.4px; height: 20.4px; fill: #3e9b46; }
.hms-js-replay { left: 1835px; top: 23px; width: 19.2px; height: 19.2px; fill: #3a3a3a; }
.hms-js-chat { left: 1855px; top: 21.5px; width: 20.2px; height: 20.2px; fill: #3a3a3a; }


.hms-done-badge {
  position: absolute; left: 110px; top: 8px; width: 17px; height: 17px; z-index: 6; border-radius: 50%;
  background: #2f9a45; box-shadow: 0 0 0 2px #fff; display: flex; align-items: center; justify-content: center;
}
.hms-done-badge svg { width: 11px; height: 11px; fill: #fff; }


.bb-demo[data-demo="help-my-student"] .bz-panel-inner { background: #fff; }
.hms-view { position: absolute; left: 0; top: 0; width: 500px; height: 100%; transition: opacity .18s ease, visibility .18s; }
.hms-out { opacity: 0; visibility: hidden; }
.bz-panel-inner.is-hms .hms-menu { opacity: 0; visibility: hidden; }
.bz-panel-inner.is-hms .hms-out { opacity: 1; visibility: visible; }


.bb-demo[data-demo="help-my-student"] .bz-panel-head { padding-top: 10px; }
.bb-demo[data-demo="help-my-student"] .bz-panel-head .bz-spark-outline { width: 23px; height: 23px; margin: 2px 11.5px 0 11.5px; }
.bb-demo[data-demo="help-my-student"] .bz-panel-head .bz-close { width: 28px; height: 28px; margin-right: 12px; }


.bb-demo[data-demo="help-my-student"] .bz-toolcard { left: 14px; width: 470px; height: 97px; background: #fafafa; }
.bb-demo[data-demo="help-my-student"] .bz-toolcard.is-hover { background: #f1f1f1; }
.bb-demo[data-demo="help-my-student"] .bz-toolcard .bz-ring { margin-left: 19.5px; }
.bb-demo[data-demo="help-my-student"] .bz-toolcard .bz-tc-text { margin-left: 20px; }
.bb-demo[data-demo="help-my-student"] .bz-toolcard .bz-chev { margin-right: 13px; }
.bb-demo[data-demo="help-my-student"] .bz-c-family { color: var(--hms-green); }
.bb-demo[data-demo="help-my-student"] .bz-c-family svg { width: 34px; height: 34px; }


.hms-out .bz-panel-head .bz-panel-back { width: 31px; height: 31px; margin: 0 15.6px 0 12.8px; fill: #1b1b1b; }


.hms-doc { position: absolute; left: 0; top: 0; width: 500px; color: #1f1f1f; }
.hms-h { position: absolute; left: 15px; top: 108px; margin: 0; font-size: 20.5px; line-height: 24.6px; font-weight: 700; color: #111; white-space: nowrap; }
.hms-list { position: absolute; left: 64px; top: 157px; width: 426px; margin: 0; padding: 0; list-style: none; font-size: 17.6px; line-height: 25.17px; }
.hms-list li { position: relative; margin: 0; }
.hms-list li::before {
  content: ''; position: absolute; left: -19.3px; top: 11px; width: 5.6px; height: 5.6px; border-radius: 50%;
  background: #1f1f1f; opacity: 0; transition: opacity .2s ease;
}
.hms-list li:has(.bb-w.is-on)::before { opacity: 1; }
.hms-list b { font-weight: 700; color: #111; }
/* css/demos/hero.css */
.hero-fx { position: absolute; inset: 0; z-index: 30; pointer-events: none; }
.hero-glow {
  position: absolute; left: 1380px; top: 131px; width: 500px; height: 913px; opacity: 0;
  box-shadow: inset 0 0 0 5px rgba(253, 192, 5, .95), 0 0 70px 22px rgba(253, 192, 5, .55);
}
.hero-glow.is-on { animation: hero-glow 1.5s ease-out forwards; }
@keyframes hero-glow { 0% { opacity: 0; } 18% { opacity: 1; } 55% { opacity: .85; } 100% { opacity: 0; } }

.hero-spark { position: absolute; left: 0; top: 0; width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); opacity: 0; }
.hero-spark svg { display: block; width: 100%; height: 100%; }
.hero-spark.is-on { animation: hero-spark var(--d) cubic-bezier(.15, .7, .25, 1) var(--delay) forwards; }
@keyframes hero-spark {
  0%   { opacity: 0; transform: translate(0, 0) scale(.2) rotate(0deg); }
  14%  { opacity: 1; transform: translate(calc(var(--dx) * .18), calc(var(--dy) * .18)) scale(1.15) rotate(calc(var(--r) * .2)); }
  70%  { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.55) rotate(var(--r)); }
}
/* css/demos/inside-buzz.css */
.ib-mark {
  position: absolute; z-index: 20; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%;
  background: #ef9d2b; color: #0d1723; font: 700 22px/46px 'Inconsolata', ui-monospace, monospace; text-align: center;
  box-shadow: 0 0 0 6px rgba(239, 157, 43, .28), 0 6px 16px rgba(0, 0, 0, .25);
  transform: scale(var(--inv, 1)); transform-origin: center;
}
.bb-demo.is-ready .ib-mark { animation: ib-pulse 2.4s ease-out 2; }
@keyframes ib-pulse { 0% { box-shadow: 0 0 0 0 rgba(239, 157, 43, .55), 0 6px 16px rgba(0,0,0,.25); } 70% { box-shadow: 0 0 0 18px rgba(239, 157, 43, 0), 0 6px 16px rgba(0,0,0,.25); } 100% { box-shadow: 0 0 0 6px rgba(239, 157, 43, .28), 0 6px 16px rgba(0,0,0,.25); } }
/* css/demos/question-assistant.css */
.qa-world { position: absolute; left: 0; top: 0; width: 1553px; height: 1127px; }
.qa-screen {
  position: relative; width: 1553px; height: 1127px; overflow: hidden;
  font-family: Roboto, Roboto, Arial, sans-serif; color: #212121; background: #ededed;
  -webkit-font-smoothing: antialiased; font-size: 18px; line-height: 22px;
}
.qa-screen *, .qa-screen *::before, .qa-screen *::after { box-sizing: border-box; }
.qa-screen svg { display: block; }
.qa-screen :is(h4, h5, p, ol, li) { margin: 0; font-family: inherit; letter-spacing: normal; }
.qa-ico { position: absolute; width: 26px; height: 26px; fill: #222; }


.qa-btn {
  position: absolute; height: 45px; display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 0 18px; border-radius: 5px; font-size: 17px; font-weight: 500; line-height: 20px; white-space: nowrap; color: #212121;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.qa-btn--amber { background: #ffc107; box-shadow: 0 2px 2px rgba(0,0,0,.18), 0 1px 4px rgba(0,0,0,.08); }
.qa-btn--line { background: #fff; border: 1px solid #e0e0e0; }
.qa-btn--off { background: #e0e0e0; color: #9e9e9e; }
.qa-btn .qa-ico { position: static; width: 21px; height: 21px; fill: #424242; }


.qa-top { position: absolute; left: 0; top: 0; width: 1553px; height: 70px; background: #f5f5f5; }
.qa-top-x { left: 27px; top: 22px; }
.qa-top-title { position: absolute; left: 72px; top: 20px; font-size: 24px; line-height: 30px; font-weight: 700; color: #1d1d1d; }
.qa-top-preview { left: 1352px; top: 13px; width: 100px; height: 44px; background: #f5f5f5; }
.qa-top-save { left: 1463px; top: 13px; width: 80px; height: 44px; box-shadow: none; }
.qa-tabs { position: absolute; left: 0; top: 70px; width: 1553px; height: 46px; background: #ededed; border-bottom: 1px solid #dadada; }
.qa-tab { position: absolute; top: 0; height: 45px; display: flex; align-items: center; justify-content: center; font-size: 17px; color: #5f5f5f; }
.qa-tab.is-active { color: #f6b800; box-shadow: inset 0 -3px 0 #ffc107; }


.qa-left { position: absolute; left: 0; top: 116px; width: 435px; bottom: 0; background: #ededed; border-right: 1px solid #e0e0e0; }
.qa-left-tools { position: relative; height: 80px; background: #f5f5f5; }
.qa-left-tools > .qa-ico { top: 27px; }
.qa-add { position: absolute; left: 372px; top: 17px; width: 46px; height: 46px; border-radius: 50%; transition: background-color .15s; }
.qa-add .qa-ico { left: 10px; top: 10px; }
.qa-add.is-hover { background: rgba(0,0,0,.08); }
.qa-list { list-style: none; margin: 0; padding: 0; }
.qa-item { position: relative; height: 84px; display: flex; align-items: center; padding: 0 8px 0 58px; transition: background-color .25s ease; }
.qa-item .qa-ico { left: 17px; top: 29px; }
.qa-item span { font-size: 16px; line-height: 20px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #1d1d1d; }
.qa-item.qa-new { opacity: 0; transform: translateX(-14px); transition: opacity .35s ease, transform .35s ease, background-color .25s ease; transition-delay: calc(var(--i, 0) * 80ms); }
.qa-list.is-added .qa-item.qa-new { opacity: 1; transform: none; }
.qa-item.is-sel { background: #fff9c4; }


.qa-right { position: absolute; left: 436px; top: 116px; right: 0; bottom: 0; background: #ededed; }
.qa-card { position: absolute; left: 20px; top: 20px; right: 20px; bottom: -20px; background: #fff; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,.14); overflow: hidden; transition: opacity .3s ease; }
.qa-preview { padding: 26px 34px; font-family: 'Open Sans', Arial, sans-serif; color: #222; }
.qa-preview h4 { font: 700 21px/28px Roboto, Roboto, Arial, sans-serif; color: #1d1d1d; margin-bottom: 14px; }
.qa-preview p { font-size: 18px; line-height: 27px; margin-bottom: 18px; }
.qa-preview h5 { font-size: 31px; line-height: 38px; font-weight: 400; color: #1d1d1d; margin: 6px 0 16px; }
.qa-qcard { opacity: 0; }
.qa-right.is-added .qa-preview { opacity: 0; }
.qa-right.is-added .qa-qcard { opacity: 1; }

.qa-qc-title { position: absolute; left: 25px; right: 76px; top: 26px; font-size: 23px; line-height: 30px; font-weight: 700; color: #1d1d1d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qa-qc-ai { position: absolute; right: 22px; top: 16px; width: 32px; height: 32px; }
.qa-field.qa-qc-type { left: 25px; top: 86px; width: 290px; height: 72px; }
.qa-qc-type .qa-qc-typeico { left: 15px; top: 22px; }
.qa-qc-type .qa-value { left: 55px; }
.qa-field.qa-qc-points { left: 335px; top: 86px; width: 140px; height: 72px; }
.qa-qc-toggle { position: absolute; left: 832px; top: 115px; width: 36px; height: 14px; border-radius: 7px; background: #c4c4c4; }
.qa-qc-knob { position: absolute; left: -3px; top: -4px; width: 22px; height: 22px; border-radius: 50%; background: #616161; box-shadow: 0 1px 2px rgba(0,0,0,.3); }
.qa-qc-knob::after { content: ''; position: absolute; left: 6px; right: 6px; top: 10px; height: 2px; background: #fff; }
.qa-qc-editor { position: absolute; left: 880px; top: 111px; font-size: 17px; line-height: 22px; color: #424242; }
.qa-qc-pv { right: 28px; top: 109px; }
.qa-qc-body { position: absolute; left: 25px; right: 25px; top: 330px; }
.qa-qc-q { font-size: 18px; line-height: 24px; color: #212121; }
.qa-qc-q span { display: inline-block; width: 34px; }
.qa-qc-opt { position: relative; height: 32px; margin-top: 46px; padding-left: 58px; font-size: 18px; line-height: 32px; }
.qa-qc-opt .qa-radio { left: 20px; top: 6px; }
.qa-qc-more { right: 6px; top: 3px; fill: #424242; }
.qa-qc-fb { margin: 18px 0 0 0 !important; padding-right: 70px !important; box-shadow: 0 2px 5px rgba(0,0,0,.16) !important; }
.qa-fb-x { right: 22px; top: 21px; fill: #333; left: auto !important; }


.qa-field { position: absolute; left: 105px; width: 1063px; height: 69px; border: 1px solid #999; border-radius: 4px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; z-index: 3; }
.qa-field.is-focus { border-color: #ffc107; box-shadow: inset 0 0 0 1px #ffc107; }
.qa-value { position: absolute; left: 19px; right: 50px; top: 50%; transform: translateY(-50%); font-size: 18px; line-height: 22px; letter-spacing: .35px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #212121; }
.qa-label {
  position: absolute; left: 15px; top: 23px; padding: 0 5px; background: #fff; font-size: 18px; line-height: 22px; color: #616161;
  white-space: nowrap; transform-origin: 0 50%; transition: transform .16s ease, color .16s ease;
}
.qa-label.is-float { transform: translateY(-34.5px) scale(.778); color: #212121; }
.qa-qc-type .qa-label.is-float, .qa-qc-points .qa-label.is-float { transform: translateY(-36px) scale(.778); }
.qa-caret { position: absolute; right: 15px; top: 50%; width: 24px; height: 24px; margin-top: -12px; fill: #757575; transition: transform .15s ease; }
.qa-field.is-open .qa-caret { transform: rotate(180deg); fill: #e0a800; }
.qa-cbox { position: absolute; width: 22px; height: 22px; border: 2px solid #757575; border-radius: 2px; background: #fff; transition: background-color .12s ease, border-color .12s ease; }
.qa-cbox.is-on { background: #ffc107; border-color: #ffc107; }
.qa-cbox.is-on::after { content: ''; position: absolute; left: 6px; top: 1px; width: 6px; height: 12px; border-right: 2.4px solid #212121; border-bottom: 2.4px solid #212121; transform: rotate(45deg); }
.qa-radio { position: absolute; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #757575; background: #fff; }
.qa-radio.is-on { border-color: #ffc107; }
.qa-radio.is-on::after { content: ''; position: absolute; left: 3px; top: 3px; width: 10px; height: 10px; border-radius: 50%; background: #ffc107; }
.qa-fb { position: relative; border: 1px solid #e3e3e3; border-radius: 4px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.12); padding: 21px 22px 21px 61px; font-size: 18px; line-height: 26px; color: #212121; }
.qa-fb > .qa-ico { left: 24px; top: 22px; width: 24px; height: 24px; fill: #333; }


.qa-addmenu {
  position: absolute; left: 372px; top: 186px; width: 350px; padding: 8px 0; background: #fff; border-radius: 4px; z-index: 8;
  box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);
  opacity: 0; transform: scale(.92); transform-origin: 20px 0; transition: opacity .15s ease, transform .15s ease;
}
.qa-addmenu.is-on { opacity: 1; transform: none; }
.qa-mi { position: relative; height: 54px; display: flex; align-items: center; padding-left: 70px; font-size: 17px; color: #212121; transition: background-color .12s; }
.qa-mi .qa-ico { left: 22px; top: 14px; }
.qa-mi.is-hover { background: #ececec; }
.qa-mi-rule { height: 1px; margin: 8px 0; background: #e0e0e0; }
.qa-bee { position: absolute; left: 19px; top: 13px; width: 34px; height: 26px; }


.qa-scrim { position: absolute; inset: 0; background: rgba(0,0,0,.32); opacity: 0; transition: opacity .22s ease; z-index: 9; }
.qa-scrim.is-on { opacity: 1; }
.qa-dialog {
  position: absolute; left: 155px; top: 127px; width: 1243px; height: 873px; background: #fff; border-radius: 4px; overflow: hidden; z-index: 10;
  box-shadow: 0 11px 15px -7px rgba(0,0,0,.2), 0 24px 38px 3px rgba(0,0,0,.14), 0 9px 46px 8px rgba(0,0,0,.12);
  opacity: 0; transform: scale(.94); transition: opacity .22s cubic-bezier(0,0,.2,1), transform .22s cubic-bezier(0,0,.2,1);
}
.qa-dialog.is-on { opacity: 1; transform: none; }
.qa-d-title { position: absolute; left: 30px; top: 27px; font-size: 24px; line-height: 28px; font-weight: 700; color: #212121; }
.qa-body { position: absolute; left: 0; top: 74px; width: 1243px; height: 733px; overflow: hidden; opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s .2s; }
.qa-body.is-on { opacity: 1; visibility: visible; transition: opacity .2s ease; }
.qa-scroll { position: absolute; left: 0; top: -74px; width: 1243px; height: 1000px; }
.qa-sbar { position: absolute; left: 1228px; top: 0; width: 13px; height: 733px; background: #fafafa; }
.qa-sbar i { position: absolute; left: 4px; top: 3px; width: 8px; height: 541px; border-radius: 4px; background: #c1c1c1; transition: transform .45s cubic-bezier(.45,.05,.25,1); }
.qa-s2.is-scrolled .qa-sbar i { transform: translateY(155px); }
.qa-s3 .qa-scroll { height: 1360px; }
.qa-s3 .qa-sbar i { height: 395px; transition-duration: .75s; }
.qa-s3.is-scrolled .qa-sbar i { transform: translateY(140px); }


.qa-step { position: absolute; left: 60px; width: 30px; height: 30px; border-radius: 50%; background: #757575; color: #fff; font-size: 16px; line-height: 30px; font-weight: 500; text-align: center; }
.qa-step.is-slate { background: #5e7d8a; }
.qa-step svg { width: 17px; height: 17px; margin: 6.5px auto 0; fill: #fff; }
.qa-step-label { position: absolute; left: 105px; font-size: 18px; line-height: 22px; color: #212121; }
.qa-step-label.is-dim { color: #757575; }
.qa-rule { position: absolute; left: 75px; width: 1px; background: #e0e0e0; }


.qa-band { position: absolute; left: 30px; right: 30px; top: 76px; height: 86px; background: #f5f5f5; transition: opacity .2s ease; }
.qa-s1.is-touched .qa-band { opacity: 0; }
.qa-s1 .qa-cbox { width: 22px; height: 22px; }
.qa-s1-text { position: absolute; font-size: 17px; line-height: 22px; color: #212121; }
.qa-or { position: absolute; left: 105px; font-size: 16px; line-height: 20px; color: #212121; }
.qa-s1-activity, .qa-s1-passage { width: 465px; height: 72px; border-color: #b4b4b4; }
.qa-s1-activity.is-focus { border-color: #ffc107; }
.qa-act-val { opacity: 0; }
.qa-s1-activity.is-picked .qa-act-ph { opacity: 0; }
.qa-s1-activity.is-picked .qa-act-val { opacity: 1; }
.qa-act-menu { right: 16px; top: 22px; width: 26px; height: 26px; fill: #424242; }
.qa-next { width: 87px; height: 46px; }
.qa-next.is-ready { background: #ffc107; color: #212121; box-shadow: 0 2px 2px rgba(0,0,0,.18), 0 1px 4px rgba(0,0,0,.08); }
.qa-picker {
  position: absolute; left: 105px; top: 357px; width: 465px; padding: 8px 0; background: #fff; border-radius: 4px; z-index: 6;
  box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);
  opacity: 0; transform: translateY(-6px); transition: opacity .15s ease, transform .15s ease;
}
.qa-picker.is-on { opacity: 1; transform: none; }
.qa-pk-head { height: 36px; padding: 9px 20px 0; font-size: 14px; line-height: 18px; color: #757575; }
.qa-pk-item { height: 54px; padding-left: 20px; font-size: 18px; line-height: 54px; transition: background-color .12s; }
.qa-pk-item.is-hover { background: #ececec; }


.qa-s2-addl { position: absolute; left: 105px; top: 572px; font-size: 17px; line-height: 22px; color: #212121; }
.qa-addl { position: absolute; left: 105px; top: 600px; width: 1063px; height: 222px; border: 1px solid #c4c4c4; border-radius: 4px; }
.qa-addl-count { position: absolute; left: 0; right: 0; bottom: 0; height: 40px; border-top: 1px solid #e6e6e6; text-align: right; padding-right: 16px; font-size: 15px; line-height: 39px; color: #424242; }
.qa-addl-count i { display: inline-block; width: 16px; }
.qa-back { width: 81px; }
.qa-gen { width: 194px; }
.qa-gen.is-busy { background: #e0e0e0; color: #9e9e9e; box-shadow: none; }
.qa-back.is-busy { color: #bdbdbd; }
.qa-spin { position: absolute; left: 410px; top: 849px; width: 36px; height: 36px; border-radius: 50%; border: 4px solid #ffe7a3; border-top-color: #ffc107; opacity: 0; transition: opacity .15s ease; animation: qa-spin .8s linear infinite; }
.qa-spin.is-on { opacity: 1; }
@keyframes qa-spin { to { transform: rotate(360deg); } }
.qa-panel {
  position: absolute; left: 105px; width: 1063px; padding: 10px 0; background: #fff; border-radius: 0 0 4px 4px; z-index: 5;
  box-shadow: 0 5px 14px rgba(0,0,0,.33);
  opacity: 0; transform: scaleY(.85); transform-origin: 50% 0; transition: opacity .15s ease, transform .15s ease;
}
.qa-panel.is-on { opacity: 1; transform: none; }
.qa-p-diff { top: 331px; }
.qa-p-types { top: 539px; }
.qa-opt { position: relative; height: 60px; padding-left: 20px; font-size: 18px; line-height: 60px; letter-spacing: .35px; color: #212121; transition: background-color .12s; }
.qa-opt.is-hover { background: #e7e7e7; }
.qa-p-types .qa-opt { padding-left: 63px; }
.qa-p-types .qa-cbox { left: 20px; top: 19px; width: 23px; height: 22px; }
.qa-f-types.is-open { z-index: 6; }


.qa-review { position: absolute; left: 120px; top: 362px; width: 1062px; }
.qa-rq { position: relative; padding-left: 51px; opacity: 0; transform: translateY(10px); transition: opacity .35s ease, transform .35s ease; }
.qa-rq + .qa-rq { margin-top: 24px; transition-delay: .15s; }
.qa-s3.is-in .qa-rq { opacity: 1; transform: none; }
.qa-rq > .qa-cbox { left: 0; top: 1px; }
.qa-rq-stem { font-size: 18px; line-height: 24px; color: #212121; }
.qa-ro { position: relative; height: 30px; margin-top: 22px; padding-left: 54px; font-size: 18px; line-height: 30px; }
.qa-rq-stem + .qa-ro { margin-top: 24px; }
.qa-ro .qa-radio { left: 14px; top: 5px; }
.qa-rq > .qa-fb { margin: 13px 0 0 54px; }
.qa-blank { display: inline-block; width: 232px; margin-left: 4px; padding: 0 0 3px 4px; border-bottom: 1px solid #8a8a8a; line-height: 22px; }


.qa-foot { position: absolute; left: 0; top: 807px; width: 1243px; height: 66px; background: #fff; }
.qa-foot .qa-btn { top: 11px; }
.qa-cancel { left: 1139px; width: 94px; }
.qa-send { left: 24px; padding: 0 16px 0 13px; }
.qa-cancel2 { left: 992px; width: 88px; }
.qa-addsel { left: 1090px; width: 143px; }
.qa-send, .qa-cancel2, .qa-addsel { display: none; }
.qa-foot.is-review .qa-cancel { display: none; }
.qa-foot.is-review .qa-send, .qa-foot.is-review .qa-cancel2, .qa-foot.is-review .qa-addsel { display: inline-flex; }


.bb-demo.is-focus .qa-world.qa-m-dialog { transform: translate(-170px, -110px); }
.bb-demo.is-focus .qa-world.qa-m-dialog ~ .bb-cursor { translate: -170px -110px; }
.bb-demo.is-focus .qa-world.qa-m-review { transform: translate(-255px, -110px); }
.bb-demo.is-focus .qa-world.qa-m-review ~ .bb-cursor { translate: -255px -110px; }
.bb-demo.is-focus .qa-world.qa-m-add { transform: translate(-790px, -110px); }
.bb-demo.is-focus .qa-world.qa-m-add ~ .bb-cursor { translate: -790px -110px; }
.bb-demo.is-focus .qa-world.qa-m-ai ~ .bb-cursor { visibility: hidden; }
/* css/demos/review-key-concepts.css */
.rkc-panel { background: #fff; }


.rkc-head { position: absolute; left: 0; top: 0; width: 500px; height: 73px; }
.rkc-head::after { content: ''; position: absolute; left: 14px; top: 72px; width: 474px; height: 1px; background: #e4e4e4; }
.rkc-head-ico { position: absolute; left: 0; top: 0; width: 500px; height: 72px; }
.rkc-head-title { position: absolute; left: 74px; top: 26px; font-size: 25px; line-height: 30px; font-weight: 500; color: #212121; white-space: nowrap; }


.rkc-area { position: absolute; left: 14px; top: 85px; width: 474px; height: 575px; background: #ededed; }

.rkc-card {
  position: absolute; left: 52px; top: 58px; width: 375px; height: 375px; perspective: 1300px;
  opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility 0s linear .28s;
}
.rkc-card.is-current { opacity: 1; visibility: visible; transition: opacity .28s ease; }
.rkc-flipper { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform .62s cubic-bezier(.45, .05, .25, 1); }
.rkc-card.is-flipped .rkc-flipper { transform: rotateY(180deg); }

.rkc-face {
  position: absolute; inset: 0; background: #fff; border-top: 5px solid #607d8b;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .22), 0 2px 3px rgba(0, 0, 0, .14);
  display: flex; align-items: center; justify-content: center; text-align: center;
  -webkit-backface-visibility: hidden; backface-visibility: hidden;
}
.rkc-back { transform: rotateY(180deg); border-top-color: var(--rkc-stripe, #b04c00); padding-bottom: 3px; }
.rkc-term { position: relative; top: -1px; font-size: 30px; line-height: 36px; color: #212121; white-space: nowrap; }
.rkc-def { font-size: 25px; line-height: 35.6px; color: #212121; white-space: nowrap; }
.rkc-flip-ico { position: absolute; left: 3px; top: 332px; width: 30px; height: 30px; }


.rkc-arrow {
  position: absolute; top: 488px; width: 50px; height: 50px; border-radius: 50%; background: #ffc106;
  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px rgba(0, 0, 0, .14), 0 1px 18px rgba(0, 0, 0, .12);
  outline: 2px solid transparent; outline-offset: 1.5px; transition: background-color .15s ease;
}
.rkc-arrow svg { width: 50px; height: 50px; }
.rkc-prev { left: 136px; }
.rkc-next { left: 287px; }

.rkc-arrow.is-focus { outline-color: #d45c01; }
.rkc-count { position: absolute; left: 186px; top: 500px; width: 100px; text-align: center; font-size: 20px; line-height: 24px; color: #212121; }
/* Webflow guards */
figure.bb-demo{margin:0;border:0;background-color:transparent}
/* BusyBee page rules Webflow classes cannot hold (pseudo-elements, states, descendants) */
:root{--bp-ink: #0d1723; --bp-text: #3a4450; --bp-muted: #5f6974; --bp-line: #e4e7ec; --bp-teal: #319a94; --bp-teal-dark: #016454; --bp-amber: #ef9d2b; --bp-cream: #fff5e1; --bp-mist: #f6f7fa; --bp-display: 'Plus Jakarta Sans', 'DM Sans', system-ui, sans-serif; --bp-body: 'DM Sans', 'DM Sans Local', system-ui, sans-serif; --bp-mono: 'Inconsolata', ui-monospace, Menlo, monospace; --bp-gutter: 24px;}
html{scroll-behavior: smooth;}
@media (prefers-reduced-motion: reduce){
html{scroll-behavior: auto;}
}
.bp{margin: 0; background: #fff; color: var(--bp-text); font: 400 18px/1.62 var(--bp-body); -webkit-font-smoothing: antialiased;}
.bp a{color: var(--bp-teal-dark); text-underline-offset: 3px;}
.bp :focus-visible{outline: 3px solid var(--bp-teal); outline-offset: 3px;}
.bp-sr{position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.bp-eyebrow .bp-dot{display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--bp-amber); margin: 0 10px 2px; vertical-align: middle;}
.bp-body p{margin: 0 0 16px;}
.bp-body p:last-child{margin-bottom: 0;}
.bp-btn{color:#fff !important;border:0}
.bp-btn:hover{background: #2a8680;}
.bp-btn svg{width: 18px; height: 18px;}
.bp-link{color:var(--bp-ink) !important}
.bp-link:hover{border-color: var(--bp-teal);}
.bp-sitebar{backdrop-filter:blur(10px)}
.bp-sitebar .bp-wrap{display: flex; align-items: center; gap: 40px; height: 72px;}
.bp-sitebar img{height: 30px; width: auto;}
.bp-sitebar nav{display: flex; gap: 32px; font: 500 16px/1 var(--bp-body); color: rgba(13, 23, 35, .55);}
.bp-sitebar nav span:nth-child(2){color: var(--bp-ink);}
.bp-sitebar .bp-btn{margin-left: auto; padding: 11px 18px; font-size: 15px;}
@media screen and (max-width: 991px){
.bp-sitebar nav{display: none;}
}
.bp-hero{background:linear-gradient(180deg, var(--bp-cream) 0%, #fffaf0 62%, #fff 100%)}
.bp-hero::before{content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5; background-image: radial-gradient(rgba(239, 157, 43, .22) 1.2px, transparent 1.4px); background-size: 26px 26px; -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 70%); mask-image: linear-gradient(180deg, #000 0%, transparent 70%);}
.bp-hero .bp-lead{max-width: 760px; margin: 26px auto 0;}
.bp-proof{display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; list-style: none; padding: 0; margin: 28px 0 0; font-size: 16px; color: var(--bp-ink);}
.bp-proof li{display: flex; align-items: center; gap: 9px;}
.bp-proof svg{width: 18px; height: 18px; color: var(--bp-teal); flex: none;}
.bp-hero-demo .bb-viewport{border-radius: 16px;}
.bp-sec--tight{padding-top: 64px;}
.bp-head .bp-body{font-size: 19px;}
.bp-hint{display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; font: 600 13px/1.2 var(--bp-mono); letter-spacing: .05em; text-transform: uppercase; color: var(--bp-teal-dark);}
.bp-hint::before{content: ''; width: 18px; height: 1px; background: currentColor;}
.bp-points{list-style:none;counter-reset:bp-pt}
.bp-points li{border-top: 2px solid var(--bp-ink); padding-top: 22px; font-size: 17px; line-height: 1.55;}
.bp-points li::before{counter-increment: bp-pt; content: counter(bp-pt); display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--bp-amber); color: var(--bp-ink); font: 800 21px/1 var(--bp-display); margin-bottom: 16px;}
.bp-points b{display: block; font: 700 19px/1.3 var(--bp-display); color: var(--bp-ink); margin-bottom: 6px;}
.bp-stat + .bp-stat{padding-left: 26px; border-left: 1px solid var(--bp-line);}
.bp-stat-num{font-variant-numeric:tabular-nums}
.bp-bars h3{margin-bottom: 22px;}
.bp-bar-top b{font: 800 30px/1 var(--bp-display); letter-spacing: -.02em; text-transform: none;}
.bp-bar--muted .bp-bar-fill{background: #b7bec8;}
.bp-bars.is-on .bp-bar-fill{width: var(--w);}
.bp-quote p{font: 600 27px/1.32 var(--bp-display); letter-spacing: -.012em; color: var(--bp-ink); margin: 0 0 18px;}
.bp-quote footer{font-size: 15px; color: var(--bp-muted);}
.bp-quote cite{font-style: normal; font-weight: 700; color: var(--bp-ink);}
.bp-callouts{list-style:none}
.bp-callouts li{display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 18px; font-size: 17px;}
.bp-callouts b{display: block; font: 700 19px/1.3 var(--bp-display); color: var(--bp-ink); margin-bottom: 4px;}
.bp-pa .bp-h3{font-size: 26px;}
.bp-pa-diagram .bp-pa-path{stroke-dasharray: 7 8; animation: bp-dash 1.6s linear infinite;}
@keyframes bp-dash{to { stroke-dashoffset: -30; }}
@media (prefers-reduced-motion: reduce){
.bp-pa-diagram .bp-pa-path{animation: none;}
}
.bp-group{display: flex; align-items: center; gap: 22px; padding: 0 0 76px;}
.bp-group-label{font: 700 clamp(26px, 3vw, 34px)/1.15 var(--bp-display); color: var(--bp-ink); letter-spacing: -.015em;}
.bp-group-line{flex: 1; height: 1px; background: var(--bp-line);}
.bp-group p{margin: 0; max-width: 430px; font-size: 17px; color: var(--bp-muted);}
.bp-inline-stat .bp-stat-num{font-size: 46px; color: var(--bp-teal-dark);}
.bp-inline-stat span{font-size: 16px; line-height: 1.4;}
.bp-card-ico svg{width: 24px; height: 24px; color: #b5651d;}
.bp-card p{margin: 0; font-size: 16.5px;}
.bp-faq .bp-h2{font-size: clamp(28px, 3.4vw, 40px); text-align: center; margin-bottom: 36px;}
.bp-faq details{border-bottom: 1px solid var(--bp-line);}
.bp-faq details:first-of-type{border-top: 1px solid var(--bp-line);}
.bp-faq summary{list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 22px 4px; font: 600 19px/1.4 var(--bp-display); color: var(--bp-ink);}
.bp-faq summary::-webkit-details-marker{display: none;}
.bp-faq summary::after{content: ''; flex: none; width: 14px; height: 14px; border-right: 2px solid var(--bp-ink); border-bottom: 2px solid var(--bp-ink); transform: rotate(45deg) translate(-3px, -3px); transition: transform .2s ease;}
.bp-faq details[open] summary::after{transform: rotate(-135deg) translate(-3px, -3px);}
.bp-faq .bp-faq-a{padding: 0 48px 24px 4px; font-size: 17px;}
.bp-faq .bp-faq-a p{margin: 0;}
.bp-belief em{font-style: normal; background: linear-gradient(180deg, transparent 62%, rgba(239, 157, 43, .38) 62%);}
.bp-manifesto p{margin: 0 0 22px;}
.bp-manifesto b{color: var(--bp-ink); font-weight: 700;}
.bp-form-ok{display: none; padding: 18px; border-radius: 12px; background: #e9f6f4; color: var(--bp-teal-dark); font-weight: 600;}
.bp-sitefoot .bp-wrap{display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;}
@media screen and (max-width: 991px){
.bp-stat:nth-child(3){border-left: 0; padding-left: 0;}
.bp-stat:nth-child(n+3){border-top: 1px solid var(--bp-line);}
}
@media screen and (max-width: 767px){
:root{--bp-gutter: 16px;}
.bp{font-size: 17px;}
.bp-proof{flex-direction: column; align-items: flex-start; text-align: left; max-width: 360px; margin-left: auto; margin-right: auto;}
.bp-stat + .bp-stat{padding-left: 14px;}
.bp-group{flex-wrap: wrap; padding-bottom: 48px;}
.bp-group-line{display: none;}
.bp-faq .bp-faq-a{padding-right: 8px;}
}
.bp-bars.is-instant .bp-bar-fill{transition: none;}
.bp-aud{list-style:none}
.bp-aud a{display: grid; grid-template-rows: auto auto auto 1fr; gap: 6px; height: 100%; padding: 24px 22px 24px; background: #fff; border: 1px solid var(--bp-line); border-radius: 18px; color: var(--bp-text) !important; text-decoration: none; box-shadow: 0 10px 30px -18px rgba(13, 23, 35, .25); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.bp-aud a:hover{transform: translateY(-3px); border-color: var(--bp-teal); box-shadow: 0 18px 36px -18px rgba(13, 23, 35, .35);}
.bp-aud-ico svg{width: 28px; height: 28px;}
.bp-aud b{font: 700 21px/1.25 var(--bp-display); color: var(--bp-ink); letter-spacing: -.01em;}
.bp-zone .bp-sec{background: transparent;}
.bp-zone .bp-sec + .bp-sec{border-top: 1px solid rgba(13, 23, 35, .09);}
.bp-zone--teach .bp-band-title span{color: var(--bp-teal-dark);}
.bp-zone--learn .bp-band-title span{color: #c46a12;}
.bp-zone--learn .bp-band-intro{margin-top: 28px;}
.bp-band-tools{list-style:none}
.bp-band-tools a{display: inline-block; padding: 9px 16px; border-radius: 999px; background: #fff; border: 1px solid rgba(13, 23, 35, .12); font: 600 15px/1.2 var(--bp-body); color: var(--bp-ink) !important; text-decoration: none;}
.bp-band-tools a:hover{border-color: var(--bp-teal);}
.bp-photo-slot{margin: 0; aspect-ratio: 4 / 3; border-radius: 24px; border: 2px dashed #e0b77a; background: repeating-linear-gradient(135deg, #fff9ee 0 14px, #fff2da 14px 28px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: #a1662a; text-align: center; padding: 24px;}
.bp-photo-slot svg{width: 56px; height: 56px;}
.bp-photo-slot figcaption{font: 600 16px/1.4 var(--bp-body);}
.bp-photo-slot figcaption span{font: 500 13px/1.4 var(--bp-mono); text-transform: uppercase; letter-spacing: .06em;}
.bp-tooltag-ico svg{width: 28px; height: 28px;}
.bp-tooltag .bz-c-help{background: #fff;}
.bp-tooltag .bz-c-check{background: #fff;}
.bp-tooltag .bz-c-review{background: #fff;}
.bp-tooltag .bz-c-family{background: #fff;}
.bp-zone--learn .bp-tooltag{color: #8a4a0c;}
.bp-oversight-badge svg{width: 42px; height: 42px;}
.bp-card-ico svg{color: #b5651d;}
@media screen and (max-width: 991px){
.bp-photo-slot{aspect-ratio: 16 / 9;}
}
.bpp-img{-webkit-mask:url('https://cdn.prod.website-files.com/63e3df066454cf5d1a3762bf/6ad190558d526cc687b398fe_busybee-student-mask.svg') center / 100% 100% no-repeat;mask:url('https://cdn.prod.website-files.com/63e3df066454cf5d1a3762bf/6ad190558d526cc687b398fe_busybee-student-mask.svg') center / 100% 100% no-repeat}
.bpp-swoosh{fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.bpp-swoosh--teal{stroke:#3d9d85;stroke-width:24}
.bpp-swoosh--amber{stroke:#ef9d2b;stroke-width:9;transition-delay:.6s}
.bpp-spark{transform-box:fill-box;transform-origin:center}
.bpp-spark:nth-child(2){transition-delay: 1.25s;}
.bpp-spark:nth-child(3){transition-delay: 1.4s;}
.bp-hero-photo.is-on .bpp-img{transform: none; opacity: 1;}
.bp-hero-photo.is-on .bpp-back{transform: none; opacity: 1;}
.bp-hero-photo.is-on .bpp-swoosh{stroke-dashoffset: 0;}
.bp-hero-photo.is-on .bpp-spark{transform: scale(1); animation: bpp-twinkle 2.4s ease-in-out 2s 2;}
@keyframes bpp-twinkle{50% { transform: scale(.55) rotate(45deg); }}
@media (prefers-reduced-motion: reduce){
.bpp-img{transition: none !important; animation: none !important;}
.bpp-back{transition: none !important; animation: none !important;}
.bpp-swoosh{transition: none !important; animation: none !important;}
.bpp-spark{transition: none !important; animation: none !important;}
}
textarea.bp-input{min-height: 96px; resize: vertical;}
.bp-bars.is-on .bp-fill-84{width: 84%;}
.bp-bars.is-on .bp-fill-29{width: 29%;}
/* Webflow fixups */
/* restore browser defaults that the receiving site's base styles change (runbook rule 12) */
:where(.bp) p{margin-top:1em;margin-bottom:1em}
:where(.bp) li{color:inherit;margin-top:0;margin-bottom:0;padding-left:0}
:where(.bp) blockquote{font-size:inherit;line-height:inherit;border-left:0}
/* agilix.com base styles: h1/h2 capitalize, h2 relative at 767px, h4 centred */
:where(.bp) h1,:where(.bp) h2{text-transform:inherit}
:where(.bp) h2{position:static;z-index:auto}
:where(.bp) h4{text-align:inherit}
.bp-submit{-webkit-appearance:none;appearance:none;width:100%;min-width:0;white-space:normal;text-align:center}
.bp .w-embed:before,.bp .w-embed:after{display:none}
.bp [data-embed]:empty{aspect-ratio:1880/1110}
.bp-form .bp-input{margin-bottom:0}
/* agilix.com Global Styles embed sets .w-input,.w-select{color:inherit;font-size:inherit} after this file */
.bp-form .bp-input{font-size:16px;line-height:1.4;color:#0d1723}
/* Webflow's default field placeholder; bundle.js removes it, this hides it until then */
.bp-form .bp-input[placeholder="Example text"]::placeholder{color:transparent}
.bp-form.w-form{margin:0}
.bp-form form{display:grid;gap:16px;margin:0}
.bp-form .w-form-done,.bp-form .w-form-fail{border-radius:12px;margin:0}
.bp-form .w-form-done{padding:18px;background:#e9f6f4;color:#016454;font-weight:600;text-align:left}