:root{--brand:#3b6bff;--color:#3b6bff;--shape:#3b6bff;--code:#3b6bff;--demo-color:#3b6bff;--demo-stroke:#d8e1ff}
.topline,.button.primary,.download-button{color:#fff}.button.primary:hover{background:#2a56dd}.hero-facts>span:first-child b{font:22px/1 'Segoe UI',sans-serif;font-weight:650}
.hero-visual{background:radial-gradient(ellipse at 40% 65%,#3b6bff18,transparent 65%)}
.hero-panel{width:234px;height:452px}.hero-color{left:35px;top:62px;z-index:1}.hero-shapes{left:22%;top:8px;z-index:2}.hero-code{right:0;top:62px;z-index:3}
.color-frame iframe{width:264px;height:477px;transform:scale(.88)}.shapes-frame iframe,.code-frame iframe{width:400px;height:725px;transform:scale(.58)}
.product-logo{display:block;flex:none;width:20px;height:20px}.panel-title .product-logo{width:16px;height:16px}.demo-tabs .product-logo{width:19px;height:19px}
.ui-icon{display:inline-block;vertical-align:middle;width:17px;height:17px;flex:none}.topline .ui-icon,.text-link .ui-icon,.visual-bottom .ui-icon,.footer-top .ui-icon{width:13px;height:13px}.tool-strip b .ui-icon{width:13px;height:13px}
.product-card h3 span{color:#3b6bff}.product-card li:before{display:inline-block;width:12px;height:12px;background:currentColor;mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="black" stroke-width="2" d="m5 12 5 5L20 7"/></svg>') center/contain no-repeat;content:''}
.code-art svg{width:160px;height:70px;fill:none;stroke:#3b6bff;stroke-width:8;stroke-linecap:round;stroke-linejoin:round}
#demo-color,.rail-stage{--demo-color:#3b6bff;--demo-stroke:#d8e1ff}
.color-ring{border-width:7px;border-color:var(--demo-stroke);opacity:1;transition:border-color .25s}.color-outline{position:absolute;right:30px;bottom:24px;width:94px;height:94px;border:6px solid var(--demo-stroke);border-radius:22px;transform:rotate(20deg);transition:border-color .25s}
.color-composition h3 em{-webkit-text-stroke:1.6px var(--demo-stroke);paint-order:stroke fill;transition:color .25s,-webkit-text-stroke-color .25s}
.output-caption output{font-size:10px;max-width:160px;flex:none;line-height:1.6}.output-caption kbd,.rail-hint kbd{font:inherit;font-weight:700;border:1px solid #ffffff35;border-radius:3px;padding:1px 4px;color:#fff}
.shape-composition{background:#1c2233;color:#3b6bff}.shape-orbit{border-color:#3b6bff33}
.rail-sculpture>div{background:var(--demo-color);border:4px solid var(--demo-stroke);transition:background .25s,border-color .25s}
.rail-sculpture>div:nth-child(2){background:transparent;border-width:5px;box-shadow:none}.rail-sculpture>div:nth-child(3){background:var(--demo-color);opacity:.8}
.rail-stage-top>span:last-child{color:#7d9cff}.rail-poster{-webkit-text-stroke:.8px var(--demo-stroke);paint-order:stroke fill}.rail-poster span{-webkit-text-stroke:0}
.rail-hint{margin:0;padding:0 16px 16px;color:#c7cad2;font-size:10px;line-height:1.7}.rail-controls button[aria-pressed=true]{background:#3b6bff;color:#fff;border-color:#3b6bff}
.price{font-size:48px}.price>span{color:#9eb5ff;max-width:80px}.download-button:disabled{opacity:1;color:#fff;cursor:default}.download-button:disabled:hover{transform:none;filter:none}
.faq-list summary:after{width:16px;height:16px;flex:none;margin-top:2px;content:'';background:currentColor;mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path stroke="black" stroke-width="2" d="M12 5v14M5 12h14"/></svg>') center/contain no-repeat}
.faq-list details[open] summary:after{content:'';mask-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path stroke="black" stroke-width="2" d="M5 12h14"/></svg>')}
.closing{background:radial-gradient(ellipse at 50% 130%,#3b6bff1b,transparent 70%)}.light :focus-visible{outline-color:#3b6bff}
@media(min-width:1500px){.hero-code{right:0}.hero-shapes{left:25%}}
@media(max-width:800px){.hero-shapes{left:22%}.hero-code{right:0}.output-caption output{max-width:125px}.rail-hint{font-size:11px}}
@media(max-width:560px){.hero-shapes{left:132px}.hero-color{left:35px;top:62px}.hero-code{right:0}.hero .panel-ensemble{height:505px;margin-bottom:-157px}.color-composition h3 em{-webkit-text-stroke-width:1px}.color-outline{width:68px;height:68px;right:24px;bottom:22px;border-width:4px}.output-caption{align-items:flex-start}.output-caption output{max-width:112px;font-size:9px}.price{font-size:48px}.price>span{max-width:none}}
