/* ============================================================
   Demo page - gooey blob splitting into a 30-agent swarm
   ============================================================ */

/* ---------- Intro ---------- */
.demo-intro{background:var(--paper);padding:158px 0 84px;}
.demo-intro-wrap{max-width:760px;}
.demo-intro h1{font-size:clamp(2.3rem,5.2vw,4rem);font-weight:650;letter-spacing:-0.03em;line-height:1.05;}
.demo-intro-copy{margin-top:20px;font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.55;color:var(--gray-1);max-width:62ch;}
.demo-note{margin-top:32px;display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:rgba(11,11,10,0.03);}
.demo-note-dot{width:8px;height:8px;border-radius:50%;background:var(--black);margin-top:6px;flex-shrink:0;animation:demoNotePulse 2.2s ease-in-out infinite;}
@keyframes demoNotePulse{0%,100%{opacity:1;}50%{opacity:.28;}}
.demo-note p{font-size:.92rem;line-height:1.55;color:var(--ink);}
.demo-note b{font-weight:650;}
.demo-note em{font-family:var(--font-serif);font-style:italic;}

/* ---------- Research brief ---------- */
.demo-brief-section{background:var(--paper);padding:88px 0;border-top:1px solid var(--line);}
.demo-brief-grid{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1fr);gap:60px;align-items:start;}
.demo-brief-copy h2{margin-top:8px;font-size:clamp(1.7rem,3.4vw,2.4rem);font-weight:650;letter-spacing:-0.02em;line-height:1.12;max-width:17ch;}
.demo-brief-lede{margin-top:16px;font-size:1rem;line-height:1.55;color:var(--gray-1);max-width:44ch;}
.demo-chips{margin-top:22px;display:flex;flex-wrap:wrap;gap:9px;}
.demo-chip{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.03em;padding:7px 13px;border-radius:100px;border:1px solid var(--line);color:var(--ink);background:rgba(11,11,10,.03);white-space:nowrap;}
@media(max-width:900px){.demo-brief-grid{grid-template-columns:1fr;gap:32px;}}

/* ---------- Shared "document" card (brief + manuscript) ---------- */
.demo-doc{border:1px solid var(--line-dark);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,#1a1a17,#141412);color:var(--white);box-shadow:0 30px 90px -50px rgba(0,0,0,.7);}
.demo-doc-bar{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line-dark);}
.demo-doc-bar span{width:9px;height:9px;border-radius:50%;background:rgba(250,249,246,.18);}
.demo-doc-bar small{margin-left:8px;font-family:var(--font-mono);font-size:.68rem;color:var(--gray-2);letter-spacing:.02em;}
.demo-doc-body{padding:24px 26px;}
.demo-doc-field{margin-bottom:18px;}
.demo-doc-field:last-child{margin-bottom:0;}
.demo-doc-field b{display:block;font-family:var(--font-mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gray-2);margin-bottom:6px;}
.demo-doc-field p{font-size:.92rem;line-height:1.5;color:#e7e4da;}
.demo-doc-title{font-family:var(--font-serif);font-style:italic;font-weight:500;font-size:clamp(1.2rem,2vw,1.5rem);letter-spacing:-0.01em;}
.demo-doc-meta{margin-top:6px;font-family:var(--font-mono);font-size:.68rem;color:var(--gray-2);letter-spacing:.03em;}
.demo-doc-p{margin-top:14px;font-size:.9rem;line-height:1.55;color:#c8c4b8;}
.demo-doc-chips{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px;}
.demo-doc-chips span{font-family:var(--font-mono);font-size:.68rem;color:var(--gray-2);padding:5px 11px;border-radius:100px;border:1px solid var(--line-dark);background:rgba(250,249,246,.03);}

/* ---------- Stage ---------- */
.demo-stage{position:relative;min-height:92vh;background:#0b0b0a;overflow:hidden;color:var(--white);}
#demoGL{position:absolute;inset:0;width:100%;height:100%;z-index:0;}

/* ---------- Start gate ---------- */
.demo-gate{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:32px;background:radial-gradient(120% 100% at 50% 40%,rgba(11,11,10,.35),rgba(9,9,8,.86));transition:opacity .6s var(--ease),visibility .6s var(--ease);}
.demo-gate.dismissed{opacity:0;visibility:hidden;pointer-events:none;}
.demo-gate-card{max-width:460px;text-align:center;border:1px solid var(--line-dark);border-radius:18px;padding:clamp(28px,4vw,44px);background:linear-gradient(180deg,#1a1a17,#121210);box-shadow:0 40px 120px -50px rgba(0,0,0,.9);}
.demo-gate-eyebrow{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gray-2);margin-bottom:12px;}
.demo-gate-card h3{font-family:var(--font-serif);font-style:italic;font-weight:500;font-size:clamp(1.5rem,2.8vw,2rem);color:var(--white);letter-spacing:-0.01em;}
.demo-gate-card p{margin-top:14px;font-size:.92rem;line-height:1.5;color:var(--gray-2);}
.demo-gate-btn{margin-top:26px;display:inline-flex;align-items:center;gap:10px;font-size:.88rem;font-weight:600;padding:14px 26px;border-radius:100px;background:var(--white);color:var(--black);border:0;cursor:pointer;transition:transform .4s var(--ease),box-shadow .3s var(--ease);}
.demo-gate-btn:hover{box-shadow:0 10px 30px rgba(0,0,0,.4);transform:translateY(-1px);}
.demo-gate-btn-arrow{display:inline-block;transition:transform .3s var(--ease);}
.demo-gate-btn:hover .demo-gate-btn-arrow{transform:translateX(3px);}

/* ---------- Hotspots ---------- */
.demo-hotspots{position:absolute;inset:0;z-index:2;pointer-events:none;}
.demo-hotspot{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;pointer-events:none;background:none;border:0;cursor:pointer;color:var(--white);opacity:0;transition:opacity .5s var(--ease);will-change:transform,opacity;padding:6px;}
.demo-hotspot.visible{opacity:1;pointer-events:auto;}
.demo-stage.is-focused .demo-hotspot:not(.demo-hotspot--active){opacity:0;pointer-events:none;}
.demo-hotspot-dot{width:11px;height:11px;border-radius:50%;background:var(--dot-color,#faf9f6);box-shadow:0 0 0 5px var(--dot-glow,rgba(250,249,246,.14));transition:box-shadow .3s var(--ease),transform .3s var(--ease-2);}
.demo-hotspot:hover .demo-hotspot-dot,.demo-hotspot:focus-visible .demo-hotspot-dot{box-shadow:0 0 0 9px var(--dot-glow,rgba(250,249,246,.22));transform:scale(1.15);}
.demo-hotspot-label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-2);white-space:nowrap;transition:color .3s var(--ease),opacity .25s var(--ease);}
.demo-hotspot:hover .demo-hotspot-label,.demo-hotspot:focus-visible .demo-hotspot-label{color:var(--white);}
.demo-hotspot-sub{font-family:var(--font-mono);font-size:.62rem;color:var(--gray-1);opacity:.8;white-space:nowrap;}
@media(max-width:720px){.demo-hotspot-sub{display:none;}}
.demo-hotspot:focus-visible{outline:none;}
.demo-hotspot--worker .demo-hotspot-dot{width:7px;height:7px;box-shadow:0 0 0 3px var(--dot-glow,rgba(250,249,246,.14));}
.demo-hotspot--worker .demo-hotspot-label,
.demo-hotspot--worker .demo-hotspot-sub{opacity:0;}
.demo-hotspot--worker:hover .demo-hotspot-label,
.demo-hotspot--worker:focus-visible .demo-hotspot-label{opacity:1;}
.demo-hotspot--worker .demo-hotspot-sub{display:none;}

/* ---------- Combined agent log console ---------- */
.demo-console{position:absolute;left:24px;right:24px;bottom:80px;z-index:3;max-width:760px;margin:0 auto;border:1px solid var(--line-dark);border-radius:12px;background:rgba(10,10,9,.8);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .5s var(--ease),visibility .5s var(--ease),transform .5s var(--ease);overflow:hidden;}
.demo-console.active{opacity:1;visibility:visible;transform:none;}
.demo-stage.is-focused .demo-console{opacity:0;visibility:hidden;pointer-events:none;}
.demo-console-head{display:flex;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid var(--line-dark);font-family:var(--font-mono);font-size:.64rem;letter-spacing:.05em;color:var(--gray-2);}
.demo-console-dot{width:7px;height:7px;border-radius:50%;background:#4fd08a;flex-shrink:0;animation:demoConsolePulse 1.6s ease-in-out infinite;}
@keyframes demoConsolePulse{0%,100%{opacity:1;}50%{opacity:.3;}}
.demo-console-title{color:var(--white);text-transform:uppercase;white-space:nowrap;}
.demo-spark{flex:1;height:22px;min-width:50px;stroke:#4fd08a;stroke-width:1.4;fill:none;opacity:.85;}
.demo-console-clock,.demo-console-count{display:flex;align-items:center;gap:5px;white-space:nowrap;}
.demo-console-clock i,.demo-console-count i{font-style:normal;color:var(--gray-1);}
.demo-console-clock b,.demo-console-count b{color:var(--white);font-weight:500;}
.demo-console-speed{white-space:nowrap;color:#4fd08a;}
.demo-console-body{height:132px;overflow:hidden;padding:8px 14px;display:flex;flex-direction:column;gap:2px;font-family:var(--font-mono);font-size:.7rem;line-height:1.5;}
.demo-console-line{display:flex;gap:9px;white-space:nowrap;overflow:hidden;color:var(--gray-2);animation:demoLogIn .3s var(--ease) both;}
@keyframes demoLogIn{from{opacity:0;transform:translateY(3px);}to{opacity:1;transform:none;}}
.demo-console-line time{color:var(--gray-1);flex-shrink:0;}
.demo-console-line b{flex-shrink:0;font-weight:600;}
@media(max-width:720px){.demo-console{left:12px;right:12px;bottom:70px;}.demo-console-body{height:96px;}.demo-console-clock,.demo-spark{display:none;}}

.demo-hint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:16px;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-2);opacity:0;transition:opacity .6s var(--ease);}
.demo-hint.visible{opacity:1;}
.demo-stage.is-focused .demo-hint{opacity:0;pointer-events:none;}
.demo-hint button{font:inherit;color:inherit;background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:100px;padding:7px 14px;cursor:pointer;transition:background .3s,color .3s;}
.demo-hint button:hover{background:var(--white);color:var(--black);}
@media(max-width:560px){.demo-hint{flex-direction:column;gap:10px;bottom:20px;}}

/* ---------- Immersive agent overlay ---------- */
.demo-panel{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;padding:40px;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s var(--ease);overflow:auto;}
.demo-panel.active{opacity:1;visibility:visible;}
.demo-panel::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 100% at 50% 32%,rgba(11,11,10,.25),rgba(9,9,8,.82));backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}
.demo-panel-back{position:absolute;top:104px;left:24px;z-index:600;display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-2);background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:100px;padding:9px 16px;cursor:pointer;transition:background .3s,color .3s;}
.demo-panel-back:hover{background:var(--white);color:var(--black);}
.demo-panel-card{position:relative;width:100%;max-width:560px;border:1px solid var(--line-dark);border-radius:18px;background:linear-gradient(180deg,#1a1a17,#141412);padding:clamp(26px,3.6vw,40px);box-shadow:0 40px 120px -50px rgba(0,0,0,.9);transform:translateY(16px);transition:transform .5s var(--ease);margin:70px 0 30px;}
.demo-panel.active .demo-panel-card{transform:none;}

.demo-panel-eyebrow{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dot-color,#faf9f6);opacity:.9;margin-bottom:14px;display:flex;align-items:center;gap:9px;}
.demo-panel-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--dot-color,#faf9f6);}
.demo-panel-name{font-family:var(--font-serif);font-style:italic;font-weight:500;font-size:clamp(1.5rem,2.6vw,2rem);color:var(--white);letter-spacing:-0.01em;}
.demo-panel-task{margin-top:8px;font-size:.95rem;color:var(--gray-2);line-height:1.45;}
.demo-panel-clock{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--font-mono);font-size:.7rem;color:var(--gray-2);padding:9px 12px;border-radius:9px;background:rgba(250,249,246,.03);border:1px solid var(--line-dark);}
.demo-panel-clock b{color:var(--white);font-size:.8rem;}
.demo-panel-lines{margin-top:22px;display:flex;flex-direction:column;gap:11px;}
.demo-panel-line{display:flex;align-items:flex-start;gap:12px;font-size:.92rem;color:#c8c4b8;line-height:1.45;opacity:0;transform:translateY(8px);animation:demoLineIn .55s var(--ease) both;animation-delay:var(--d,0s);}
.demo-panel-line::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--dot-color,#faf9f6);margin-top:7px;flex-shrink:0;}
@keyframes demoLineIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.demo-panel-log{margin-top:16px;height:120px;overflow:hidden;display:flex;flex-direction:column;gap:4px;font-family:var(--font-mono);font-size:.7rem;color:var(--gray-2);border-top:1px solid var(--line-dark);padding-top:10px;}
.demo-panel-log-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:demoLogIn .3s var(--ease) both;}
.demo-panel-status{margin-top:16px;display:inline-flex;align-items:center;gap:8px;font-size:.85rem;color:#4fd08a;font-weight:500;}
.demo-panel-status .chk{width:16px;height:16px;border-radius:50%;background:#4fd08a;position:relative;flex-shrink:0;}
.demo-panel-status .chk::after{content:"";position:absolute;left:5px;top:3px;width:4px;height:7px;border-right:2px solid #141412;border-bottom:2px solid #141412;transform:rotate(42deg);}
.demo-panel-chart{margin-top:18px;}
.demo-panel-foot{margin-top:24px;padding-top:18px;border-top:1px solid var(--line-dark);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--font-mono);font-size:.7rem;color:var(--gray-1);text-transform:uppercase;letter-spacing:.06em;}

/* ---------- Mini charts (inside agent panels) ---------- */
.demo-mini-spark{width:100%;height:56px;display:block;}
.demo-mini-spark polyline{fill:none;stroke-width:1.6;}
.demo-mini-bars{display:flex;align-items:flex-end;gap:4px;height:56px;}
.demo-mini-bars i{flex:1;border-radius:3px 3px 0 0;display:block;}
.demo-mini-funnel{display:flex;flex-direction:column;gap:8px;}
.demo-mini-funnel-row{display:flex;align-items:center;gap:10px;}
.demo-mini-funnel-row span{font-family:var(--font-mono);font-size:.62rem;color:var(--gray-2);width:92px;flex-shrink:0;}
.demo-mini-funnel-track{flex:1;height:7px;border-radius:100px;background:rgba(250,249,246,.06);overflow:hidden;}
.demo-mini-funnel-track i{display:block;height:100%;border-radius:100px;}
.demo-mini-wordbar-track{height:8px;border-radius:100px;background:rgba(250,249,246,.06);overflow:hidden;}
.demo-mini-wordbar-track i{display:block;height:100%;border-radius:100px;}
.demo-mini-wordbar-label{margin-top:8px;font-family:var(--font-mono);font-size:.68rem;color:var(--gray-2);}
.demo-mini-radial{display:flex;align-items:center;gap:16px;}
.demo-mini-radial svg{width:56px;height:56px;transform:rotate(-90deg);flex-shrink:0;}
.demo-mini-radial circle{fill:none;stroke-width:5;}
.demo-mini-radial .bg{stroke:rgba(250,249,246,.1);}
.demo-mini-radial .fg{stroke-linecap:round;}
.demo-mini-radial b{font-size:1.1rem;color:var(--white);}
.demo-mini-radial span{display:block;font-family:var(--font-mono);font-size:.64rem;color:var(--gray-2);margin-top:2px;}

/* ---------- No-WebGL fallback ---------- */
.demo-fallback-list{display:none;position:relative;z-index:3;padding:70px 0;}
.demo-stage.no-webgl .demo-fallback-list{display:block;}
.demo-stage.no-webgl #demoGL,
.demo-stage.no-webgl .demo-hotspots{display:none;}
.demo-fallback-row{display:flex;align-items:center;gap:16px;padding:18px 4px;border-bottom:1px solid var(--line-dark);background:none;border-left:0;border-right:0;border-top:0;width:100%;color:var(--white);text-align:left;cursor:pointer;font:inherit;}
.demo-fallback-row:first-child{border-top:1px solid var(--line-dark);}
.demo-fallback-dot{width:10px;height:10px;border-radius:50%;background:var(--dot-color,#faf9f6);flex-shrink:0;box-shadow:0 0 0 5px var(--dot-glow,rgba(250,249,246,.14));}
.demo-fallback-name{font-weight:600;min-width:190px;}
.demo-fallback-task{color:var(--gray-2);font-size:.9rem;flex:1;}
@media(max-width:640px){.demo-fallback-row{flex-wrap:wrap;}.demo-fallback-name{min-width:0;}}

.demo-cta{margin-top:28px;}

/* ---------- Agent progress ---------- */
.demo-progress-section{padding:100px 0;background:var(--paper);}
.demo-progress-section h2{margin-top:8px;font-size:clamp(1.6rem,3.2vw,2.3rem);font-weight:650;letter-spacing:-0.02em;max-width:22ch;}
.demo-progress-top{margin-top:36px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:26px;align-items:stretch;}
.demo-ring-card{border:1px solid var(--line);border-radius:16px;background:var(--white);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:20px;position:relative;}
.demo-ring{width:120px;height:120px;transform:rotate(-90deg);}
.demo-ring-bg{fill:none;stroke:var(--line);stroke-width:6;}
.demo-ring-fg{fill:none;stroke:var(--black);stroke-width:6;stroke-linecap:round;stroke-dasharray:276.5;stroke-dashoffset:276.5;transition:stroke-dashoffset .3s var(--ease);}
.demo-ring-label{position:absolute;display:flex;flex-direction:column;align-items:center;}
.demo-ring-label b{font-family:var(--font-serif);font-style:italic;font-size:1.6rem;font-weight:500;}
.demo-ring-label span{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-1);margin-top:2px;}
.demo-timeline-card{border:1px solid var(--line);border-radius:16px;background:var(--white);padding:22px 24px;}
.demo-timeline-head{display:flex;align-items:center;justify-content:space-between;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;color:var(--gray-1);margin-bottom:16px;}
.demo-timeline-head b{color:var(--black);font-size:.78rem;}
.demo-timeline{position:relative;display:flex;flex-direction:column;gap:12px;}
.demo-timeline-row{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;gap:12px;}
.demo-timeline-name{font-size:.78rem;color:var(--ink);white-space:nowrap;}
.demo-timeline-track{position:relative;height:10px;border-radius:100px;background:rgba(11,11,10,.05);overflow:hidden;}
.demo-timeline-bar{position:absolute;top:0;bottom:0;border-radius:100px;opacity:.85;}
.demo-timeline-playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--black);left:0;}
.demo-timeline-playhead::before{content:"";position:absolute;top:-4px;left:-3px;width:8px;height:8px;border-radius:50%;background:var(--black);}
@media(max-width:820px){.demo-progress-top{grid-template-columns:1fr;}.demo-timeline-row{grid-template-columns:70px minmax(0,1fr);}}

.demo-progress-grid{margin-top:36px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px 18px;}
.demo-progress-team-label{grid-column:1/-1;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gray-1);margin-top:20px;padding-bottom:6px;border-bottom:1px solid var(--line);}
.demo-progress-team-label:first-child{margin-top:0;}
.demo-progress-row{display:flex;align-items:center;gap:10px;padding:7px 0;}
.demo-progress-dot{width:8px;height:8px;border-radius:50%;background:var(--dot-color,#000);flex-shrink:0;}
.demo-progress-name{font-family:var(--font-mono);font-size:.7rem;color:var(--ink);white-space:nowrap;width:74px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;}
.demo-progress-bar-track{flex:1;height:6px;border-radius:100px;background:rgba(11,11,10,.06);overflow:hidden;}
.demo-progress-bar-fill{display:block;height:100%;border-radius:100px;background:var(--dot-color,#000);width:0%;}
.demo-progress-status{font-family:var(--font-mono);font-size:.6rem;color:var(--gray-1);width:50px;text-align:right;flex-shrink:0;text-transform:uppercase;}

/* ---------- Results ---------- */
.demo-results-section{padding:100px 0;background:#0b0b0a;color:var(--white);position:relative;}
.demo-results-section .eyebrow{color:var(--gray-2);}
.demo-results-section .eyebrow::before{background:var(--gray-2);}
.demo-results-section h2{margin-top:8px;font-size:clamp(1.6rem,3.2vw,2.3rem);font-weight:650;letter-spacing:-0.02em;color:var(--white);max-width:24ch;}
.demo-results-lock{margin-top:16px;font-family:var(--font-mono);font-size:.78rem;color:var(--gray-2);}
.demo-results-grid{margin-top:34px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;opacity:.3;filter:blur(2px) grayscale(.4);pointer-events:none;transition:opacity .8s var(--ease),filter .8s var(--ease);}
.demo-results-section.complete .demo-results-grid{opacity:1;filter:none;pointer-events:auto;}
.demo-results-section.complete .demo-results-lock{display:none;}
.demo-doc-manuscript{grid-column:1/-1;}
.demo-chart-card{border:1px solid var(--line-dark);border-radius:16px;padding:22px 24px 26px;background:linear-gradient(180deg,#151512,#111110);}
.demo-chart-head{font-size:.92rem;font-weight:600;color:var(--white);}
.demo-chart-caption{margin-top:14px;font-family:var(--font-mono);font-size:.7rem;color:var(--gray-2);line-height:1.4;}
@media(max-width:900px){.demo-results-grid{grid-template-columns:1fr;}}

.demo-chart-3d{margin-top:20px;height:190px;perspective:640px;display:flex;align-items:center;justify-content:center;}
.d3-scene{position:relative;width:220px;height:130px;transform-style:preserve-3d;transform:rotateX(58deg) rotateZ(-38deg);animation:d3Sway 9s ease-in-out infinite alternate;}
@keyframes d3Sway{from{transform:rotateX(58deg) rotateZ(-42deg);}to{transform:rotateX(58deg) rotateZ(-34deg);}}
.d3-floor{position:absolute;inset:0;border:1px solid rgba(250,249,246,.12);background:rgba(250,249,246,.02);}
.d3-bar{position:absolute;width:18px;bottom:0;left:calc(var(--x) * 46px + 14px);transform:translateZ(calc(var(--z) * 40px)) scaleY(var(--h));transform-origin:bottom;height:110px;background:var(--c);border-radius:2px 2px 0 0;box-shadow:0 0 14px -2px var(--c);}
.demo-chart-3d-axis{display:flex;justify-content:space-around;margin-top:8px;font-family:var(--font-mono);font-size:.62rem;color:var(--gray-1);padding:0 14px;}
.demo-chart-3d-legend{display:flex;gap:18px;justify-content:center;margin-top:10px;font-family:var(--font-mono);font-size:.68rem;color:var(--gray-2);}
.demo-chart-3d-legend span{display:flex;align-items:center;gap:7px;}
.demo-chart-3d-legend .sw{width:9px;height:9px;border-radius:2px;display:inline-block;}
.demo-chart-3d-legend .sw.sit{background:var(--gray-1);}
.demo-chart-3d-legend .sw.stand{background:#4fd08a;}

.demo-line-chart{width:100%;height:150px;margin-top:16px;}
.demo-line-chart .dlc-grid{stroke:rgba(250,249,246,.08);stroke-width:1;}
.demo-line-chart .dlc-seated{fill:none;stroke:var(--gray-1);stroke-width:2;}
.demo-line-chart .dlc-standing{fill:none;stroke:#4fd08a;stroke-width:2;}
.demo-line-chart text{font-family:var(--font-mono);font-size:6.5px;fill:var(--gray-2);}

@media(max-width:720px){
  .demo-stage{min-height:100vh;}
  .demo-panel-card{padding:24px 22px;}
}