*{box-sizing:border-box}body{margin:0;font:15px/1.5 system-ui,sans-serif;background:#0b1210;color:#e8f2ef}
header{display:flex;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid #1d2b27}.logo{font-size:20px;color:#3fe0b5}.net{color:#8aa;font-size:13px;flex:1}
button{background:#0e9f8e;color:#fff;border:1px solid #000;border-radius:10px;padding:10px 16px;font-weight:600;cursor:pointer}
main{max-width:860px;margin:0 auto;padding:24px}h1{margin:8px 0 0}.sub{color:#8aa;margin-top:4px}
form{display:flex;gap:8px;margin:16px 0}input{flex:1;background:#111c19;border:1px solid #24352f;color:#fff;border-radius:10px;padding:10px 12px;font-family:monospace}
.card{background:#111c19;border:1px solid #1d2b27;border-radius:14px;padding:16px;margin:12px 0}
.top{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.score{font-size:56px;font-weight:800;width:130px;height:130px;border-radius:50%;display:grid;place-items:center;border:6px solid}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:1}.stats div{background:#0b1210;border-radius:10px;padding:10px}.stats b{display:block;font-size:20px}
table{width:100%;border-collapse:collapse;font-size:13px}td,th{text-align:left;padding:6px;border-bottom:1px solid #1d2b27}code,.mono{font-family:monospace;font-size:12px}
.tag{font-size:11px;padding:2px 6px;border-radius:6px;margin-left:4px}.bad{background:#5a1d1d;color:#ffb3b3}.warn{background:#4d3d12;color:#ffd98a}.ok{color:#3fe0b5}
.doc{color:#aac;margin-top:20px}a{color:#3fe0b5}@media(max-width:600px){.stats{grid-template-columns:repeat(2,1fr)}}

header img.logo{height:44px;width:auto;border-radius:8px;display:block}
/* cream theme */
body{background:#f6f1e3;color:#123d32}header{border-bottom:1px solid #e2d9c2}header img.logo{border-radius:0;height:48px;mix-blend-mode:multiply}
.net,.sub,.doc{color:#5d7a70}button{background:#0f5e4a;border-color:#0b4436}
input{background:#fffdf6;border-color:#d9cfb5;color:#123d32}.card{background:#fffdf6;border-color:#e2d9c2}
.stats div{background:#f6f1e3}td,th{border-bottom-color:#e8e0cb}a,.ok{color:#0f5e4a}
.bad{background:#fde2e0;color:#9b2c24}.warn{background:#fbefc9;color:#7a5a0e}
header img.logo{mix-blend-mode:normal;height:40px}
.score{background:#fffdf5}
@media(max-width:600px){header{padding:10px 12px;gap:8px;flex-wrap:nowrap}header img.logo{height:26px}.net{font-size:11px;white-space:nowrap}header button#connect{padding:6px 10px;font-size:12px;border-radius:8px;white-space:nowrap}}
/* floating translucent header */
header{position:sticky;top:0;z-index:50;background:rgba(246,241,227,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(15,94,74,.08)}
header{background:rgba(246,241,227,.18);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border-bottom:0}