/* Base's actual application screenshots, scoped to this product page. */
html{scroll-padding-top:var(--bs-header-height,76px)}
.bs-intro{position:relative;overflow:hidden;padding:58px 0 54px}
.bs-intro-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr);align-items:center;gap:40px}
.bs-intro-copy{position:relative;z-index:1}
.bs-intro-kicker{display:flex;align-items:center;gap:12px;margin-bottom:24px;color:#c4ceda;font-size:11px;font-weight:600;letter-spacing:.04em}
.bs-intro-kicker img{width:22px;height:22px;flex:none}
.bs-intro-kicker>span:last-child{color:#738093}
.bs-intro-divider{height:13px;width:1px;background:#394250}
.bs-intro h1{margin:0;color:#f2f5f9;font-size:clamp(34px,3.7vw,56px);font-weight:700;line-height:1.16;letter-spacing:-.045em}
.bs-intro h1>span{display:block}
.bs-intro-accent{color:#52d9ef}
.bs-intro-copy>p{margin:22px 0 0;max-width:530px;font-size:14px;line-height:1.85;color:#a4b1c2}
.bs-intro-links{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:28px}
.bs-intro-links a{display:inline-flex;align-items:center;gap:22px;font-size:12px;font-weight:600;color:#d4dce7;padding:12px 0}
.bs-intro-links a:first-child{padding:13px 20px;border:1px solid #3dd2ec;border-radius:8px;background:#32cce7;color:#100a0e;box-shadow:0 4px 24px #32cce718}
.bs-intro-links a:hover{color:#a3edfa}
.bs-intro-links a:first-child:hover{background:#52d9ef;color:#100a0e}
.bs-intro-links a:focus-visible{outline:2px solid #a3edfa;outline-offset:4px}
.bs-intro-art{position:relative;display:grid;place-items:center;justify-self:center;width:min(100%,320px);aspect-ratio:1;isolation:isolate}
.bs-intro-art:before{content:"";position:absolute;inset:6%;z-index:-1;background:radial-gradient(ellipse at 68% 35%,#32cce720,transparent 65%),radial-gradient(ellipse at 28% 75%,#27d6cf13,transparent 65%);filter:blur(14px)}
.bs-intro-art>img{width:116px;height:116px;transform:none;filter:drop-shadow(9px 14px 30px #32cce72b)}
.bs-orbit{position:absolute;inset:2%;border:1px solid #35404b88;border-radius:50%;transform:rotate(-28deg)}
.bs-orbit-outer{border-right-color:#32cce777;border-bottom-color:#28404755}
.bs-orbit-inner{inset:16%;border-color:#28354188;border-left-color:#60cfcb66;transform:rotate(35deg)}
.bs-orbit-point{position:absolute;width:7px;height:7px;border-radius:50%;background:#6ee5f6;top:13%;right:16%;box-shadow:0 0 14px #32cce780}
@media(max-width:1000px){.bs-intro-layout{grid-template-columns:minmax(0,1fr) 220px;gap:24px}.bs-intro-art>img{width:86px;height:86px}}
@media(max-width:700px){.bs-intro{padding:38px 0 42px}.bs-intro-layout{display:block}.bs-intro-art{display:none}.bs-intro-kicker{margin-bottom:22px}.bs-intro h1{font-size:clamp(30px,6.5vw,42px);letter-spacing:-.035em}.bs-intro-copy>p{margin-top:18px;font-size:13px}.bs-intro-links{margin-top:24px}}
.bs-figure{margin:0;min-width:0}
.bs-screenshot{display:block;position:relative;width:100%;padding:0;background:#0a0e12;overflow:hidden;border:1px solid var(--line);border-radius:10px;cursor:zoom-in}
.bs-screenshot img{display:block;width:100%;height:auto}
.bs-gallery .bs-screenshot{aspect-ratio:2296/1354;display:grid;place-items:center}
.bs-gallery .bs-screenshot img{width:100%;height:100%;object-fit:contain}
.bs-enlarge{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:8px;background:#10151bef;border:1px solid #526074;color:#eef1f6;border-radius:7px;padding:8px 12px;font-size:11px;opacity:0;transform:translateY(4px);transition:opacity .18s,transform .18s}
.bs-screenshot:hover .bs-enlarge,.bs-screenshot:focus-visible .bs-enlarge{opacity:1;transform:none}
.bs-story{padding:0 0 80px}
.bs-feature{position:relative;isolation:isolate;margin:0;padding:0;scroll-margin-top:16px}
.bs-feature+.bs-feature{margin-top:88px}
.bs-feature-bar{position:sticky;top:calc(var(--bs-header-height,76px) + 8px);z-index:10;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:66px;padding:14px 0;border-top:2px solid #267b91;border-bottom:1px solid #2d3744;background:#0b0f14f5;backdrop-filter:blur(16px)}
.bs-feature-name{display:flex;align-items:center;gap:14px;min-width:0}
.bs-feature-name strong{font-size:19px;font-weight:700;line-height:1.35;color:#f2f5f9}
.bs-feature-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:52px;align-items:start;margin:0;padding:32px 0}
.bs-feature-heading .eyebrow{color:#3dd2ec;font-size:10px}
.bs-feature-heading h2{font-size:clamp(28px,3.3vw,43px);margin:0;max-width:520px;line-height:1.16}
.bs-feature-heading p{font-size:14px;line-height:1.8}
.bs-feature-heading ul{padding:0;margin:18px 0 0;list-style:none;display:grid;gap:10px}
.bs-feature-heading li{color:#c1cbd6;font-size:12px;line-height:1.75;padding-left:17px;position:relative}
.bs-feature-heading li:before{content:"";width:4px;height:4px;background:#3dd2ec;border-radius:50%;position:absolute;left:0;top:.78em}
.bs-gallery{min-width:0}
.bs-gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:2px 2px 14px}
.bs-gallery-hint{margin:0;color:#c4ceda;font-size:12px;line-height:1.6}
.bs-gallery-controls{display:flex;align-items:center;gap:8px;flex:none}
.bs-gallery-controls button{display:grid;place-items:center;width:44px;height:40px;padding:0;border:1px solid #596576;border-radius:8px;background:#222d3a;color:#f1f5fa;font-size:22px;cursor:pointer;transition:background .15s,border-color .15s}
.bs-gallery-controls button:hover:not(:disabled){background:#143945;border-color:#3dd2ec}
.bs-gallery-controls button:disabled{background:#151c24;border-color:#2f3946;color:#586373;cursor:default}
.bs-gallery-controls [data-gallery-count]{min-width:40px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;color:#e6edf5}
.bs-gallery-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:14px;scrollbar-width:thin;scrollbar-color:#455162 transparent}
.bs-gallery-tabs button{padding:11px 15px;border:1px solid #4a5667;border-radius:8px;background:#1e2834;box-shadow:0 2px 0 #070b10;color:#d5dfea;white-space:nowrap;font-size:12px;font-weight:600;line-height:1.5;cursor:pointer;transition:background .15s,border-color .15s}
.bs-gallery-tabs button:hover{background:#303444;border-color:#8be7f5;color:#fff}
.bs-gallery-tabs button[aria-selected=true]{color:#fff;background:#154d5e;border-color:#3dd2ec;box-shadow:inset 0 -2px 0 #3dd2ec}
.bs-gallery-tabs button:focus-visible,.bs-gallery-controls button:focus-visible{outline:2px solid #a3edfa;outline-offset:2px}
.bs-gallery [role=tabpanel]{min-width:0}
.bs-lightbox{background:#0c1117;border:1px solid #354152;color:var(--text);padding:0;border-radius:12px;width:min(1900px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 40px);overflow:hidden;box-shadow:0 24px 100px #0009}
.bs-lightbox::backdrop{background:#020509e8;backdrop-filter:blur(8px)}
.bs-lightbox[open]{display:flex;flex-direction:column}
.bs-lightbox-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 20px;border-bottom:1px solid var(--line);flex:none}
.bs-lightbox-bar p{color:#e0e6ed;font-size:13px}
.bs-lightbox-bar p{margin-right:auto}
.bs-lightbox button{background:#17202b;border:1px solid #364251;border-radius:6px;padding:8px 14px;font-size:12px;flex:none}
.bs-lightbox button:hover{border-color:#3dd2ec}
.bs-lightbox button:disabled{opacity:.4;cursor:default}
.bs-lightbox-image{overflow:auto;display:grid;place-items:center;min-height:0;padding:10px}
.bs-lightbox-image img{width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 178px);object-fit:contain}
.bs-lightbox-image img{cursor:zoom-in}
.bs-lightbox.bs-actual-size .bs-lightbox-image{display:block;place-items:start;text-align:left;overflow-anchor:none}
.bs-lightbox.bs-actual-size .bs-lightbox-image img{width:auto;max-width:none;max-height:none;cursor:zoom-out}
.bs-lightbox-controls{display:flex;align-items:center;justify-content:center;gap:20px;padding:10px 16px;border-top:1px solid var(--line);font-size:11px;flex:none}
body.bs-lightbox-open{overflow:hidden}

@media(max-width:900px){.bs-feature-heading{gap:28px}.bs-feature-heading h2{font-size:32px}.bs-feature+.bs-feature{margin-top:64px}}
@media(max-width:600px){.bs-enlarge{display:none}.bs-story{padding:0 0 48px}.bs-feature-heading{grid-template-columns:1fr}.bs-feature-heading p{font-size:13px}.bs-feature-heading li{font-size:12px}.bs-gallery-tabs{padding-bottom:8px}.bs-gallery-tabs button{font-size:11px;padding:9px 10px}.bs-screenshot{border-radius:6px}.bs-lightbox{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.bs-lightbox-bar{padding:10px;gap:10px}.bs-lightbox-bar p{font-size:11px}.bs-lightbox-controls{gap:8px}.bs-lightbox button{font-size:10px;padding:8px}.bs-lightbox-image{display:block;overflow:auto;padding:4px}.bs-lightbox-image img{width:1100px;max-width:none;max-height:none}.bs-lightbox-controls [data-lightbox-count]{min-width:35px;text-align:center}}
@media(prefers-reduced-motion:reduce){.bs-enlarge,.bs-gallery-tabs button,.bs-gallery-controls button{transition:none}}
@media(max-width:600px){.bs-gallery-toolbar{gap:10px;padding:4px 3px 12px}.bs-gallery-hint{font-size:11px}.bs-gallery-controls{gap:4px}.bs-gallery-controls button{width:38px;height:42px}.bs-gallery-controls [data-gallery-count]{min-width:34px;font-size:11px}.bs-gallery-tabs{gap:6px}}
@media(max-width:600px){.bs-feature+.bs-feature{margin-top:48px}.bs-feature-bar{top:var(--bs-header-height,67px);min-height:58px;padding:12px 0;gap:10px}.bs-feature-name{gap:9px}.bs-feature-name strong{font-size:14px}.bs-feature-heading{padding:24px 0;margin:0;gap:18px}.bs-feature-heading h2{font-size:27px;margin:0}.bs-gallery-tabs{padding-top:2px}.bs-feature-heading ul{margin-top:14px}}
@media(max-width:600px){.bs-lightbox-image img{width:auto;max-width:100%;max-height:calc(100dvh - 160px)}.bs-lightbox-bar{flex-wrap:wrap}.bs-lightbox-bar p{flex-basis:100%;margin:0}}
@media(max-width:600px){.bs-enlarge{display:flex;opacity:1;transform:none;font-size:10px;right:8px;bottom:8px;padding:6px 8px}}

.bs-intro-art>img{width:156px;height:156px;object-fit:contain;filter:drop-shadow(0 14px 30px #32cce720)}
.bs-section-nav{display:flex;gap:12px;padding-bottom:30px;flex-wrap:wrap}
.bs-section-nav a{display:flex;align-items:center;gap:12px;padding:12px 18px;border:1px solid var(--line);border-radius:8px;font-size:12px;color:#c4ceda;background:#101820;min-height:44px}
.bs-section-nav a:hover{border-color:#3dd2ec;color:#fff}
.bs-section-nav a:focus-visible,.bs-screenshot:focus-visible{outline:2px solid #8be7f5;outline-offset:4px}
.bs-step{font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.05em;color:#52d9ef;flex:none}
.bs-tools{padding-top:0}
.bs-tools-heading{max-width:680px;margin-bottom:34px}
.bs-tools-heading h2{margin:14px 0;font-size:clamp(28px,3.3vw,43px)}
.bs-tools-heading p{font-size:14px}
.bs-tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.bs-tool{display:grid;grid-template-columns:30px minmax(0,1fr);align-content:start;gap:16px;padding:26px;border:1px solid var(--line);border-radius:10px;background:#10171e}
.bs-tool-icon{width:28px;height:28px;color:#52d9ef}
.bs-tool h3{font-size:16px;line-height:1.65;margin:0}
.bs-tool p{grid-column:1/-1;font-size:12px;line-height:1.8;margin:0;color:#a4b1c2}
@media(max-width:900px){.bs-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bs-intro-art>img{width:130px;height:130px}}
@media(max-width:600px){.bs-intro{padding-bottom:24px}.bs-section-nav{gap:8px;padding-bottom:24px}.bs-section-nav a{padding:10px;font-size:11px;gap:8px}.bs-tools-grid{grid-template-columns:1fr}.bs-tool{padding:22px}.bs-tools-heading h2{font-size:27px}.bs-feature-heading h2{max-width:100%}.bs-tools-heading p{font-size:13px}}
