:root{--bg:#f4f6f9;--card:#fff;--ink:#1d2433;--muted:#6b7280;--line:#e5e7eb;--accent:#1a73e8;--ok:#15803d;--okbg:#dcfce7;--warn:#b45309;--warnbg:#fef3c7;--bad:#b91c1c;--badbg:#fee2e2;--side:#1f2937}
*{box-sizing:border-box}
body{margin:0;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
.layout{display:flex;min-height:100vh}
.side{width:210px;background:var(--side);color:#e5e7eb;padding:18px 14px;flex-shrink:0}
.side .brand{font-weight:700;font-size:15px;margin-bottom:22px;color:#fff}
.side a{display:block;color:#d1d5db;padding:9px 10px;border-radius:6px;margin-bottom:2px}
.side a.active,.side a:hover{background:#374151;color:#fff;text-decoration:none}
.side .foot{margin-top:30px;font-size:12px;color:#9ca3af}
.main{flex:1;padding:26px 32px;max-width:1300px}
h1{font-size:20px;margin:0 0 6px}h2{font-size:15px;margin:22px 0 10px}
.sub{color:var(--muted);margin-bottom:18px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:14px 0}
.tile{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.tile .k{font-size:11px;color:var(--muted);letter-spacing:.04em}
.tile .v{font-size:22px;font-weight:700;margin-top:4px}
.tile .s{font-size:12px;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:16px}
table{width:100%;border-collapse:collapse;font-size:13px}
th{font-size:11px;color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-weight:600;white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:none}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
.ok{background:var(--okbg);color:var(--ok)}.warn{background:var(--warnbg);color:var(--warn)}.bad{background:var(--badbg);color:var(--bad)}.muted{background:#f1f5f9;color:var(--muted)}
.score{font-weight:700;font-size:18px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:16px 0}
.tabs a{padding:8px 14px;border-radius:8px 8px 0 0;color:var(--muted)}
.tabs a.active{background:var(--card);color:var(--ink);border:1px solid var(--line);border-bottom-color:var(--card);margin-bottom:-1px;font-weight:600}
.kv{display:grid;grid-template-columns:160px 1fr;gap:6px 14px;font-size:13px}.kv .k{color:var(--muted)}
.bars{display:flex;gap:2px;align-items:flex-end;height:26px}
.bars span{flex:1;background:var(--ok);border-radius:2px;min-width:4px;height:100%}.bars span.d{background:var(--bad)}.bars span.n{background:#e5e7eb}
.small{font-size:12px;color:var(--muted)}
.mono{font-family:ui-monospace,Menlo,monospace;font-size:12px}
.login{max-width:360px;margin:12vh auto;background:var(--card);padding:28px;border-radius:12px;border:1px solid var(--line)}
input[type=text],input[type=email],input[type=password],select{width:100%;padding:9px 10px;border:1px solid #cbd5e1;border-radius:6px;font-size:14px;margin:4px 0 12px}
button{background:var(--accent);color:#fff;border:0;border-radius:6px;padding:10px 16px;font-size:14px;cursor:pointer}
.note{padding:8px 12px;border-left:3px solid var(--warn);background:var(--warnbg);border-radius:4px;margin:6px 0;font-size:13px}
.note.bad{border-color:var(--bad);background:var(--badbg)}
ul.plain{margin:0;padding-left:18px}
@media print{.side,.noprint{display:none}.main{padding:0;max-width:none}.card{break-inside:avoid;border:1px solid #999}body{background:#fff}}
