/* Instrument 04 — the signal engine. Scoped to the AI demonstration. */
.ai-lab{--ai-accent:#63e5d9;--ai-rgb:99,229,217;position:relative;margin-top:72px;border:1px solid #30414d;border-radius:24px;background:#08131e;overflow:hidden;isolation:isolate;scroll-margin-top:180px;box-shadow:0 30px 90px #0004}
.ai-lab::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 49% 44%,rgba(var(--ai-rgb),.075),transparent 47%),radial-gradient(ellipse at 95% 0%,#e0107a0e,transparent 40%),linear-gradient(125deg,#ffffff04,transparent 35%)}
.ai-lab [hidden]{display:none!important}
.ai-lab button{font:inherit;cursor:pointer}
.ai-lab button:disabled{cursor:default;opacity:.5}
.ai-lab button:focus-visible{outline:2px solid var(--ai-accent);outline-offset:5px}
.ai-lab-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 32px;border-bottom:1px solid #ffffff12}
.ai-lab-kicker{display:flex;gap:12px;align-items:center;font:500 .65rem/1.6 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:#c4d0da}
.ai-lab-kicker b{font-weight:500;color:var(--ai-accent)}
.ai-lab-kicker i{width:7px;height:7px;border-radius:50%;background:var(--ai-accent);box-shadow:0 0 12px var(--ai-accent)}
.ai-motion{border:1px solid #ffffff29;background:#ffffff05;border-radius:99px;min-height:40px;padding:8px 14px;color:#c4d0da;font-size:.75rem!important;white-space:nowrap}
.ai-lab-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:32px 32px 26px}
.ai-lab h2{font:500 clamp(1.7rem,3.5vw,2.7rem)/1.16 var(--serif);letter-spacing:-.025em;max-width:21ch;margin:0;color:#f3f3f1}
.ai-lab h2 em{color:var(--ai-accent);font-weight:400}
.ai-lab-intro>p{font-size:.9rem;line-height:1.7;color:#b0becb;max-width:35ch;margin:0}
.ai-scenario-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 32px 28px}
.ai-scenarios{display:flex;gap:8px;flex-wrap:wrap}
.ai-scenario{display:flex;gap:10px;align-items:center;min-height:46px;padding:11px 16px!important;color:#bac8d4;border:1px solid #ffffff21;border-radius:8px;background:#ffffff03;transition:background .25s,border-color .25s,transform .25s;font-size:.8rem!important}
.ai-scenario>span{color:#7c92a3;font:500 .63rem var(--mono)}
.ai-scenario:hover{transform:translateY(-2px);border-color:#ffffff66}
.ai-scenario[aria-pressed="true"]{color:#effffb;background:rgba(var(--ai-rgb),.08);border-color:rgba(var(--ai-rgb),.65);box-shadow:inset 0 0 20px rgba(var(--ai-rgb),.035)}
.ai-scenario[aria-pressed="true"]>span{color:var(--ai-accent)}
.ai-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr) minmax(0,1.05fr);align-items:center;padding:8px 32px 22px;gap:10px;min-height:410px;border-top:1px solid #ffffff0c;background-image:radial-gradient(#9dc9d916 .7px,transparent .7px);background-size:18px 18px}
.ai-card{position:relative;z-index:2;padding:22px 20px;border:1px solid #344550;border-radius:12px;background:linear-gradient(145deg,#11232ee8,#0b1821ed);box-shadow:0 14px 35px #0003;transition:border-color .5s,box-shadow .5s;min-width:0}
.ai-card::before{content:"";position:absolute;height:1px;width:45px;top:50%;background:linear-gradient(90deg,rgba(var(--ai-rgb),.7),transparent);pointer-events:none}
.ai-input::before{left:100%}.ai-output::before{right:100%;transform:rotate(180deg)}
.ai-card-top{display:flex;align-items:center;gap:9px;font:500 .6rem/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#b9c8d3;margin-bottom:22px}
.ai-card-top>span{display:grid;place-items:center;width:25px;height:25px;flex:none;border:1px solid #526272;border-radius:6px;color:var(--ai-accent);font-size:.85rem}
.ai-source{display:block;color:var(--ai-accent);font-size:.74rem;line-height:1.5;margin:0 0 12px}
.ai-message{padding:0;margin:0;border:0;font-size:1rem;line-height:var(--copy-leading);color:#eff5f5;font-family:var(--sans)}
.ai-message::before{content:'“';color:var(--ai-accent)}.ai-message::after{content:'”';color:var(--ai-accent)}
.ai-challenge{display:flex;align-items:center;gap:10px;text-align:left;width:100%;margin-top:24px;padding:14px 0 0;color:#c3cdd5;background:none;border:0;border-top:1px solid #ffffff16;font-size:.75rem!important;line-height:1.5!important}
.ai-challenge>span{width:29px;height:17px;background:#32434f;border-radius:20px;position:relative;flex:none;transition:background .3s}
.ai-challenge>span::before{content:"";position:absolute;width:11px;height:11px;top:3px;left:3px;background:#d5e3e7;border-radius:50%;transition:transform .3s}
.ai-challenge[aria-pressed="true"]>span{background:#a47628}.ai-challenge[aria-pressed="true"]>span::before{transform:translateX(12px);background:#fff6d8}
.ai-visual{position:relative;min-width:0;height:390px;touch-action:pan-y;cursor:grab}
.ai-visual:active{cursor:grabbing}
.ai-visual canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ai-orb-fallback{position:absolute;width:58%;aspect-ratio:1;top:12%;left:21%;border-radius:50%;border:1px solid #63e5d955;background:radial-gradient(circle at 35% 30%,#63e5d91c,#0b172900 65%);box-shadow:inset 0 0 40px #63e5d912,0 0 60px #63e5d908}
.ai-orb-fallback::before,.ai-orb-fallback::after{content:"";position:absolute;inset:14%;border-radius:50%;border:1px solid #63e5d933;transform:rotateX(55deg) rotate(-28deg)}
.ai-orb-fallback::after{transform:rotateY(55deg) rotate(32deg)}
.ai-lab.is-rendered .ai-orb-fallback{opacity:0}
.ai-core-copy{position:absolute;bottom:10px;left:-15px;right:-15px;text-align:center;pointer-events:none}
.ai-core-copy>span{display:block;margin-bottom:8px;font:500 .55rem/1.6 var(--mono);letter-spacing:.25em;text-transform:uppercase;color:var(--ai-accent)}
.ai-core-copy strong{font:500 1.15rem/1.35 var(--serif);display:block;color:#f5f9fa}
.ai-core-copy small{display:block;margin-top:8px;color:#9cafbf;font:.62rem/1.6 var(--mono)}
.ai-output h3{font:500 1.32rem/1.3 var(--serif);color:#edf5f7;margin:0 0 14px}
.ai-output p{font-size:.8rem;line-height:1.75;color:#becbd4;margin:0}
.ai-output dl{margin:18px 0 0;padding-top:14px;border-top:1px solid #ffffff16;display:grid;gap:10px}
.ai-output dl>div{display:grid;grid-template-columns:55px minmax(0,1fr);gap:10px;font-size:.7rem;line-height:1.6}
.ai-output dt{color:#92a7b8}.ai-output dd{margin:0;color:#e4edf1}
.ai-review{display:flex;align-items:center;gap:8px;margin-top:18px;font:500 .6rem/1.6 var(--mono);color:#adbecb;text-transform:uppercase;letter-spacing:.07em}
.ai-review i{height:6px;width:6px;border-radius:50%;background:currentColor;flex:none}
.ai-lab[data-step="4"] .ai-output{border-color:#d4af3790;box-shadow:0 0 30px #d4af3710,0 14px 35px #0003}
.ai-lab[data-step="4"] .ai-review{color:#efd080}
.ai-lab[data-complete="true"] .ai-output{border-color:#63e5d980}
.ai-lab[data-complete="true"] .ai-review{color:#8ce4d3}
.ai-approve{width:100%;margin-top:20px;border:1px solid #d4af3770;background:#d4af3715;color:#ffe3a0;border-radius:7px;padding:12px 9px;min-height:44px;font-size:.76rem!important;transition:background .2s}
.ai-approve:hover{background:#d4af3728}
.ai-sequence{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 32px;gap:8px;margin-top:16px}
.ai-step{position:relative;border:0;border-top:2px solid #334451;background:none;color:#a6b8c7;padding:15px 3px 10px;text-align:left;min-height:60px;font-size:.7rem!important;line-height:1.6!important;transition:border-color .3s,color .3s}
.ai-step>span{font:.57rem var(--mono);color:#8197a9;display:block;margin-bottom:6px}
.ai-step.is-done{border-color:rgba(var(--ai-rgb),.45)}
.ai-step[aria-pressed="true"]{border-color:var(--ai-accent);color:#f3fffb}
.ai-step[aria-pressed="true"]>span{color:var(--ai-accent)}
.ai-step[aria-pressed="true"]::before{content:"";position:absolute;width:28%;height:2px;top:-2px;left:0;background:#e2fff9;box-shadow:0 0 9px var(--ai-accent)}
.ai-lab-controls{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:24px 32px 28px}
.ai-run{display:inline-flex;align-items:center;justify-content:center;gap:16px;flex:none;min-height:52px;border:1px solid var(--ai-accent);border-radius:8px;background:var(--ai-accent);color:#081820;padding:14px 20px;font-size:.85rem!important;font-weight:700!important;box-shadow:0 0 24px rgba(var(--ai-rgb),.13);transition:box-shadow .3s,transform .3s}
.ai-run:hover{box-shadow:0 0 35px rgba(var(--ai-rgb),.25);transform:translateY(-2px)}
.ai-run>span:first-child{font-size:.9rem}
.ai-demo-note{max-width:60ch;font-size:.73rem;line-height:var(--copy-leading);color:#aebfcd;margin:0}
.ai-demo-note strong{font-weight:500;color:#dfebef}
.ai-lab.is-paused .ai-orb-fallback{animation:none}
@media(min-width:1450px){.ai-visual{height:450px}.ai-card{padding:28px}.ai-stage{gap:20px}}
@media(max-width:980px){.ai-lab-intro{align-items:flex-start}.ai-stage{grid-template-columns:minmax(0,1fr) minmax(240px,1.35fr) minmax(0,1fr);padding-left:22px;padding-right:22px;gap:0}.ai-card{padding:18px 14px}.ai-visual{height:355px}.ai-message{font-size:.86rem}.ai-core-copy strong{font-size:1rem}.ai-lab-intro>p{max-width:30ch;font-size:.82rem}.ai-output dl>div{grid-template-columns:1fr;gap:2px}.ai-card-top{font-size:.54rem;letter-spacing:.05em}}
@media(max-width:760px){.ai-lab{margin-top:48px;border-radius:16px;scroll-margin-top:150px}.ai-lab-head,.ai-lab-intro,.ai-lab-controls{padding:22px}.ai-lab-intro{display:block}.ai-lab h2{font-size:2rem;max-width:23ch}.ai-lab-intro>p{margin-top:16px;max-width:50ch}.ai-scenarios{padding:0 22px 24px;gap:6px}.ai-scenario{flex:1;justify-content:center;padding:10px!important;font-size:.73rem!important}.ai-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;padding:0 22px 20px}.ai-visual{grid-column:1/-1;grid-row:1;height:345px;max-width:460px;width:100%;margin:auto}.ai-input,.ai-output{align-self:stretch}.ai-card::before{display:none}.ai-card-top{font-size:.6rem}.ai-output dl>div{grid-template-columns:55px minmax(0,1fr);gap:6px}.ai-sequence{padding:0 22px;gap:6px}.ai-step{font-size:.62rem!important}.ai-core-copy strong{font-size:1.2rem}.ai-lab-controls{align-items:flex-start;flex-direction:column;gap:16px}.ai-run{width:100%}.ai-demo-note{max-width:none}}
@media(max-width:480px){.ai-lab-head{gap:10px;padding:17px}.ai-lab-kicker{gap:8px;font-size:.53rem;letter-spacing:.12em}.ai-motion{font-size:.65rem!important;padding:8px 10px;min-height:36px}.ai-lab-intro{padding:24px 18px}.ai-lab h2{font-size:1.8rem}.ai-scenarios{padding:0 18px 18px}.ai-scenario{font-size:.68rem!important;gap:6px}.ai-scenario>span{display:none}.ai-stage{grid-template-columns:minmax(0,1fr);padding:0 18px 18px}.ai-visual{grid-column:auto;height:315px}.ai-card{padding:20px}.ai-message{font-size:.93rem}.ai-output dl>div{grid-template-columns:60px minmax(0,1fr)}.ai-sequence{padding:0 18px;gap:5px}.ai-step{font-size:.58rem!important}.ai-lab-controls{padding:18px}.ai-core-copy{left:0;right:0}.ai-core-copy>span{font-size:.52rem}.ai-lab-kicker .ai-engine-label{display:none}}
.ai-scenario-bar .ai-scenarios{padding:0}
@media(max-width:980px){.ai-scenario-bar{align-items:stretch}.ai-scenario-bar .ai-run{font-size:.76rem!important;padding:12px 16px}.ai-scenarios{gap:6px}.ai-scenario{font-size:.73rem!important;padding:10px 12px!important}}
@media(max-width:760px){.ai-scenario-bar{display:block;padding:0 22px 22px}.ai-scenario-bar .ai-run{margin-top:14px}.ai-scenarios{flex-wrap:nowrap}}
@media(max-width:480px){.ai-scenario-bar{padding:0 18px 20px}.ai-scenario{padding:9px 8px!important;font-size:.66rem!important}.ai-scenario-bar .ai-run{min-height:46px}}
@media(prefers-reduced-motion:reduce){.ai-lab *, .ai-lab *::before{transition:none!important;animation:none!important}.ai-lab button:hover{transform:none}}