/* The source changes its visual identity; the Ontik event preview stays familiar. */
body[data-atmosphere] main{position:relative;isolation:isolate;overflow:hidden;background:#101b19;transition:background-color .5s ease}
body[data-atmosphere] main::before,body[data-atmosphere] main::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;transition:opacity .5s ease}
body[data-atmosphere] main>.wrap{position:relative}
body[data-atmosphere] .lab-heading h1{color:#f4faf6}
body[data-atmosphere] .lab-heading p{color:#bacdc3}
body[data-atmosphere] .lab-heading .eyebrow{color:#a7e811}
body[data-atmosphere] .lab-tabs button{box-shadow:0 4px 16px #00000012;transition:background .25s,color .25s,transform .25s,border-color .25s}
body[data-atmosphere] .lab-tabs button:hover{transform:translateY(-2px)}
body[data-atmosphere] .lab-tabs button[aria-pressed=true]{background:#a7e811;border-color:#a7e811;color:#192323;font-weight:700}
body[data-atmosphere] .lab-panel{transition:background-color .4s,border-color .4s,box-shadow .4s;border-radius:20px;box-shadow:0 20px 60px #0000001c}
body[data-atmosphere] .lab-panel:first-child{color:#f4faf6;background:#142820;border-color:#456453}
body[data-atmosphere] .lab-panel:first-child p{color:#bed1c6}
body[data-atmosphere] .lab-panel:first-child .lab-label{color:#a7e811}
body[data-atmosphere] .lab-panel:first-child select,body[data-atmosphere] .lab-panel:first-child input{background:#112018;color:#f4faf6;border-color:#527461;color-scheme:dark}
body[data-atmosphere] .lab-panel:first-child .button{background:#a7e811;color:#192323;box-shadow:0 7px 20px #a7e81120;transition:transform .2s,box-shadow .2s}
body[data-atmosphere] .lab-panel:first-child .button:hover{transform:translateY(-2px);box-shadow:0 12px 24px #a7e81130}
body[data-atmosphere] .lab-art{position:relative;height:136px;gap:10px;margin:24px 0;padding-top:30px;align-items:center}
body[data-atmosphere] .lab-art::before{content:attr(data-caption);position:absolute;left:0;top:0;font:10px/1.4 ui-monospace,Consolas,monospace;letter-spacing:.12em;color:#a9c5b6}
body[data-atmosphere] .lab-art span{position:relative;display:flex;align-items:flex-end;justify-content:center;padding:12px 6px;min-width:0;height:80px;flex:1;overflow:hidden;color:#e8faf0;font-size:11px;font-weight:700;transition:height .4s,transform .4s,border-radius .4s;transform:none;border:1px solid #ffffff20;box-shadow:0 12px 30px #00000025}
body[data-atmosphere] .lab-art span::after{content:'';position:absolute;inset:0;pointer-events:none}
body[data-atmosphere] .lab-total{background:#203f32;border:1px solid #527461}
body[data-atmosphere] .lab-total output{color:#a7e811}
body[data-atmosphere] .lab-layout+.docs-note{margin-top:28px;padding:16px 20px;background:#ffffff0c;border:1px solid #ffffff25;border-radius:14px;color:#c2d2c8}
body[data-atmosphere] .lab-layout+.docs-note p{margin:0}
body[data-atmosphere] .lab-layout+.docs-note a{color:#a7e811}

/* Polished paint, angled highlights and an understated showroom glow. */
body[data-atmosphere=detailing] main{background-color:#0d1415}
body[data-atmosphere=detailing] main::before{background:radial-gradient(ellipse at 8% 40%,#37706755,transparent 50%),linear-gradient(115deg,transparent 35%,#c7eed00b 36%,transparent 37%,transparent 65%,#b8d8bd09 66%,transparent 67%)}
body[data-atmosphere=detailing] .lab-panel:first-child{background:linear-gradient(145deg,#283b38,#101c1b 65%);border-color:#597267}
body[data-atmosphere=detailing] .lab-art span{border-radius:30px 9px 30px 9px;transform:skewY(-7deg);background:linear-gradient(135deg,#b1e1ca,#1d785e 34%,#162d29 60%,#6caa98)}
body[data-atmosphere=detailing] .lab-art span:nth-child(2){height:96px;background:linear-gradient(135deg,#a4bcc1,#233e3b 35%,#88cfae 55%,#1b302a)}
body[data-atmosphere=detailing] .lab-art span:nth-child(3){background:linear-gradient(135deg,#515f57,#172c24 45%,#a7e811 140%)}
body[data-atmosphere=detailing] .lab-art span::after{background:linear-gradient(115deg,transparent 30%,#ffffff30 48%,transparent 65%);background-size:250% 100%;animation:showroomShine 7s ease-in-out infinite}

/* A control-room grid with three rack status displays. */
body[data-atmosphere=monitoring] main{background-color:#0b2021}
body[data-atmosphere=monitoring] main::before{background-image:linear-gradient(#6dcab60a 1px,transparent 1px),linear-gradient(90deg,#6dcab60a 1px,transparent 1px),radial-gradient(ellipse at 85% 20%,#1d785e55,transparent 60%);background-size:36px 36px,36px 36px,100% 100%}
body[data-atmosphere=monitoring] .lab-panel:first-child{background:#10282a;border-color:#427970;border-radius:12px}
body[data-atmosphere=monitoring] .lab-art span{border-radius:6px;background:repeating-linear-gradient(0deg,#254c4611 0px,#254c4633 2px,transparent 3px,transparent 12px),#0b1c20;font-family:ui-monospace,Consolas,monospace}
body[data-atmosphere=monitoring] .lab-art span::after{inset:15px auto auto 12px;width:7px;height:7px;border-radius:50%;background:#a7e811;box-shadow:0 0 13px #a7e81180;animation:rackSignal 3s ease infinite}
body[data-atmosphere=monitoring] .lab-art span:nth-child(2)::after{background:#ffcf75;box-shadow:0 0 13px #ffcf7570;animation-delay:.7s}
body[data-atmosphere=monitoring] .lab-art span:nth-child(3)::after{animation-delay:1.4s}

/* A release console: monospace labels and connected pipeline stages. */
body[data-atmosphere=deploy] main{background-color:#17202c}
body[data-atmosphere=deploy] main::before{background:radial-gradient(ellipse at 15% 60%,#53779a33,transparent 50%),radial-gradient(ellipse at 100% 0,#375b4b66,transparent 55%)}
body[data-atmosphere=deploy] .lab-panel:first-child{background:#1c2a36;border-color:#5c7582;border-radius:10px}
body[data-atmosphere=deploy] .lab-panel:first-child h2,body[data-atmosphere=deploy] .lab-form label{font-family:ui-monospace,Consolas,monospace}
body[data-atmosphere=deploy] .lab-art{gap:6px}
body[data-atmosphere=deploy] .lab-art span{font-family:ui-monospace,Consolas,monospace;height:68px;background:#233e3d;border-radius:6px;border-top:3px solid #8ccfae;align-items:center}
body[data-atmosphere=deploy] .lab-art span:nth-child(3){border-top-color:#a7e811;background:#35503a;box-shadow:0 0 24px #a7e81110}

/* A warmer storefront, paper-like surfaces and product-display pedestals. */
body[data-atmosphere=order] main{background-color:#f5f0e6}
body[data-atmosphere=order] main::before{background:radial-gradient(ellipse at 100% 15%,#dfb67a33,transparent 50%),radial-gradient(ellipse at 0% 65%,#8ccfae40,transparent 55%)}
body[data-atmosphere=order] .lab-heading h1{color:#293a30}
body[data-atmosphere=order] .lab-heading p{color:#596356}
body[data-atmosphere=order] .lab-heading .eyebrow{color:#1d785e}
body[data-atmosphere=order] .lab-tabs button[aria-pressed=true]{background:#1d785e;color:#fff;border-color:#1d785e}
body[data-atmosphere=order] .lab-panel:first-child{color:#293a30;background:#fffcf6;border-color:#ded6c5;border-radius:24px}
body[data-atmosphere=order] .lab-panel:first-child p{color:#656558}
body[data-atmosphere=order] .lab-panel:first-child .lab-label{color:#1d785e}
body[data-atmosphere=order] .lab-panel:first-child select,body[data-atmosphere=order] .lab-panel:first-child input{background:#fff;color:#293a30;border-color:#d2caba;color-scheme:light}
body[data-atmosphere=order] .lab-panel:first-child .button{background:#1d785e;color:white;box-shadow:0 8px 20px #1d785e20}
body[data-atmosphere=order] .lab-art::before{color:#757768}
body[data-atmosphere=order] .lab-art span{border-radius:40px 40px 10px 10px;background:linear-gradient(145deg,#ecdfc8,#c3d9bb);color:#354b3a;border-color:#d4d9c9;box-shadow:0 8px 20px #4f503b10}
body[data-atmosphere=order] .lab-art span:nth-child(2){height:94px;background:linear-gradient(145deg,#dfeddf,#92baa7)}
body[data-atmosphere=order] .lab-art span:nth-child(3){background:linear-gradient(145deg,#f7dfad,#d6c69f)}
body[data-atmosphere=order] .lab-total{background:#e9efe0;border-color:#d3ddc5}
body[data-atmosphere=order] .lab-total output{color:#1d785e}
body[data-atmosphere=order] .lab-layout+.docs-note{background:#ffffff80;border-color:#d5dcca;color:#596356}
body[data-atmosphere=order] .lab-layout+.docs-note a{color:#1d785e}
body[data-atmosphere] .lab-art.lab-art-photo{display:block;height:clamp(190px,20vw,270px);padding:0;overflow:hidden;border:1px solid #ffffff24;border-radius:14px;background:#172722;isolation:isolate}
body[data-atmosphere] .lab-art.lab-art-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%;transition:opacity .3s ease}
body[data-atmosphere] .lab-art.lab-art-photo::before{inset:auto 16px 15px;z-index:2;color:#f1faf4;font-size:9px;letter-spacing:.1em;text-shadow:0 1px 5px #000}
body[data-atmosphere] .lab-art.lab-art-photo::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent 50%,#071511b3 100%)}
body[data-atmosphere=detailing] .lab-art.lab-art-photo img{object-position:center 64%}
body[data-atmosphere=monitoring] .lab-art.lab-art-photo img{object-position:center 44%}
body[data-atmosphere=deploy] .lab-art.lab-art-photo img{object-position:center 44%}
body[data-atmosphere=order] .lab-art.lab-art-photo{border-color:#d4d9c9}
@media(max-width:760px){body[data-atmosphere] .lab-art.lab-art-photo{height:clamp(180px,48vw,290px)}}
@keyframes showroomShine{0%,40%{background-position:100% 0}80%,100%{background-position:0% 0}}
@keyframes rackSignal{0%,100%{opacity:1}50%{opacity:.45}}
@media(prefers-reduced-motion:reduce){body[data-atmosphere] *,body[data-atmosphere] *::after{animation:none!important;transition:none!important}}
