:root{color-scheme:light;--bg:#f4f6f8;--surface:#fff;--text:#14202a;--muted:#667581;--line:#e0e6ea;--brand:#136f62;--brand-soft:#e8f5f2;--good:#17845d;--good-soft:#e8f7f0;--bad:#b3424d;--bad-soft:#fff0f1;--blue:#315fa9;--blue-soft:#edf3ff;--shadow:0 10px 32px rgba(23,40,52,.07)}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#edf3f2 0,#f4f6f8 250px);color:var(--text);font:14px/1.5 system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}.shell{width:min(1440px,calc(100% - 36px));margin:auto;padding:28px 0 52px}h1,h2,p{margin:0}.topbar,.filters,.panel,.metrics article{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow)}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:25px 28px;border-radius:17px}.eyebrow{color:var(--brand);font-size:12px;font-weight:800;letter-spacing:.12em}.topbar h1{margin:3px 0 2px;font-size:30px;letter-spacing:-.035em}.topbar p,.filters p,.panel-head p{color:var(--muted)}.status{display:flex;align-items:center;gap:9px;padding:9px 13px;border-radius:99px;background:var(--brand-soft);color:var(--brand);font-weight:750}.status span{width:8px;height:8px;border-radius:50%;background:#20a97f;box-shadow:0 0 0 5px rgba(32,169,127,.13)}
.filters{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-top:16px;padding:18px 22px;border-radius:14px}.filters h2,.panel h2{font-size:18px}.filters form{display:flex;align-items:end;gap:9px;flex-wrap:wrap}.quick-dates{display:flex;gap:7px}.filters label{display:grid;gap:4px;color:var(--muted);font-size:12px;font-weight:750}.filters input,.filters button{height:40px;border-radius:8px;border:1px solid var(--line);font:inherit}.filters input{padding:0 10px;background:#fff;color:var(--text)}.filters button{padding:0 18px;border-color:var(--brand);background:var(--brand);color:#fff;font-weight:800;cursor:pointer}.filters button:hover{filter:brightness(.97)}.filters button.secondary{background:#fff;color:var(--brand)}.notice{min-height:26px;padding:10px 2px 0;color:var(--muted)}.notice.error{color:var(--bad)}
.metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:4px}.metrics article{position:relative;overflow:hidden;padding:19px 19px 17px;border-radius:13px}.metrics article:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#aab6be}.metrics article.primary:before{background:var(--blue)}.metrics article.valid:before{background:var(--good)}.metrics article.invalid:before{background:var(--bad)}.metrics span,.metrics small{display:block;color:var(--muted)}.metrics span{font-weight:700}.metrics strong{display:block;margin:7px 0 3px;font-size:29px;line-height:1.1;letter-spacing:-.03em}.metrics .primary strong{color:var(--blue)}.metrics .valid strong{color:var(--good)}.metrics .invalid strong{color:var(--bad)}
.panel{margin-top:15px;padding:21px 22px;border-radius:14px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.panel-head>strong{padding:7px 10px;border-radius:8px;background:var(--brand-soft);color:var(--brand);font-size:13px}.counter{color:var(--muted);font-weight:700}.table-wrap{margin-top:14px;overflow:auto;border:1px solid var(--line);border-radius:10px}table{width:100%;min-width:900px;border-collapse:collapse;background:#fff}th,td{padding:12px 11px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}th:first-child,td:first-child{text-align:left}th{position:sticky;top:0;z-index:1;background:#f8fafb;color:#60707d;font-size:11px;letter-spacing:.04em;text-transform:uppercase}tbody tr:hover{background:#fbfdfd}tbody tr:last-child td{border-bottom:0}.domain-name,.host-name{font-weight:750;color:#273b49}.ip-address{font:12px ui-monospace,SFMono-Regular,Consolas,monospace;color:#405461}.emphasis{color:var(--blue);font-weight:800}.text-valid{color:var(--good);font-weight:750}.text-invalid{color:var(--bad);font-weight:750}.empty{text-align:center!important;color:var(--muted);padding:30px}.badge{display:inline-flex;min-width:44px;justify-content:center;padding:3px 8px;border-radius:99px;font-size:12px;font-weight:800}.badge.good{background:var(--good-soft);color:var(--good)}.badge.bad{background:var(--bad-soft);color:var(--bad)}.badge.neutral{background:#eef2f4;color:#687883}.footnote{margin-top:14px;padding:11px 13px;border:1px solid #eadca8;border-radius:9px;background:#fffaf0;color:#78632a}
@media(max-width:1100px){.metrics{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.shell{width:calc(100% - 20px);padding-top:12px}.topbar,.filters{align-items:flex-start;flex-direction:column}.topbar,.filters,.panel{padding:18px}.filters form{width:100%}.filters label{flex:1;min-width:135px}.filters input{width:100%}.metrics{grid-template-columns:repeat(2,1fr)}.topbar h1{font-size:25px}.panel-head{align-items:flex-start}}@media(max-width:440px){.metrics{gap:8px}.metrics article{padding:15px}.metrics strong{font-size:24px}.filters form>button{flex:1}.quick-dates{width:100%}.quick-dates button{flex:1}}