/* NIM-3638: "AI changes every week", the sticky four-beat story (noise, audit, operate, superpowers).
   Ported from the approved mockup v7. The section keeps its light look in both themes. */
.ks-story{--cream:#f7f0ee;--navy:#152238;--muted:#536072;--rose:#e3aeb4;--blue:#c6cff0;--line:#d9c6c9;--ks-barn:#b7433d;--ks-white:#fffdf9;--ks-gold:#d7c875;--ks-pass:#2f7d4f;--ks-pass-wash:#e3f2e8;--ks-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  position:relative;height:460vh;padding:0;background:var(--cream);color:var(--navy);font-size:18px;line-height:1.55}
.ks-story .ks-wrap{max-width:1180px;margin:0 auto;padding-inline:24px;width:100%;min-width:0}
.ks-story .eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:12px;font-weight:800;color:var(--ks-barn);display:block;margin:0}
.ks-story h2{font-size:clamp(32px,4.4vw,56px);line-height:1.05;letter-spacing:-1.8px;margin:10px 0 0;font-weight:800;text-wrap:balance;max-width:17ch}
.ks-story h3{margin:0}
.ks-intro-m{display:none}
.ks-sticky{position:sticky;top:env(safe-area-inset-top,0px);height:100vh;display:flex;flex-direction:column;padding-block:24px 16px;gap:12px}
.ks-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:28px;align-items:end}
.ks-head>div{min-width:0}
.ks-story .ks-beats{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-start;padding:0;border:0}
.ks-beats button{font:700 12.5px/1 Figtree,Arial,sans-serif;border:1px solid var(--line);background:var(--ks-white);color:var(--muted);padding:8px 12px;border-radius:999px;cursor:pointer;display:flex;gap:6px;align-items:center}
.ks-beats button span{font-family:var(--ks-mono);font-size:10.5px;opacity:.7}
.ks-beats button[aria-current="step"]{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.ks-beats button:focus-visible{outline:2px solid var(--ks-barn);outline-offset:2px}
.ks-copy{display:grid;margin-top:12px}
.ks-copy p{grid-area:1/1;margin:0;font-size:18px;max-width:46ch;opacity:0;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease}
.ks-copy p.on{opacity:1;transform:none}
.ks-copy strong{display:block;font-size:24px;letter-spacing:-.4px;line-height:1.2;margin-bottom:6px}
.ks-copy p[data-b="0"] strong{color:var(--ks-barn)}
.ks-copy p[data-b="3"] strong{color:var(--ks-pass)}

.ks-stage{position:relative;flex:1;min-height:0;border-radius:22px;background:radial-gradient(circle at 50% 50%,#fffdf9 0,#fbf6f3 55%,#f3e9e5 100%);border:1px solid var(--line);overflow:hidden}
.ks-stage svg{position:absolute;inset:0;width:100%;height:100%}
.ks-node{position:absolute;left:0;top:0;transform:translate(-50%,-50%);will-change:transform,opacity}
.ks-counter{position:absolute;right:14px;top:12px;font-family:var(--ks-mono);font-size:11.5px;color:var(--ks-barn);background:var(--ks-white);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-variant-numeric:tabular-nums;z-index:5;transition:opacity .2s}
.ks-tally{position:absolute;left:14px;bottom:12px;font-family:var(--ks-mono);font-size:11.5px;background:var(--ks-white);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-variant-numeric:tabular-nums;z-index:5}
.ks-tally[hidden]{display:none}
.ks-tally b{color:var(--ks-pass)}
.ks-tally i{font-style:normal;color:var(--ks-barn)}

/* an AI tool card: launch, then audited, then a chip in an operator's stack */
.ks-card{width:132px;background:var(--ks-white);border:1px solid #c9b9bc;border-radius:10px;padding:6px 9px 7px;box-shadow:0 8px 18px -12px #15223866;transition:background .25s,border-color .25s}
.ks-card .ks-top{display:flex;gap:6px;align-items:center;font-weight:800;font-size:12.5px;line-height:1.2}
.ks-card .ks-new{font-family:var(--ks-mono);font-size:8.5px;letter-spacing:1px;background:var(--ks-barn);color:var(--ks-white);padding:2px 4px;border-radius:4px;flex:none}
.ks-card .ks-logo{width:14px;height:14px;object-fit:contain;flex:none;display:block}
.ks-card .ks-dot{width:9px;height:9px;border-radius:3px;flex:none}
.ks-card .ks-verdict{font-size:11px;font-weight:700;line-height:1.2;margin-top:4px;display:none}
.ks-card.judged .ks-verdict{display:block}
.ks-card.judged .ks-new{display:none}
.ks-card.pass{border-color:var(--ks-pass);background:var(--ks-pass-wash)}
.ks-card.pass .ks-verdict{color:var(--ks-pass)}
.ks-card.fail{opacity:.6}
.ks-card.fail .ks-nm{text-decoration:line-through;text-decoration-color:var(--ks-barn)}
.ks-card.fail .ks-verdict{color:var(--ks-barn)}
.ks-card.scan{outline:2.5px solid var(--navy);outline-offset:2px}
.ks-card.chip{width:150px;padding:5px 9px;background:var(--ks-white);border-color:var(--navy)}
.ks-card.chip .ks-verdict,.ks-card.chip .ks-new{display:none}
.ks-custom{width:150px;border:1.5px dashed var(--navy);border-radius:10px;padding:5px 9px;font-size:12px;font-weight:800;background:#eef1fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.ks-promise{font-style:italic;font-weight:700;font-size:13px;color:var(--ks-barn);background:#fbe9ea;border:1px solid var(--rose);border-radius:14px 14px 14px 3px;padding:5px 10px;white-space:nowrap}
.ks-ask{font-family:var(--ks-mono);font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--navy);background:var(--ks-gold);border-radius:6px;padding:3px 7px;white-space:nowrap}

.ks-op{width:150px;background:var(--navy);color:var(--cream);border-radius:12px;padding:7px 10px 8px;text-align:center}
.ks-op .ks-kind{font-family:var(--ks-mono);font-size:9.5px;letter-spacing:1.3px;text-transform:uppercase;color:var(--rose);display:flex;justify-content:center;gap:6px;align-items:center}
.ks-op .ks-live{width:7px;height:7px;border-radius:50%;background:#7fd19b;animation:ks-pulse 1.8s infinite}
@keyframes ks-pulse{0%{box-shadow:0 0 0 0 #7fd19b88}70%,100%{box-shadow:0 0 0 7px #7fd19b00}}
.ks-op .ks-name{font-weight:800;font-size:14.5px}
.ks-you{width:76px;height:76px;border-radius:50%;background:var(--rose);border:2px solid var(--navy);display:grid;place-items:center;text-align:center;font-weight:900;font-size:17px;line-height:1}
.ks-you small{display:block;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:3px}
.ks-fly{display:flex;align-items:center;gap:10px;background:var(--ks-white);border:2px solid var(--navy);border-radius:999px;padding:5px 16px 5px 5px;z-index:4}
.ks-fly img{width:50px;height:50px;border-radius:50%;background:var(--blue);display:block}
.ks-fly .ks-name{font-weight:900;font-size:18px;line-height:1.1}
.ks-fly.compact{padding:4px}
.ks-fly.compact>div{display:none}
.ks-fly.compact img{width:40px;height:40px}
.ks-expert{width:150px;border:1.5px dashed #8a7a2a;border-radius:10px;padding:5px 9px;font-size:12px;font-weight:800;background:#f6f0cf;line-height:1.2}
.ks-expert .ks-short{display:none}
/* beat 4: Fly's tree collapses into one circle; the founder's tree opens */
.ks-hub{width:210px;height:210px;border-radius:50%;background:var(--navy);color:var(--cream);display:grid;place-content:center;text-align:center;padding:22px;gap:8px;box-shadow:0 18px 40px -22px #152238aa}
.ks-hub b{font-size:19px;line-height:1.15;letter-spacing:-.3px}
.ks-hub small{font-family:var(--ks-mono);font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--rose)}
.ks-hub .ks-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;max-width:132px;margin:0 auto}
.ks-hub .ks-dots i{width:16px;height:16px;border-radius:4px;background:var(--ks-white);display:grid;place-items:center}
.ks-hub .ks-dots img{width:11px;height:11px;object-fit:contain;display:block}
.ks-power{width:220px;background:var(--ks-white);border:2px solid var(--navy);border-radius:12px;padding:8px 12px;font-weight:800;font-size:15px;line-height:1.2;display:flex;gap:9px;align-items:center;box-shadow:0 10px 22px -16px #152238aa}
.ks-power .ks-ic{width:28px;height:28px;border-radius:8px;background:var(--rose);display:grid;place-items:center;font-size:15px;flex:none}

@media(max-width:820px){
  .ks-story{font-size:16px}
  .ks-story .ks-wrap{padding-inline:16px}
  .ks-head{grid-template-columns:minmax(0,1fr);gap:8px}
  .ks-intro-d{display:none}
  .ks-intro-m{display:block;padding-block:24px 0}
  .ks-intro-m h2{font-size:32px}
  .ks-sticky{padding-block:12px}
  .ks-copy{margin-top:8px}
  .ks-copy p{font-size:14.5px}
  .ks-copy strong{font-size:18px}
  .ks-beats button{padding:6px 9px;font-size:11px}
  .ks-card{width:84px;padding:4px 6px}
  .ks-card .ks-top{font-size:10px;gap:4px}
  .ks-card .ks-new{display:none}
  .ks-card .ks-logo{width:11px;height:11px}
  .ks-card .ks-verdict{font-size:9.5px}
  .ks-card.chip,.ks-custom{width:96px;font-size:10px;padding:3px 6px}
  .ks-promise{font-size:10.5px}
  .ks-op{width:96px;padding:5px 6px}
  .ks-op .ks-name{font-size:12px}
  .ks-op .ks-kind{font-size:8px;letter-spacing:.8px}
  .ks-you{width:54px;height:54px;font-size:14px}
  .ks-you small{display:none}
  .ks-fly img{width:36px;height:36px}
  .ks-fly .ks-name{font-size:14px}
  .ks-expert{width:96px;font-size:10px;padding:3px 6px}
  .ks-expert .ks-long{display:none}
  .ks-expert .ks-short{display:inline}
  .ks-hub{width:128px;height:128px;padding:12px;gap:4px}
  .ks-hub b{font-size:12.5px}
  .ks-hub small{font-size:8px;letter-spacing:.8px}
  .ks-hub .ks-dots{max-width:84px;gap:2px}
  .ks-hub .ks-dots i{width:10px;height:10px;border-radius:2px}
  .ks-hub .ks-dots img{width:7px;height:7px}
  .ks-power{width:248px;font-size:13.5px;padding:6px 10px}
  .ks-power .ks-ic{width:24px;height:24px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){.ks-copy p,.ks-card,.ks-counter{transition:none}.ks-op .ks-live{animation:none}}
