.bd-grid-intro{background-image:linear-gradient(#3b82f614 1px,#0000 1px),linear-gradient(90deg,#3b82f614 1px,#0000 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(at 50% 45%,#000 0%,#0000 68%);mask-image:radial-gradient(at 50% 45%,#000 0%,#0000 68%)}.bd-grad-text{background:linear-gradient(120deg,#60a5fa 0%,#3b82f6 40%,#0aa5cf 100%);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}@keyframes bd-nudge{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.bd-nudge{animation:1.8s ease-in-out infinite bd-nudge}.bd-pin{min-height:100svh}.bd-live .bd-pin{height:100svh}.bd-layout{grid-template-rows:auto auto auto;grid-template-areas:"cap""prev""code";gap:14px;display:grid}.bd-live .bd-layout{grid-template-rows:auto auto minmax(0,1fr)}@media (max-width:1023.98px){.bd-viewport{aspect-ratio:760/560}}@media (min-width:1024px){.bd-layout{grid-template:"cap prev""code prev"/minmax(300px,.78fr) 1.5fr;gap:22px 44px}.bd-live .bd-layout{grid-template-rows:auto minmax(0,1fr)}}.bd-a-cap{grid-area:cap}.bd-a-prev{grid-area:prev}.bd-a-code{grid-area:code;min-height:0}.bd-caps{gap:22px;display:grid}.bd-live .bd-caps>*{grid-area:1/1}.bd-step{color:#4a5368;transition:color .25s}.bd-step .bd-step-n{transition:color .25s}.bd-step.is-done{color:#8892a6}.bd-step.is-active{color:#f4f7fb}.bd-step.is-active .bd-step-n{color:#0aa5cf}.bd-bar{transform-origin:0;transform:scaleX(1)}.bd-ed{background:#070b17;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;height:100%;min-height:0;display:flex;overflow:hidden}.bd-ed-tabs{border-bottom:1px solid #ffffff0f;flex-shrink:0;display:flex}.bd-tab{font-family:var(--font-jetbrains), ui-monospace, monospace;color:#5b6478;border-right:1px solid #ffffff0d;padding:8px 12px;font-size:10.5px;transition:color .2s,background-color .2s;position:relative}.bd-tab.is-active{color:#f4f7fb;background:#ffffff09}.bd-tab.is-active:after{content:"";background:#0aa5cf;height:2px;position:absolute;inset:0 0 auto}.bd-ed-body{flex:1;min-height:110px;position:relative;overflow:hidden}@media (min-width:1024px){.bd-ed-body{min-height:230px}}.bd-pane{padding:10px 0;position:absolute;inset:0}.bd-pane-brief,.bd-pane-page{opacity:0;visibility:hidden}.bd-row{font-family:var(--font-jetbrains), ui-monospace, monospace;white-space:pre;font-size:10.5px;line-height:17px;display:flex}@media (min-width:1024px){.bd-row{font-size:12px;line-height:20px}}.bd-ln{text-align:right;color:#2e3548;-webkit-user-select:none;user-select:none;flex-shrink:0;width:34px;padding-right:12px}.bd-txt{display:inline-block}.tk-c{color:#5b6478}.tk-k{color:#c084fc}.tk-f{color:#60a5fa}.tk-t{color:#0aa5cf}.tk-a{color:#93c5fd}.tk-s{color:#86efac}.tk-n{color:#f59e0b}.tk-p{color:#8892a6}.tk-h{color:#f4f7fb;font-weight:500}.tk-x{color:#d6dce8}.tk-ok{color:#22c55e}.tk-d{color:#5b6478}.bd-viewport{min-height:0;position:relative}.bd-root:not(.bd-live) .bd-viewport{aspect-ratio:760/560}.bd-stage{width:760px;height:560px;transform:translate(-50%, -50%) scale(var(--s,.45));transform-origin:50%;position:absolute;top:50%;left:50%}.bd-browser{background:#05080f;border:1px solid #ffffff1a;border-radius:14px;width:100%;height:100%;overflow:hidden;box-shadow:0 40px 90px -30px #000c,0 0 0 1px #1c4fe814}.bd-chrome{background:#0a0f1f;border-bottom:1px solid #ffffff0f;align-items:center;gap:6px;height:32px;padding:0 12px;display:flex}.bd-canvas{height:528px;position:relative;overflow:hidden}.bd-grid-faint{background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:28px 28px;position:absolute;inset:0}.bd-grid-bp{opacity:0;visibility:hidden;background-color:#1c4fe80d;background-image:linear-gradient(#3b82f629 1px,#0000 1px),linear-gradient(90deg,#3b82f629 1px,#0000 1px),linear-gradient(#3b82f60f 1px,#0000 1px),linear-gradient(90deg,#3b82f60f 1px,#0000 1px);background-size:70px 70px,70px 70px,14px 14px,14px 14px;position:absolute;inset:0}.bd-bp{pointer-events:none;opacity:0;visibility:hidden;border:1px dashed #60a5faa6;border-radius:7px;position:absolute;inset:-5px}.bd-bp-tag{color:#93c5fd;font-family:var(--font-jetbrains), ui-monospace, monospace;letter-spacing:.04em;white-space:nowrap;background:#0b1430;border-radius:3px;padding:1px 5px;font-size:8.5px;position:absolute;top:-8px;left:6px}.bd-skel{pointer-events:none;opacity:0;visibility:hidden;flex-direction:column;justify-content:center;gap:7px;display:flex;position:absolute;inset:0}.bd-skel.is-row{flex-direction:row;justify-content:space-between;align-items:center}.bd-skel.is-center{align-items:center}.bd-skel.is-start{align-items:flex-start}.bd-skel.is-row.is-center{justify-content:center;gap:10px}.bd-skel i{background:linear-gradient(90deg,#121a33,#1b2546,#121a33);flex-shrink:0;display:block}.bd-empty{opacity:0;visibility:hidden;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.bd-note{opacity:0;visibility:hidden;background:#0e1530;border:1px solid #ffffff17;border-radius:10px;width:210px;padding:11px 13px;position:absolute;box-shadow:0 14px 34px -12px #000000b3}.bd-swap{display:inline-grid}.bd-swap>*{grid-area:1/1}.bd-url-dev,.bd-st-wait{opacity:0;visibility:hidden}.bd-grad-wrap{display:inline-block;position:relative}.bd-grad-base{opacity:0}.bd-grad-wrap .bd-grad-text{position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.bd-nudge{animation:none}}
