.cs-lab{padding:76px 0 32px;background:radial-gradient(ellipse at 85% 40%,#17242c 0,transparent 45%),#080d11;border-block:1px solid #ffffff12}
.cs-lab .shell{width:min(1376px,90%)}
.cs-lab-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:70px;margin-bottom:36px}
.cs-lab-heading h2{font-size:clamp(36px,4vw,60px);line-height:1.04;letter-spacing:-.05em}
.cs-lab-heading>div:last-child{max-width:460px;padding-bottom:6px;justify-self:end}
.cs-lab-heading>div>p:not(.eyebrow){font-size:15px;color:#b6c3ce;line-height:1.65;margin:0}
.cs-control-summary{display:block;color:#f1f4f8;font-size:11px;letter-spacing:.07em;margin-top:16px}
.cs-lab-layout{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:38px;align-items:stretch}
.cs-scene{position:relative;min-width:0;overflow:hidden;border:1px solid #a1c3db2c;border-radius:22px;background:#0b1219;isolation:isolate}
.cs-car{position:absolute;inset:0;width:100%;height:100%;display:block}
.cs-light{opacity:var(--cs-intensity,1);mix-blend-mode:screen}
.cs-scene:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(#02070c88,transparent 20%,transparent 58%,#03080cba 87%,#03080cee)}
.cs-scene-top{position:absolute;top:24px;left:26px;right:22px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:2}
.cs-scene-top>span{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:700;letter-spacing:.12em;color:#fff}
.cs-scene-top>span i{width:6px;height:6px;background:#f91738;border-radius:50%;box-shadow:0 0 12px #ff163a}
.cs-scene-top button{display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff40;border-radius:50%;background:#09101666;color:#fff;cursor:pointer}
.cs-scene-top button svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5}
.cs-scene-caption{position:absolute;left:30px;right:30px;bottom:82px;z-index:2}
.cs-scene-caption>span{display:inline-block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;color:rgb(var(--cs-tone));border:1px solid #ffffff33;border-radius:4px;margin-bottom:12px;background:#060b1166}
.cs-scene-caption strong{display:block;font-size:clamp(23px,2.4vw,35px);line-height:1.12;letter-spacing:-.035em;max-width:450px}
.cs-scene-caption p{font-size:12px;color:#ced5dc;margin-top:10px}
.cs-scene-meter{position:absolute;bottom:27px;left:30px;right:30px;z-index:2;display:flex;align-items:center;gap:12px;font-size:10px;color:#e0e6ec;letter-spacing:.05em}
.cs-scene-meter>div{height:3px;flex:1;background:#ffffff26;border-radius:5px;overflow:hidden}
.cs-scene-meter i{display:block;height:100%;width:100%;background:rgb(var(--cs-tone));box-shadow:0 0 12px rgb(var(--cs-tone));transition:width .1s}
.cs-scene-meter output{font-variant-numeric:tabular-nums;width:34px;text-align:right}
.cs-phone-stage{position:relative;display:grid;place-items:center}
.cs-phone-stage:before{content:"";position:absolute;inset:12% -20%;border-radius:50%;background:radial-gradient(ellipse,#f31b2c14,transparent 65%);pointer-events:none}
.cs-phone{position:relative;width:306px;max-width:100%;padding:16px 21px 13px;box-sizing:border-box;color:#f4f5f7;background:linear-gradient(155deg,#141c24,#030709 42%,#020507);border:2px solid #727981;border-radius:42px;box-shadow:0 0 0 5px #070a0f,0 0 0 6px #282e36,0 24px 70px #0009,inset 0 0 0 3px #03070b;z-index:1;font-family:Inter,Arial,sans-serif}
.cs-device-top{height:18px;display:flex;align-items:center;justify-content:space-between;padding:0 3px;margin-bottom:17px;font-size:10px;font-weight:700}
.cs-device-top i{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:80px;height:21px;background:#020508;border-radius:20px}
.cs-phone-heading{display:flex;align-items:center;justify-content:space-between;gap:6px}
.cs-phone-heading small{font-size:8px;letter-spacing:.12em;color:#91a0ae}
.cs-phone-heading h3{font-size:18px;letter-spacing:-.04em;margin:4px 0 0;font-weight:650}
.cs-demo-badge{font-size:8px;letter-spacing:.02em;background:#ffffff0b;border:1px solid #ffffff20;color:#b7c3ce;padding:5px 6px;border-radius:5px}
.cs-phone input[type=range]{display:block;appearance:none;width:100%;margin:10px 0 0;height:5px;border:0;border-radius:9px;padding:0;background:#354251;cursor:pointer;accent-color:#f52b40}
.cs-phone input[data-cs-range=tone]{height:8px;background:linear-gradient(90deg,#ffb923,#ffdd95 45%,#ecf3f8 65%,#b9e2ff)}
.cs-phone input[type=range]::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #cad2d9;box-shadow:0 1px 6px #0008}
.cs-phone input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid #cad2d9;box-shadow:0 1px 6px #0008}
.cs-phone input:focus-visible{outline:2px solid #fff;outline-offset:6px}
.cs-tone-control label,.cs-level label,.cs-effects legend{font-size:10px;letter-spacing:.02em;color:#b9c5d0;font-weight:500}
.cs-scale{display:flex;justify-content:space-between;color:#91a1b2;font-size:9px;margin-top:9px}
.cs-levels{display:grid;gap:20px;border-top:1px solid #ffffff10;padding-top:16px}
.cs-level>div{display:flex;align-items:center;justify-content:space-between}
.cs-level label{display:flex;align-items:center;gap:7px}.cs-level label svg{width:14px;height:14px;stroke:#9eb0be;fill:none;stroke-width:1.5}
.cs-level output{font-size:10px;font-weight:650;font-variant-numeric:tabular-nums}
.cs-device-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff10;padding-top:13px;margin-top:16px}
.cs-device-bottom>span{font-size:10px;color:#b9c6d3;display:flex;align-items:center;gap:6px}
.cs-device-bottom>span:before{content:"";width:5px;height:5px;border-radius:50%;background:#b6dcc3}
.cs-power{border:1px solid #ff4665;display:grid;place-items:center;color:#fff;background:#f90c31;box-shadow:0 0 20px #ff163a33;border-radius:50%;width:39px;height:39px;cursor:pointer}
.cs-power svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8}
.cs-home-indicator{width:80px;height:3px;background:#c1c8ce;border-radius:4px;margin:13px auto 0;opacity:.7}
.cs-tone-control{margin:25px 0 19px}
.cs-channel-labels{display:flex;justify-content:space-between;gap:6px;font-size:9px;color:#d4dce2;margin-top:12px}.cs-channel-labels span:first-child{color:#ffce43}.cs-channel-labels b{font-weight:600;margin-left:3px}
.cs-phone input[data-cs-range=tone]{height:24px;margin-top:7px;background:linear-gradient(90deg,#ffcb3f,#fff0b4 48%,#e8f4fc)}
.cs-phone input[data-cs-range=tone]::-webkit-slider-thumb,.cs-phone input[data-cs-range=brightness]::-webkit-slider-thumb{width:5px;height:30px;border:1px solid #fff;border-radius:4px;background:#fff;box-shadow:0 0 0 1px #070b1266,0 1px 6px #0004}
.cs-phone input[data-cs-range=tone]::-moz-range-thumb,.cs-phone input[data-cs-range=brightness]::-moz-range-thumb{width:4px;height:28px;border:1px solid #fff;border-radius:4px;background:#fff}
.cs-phone input[data-cs-range=brightness]{height:21px;background:linear-gradient(90deg,#202b36,#e3f2fa)}
.cs-phone input[data-cs-range=brightness]::-webkit-slider-thumb{height:27px}
.cs-levels{gap:18px;padding-top:15px}.cs-quick{border:0;padding:0;margin:21px 0 0;min-width:0}
.cs-quick legend{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0;margin-bottom:10px;font-size:10px;color:#c6d0d9}
.cs-quick legend>span{display:flex;align-items:center;gap:4px;color:#8493a1;font-size:9px}.cs-quick legend svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5}
.cs-quick-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:5px}
.cs-quick-row button{display:grid;place-items:center;min-height:47px;border:0;border-radius:9px;background:none;color:#111820;padding:5px;cursor:pointer}
.cs-quick-row button>i{display:flex;align-items:center;justify-content:center;width:34px;height:34px;background:var(--cs-swatch);border-radius:50%;font-style:normal;font-size:10px;font-weight:650;box-shadow:0 0 0 1px #ffffff22}
.cs-quick-row button small{font-size:7px;margin-left:1px}
.cs-quick-row button:last-child>i{background:transparent;border:1px solid var(--cs-swatch);color:var(--cs-swatch);box-shadow:none}
.cs-quick-row button[aria-pressed=true]>i{outline:2px solid #ff183e;outline-offset:4px}
.cs-quick-row button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.cs-current-mode{display:flex;align-items:center;justify-content:space-between;margin:13px 0 0;font-size:9px;color:#8798a8}.cs-current-mode strong{font-weight:500;color:#d5e0e9}
.cs-is-off .cs-tone-control,.cs-is-off .cs-levels,.cs-is-off .cs-quick{opacity:.6}
.cs-is-off .cs-power{background:#26313d;border-color:#6b7c8c;box-shadow:none}.cs-is-off .cs-device-bottom>span:before{background:#718090}
.cs-lab-foot{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin-top:26px}
.cs-lab-foot p{font-size:10px;line-height:1.65;max-width:780px;color:#8798a8}
.cs-lab-foot>span{font-size:10px;color:#c7d3dc;flex-shrink:0;padding-left:12px;border-left:2px solid #fe1533;max-width:260px;line-height:1.5}
.cs-strobe .cs-light{animation:cs-strobe-preview 180ms steps(1,end) infinite}.cs-paused .cs-light{animation-play-state:paused}
@keyframes cs-strobe-preview{0%,100%{opacity:var(--cs-intensity,1)}22%{opacity:0}}
.cs-lab button:focus-visible,.cs-phone button:focus-visible{outline:2px solid #fff;outline-offset:4px}
#aplicativo .app-layout{display:grid;grid-template-columns:minmax(0,1fr) 306px minmax(0,1fr);gap:50px;align-items:center}
#aplicativo .app-photo{opacity:.35;clip-path:none}#aplicativo .app-phone{padding:10px 0}#aplicativo .app-features{padding:0}
#aplicativo .app-phone .cs-phone{transform:none}
@media(min-width:1600px){.cs-lab-layout{gap:55px}}
@media(max-width:1100px){.cs-lab-layout{gap:24px}.cs-car{width:115%;left:-8%}.cs-scene-caption{left:23px;right:20px}.cs-scene-caption strong{font-size:26px}.cs-lab-heading{gap:35px}#aplicativo .app-layout{gap:30px;grid-template-columns:minmax(0,1fr) 306px}#aplicativo .app-features{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}#aplicativo .app-feature{margin:0;display:block}#aplicativo .app-feature>.icon{margin-bottom:12px}}
@media(max-width:760px){.cs-lab{padding:48px 0 26px}.cs-lab-heading{display:block;margin-bottom:26px}.cs-lab-heading h2{font-size:43px}.cs-lab-heading>div:last-child{max-width:440px;margin-top:22px}.cs-lab-heading>div>p:not(.eyebrow){font-size:14px}.cs-control-summary{font-size:10px;margin-top:12px}.cs-lab-layout{grid-template-columns:minmax(0,1fr);gap:30px}.cs-scene{height:auto;aspect-ratio:1.07;border-radius:16px}.cs-car{width:100%;left:0}.cs-scene-caption{left:20px;bottom:59px}.cs-scene-caption strong{font-size:24px;max-width:260px}.cs-scene-caption p{display:none}.cs-scene-caption>span{margin-bottom:8px;font-size:9px}.cs-scene-top{top:16px;left:20px;right:16px}.cs-scene-top>span{font-size:8px}.cs-scene-meter{left:20px;right:20px;bottom:22px}.cs-phone-stage{padding:7px 0 0}.cs-lab-foot{display:block;margin-top:25px}.cs-lab-foot>span{display:block;margin-top:13px;max-width:none}.cs-lab-foot p{font-size:10px}#aplicativo .app-layout{grid-template-columns:minmax(0,1fr);gap:32px}#aplicativo .app-phone{display:grid;place-items:center}#aplicativo .app-features{grid-template-columns:1fr 1fr;gap:24px}#aplicativo .app-feature h3{font-size:13px}#aplicativo .app-feature p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.cs-strobe .cs-light{animation:none}.cs-scene-meter i{transition:none}}

@media(max-width:760px){
  .cs-phone-stage:before{inset:12% 0}
  .cs-scene{position:sticky;top:80px;z-index:3;height:clamp(210px,31vh,270px);aspect-ratio:auto;box-shadow:0 14px 22px #0009}
  .cs-scene-caption{bottom:43px}.cs-scene-caption strong,.cs-scene-caption p{display:none}.cs-scene-caption>span{font-size:8px;padding:4px 7px}
  .cs-scene-meter{bottom:17px;font-size:9px}.cs-scene-top{top:12px}
  .cs-lab-layout{align-items:start}.cs-phone input,.cs-phone button{scroll-margin-top:370px}
}