/* Signal Curation Blueprint -- the widget kura.html embeds in an iframe just below
   the hero. It is its own document, so it links the design system itself. It also
   keeps the export's DM Sans / DM Mono type rather than the site's Space Grotesk /
   Inter: the blueprint is deliberately drawn as a separate 'instrument panel'. */
:root{
  /* Local aliases the blueprint's own rules are written against, resolved onto the
     design-system tokens. --mint here is the BRIGHT mint (--mint-bright, #09E5A3),
     not --ss-mint (#2CB67D) -- keeping the local name avoids shadowing that token.
     --white and --dim are the panel's own greys, not brand colours. */
  --bg: var(--bg-deep);
  --mint: var(--mint-bright);
  --violet: var(--kura-purple);
  --white:#f0f0f5;
  --dim:#5a5a6a;
  --border:rgba(255,255,255,.06)
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:#c8c8d4;font-family:'DM Sans',sans-serif;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}

.hexbg{position:fixed;inset:0;z-index:0;pointer-events:none}
.hexbg canvas{width:100%;height:100%}

/* ═══ PAGE LAYOUT — Composio-style: not full-bleed, content islands ═══ */
.scene{position:relative;z-index:10;max-width:1320px;margin:0 auto;padding:28px 48px 32px}



/* ═══ COMPOSIO GRID: 3 columns, blocks DON'T fill, generous gaps ═══ */
.grid{display:grid;grid-template-columns:300px 1fr 300px;gap:32px}

/* Side columns: stack cards with gaps, don't stretch */
.col-left,.col-right{display:flex;flex-direction:column;gap:32px}

/* CONNECTION SVG */
.conn-svg{position:absolute;inset:0;z-index:30;pointer-events:none;overflow:visible}
.conn-line{stroke-width:1.5;fill:none;stroke-dasharray:6 4;opacity:0;transition:opacity .6s}
.conn-line.on{opacity:1}
.conn-line.mint{stroke:rgba(9,229,163,.35)}.conn-line.violet{stroke:rgba(127,90,240,.35)}.conn-line.both{stroke:url(#connGrad)}
.conn-dot{r:3;opacity:0;transition:opacity .4s}.conn-dot.on{opacity:1}

/* ═══ CARDS ═══ */
.card{background:rgba(18,15,26,.7);border:1px solid var(--border);border-radius:4px;overflow:hidden;position:relative;backdrop-filter:blur(16px);opacity:0;transform:translateY(12px);transition:all .7s cubic-bezier(.16,1,.3,1)}
.card.on{opacity:1;transform:translateY(0)}

.card-header{padding:14px 16px 10px;border-bottom:1px solid rgba(255,255,255,.04);display:flex;justify-content:space-between;align-items:center}
.card-header .label{font-family:'DM Mono';font-size:7px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;color:rgba(240,240,245,.2)}
.card-header h2{font-size:12px;font-weight:700;margin-top:3px}
.card-header .status{font-family:'DM Mono';font-size:7px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;padding:3px 8px;border-radius:5px;opacity:0;transition:opacity .3s}
.card-header .status.on{opacity:1}

.card.mint-card .label{color:rgba(9,229,163,.35)}.card.mint-card h2{color:rgba(9,229,163,.75)}.card.mint-card .status{background:rgba(9,229,163,.08);color:var(--mint)}
.card.violet-card .label{color:rgba(127,90,240,.35)}.card.violet-card h2{color:rgba(127,90,240,.75)}.card.violet-card .status{background:rgba(127,90,240,.08);color:var(--violet)}
.card.center-card{border-color:rgba(127,90,240,.08)}.card.center-card .label{color:rgba(127,90,240,.4)}.card.center-card h2{color:#fff}

/* FEED — fixed height, not flex-grow */
.feed{height:260px;overflow:hidden;position:relative}
.feed::before,.feed::after{content:'';position:absolute;left:0;right:0;height:20px;z-index:5;pointer-events:none}
.feed::before{top:0;background:linear-gradient(180deg,rgba(18,15,26,.8),transparent)}
.feed::after{bottom:0;background:linear-gradient(0deg,rgba(18,15,26,.8),transparent)}
.ft{will-change:transform}
.rw{padding:3px 14px;font-family:'DM Mono';font-size:7.5px;color:rgba(240,240,245,.28);border-bottom:1px solid rgba(255,255,255,.02);display:flex;gap:5px;white-space:nowrap;overflow:hidden;transition:all .4s}
.rw .ts{color:rgba(240,240,245,.08);font-size:6.5px;width:44px;flex-shrink:0}
.rw .k{min-width:42px;flex-shrink:0;color:rgba(240,240,245,.15)}
.rw.tgt{color:#fff;font-weight:600}
.card.mint-card .rw.tgt{background:rgba(9,229,163,.1);box-shadow:inset 2px 0 0 var(--mint)}.card.mint-card .rw.tgt .k{color:var(--mint)}
.card.violet-card .rw.tgt{background:rgba(127,90,240,.1);box-shadow:inset 2px 0 0 var(--violet)}.card.violet-card .rw.tgt .k{color:var(--violet)}
.rw.sel{color:#fff!important}
.card.mint-card .rw.sel{background:rgba(9,229,163,.12);box-shadow:inset 2px 0 0 var(--mint);animation:rp 1.5s infinite}
.card.violet-card .rw.sel{background:rgba(127,90,240,.12);box-shadow:inset 2px 0 0 var(--violet);animation:rp 1.5s infinite}
@keyframes rp{0%,100%{opacity:1}50%{opacity:.75}}

/* ISO */
.iso{position:absolute;top:50%;left:10px;right:10px;z-index:10;padding:8px 10px;border-radius:4px;background:rgba(12,10,18,.92);backdrop-filter:blur(16px);opacity:0;transform:translateY(-50%) scale(.95);transition:all .5s cubic-bezier(.16,1,.3,1)}
.iso.on{opacity:1;transform:translateY(-50%) scale(1)}
.card.mint-card .iso{border:1px solid rgba(9,229,163,.12)}.card.violet-card .iso{border:1px solid rgba(127,90,240,.12)}
.iso .ie{font-family:'DM Mono';font-size:5.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:3px}
.card.mint-card .ie{color:rgba(9,229,163,.4)}.card.violet-card .ie{color:rgba(127,90,240,.4)}
.im{font-family:'DM Mono';font-size:8px;font-weight:600;color:var(--white);margin-bottom:4px;display:flex;align-items:center;gap:4px}
.im .dt{width:4px;height:4px;border-radius:50%;animation:bk 1s infinite}
.card.mint-card .im .dt{background:var(--mint);box-shadow:0 0 6px rgba(9,229,163,.5)}
.card.violet-card .im .dt{background:var(--violet);box-shadow:0 0 6px rgba(127,90,240,.5)}
.ig{display:grid;grid-template-columns:1fr 1fr;gap:2px 6px}
.igk{font-family:'DM Mono';font-size:5px;color:rgba(240,240,245,.22);text-transform:uppercase;letter-spacing:.5px}
.igv{font-family:'DM Mono';font-size:6.5px;color:rgba(240,240,245,.65);font-weight:500;margin-top:1px}

/* VISITS CARD */
.visits-card{opacity:0!important;transform:translateY(12px)!important;transition:all .7s cubic-bezier(.16,1,.3,1)!important}
.visits-card.on{opacity:1!important;transform:translateY(0)!important}
.visits-feed{padding:6px 0;height:80px;overflow:hidden;position:relative}
.visits-feed::after{content:'';position:absolute;bottom:0;left:0;right:0;height:16px;background:linear-gradient(0deg,rgba(18,15,26,.8),transparent);pointer-events:none}
.vf-row{padding:3px 14px;font-family:'DM Mono';font-size:7px;color:rgba(9,229,163,.5);display:flex;gap:6px;border-bottom:1px solid rgba(9,229,163,.04);animation:piFlash .5s}
.vf-row .vf-store{color:rgba(9,229,163,.7);font-weight:600;min-width:80px}
.vf-row .vf-time{color:rgba(240,240,245,.25)}
.visits-stats{padding:8px 14px;border-top:1px solid rgba(9,229,163,.06)}
.vs-row{display:flex;justify-content:space-between;padding:2px 0}
.vs-label{font-family:'DM Mono';font-size:6.5px;color:rgba(240,240,245,.25);text-transform:uppercase;letter-spacing:.5px}
.vs-val{font-family:'DM Mono';font-size:8px;font-weight:700;color:var(--mint)}
.vs-up{color:var(--mint)}

/* FLY VISIT (from PMP to visits card) */
.fly-visit{position:fixed;z-index:100;font-family:'DM Mono';font-size:7px;color:var(--mint);background:rgba(9,229,163,.08);border:1px solid rgba(9,229,163,.2);border-radius:4px;padding:2px 8px;pointer-events:none;white-space:nowrap;box-shadow:0 0 8px rgba(9,229,163,.1);transition:left .6s cubic-bezier(.2,.8,.3,1),top .6s cubic-bezier(.2,.8,.3,1),opacity .6s}.fly-visit.go{opacity:.15}

/* ═══ CENTER ENGINE ═══ */
.engine-body{padding:20px 24px 16px;display:flex;flex-direction:column;align-items:center;gap:12px}
.engine-status{font-family:'DM Mono';font-size:10px;font-weight:600;color:rgba(240,240,245,.4);text-align:center;height:16px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .4s;letter-spacing:.3px;width:100%}
.engine-status.v{color:rgba(127,90,240,.7)}.engine-status.m{color:rgba(9,229,163,.7)}
.hex-wrap{width:280px;height:178px;flex-shrink:0}
.hex-wrap svg{width:100%;height:100%}
.hex-wrap.glow-m{filter:drop-shadow(0 0 16px rgba(9,229,163,.15))}
.hex-wrap.glow-both{filter:drop-shadow(0 0 14px rgba(127,90,240,.08)) drop-shadow(0 0 14px rgba(9,229,163,.08))}

.proc-box{width:100%;max-width:440px;background:rgba(15,12,22,.5);border:1px solid rgba(255,255,255,.03);border-radius:4px;padding:10px 12px;opacity:0;transform:translateY(6px);transition:all .5s cubic-bezier(.16,1,.3,1)}
.proc-box.on{opacity:1;transform:translateY(0)}
.step-line{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.025);opacity:0;transform:translateX(-6px);transition:all .4s}
.step-line.on{opacity:1;transform:translateX(0)}
.step-num{font-family:'DM Mono';font-size:7px;font-weight:700;letter-spacing:1px;min-width:14px}
.step-num.v{color:var(--violet)}.step-num.m{color:var(--mint)}
.step-label{font-size:9.5px;font-weight:600;color:rgba(240,240,245,.8);flex:1}
.step-status{font-family:'DM Mono';font-size:7px;font-weight:600;color:var(--dim);transition:all .3s}
.step-status.ok{color:var(--mint)}
.adn-section{padding-top:6px;margin-top:3px;border-top:1px solid rgba(9,229,163,.06);opacity:0;transition:all .5s}
.adn-section.on{opacity:1}
.adn-label{font-family:'DM Mono';font-size:6px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:rgba(9,229,163,.6);margin-bottom:3px}
.adn-title{font-size:10px;font-weight:700;color:#fff;margin-bottom:4px}
.adn-tags{display:flex;gap:3px;flex-wrap:wrap}
.dtag{font-family:'DM Mono';font-size:6px;font-weight:500;padding:3px 6px;border-radius:4px}
.dtag-v{background:rgba(127,90,240,.06);color:rgba(127,90,240,.6)}.dtag-m{background:rgba(9,229,163,.06);color:rgba(9,229,163,.6)}

/* ═══ PMP BAR — separate row ═══ */
.pmp-row{margin-top:32px}
.pmp-bar{background:rgba(18,15,26,.7);border:1px solid var(--border);border-radius:4px;display:flex;align-items:center;gap:16px;padding:14px 24px;height:72px;backdrop-filter:blur(16px);transition:all .6s cubic-bezier(.16,1,.3,1)}
.pmp-status-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.06);flex-shrink:0;transition:all .5s}
.pmp-status-dot.active{background:var(--mint);box-shadow:0 0 10px rgba(9,229,163,.4);animation:bk 1s infinite}
.pmp-info{flex-shrink:0}.pmp-label{font-family:'DM Mono';font-size:7px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.15);transition:color .3s}.pmp-label.active{color:var(--mint)}
.pmp-id{font-family:'DM Mono';font-size:11px;font-weight:700;color:rgba(255,255,255,.1);transition:color .3s;margin-top:2px}.pmp-id.active{color:#fff}
.pmp-stats{display:flex;gap:20px;flex-shrink:0}
.pmp-stat{text-align:center}.pmp-stat-val{font-family:'DM Mono';font-size:15px;font-weight:700;color:rgba(255,255,255,.08);transition:color .3s}.pmp-stat-val.active{color:#fff}
.pmp-stat-lbl{font-family:'DM Mono';font-size:6px;color:rgba(255,255,255,.15);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.pmp-inbox-mini{flex:1;display:flex;flex-direction:column;gap:2px;height:44px;max-height:44px;overflow:hidden;position:relative}
.pmp-inbox-mini::after{content:'';position:absolute;bottom:0;left:0;right:0;height:12px;background:linear-gradient(0deg,rgba(18,15,26,.8),transparent);pointer-events:none}
.pi-row{font-family:'DM Mono';font-size:6.5px;color:rgba(9,229,163,.4);display:flex;gap:4px;padding:1px 0;animation:piFlash .5s}
.pi-row .pi-score{color:var(--mint);font-weight:600;min-width:22px}.pi-row .pi-data{color:rgba(240,240,245,.2);flex:1;overflow:hidden;white-space:nowrap}
@keyframes piFlash{from{background:rgba(9,229,163,.08)}to{background:transparent}}

.fly-imp{position:fixed;z-index:100;font-family:'DM Mono';font-size:7px;color:var(--mint);background:rgba(9,229,163,.08);border:1px solid rgba(9,229,163,.2);border-radius:6px;padding:2px 8px;pointer-events:none;white-space:nowrap;box-shadow:0 0 12px rgba(9,229,163,.12);transition:left .5s cubic-bezier(.2,.8,.3,1),top .5s cubic-bezier(.2,.8,.3,1),opacity .5s}.fly-imp.go{opacity:.15}
.live-imp{display:flex;align-items:center;gap:5px;padding:3px 14px;font-family:'DM Mono';font-size:7px;color:rgba(240,240,245,.2);border-bottom:1px solid rgba(255,255,255,.015);white-space:nowrap;overflow:hidden}
.live-imp .li-score{min-width:24px;font-weight:700;text-align:right;font-size:7.5px}.live-imp .li-score.high{color:var(--mint)}.live-imp .li-score.mid{color:rgba(240,240,245,.12)}.live-imp .li-score.low{color:#e05555}
.live-imp.flagged{background:rgba(224,85,85,.02)}.live-imp.matched{background:rgba(9,229,163,.03);animation:mp .5s}.live-imp.matched .li-vars{color:rgba(240,240,245,.4)}
.live-imp .li-vars{color:rgba(240,240,245,.18);flex:1;overflow:hidden}.live-imp .li-check{font-size:7px;min-width:12px;text-align:center;color:rgba(240,240,245,.06)}.live-imp.matched .li-check{color:var(--mint);font-weight:600}
@keyframes mp{0%{background:rgba(9,229,163,.1)}100%{background:rgba(9,229,163,.03)}}
@keyframes fi{from{opacity:0}to{opacity:1}}
@keyframes bk{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes dashFlow{to{stroke-dashoffset:-20}}