.visuals-page{--visuals-accent:#b8dcff;--glass-alpha:.76;--hud-scale:1;padding-bottom:56px}
.visuals-intro{text-align:center;position:relative;padding:40px 20px 49px;background:radial-gradient(ellipse at 50% 30%,#ffffff04,transparent 65%)}
.visuals-kicker{display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;letter-spacing:2.6px;color:#c5c5cb;font-weight:600}.visuals-spark{font-size:24px;line-height:1;color:#e8e8ee}.visuals-status{font-size:9px;letter-spacing:.3px;color:#a5a5ad;border:1px solid #35353c;padding:4px 9px;border-radius:20px;background:#1c1c20}
.visuals-intro h1{font-size:clamp(38px,5vw,67px);line-height:1.08;letter-spacing:-3px;margin:25px 0 22px;font-weight:700}.visuals-intro h1>span{color:#94949d}.visuals-intro>p{font-size:14px;line-height:1.9;color:#a7a7b0;margin:0 auto 24px}.visuals-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.visuals-actions .btn{font-size:12px;padding:11px 18px}.visuals-release{color:#81818b;font-size:10px;margin-top:21px}.visuals-release .dot{background:#aeb9b0;width:5px;height:5px}
.visuals-lab{border:1px solid #38383f;border-radius:14px;overflow:hidden;background:#111113;box-shadow:0 28px 90px #0005;scroll-margin-top:110px}.visuals-lab:focus-visible{outline:2px solid #777;outline-offset:5px}.visuals-lab-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 20px;background:#1a1a1e;border-bottom:1px solid #303036;font-size:9px;color:#8b8b97;letter-spacing:1.5px}.visuals-lab-head>span:first-child{display:flex;gap:6px}.visuals-lab-head i{display:block;width:7px;height:7px;border-radius:50%;background:#494951}.visuals-lab-head i:first-child{background:#74747b}.concept-tag{font-size:9px;letter-spacing:0;border:1px solid #36363d;padding:3px 7px;border-radius:4px}
.visuals-lab-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px}.visuals-preview{min-width:0;display:flex;flex-direction:column}.visuals-scene{position:relative;flex:1;min-height:460px;overflow:hidden;isolation:isolate;background:#23241f}.visuals-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:57% center;filter:brightness(.8)}.visuals-vignette{position:absolute;inset:0;background:linear-gradient(0deg,#080b1399,transparent 65%),radial-gradient(ellipse at center,transparent 20%,#080b1344)}
.hud-glass{background:rgba(13,16,20,var(--glass-alpha));border:1px solid #ffffff30;backdrop-filter:blur(16px);box-shadow:0 8px 25px #0003;color:#f3f5f8;border-radius:10px}.visuals-watermark{position:absolute;left:23px;top:23px;display:flex;gap:9px;align-items:center;padding:10px 13px;transform:scale(var(--hud-scale));transform-origin:top left}.visuals-watermark>span{color:var(--visuals-accent);font-size:23px;line-height:1}.visuals-watermark strong{font-size:12px;letter-spacing:-.4px}.visuals-watermark small{font-size:6px;letter-spacing:1px;color:var(--visuals-accent);border-left:1px solid #ffffff22;padding-left:9px}
.visuals-target{position:absolute;right:23px;top:90px;padding:12px;display:flex;align-items:center;gap:12px;width:237px;transform:scale(var(--hud-scale));transform-origin:top right}.visuals-head{width:43px;height:43px;overflow:hidden;border-radius:7px;background:color-mix(in srgb,var(--visuals-accent) 15%,#121720);flex-shrink:0}.visuals-head img{width:100%;height:100%;object-fit:cover;transform:scale(1.5);object-position:center 30%}.visuals-target>div:last-child{flex:1}.target-name{font-size:12px;font-weight:600;display:flex;gap:10px;align-items:center}.target-name small{font-size:6px;letter-spacing:.8px;color:#8f9ba5}.visuals-health{height:4px;border-radius:3px;background:#ffffff15;margin:10px 0 5px}.visuals-health span{display:block;height:100%;width:86%;border-radius:inherit;background:var(--visuals-accent);box-shadow:0 0 12px color-mix(in srgb,var(--visuals-accent) 25%,transparent)}.visuals-target>div>small{display:flex;justify-content:space-between;font-size:8px;color:var(--visuals-accent)}.visuals-target>div>small span{color:#9b9da3;font-size:7px}
.visuals-crosshair{position:absolute;top:47%;left:50%;width:18px;height:18px;transform:translate(-50%,-50%) scale(var(--hud-scale));filter:drop-shadow(0 1px 2px #000);color:var(--visuals-accent)}.visuals-crosshair i{position:absolute;background:currentColor;border-radius:1px}.visuals-crosshair i:first-child{width:18px;height:2px;top:8px}.visuals-crosshair i:last-child{height:18px;width:2px;left:8px}
.visuals-scene-caption{position:absolute;left:28px;bottom:100px;color:#fff}.visuals-scene-caption>span{font-size:7px;letter-spacing:2px;color:#cbd1d7}.visuals-scene-caption strong{display:block;font-weight:500;font-size:28px;line-height:1.25;letter-spacing:-1px;margin-top:10px;text-shadow:0 2px 14px #0005}
.visuals-hotbar{position:absolute;bottom:22px;left:50%;display:flex;gap:4px;padding:5px;border-radius:9px;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:bottom center}.visuals-hotbar>span{display:grid;place-items:center;width:28px;height:28px;font:10px ui-monospace,monospace;border:1px solid #ffffff12;background:#ffffff05;border-radius:4px;color:#ffffff66}.visuals-hotbar>span.selected{color:var(--visuals-accent);border-color:var(--visuals-accent);background:color-mix(in srgb,var(--visuals-accent) 15%,transparent)}
.visuals-particles{position:absolute;inset:0;pointer-events:none}.visuals-particles i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:var(--visuals-accent);opacity:.55;box-shadow:0 0 9px var(--visuals-accent);animation:visuals-drift var(--duration) ease-in-out var(--delay) infinite alternate}@keyframes visuals-drift{from{transform:translate(0,10px);opacity:.15}to{transform:translate(12px,-18px);opacity:.75}}
.visuals-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 18px;border-top:1px solid #303036;background:#19191c;color:#858590;font-size:9px}.visuals-preview-bar>span{display:flex;gap:7px;align-items:center}.visuals-preview-bar i{width:5px;height:5px;border-radius:50%;background:var(--visuals-accent)}.visuals-preview-bar button{display:flex;align-items:center;gap:6px;border:1px solid #38383f;background:#242429;padding:6px 9px;border-radius:5px;color:#c2c2cb;font-size:9px;cursor:pointer}.visuals-preview-bar button:hover{background:#34343c}.visuals-clean :is(.visuals-watermark,.visuals-target,.visuals-crosshair,.visuals-hotbar){visibility:hidden}.visuals-scene [hidden]{display:none!important}
.visuals-controls{padding:22px;background:#161619;border-left:1px solid #303036}.visuals-control-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:10px}.visuals-control-title h2{font-size:13px;font-weight:500;margin:0}.visuals-control-title button{color:#8c8c99;background:none;border:0;font-size:9px;cursor:pointer;padding:4px}.visuals-control-title button:hover{color:#fff}.visuals-controls fieldset{border:0;padding:0;margin:0 0 22px;min-width:0}.visuals-controls legend{width:100%;font-size:10px;color:#a3a3ae;margin-bottom:12px}.visuals-controls output{float:right;color:var(--visuals-accent);font-size:9px}.visuals-presets>div{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.visuals-presets button{display:flex;align-items:center;flex-direction:column;gap:6px;cursor:pointer;background:#202025;border:1px solid #36363d;border-radius:7px;padding:9px 5px;font-size:8px;color:#9b9ba7}.visuals-presets button i{width:17px;height:17px;border-radius:50%;background:var(--swatch);border:3px solid #ffffff22}.visuals-presets button[aria-pressed=true]{border-color:var(--visuals-accent);background:color-mix(in srgb,var(--visuals-accent) 8%,#17171b);color:#fff}.visuals-presets button:hover{background:#303038}
.visuals-slider{margin-bottom:19px}.visuals-slider label{display:block;font-size:10px;color:#b4b4be;margin-bottom:8px}.visuals-slider input{width:100%;accent-color:var(--visuals-accent);cursor:pointer;margin:0;height:18px}.visuals-toggles{border-top:1px solid #2b2b32!important;padding-top:17px!important;margin:23px 0 0!important}.visuals-toggles legend{margin-bottom:0;padding-right:8px;width:auto}.visuals-toggles label{display:flex;position:relative;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;cursor:pointer}.visuals-toggles label strong{display:block;font-size:10px;font-weight:500;color:#d1d1d9}.visuals-toggles label small{display:block;font-size:8px;color:#787885;margin-top:3px}.visuals-toggles input{position:absolute;right:0;width:33px;height:20px;opacity:0;cursor:pointer}.visuals-switch{width:30px;height:17px;flex:none;background:#36363f;border:1px solid #494953;border-radius:20px;position:relative;pointer-events:none}.visuals-switch::after{content:'';width:11px;height:11px;background:#90909d;border-radius:50%;position:absolute;left:2px;top:2px;transition:transform .2s}.visuals-toggles input:checked+.visuals-switch{background:color-mix(in srgb,var(--visuals-accent) 25%,#17171b);border-color:color-mix(in srgb,var(--visuals-accent) 50%,#17171b)}.visuals-toggles input:checked+.visuals-switch::after{background:var(--visuals-accent);transform:translateX(13px)}.visuals-toggles input:focus-visible+.visuals-switch{outline:2px solid white;outline-offset:4px}.visuals-local-note{margin:19px 0 0;color:#71717e;font-size:8px;line-height:1.7}
.visuals-disclaimer{font-size:10px;text-align:center;color:#777783;margin:16px 15px 0}.visuals-principles{display:grid;grid-template-columns:repeat(3,1fr);margin:45px 0 40px;gap:30px}.visuals-principles article{border-top:1px solid #333338;padding-top:23px}.visuals-principles article>span{color:#777782;letter-spacing:1.4px;font-size:8px}.visuals-principles h2{font-size:18px;line-height:1.4;letter-spacing:-.5px;margin:12px 0 10px;font-weight:500}.visuals-principles p{font-size:12px;color:#8c8c98;line-height:1.9;margin:0}.visuals-soon{display:flex;align-items:center;gap:24px;border:1px solid #303036;border-radius:12px;padding:27px 30px;background:linear-gradient(115deg,#202024,#141417)}.visuals-soon>.visuals-spark{font-size:40px;color:#a5a5b2}.visuals-soon>div{flex:1}.visuals-soon h2{font-size:19px;letter-spacing:-.5px;margin:0 0 7px;font-weight:500}.visuals-soon p{margin:0;font-size:11px;color:#898997}.visuals-soon .btn{font-size:11px}.visuals-faq{max-width:830px;margin:35px auto 0}.visuals-faq details{border-bottom:1px solid #29292f;padding:17px 0}.visuals-faq summary{font-size:12px;cursor:pointer;color:#c7c7d0}.visuals-faq p{color:#888895;font-size:12px;line-height:1.85}
@media(max-width:960px){.visuals-lab-grid{grid-template-columns:minmax(0,1fr) 250px}.visuals-controls{padding:18px}.visuals-target{right:16px;top:100px}.visuals-intro h1{font-size:53px}.visuals-principles{gap:20px}.visuals-principles h2{font-size:16px}}
@media(max-width:760px){.visuals-intro{padding:27px 0 35px}.visuals-intro h1{font-size:42px;letter-spacing:-2px}.visuals-intro>p{font-size:12px}.visuals-kicker{font-size:9px;gap:8px;letter-spacing:1.6px}.visuals-status{font-size:8px}.visuals-lab-grid{grid-template-columns:1fr}.visuals-scene{min-height:350px}.visuals-controls{border-left:0;border-top:1px solid #303036;padding:24px}.visuals-control-title h2{font-size:15px}.visuals-controls legend,.visuals-slider label{font-size:12px}.visuals-controls output{font-size:11px}.visuals-presets button{font-size:10px;padding:12px}.visuals-toggles label strong{font-size:12px}.visuals-toggles label small{font-size:10px}.visuals-toggles{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}.visuals-local-note{font-size:10px}.visuals-lab-head{font-size:7px;padding:13px;letter-spacing:1px}.concept-tag{font-size:7px}.visuals-watermark{left:15px;top:15px}.visuals-target{right:15px;top:87px;width:212px}.visuals-scene-caption{left:20px;bottom:85px}.visuals-scene-caption strong{font-size:24px}.visuals-hotbar>span{width:23px;height:23px}.visuals-principles{grid-template-columns:1fr;gap:24px;margin-top:32px}.visuals-principles h2{font-size:19px}.visuals-principles p{font-size:12px}.visuals-soon{padding:22px;gap:17px;flex-wrap:wrap}.visuals-soon .btn{margin-left:0}.visuals-soon h2{font-size:17px}.visuals-faq{margin-top:25px}}
@media(max-width:400px){.visuals-intro h1{font-size:37px}.visuals-toggles{grid-template-columns:1fr}.visuals-intro>p br{display:none}.visuals-actions .btn{font-size:11px}.visuals-lab-head>span:first-child{display:none}.visuals-hotbar{gap:3px}.visuals-hotbar>span{width:21px}.visuals-scene-caption strong{font-size:22px}.visuals-watermark{transform:scale(calc(var(--hud-scale)*.9))}}
@media(prefers-reduced-motion:reduce){.visuals-particles i{animation:none}.visuals-switch::after{transition:none}}