.diagnostics-shell { --diag-blue:#55b8ff; --diag-green:#55d8a6; --diag-yellow:#f0cc33; display:grid; gap:1rem; color:#f8fbff; }
.diagnostics-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; padding:.35rem .45rem .85rem; border-bottom:1px solid rgba(85,184,255,.25); }
.diagnostics-heading span { color:var(--diag-yellow); font-size:.72rem; font-weight:800; letter-spacing:.12em; }
.diagnostics-heading h1 { margin:.28rem 0; font-size:clamp(1.65rem,2.7vw,2.4rem); }
.diagnostics-heading p,.diagnostics-card header p { margin:0; color:#bdc9d7; }
.diagnostics-actions { display:flex; flex-wrap:wrap; gap:.55rem; }
.diagnostics-actions button { padding:.68rem .9rem; border:1px solid #4a627a; border-radius:10px; color:#f7f9fc; background:#172b40; font-weight:800; cursor:pointer; }
.diagnostics-actions button.is-primary { border-color:#d9b900; color:#111820; background:linear-gradient(135deg,#f0cc33,#d8b000); }
.diagnostics-actions button:disabled { opacity:.55; cursor:wait; }
.diagnostics-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; }
.diagnostics-summary article { display:grid; gap:.22rem; padding:.9rem 1rem; border:1px solid rgba(168,195,222,.26); border-radius:14px; background:linear-gradient(145deg,#11243a,#0c1929); }
.diagnostics-summary span { color:#aebdcd; font-size:.7rem; text-transform:uppercase; }
.diagnostics-summary strong { font-size:1rem; overflow-wrap:anywhere; }
.diagnostics-card { padding:1.15rem; border:1px solid rgba(168,195,222,.3); border-radius:18px; background:linear-gradient(155deg,#102238,#0b1828 72%); box-shadow:0 18px 42px rgba(0,0,0,.2); }
.diagnostics-card header { margin-bottom:.9rem; }
.diagnostics-card h2 { margin:0 0 .2rem; font-size:1.1rem; }
.diagnostics-checks { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
.diagnostics-check { display:grid; grid-template-columns:12px minmax(0,1fr) auto; gap:.65rem; align-items:center; padding:.75rem; border:1px solid rgba(168,195,222,.2); border-radius:11px; background:#112338; }
.diagnostics-check__dot { width:10px; height:10px; border-radius:50%; background:#ef7777; box-shadow:0 0 12px currentColor; }
.diagnostics-check.is-ok .diagnostics-check__dot { background:var(--diag-green); }.diagnostics-check.is-warning .diagnostics-check__dot { background:var(--diag-yellow); }
.diagnostics-check div { display:grid; gap:.18rem; }.diagnostics-check small { color:#9fb0c1; }.diagnostics-check b { font-size:.68rem; }
.is-ok { color:var(--diag-green)!important; }.is-warning { color:var(--diag-yellow)!important; }.is-error { color:#ff9c9c!important; }
.diagnostics-table-wrap { overflow-x:auto; }.diagnostics-card table { width:100%; border-collapse:collapse; font-size:.78rem; }
.diagnostics-card th,.diagnostics-card td { padding:.7rem; border-bottom:1px solid rgba(168,195,222,.18); text-align:left; }.diagnostics-card th { color:#aebdcd; font-size:.66rem; text-transform:uppercase; }
.diagnostics-card code { color:#91ceff; font-size:.7rem; }.diagnostics-run-state { font-weight:900; font-size:.7rem; }
.diagnostics-feedback { min-height:1.2rem; margin:0 .25rem; color:#aebdcd; font-size:.76rem; }.diagnostics-feedback[data-kind="success"] { color:var(--diag-green); }.diagnostics-feedback[data-kind="error"] { color:#ff9c9c; }
.diagnostics-alert { padding:1rem; border:1px solid rgba(239,119,119,.4); border-radius:14px; color:#ffaaaa; background:rgba(239,119,119,.08); }
.diagnostics-card--field { border-color:rgba(240,204,51,.3); }
.diagnostics-field-controls { display:grid; grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) auto; gap:.7rem; align-items:end; }
.diagnostics-field-controls label { display:grid; gap:.35rem; color:#d9e2eb; font-size:.74rem; font-weight:700; }
.diagnostics-field-controls select { min-height:42px; width:100%; padding:.62rem .7rem; border:1px solid #415b73; border-radius:10px; color:#f8fbff; background:#07131f; }
.diagnostics-field-controls button { min-height:42px; padding:.68rem .9rem; border:1px solid #d9b900; border-radius:10px; color:#111820; background:linear-gradient(135deg,#f0cc33,#d8b000); font-weight:800; cursor:pointer; }
.diagnostics-field-controls button:disabled { opacity:.45; cursor:not-allowed; }
.diagnostics-field-result { margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(168,195,222,.2); }
.diagnostics-field-result > header { display:flex; align-items:center; gap:.7rem; margin-bottom:.75rem; }
.diagnostics-field-result > header strong { font-size:.9rem; }.diagnostics-field-result > header span { color:#aebdcd; font-size:.78rem; }
@media(max-width:900px){.diagnostics-heading{display:grid;align-items:start}.diagnostics-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.diagnostics-checks{grid-template-columns:1fr}}
@media(max-width:900px){.diagnostics-field-controls{grid-template-columns:1fr 1fr}.diagnostics-field-controls button{grid-column:1/-1}}
@media(max-width:560px){.diagnostics-summary{grid-template-columns:1fr}.diagnostics-actions{display:grid}.diagnostics-check{grid-template-columns:12px minmax(0,1fr)}.diagnostics-check b{grid-column:2}.diagnostics-field-controls{grid-template-columns:1fr}.diagnostics-field-controls button{grid-column:auto}}