:root { color-scheme:light; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#2c3550; background:#eef2fb; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 10% 5%,#eadffc 0,transparent 31%),radial-gradient(circle at 92% 10%,#dceefb 0,transparent 34%),linear-gradient(145deg,#faf8fd,#edf4fb); }
button { border:1px solid #d6daea; border-radius:12px; padding:11px 15px; color:#55617d; background:#f8f9fd; cursor:pointer; font:inherit; font-weight:750; transition:.18s ease; }
button:hover:not(:disabled) { transform:translateY(-1px); border-color:#bfc5e1; background:#f0f1ff; }
button:disabled { opacity:.55; cursor:not-allowed; }
main { width:min(1120px,calc(100% - 32px)); margin:0 auto; padding:38px 0 34px; }
.hero,.panel,.privacy-note,.notice,.summary-grid article { border:1px solid #dce1ef; background:#ffffffdf; box-shadow:0 18px 44px #4e5a8010; }
.hero { padding:27px; border-radius:24px; }
.brand-row { display:flex; align-items:center; gap:13px; }
.brand-row > div:nth-child(2) strong,.brand-row > div:nth-child(2) span { display:block; }
.brand-row > div:nth-child(2) strong { margin-top:3px; font-size:14px; }
.mark { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; color:#fff; background:linear-gradient(145deg,#a290ea,#7186dd); box-shadow:0 13px 28px #776bc044; font-weight:850; }
.eyebrow { color:#7b84a7; font-size:10px; letter-spacing:.18em; font-weight:850; }
.live-badge { margin-left:auto; padding:7px 10px; border-radius:999px; color:#33715f; background:#eaf8f3; font-size:11px; font-weight:750; }
.live-badge i { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:#42c99a; box-shadow:0 0 0 4px #42c99a20; }
.hero-copy { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-top:30px; }
h1 { margin:0; max-width:760px; font-size:clamp(31px,5vw,54px); line-height:1.03; letter-spacing:-.035em; }
.hero-copy p { max-width:790px; margin:14px 0 0; color:#67738f; font-size:16px; line-height:1.6; }
.primary { flex:0 0 auto; min-width:185px; min-height:48px; color:#fff; border-color:#8275d8; background:linear-gradient(135deg,#9b8be8,#7187dc); box-shadow:0 12px 27px #7d72d535; }
.privacy-note { display:flex; gap:13px; align-items:flex-start; margin-top:16px; padding:17px 19px; border-color:#cce5dc; border-radius:16px; background:#f1faf7; }
.privacy-note > span { width:27px; height:27px; flex:0 0 27px; display:grid; place-items:center; border-radius:9px; color:#26715a; background:#d9f0e7; font-weight:850; }
.privacy-note strong,.privacy-note p { display:block; }
.privacy-note strong { color:#315c50; font-size:14px; }
.privacy-note p { margin:4px 0 0; color:#5c746d; font-size:13px; line-height:1.5; }
.notice { margin-top:16px; padding:15px 18px; border-radius:14px; color:#52627a; background:#f7f9fc; font-size:14px; }
.notice.running { color:#53639b; border-color:#ced5ef; background:#f1f3ff; }
.notice.good { color:#33715f; border-color:#bfe1d6; background:#edf9f5; }
.notice.warning { color:#825b2c; border-color:#ead3af; background:#fff7e9; }
.summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; margin-top:16px; }
.summary-grid article { min-height:138px; padding:20px; border-radius:17px; }
.summary-grid span,.summary-grid strong,.summary-grid small { display:block; }
.summary-grid span { color:#818ba4; font-size:12px; font-weight:750; }
.summary-grid strong { margin-top:15px; color:#303950; font-size:20px; line-height:1.2; overflow-wrap:anywhere; }
.summary-grid small { margin-top:7px; color:#74809a; font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.panel { margin-top:16px; border-radius:20px; overflow:hidden; }
.panel-heading { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:19px 22px; border-bottom:1px solid #e2e6f0; }
h2 { margin:5px 0 0; font-size:20px; }
.count-badge { padding:7px 10px; border-radius:999px; color:#6257a7; background:#efedff; font-size:11px; font-weight:750; white-space:nowrap; }
.check-list { padding:6px 22px 18px; }
.check-row { display:grid; grid-template-columns:31px minmax(150px,.7fr) minmax(220px,1.3fr); gap:12px; align-items:center; min-height:63px; padding:11px 0; border-bottom:1px solid #e7eaf2; }
.check-row:last-child { border-bottom:0; }
.check-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; font-size:12px; font-weight:850; }
.check-good .check-icon { color:#26715a; background:#e0f3ec; }
.check-warning .check-icon { color:#95622a; background:#fff0d9; }
.check-info .check-icon { color:#5365a4; background:#e9edff; }
.check-row strong { font-size:13px; }
.check-value { color:#5e6a84; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.empty { padding:28px 0 16px; color:#7b859d; font-size:13px; line-height:1.55; text-align:center; }
.actions { display:flex; gap:8px; }
.technical details { padding:0 22px 22px; }
.technical summary { padding:18px 0 0; color:#5c6680; cursor:pointer; font-size:13px; font-weight:700; }
pre { max-height:500px; overflow:auto; margin:15px 0 0; padding:18px; border-radius:14px; color:#dce8ff; background:#172137; font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
footer { display:flex; justify-content:space-between; gap:18px; margin-top:19px; padding:0 5px; color:#8790a8; font-size:11px; }
footer strong { color:#6d7894; }
@media (max-width:800px) { .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .hero-copy { align-items:flex-start; flex-direction:column; } .primary { width:100%; } .check-row { grid-template-columns:31px 1fr; } .check-value { grid-column:2; } }
@media (max-width:560px) { main { width:min(100% - 20px,1120px); padding-top:16px; } .hero { padding:20px; } .live-badge { display:none; } .summary-grid { grid-template-columns:1fr; } .panel-heading { align-items:flex-start; flex-direction:column; } .actions { width:100%; } .actions button { flex:1; } footer { flex-direction:column; } }