styles.css

:root{--bg:#070b13;--panel:#0d1524;--panel2:#111c2e;--text:#f4f7fb;--muted:#a8b4c8;--line:#223044;--teal:#2dd4bf;--gold:#f6c453;--purple:#8b5cf6;--red:#f87171;--green:#86efac;--yellow:#fde68a;--orange:#fdba74}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 20% 0%,#162036 0,#070b13 42%,#05070c 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}.wrap{max-width:1180px;margin:0 auto;padding:28px}.hero{padding:48px 0 28px}.eyebrow{color:var(--teal);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}.hero h1{font-size:clamp(2.3rem,5vw,5rem);line-height:.95;margin:.3rem 0;background:linear-gradient(135deg,#fff,#bcd6ff 46%,#f6c453);-webkit-background-clip:text;background-clip:text;color:transparent}.subtitle{font-size:1.2rem;color:var(--muted);max-width:850px}.status-row{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.pill{border:1px solid var(--line);background:rgba(13,21,36,.76);border-radius:999px;padding:8px 13px;color:#dbeafe;font-size:.9rem}.pill.green{border-color:rgba(134,239,172,.5);color:#bbf7d0}.pill.yellow{border-color:rgba(253,230,138,.55);color:#fde68a}.pill.red{border-color:rgba(248,113,113,.55);color:#fecaca}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.card{background:linear-gradient(180deg,rgba(17,28,46,.92),rgba(9,15,26,.92));border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.card h2,.card h3{margin-top:0}.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-6{grid-column:span 6}.span-4{grid-column:span 4}.schema{width:100%;border-radius:18px;border:1px solid var(--line);background:#060a12}.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;color:#cffafe;background:#07111e;border:1px solid #193347;padding:12px;border-radius:12px;overflow:auto}.rule{padding:14px;border-left:3px solid var(--teal);background:rgba(45,212,191,.07);border-radius:12px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.tab{cursor:pointer;border:1px solid var(--line);background:#0b1220;color:#dbeafe;border-radius:999px;padding:9px 13px}.tab.active{border-color:var(--teal);box-shadow:0 0 0 2px rgba(45,212,191,.15) inset}.atoms{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.atom{border:1px solid var(--line);background:rgba(7,11,19,.55);border-radius:16px;padding:15px}.atom .id{font-family:"SFMono-Regular",monospace;color:var(--teal);font-size:.85rem}.gate{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:.75rem;font-weight:800;margin-left:6px}.gate.GREEN{background:rgba(134,239,172,.12);color:var(--green)}.gate.YELLOW{background:rgba(253,230,138,.12);color:var(--yellow)}.gate.ORANGE{background:rgba(253,186,116,.12);color:var(--orange)}.gate.RED{background:rgba(248,113,113,.14);color:#fecaca}.bar{height:11px;background:#101827;border-radius:999px;overflow:hidden;border:1px solid #1f2d44}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--gold));border-radius:999px}.edge-list li{margin:.5rem 0}.source-list{display:grid;gap:10px}.source{padding:12px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line)}.source b{color:#fff}.muted{color:var(--muted)}.footer{color:var(--muted);font-size:.9rem;padding:24px 0}.btn{display:inline-block;border:1px solid var(--teal);color:#e0fffb;text-decoration:none;border-radius:12px;padding:10px 14px;background:rgba(45,212,191,.08)}@media(max-width:860px){.span-8,.span-6,.span-4{grid-column:span 12}.wrap{padding:18px}.hero{padding-top:28px}}