/* Jarvis 8.4.4 — clear Reactor results and dependable touch controls. */
.quick-guide {
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:9px;
 margin:0 0 16px;
}
.quick-guide > div {
 display:grid;
 gap:5px;
 padding:13px 15px;
 border:1px solid #252c34;
 border-radius:12px;
 background:#070a0d;
}
.quick-guide small {
 color:#77828d;
 font:900 8px ui-monospace,monospace;
 letter-spacing:.15em;
}
.quick-guide b { color:#d9dfe5;font-size:12px; }
.relay-grid button {
 touch-action:manipulation;
 -webkit-tap-highlight-color:transparent;
}
.relay-grid button:focus-visible,
.result button:focus-visible,
#startButton:focus-visible { outline:2px solid #f3f6f8;outline-offset:3px; }
.result { overflow:auto; }
.result[hidden] { display:none!important; }
.result-card { width:min(650px,100%)!important; }
.result-state {
 display:flex;
 align-items:center;
 gap:8px;
 margin-bottom:22px;
 color:#9ca6b0;
 font:900 8px ui-monospace,monospace;
 letter-spacing:.15em;
}
.result-state i {
 width:8px;
 height:8px;
 border-radius:50%;
 background:var(--good);
 box-shadow:0 0 14px #77e5a577;
}
.result-reason { margin:0 0 20px!important;color:#b4bdc7!important; }
.result-metrics {
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:7px;
}
.result-metrics > div {
 min-width:0;
 padding:12px;
 border:1px solid #28313a;
 border-radius:11px;
 background:#05080b;
}
.result-metrics small,.result-metrics b { display:block; }
.result-metrics small {
 color:#737e89;
 font:850 7px ui-monospace,monospace;
 letter-spacing:.12em;
}
.result-metrics b {
 margin-top:6px;
 color:#edf1f4;
 font:900 17px ui-monospace,monospace;
 overflow-wrap:anywhere;
}
.result-archive {
 padding:12px 14px;
 border:1px solid #26313a;
 border-radius:11px;
 background:#0a1013;
 color:#9eabb6!important;
}
.result-actions { display:flex;gap:8px;flex-wrap:wrap; }
.result-actions button { margin:0; }
.result-actions #againButton { min-width:160px; }

@media (max-width:650px) {
 .quick-guide { grid-template-columns:1fr; }
 .relay-grid button { min-width:0;min-height:78px; }
 .result { align-items:start;padding:14px; }
 .result-card { margin:auto;padding:24px 18px!important;border-radius:18px!important; }
 .result h2 { font-size:36px!important; }
 .result-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .result-actions { display:grid;grid-template-columns:1fr 1fr; }
 .result-actions button { width:100%;min-height:48px; }
}

@media (prefers-reduced-motion:reduce) {
 .result-state i { box-shadow:none; }
}
