/* Graph cards – HUD style */
.ggrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
@media(max-width:900px){.ggrid{grid-template-columns:1fr}}
.gcard{position:relative;background:linear-gradient(160deg,#101c38 0%,#0a1328 70%);border:1px solid rgba(110,160,255,.18);border-radius:6px;padding:18px 18px 14px;color:#e6edfc;overflow:hidden;transition:border-color .35s,box-shadow .35s,transform .35s;transform-style:preserve-3d}
.gcard::before,.gcard::after{content:"";position:absolute;width:16px;height:16px;border:2px solid var(--red-hot,#ff4d66);opacity:.85;pointer-events:none}
.gcard::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.gcard::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.gcard:hover{border-color:rgba(255,77,102,.55);box-shadow:0 0 0 1px rgba(255,77,102,.25),0 18px 60px -18px rgba(255,77,102,.35)}
.gcard .scan{position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(110,160,255,.07),transparent);height:30%;top:-30%;animation:scan 5s linear infinite;pointer-events:none}
.gcard.live::selection{background:transparent}
@keyframes scan{to{top:110%}}
.gc-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.gid{font:700 .72rem "Inter",sans-serif;letter-spacing:.16em;color:#0a0f1c;background:var(--red-hot,#ff4d66);padding:3px 8px;border-radius:2px}
.gch{font:600 .68rem "Inter",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8fa0bf;flex:1}
.gbtn{display:flex;gap:6px}
.gbtn button{width:30px;height:30px;border-radius:3px;background:rgba(143,160,191,.1);border:1px solid rgba(143,160,191,.25);color:#cfd9ee;font-size:1rem;cursor:pointer;display:grid;place-items:center;transition:background .25s,color .25s,transform .25s}
.gbtn button:hover{background:var(--red-hot,#ff4d66);color:#0a0f1c;transform:rotate(12deg)}
.gcard h4{font-family:var(--serif,Georgia,serif);font-weight:400;font-size:1.35rem;line-height:1.15;margin:0 0 4px;color:#fff;letter-spacing:-.01em}
.gsub{font-size:.84rem;line-height:1.5;color:#9fb0cf;margin:0 0 10px;min-height:2.5em}
.gplot{background:radial-gradient(600px 300px at 50% 0,rgba(110,160,255,.08),transparent 70%),rgba(4,9,22,.55);border:1px solid rgba(143,160,191,.12);border-radius:4px;padding:6px}
.gplot svg{display:block;width:100%;height:auto;overflow:visible}
.gfoot{display:flex;gap:12px;align-items:center;margin-top:10px;font-size:.76rem;color:#8fa0bf}
.gill{font:700 .62rem "Inter",sans-serif;letter-spacing:.16em;text-transform:uppercase;border:1px solid rgba(143,160,191,.4);border-radius:2px;padding:2px 7px;color:#9fb0cf;white-space:nowrap}
.gcap{line-height:1.4}
/* svg text */
.gplot .ax{font:500 11.5px "Inter",sans-serif;fill:#8fa0bf}
.gplot .axt{font:600 11.5px "Inter",sans-serif;fill:#9fb0cf;letter-spacing:.04em}
.gplot .axl{stroke:rgba(143,160,191,.5);stroke-width:1}
.gplot .tx{font:600 12px "Inter",sans-serif;fill:#e6edfc;paint-order:stroke;stroke:rgba(5,10,24,.9);stroke-width:3.5px;stroke-linejoin:round}
.gplot .tx.s{font-size:10.5px;font-weight:500;fill:#9fb0cf}
.gplot .tx.b{font-weight:800}
.gplot .big{font:300 30px "Fraunces",Georgia,serif;fill:#fff}
.gplot .mono{font-variant-numeric:tabular-nums}
.gplot .glowr{filter:drop-shadow(0 0 6px rgba(255,77,102,.65))}
.gplot [data-tip]{cursor:pointer}
/* chapter filter */
.gfilter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;position:sticky;top:72px;z-index:20;padding:12px 0;background:linear-gradient(180deg,#0a0f1c 70%,transparent)}
.gfilter button{font:600 .76rem "Inter",sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:10px 16px;border-radius:2px;background:transparent;color:#b9c4dc;border:1px solid rgba(143,160,191,.3);cursor:pointer;transition:all .25s}
.gfilter button:hover{border-color:var(--red-hot,#ff4d66);color:#fff}
.gfilter button.on{background:var(--red,#c8102e);border-color:var(--red,#c8102e);color:#fff}
/* tooltip */
.gtip{position:fixed;z-index:300;pointer-events:none;background:#050a18;border:1px solid rgba(255,77,102,.6);color:#e6edfc;font:500 .78rem/1.45 "Inter",sans-serif;padding:8px 11px;border-radius:3px;opacity:0;transform:translateY(4px);transition:opacity .15s,transform .15s;max-width:260px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.gtip.on{opacity:1;transform:none}
.gtip b{color:#ff7a8f}
/* fullscreen present mode */
.gfs{position:fixed;inset:0;z-index:400;background:rgba(3,6,14,.94);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:24px}
.gfs.open{display:flex}
.gfs-in{position:relative;width:min(1180px,100%);max-height:100%;overflow:auto}
.gfs .gcard.big{padding:28px}
.gfs .gcard.big h4{font-size:2.2rem}
.gfs .gcard.big .gsub{font-size:1.05rem}
.gfs-x{position:absolute;right:10px;top:8px;z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.4);color:#fff;font-size:1.6rem;cursor:pointer}
body.noscroll{overflow:hidden}
.gcard[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.gcard .scan{display:none}}
/* phones: keep type legible by letting the plot scroll sideways */
@media(max-width:640px){.gplot{overflow-x:auto;-webkit-overflow-scrolling:touch}.gplot svg{min-width:590px}.gplot::after{content:"swipe to explore →";display:block;font:600 .64rem Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#6b7b99;text-align:right;padding:4px 6px 0}.gcard{padding:14px 12px 12px}.gcard h4{font-size:1.2rem}}