:root{
    --navy:#0f1b2d; --navy2:#16263f; --line:#24344d;
    --orange:#ff9900; --cyan:#22d3ee; --green:#34d399; --red:#f87171;
    --purple:#a78bfa; --muted:#94a3b8; --text:#e2e8f0;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--navy);color:var(--text);
    font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5}
  .wrap{max-width:1100px;margin:0 auto;padding:22px 26px}
  header{background:linear-gradient(135deg,#0ea5e9,#6366f1);padding:22px 26px;border-bottom:4px solid var(--orange)}
  header h1{margin:0;font-size:1.5rem}
  header p{margin:4px 0 0;color:#e0f2fe;font-size:.85rem}
  .gate{display:inline-block;margin-top:10px;background:#065f46;color:#d1fae5;
    font-weight:800;border-radius:8px;padding:6px 14px;font-size:.85rem;letter-spacing:.5px}
  .cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:18px 0}
  .c{background:var(--navy2);border:1px solid var(--line);border-radius:12px;padding:14px}
  .c .k{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:1px}
  .c .v{font-size:1.9rem;font-weight:800;margin-top:2px}
  .c.pass .v{color:var(--green)} .c.fail .v{color:var(--red)}
  .c.skip .v{color:var(--muted)} .c.time .v{color:var(--cyan)} .c.rate .v{color:var(--orange)}
  .bar{height:10px;border-radius:6px;background:#0b1220;border:1px solid var(--line);overflow:hidden;margin:2px 0 20px}
  .bar > i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#34d399,#22d3ee)}
  h2{font-size:1.1rem;border-bottom:2px solid var(--orange);display:inline-block;padding-bottom:4px}
  table{width:100%;border-collapse:collapse;margin-top:10px;font-size:.82rem}
  th{text-align:left;color:var(--orange);border-bottom:2px solid var(--orange);padding:8px 8px}
  td{border-bottom:1px solid var(--line);padding:9px 8px;vertical-align:top}
  tr:hover td{background:#111a2e}
  code{background:#0b1220;border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:.82em;color:#e2e8f0}
  .badge{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.7rem;font-weight:700}
  .b-pass{background:#065f46;color:#d1fae5}
  .t{display:inline-block;border-radius:6px;padding:1px 8px;font-size:.7rem;font-weight:700}
  .t-happy{background:#0c4a6e;color:#bae6fd}
  .t-guard{background:#78350f;color:#fde68a}
  .t-neg{background:#3b0764;color:#e9d5ff}
  .muted{color:var(--muted)}
  .pct{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0 4px;max-width:420px}
  .pct .c .v{font-size:1.3rem;color:var(--text)}
  footer{color:var(--muted);font-size:.75rem;padding:18px 26px;border-top:1px solid var(--line)}