:root{--font-sans:'Inter',-apple-system,sans-serif;--font-mono:'JetBrains Mono',monospace;--radius:12px;--transition:0.25s ease}
[data-theme="dark"]{--bg:#0F172A;--bg2:#1E293B;--bg-card:rgba(30,41,59,0.85);--bg-input:rgba(51,65,85,0.5);--border:rgba(148,163,184,0.1);--text:#F1F5F9;--text2:#94A3B8;--text3:#64748B;--primary:#6366F1;--secondary:#94A3B8;--accent:#22D3EE;--green:#34D399;--red:#F87171;--gradient:linear-gradient(135deg,#6366F1,#8B5CF6)}
[data-theme="light"]{--bg:#F8FAFC;--bg2:#FFFFFF;--bg-card:rgba(255,255,255,0.95);--bg-input:rgba(241,245,249,0.5);--border:rgba(0,0,0,0.08);--text:#1E293B;--text2:#475569;--text3:#94A3B8;--primary:#4F46E5;--secondary:#64748B;--accent:#0891B2;--green:#059669;--red:#DC2626;--gradient:linear-gradient(135deg,#4F46E5,#7C3AED)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);min-height:100vh}
.app{max-width:800px;margin:0 auto;display:flex;flex-direction:column;min-height:100vh}
.header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border)}.header-actions{display:flex;gap:8px}
.logo{display:flex;align-items:center;gap:10px}.logo h1{font-size:1rem;font-weight:700;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:.82rem;font-weight:500;padding:8px 16px;border-radius:8px;border:none;cursor:pointer;transition:all var(--transition)}
.btn-primary{background:var(--gradient);color:#fff}.btn-primary:hover{transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--text2)}.btn-ghost:hover{background:var(--bg-input);color:var(--text)}
.main{flex:1;padding:24px;display:flex;flex-direction:column;gap:24px}
.score-banner{display:flex;align-items:center;gap:20px;padding:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius)}
.score-ring{position:relative;width:80px;height:80px;flex-shrink:0}.score-ring svg{width:100%;height:100%}
.score-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;font-family:var(--font-mono);color:var(--primary)}
.score-banner h2{font-size:.9rem;font-weight:600;margin-bottom:4px}.score-banner p{font-size:.82rem;color:var(--text2);max-width:400px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.probe{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;animation:fadeIn .3s ease}
.probe h3{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text3);margin-bottom:6px;display:flex;align-items:center;gap:6px}
.probe .val{font-family:var(--font-mono);font-size:.8rem;color:var(--text);word-break:break-all;line-height:1.4}
.risk-high{color:var(--red)}.risk-low{color:var(--green)}.risk-med{color:var(--accent)}
.dot{width:6px;height:6px;border-radius:50%;display:inline-block}
.dot-red{background:var(--red)}.dot-green{background:var(--green)}.dot-yellow{background:#FBBF24}
.tips{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px}
.tips h3{font-size:.85rem;font-weight:600;margin-bottom:10px}
.tips ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.tips li{font-size:.8rem;color:var(--text2);padding:6px 0;border-bottom:1px solid var(--border)}
.tips li:last-child{border-bottom:none}
@keyframes fadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
[data-theme="dark"] .icon-moon{display:none}[data-theme="dark"] .icon-sun{display:block}[data-theme="light"] .icon-moon{display:block}[data-theme="light"] .icon-sun{display:none}
@media(max-width:640px){.grid{grid-template-columns:1fr}.main{padding:16px}.score-banner{flex-direction:column;text-align:center}}