:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin:0; background:#faf7f4; color:#2b2b2b; font-family:-apple-system,"Segoe UI",Roboto,sans-serif; }
nav { display:flex; gap:4px; padding:10px 14px; background:#fff; border-bottom:1px solid #e7e1d8; position:sticky; top:0; z-index:10; overflow-x:auto; }
nav a { padding:8px 12px; border-radius:10px; text-decoration:none; color:#2b2b2b; font-size:.9rem; white-space:nowrap; }
nav a.active { background:#f3e6e3; color:#8c4a40; font-weight:600; }
main { max-width:860px; margin:0 auto; padding:20px 16px 60px; }
h1 { font-size:1.45rem; margin:8px 0 4px; }
h2 { font-size:1.05rem; margin:0 0 10px; }
.sub { color:#8a8378; font-size:.85rem; margin-bottom:16px; }
.sub a { color:#b0685c; }
.banner { border-radius:12px; padding:14px 18px; margin-bottom:16px; font-size:.95rem; line-height:1.5; }
.b-green { background:#e6f2e6; border:1px solid #a9d3a9; }
.b-amber { background:#fdf3dd; border:1px solid #e8c876; }
.b-red   { background:#fbe7e4; border:1px solid #e5a49b; }
.b-gray  { background:#efece8; border:1px solid #d8d2c8; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin-bottom:18px; }
.card { background:#fff; border:1px solid #e7e1d8; border-radius:12px; padding:14px 16px; }
.card .label { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:#8a8378; }
.card .value { font-size:1.4rem; font-weight:650; margin-top:4px; }
.card .hint { font-size:.75rem; color:#8a8378; margin-top:2px; }
.panel { background:#fff; border:1px solid #e7e1d8; border-radius:12px; padding:16px; margin-bottom:16px; }
.chartwrap { position:relative; height:300px; }
table { width:100%; border-collapse:collapse; font-size:.85rem; }
th,td { text-align:left; padding:6px 8px; border-bottom:1px solid #efe9e0; }
th { color:#8a8378; font-weight:600; font-size:.72rem; text-transform:uppercase; }
.note { font-size:.78rem; color:#8a8378; line-height:1.55; margin-top:10px; }
.err { color:#a33; }
.pct-up { color:#2e7d32; } .pct-warn { color:#b26a00; } .pct-bad { color:#c62828; }
form.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
label.f { display:flex; flex-direction:column; font-size:.75rem; color:#8a8378; gap:4px; }
input, textarea { padding:9px 10px; border:1px solid #d8d2c8; border-radius:9px; font-size:.95rem; background:#fff; width:100%; }
button { padding:11px 18px; border:none; border-radius:10px; background:#b0685c; color:#fff; font-size:.95rem; font-weight:600; cursor:pointer; }
button.secondary { background:#efece8; color:#2b2b2b; }
button:disabled { opacity:.5; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:640px){ .two { grid-template-columns:1fr; } }
.good, .bad { border-radius:12px; padding:14px 16px; font-size:.9rem; line-height:1.55; }
.good { background:#e6f2e6; border:1px solid #a9d3a9; }
.bad  { background:#fbe7e4; border:1px solid #e5a49b; }
.good h3, .bad h3 { margin:0 0 8px; font-size:.95rem; }
.good ul, .bad ul { margin:0; padding-left:18px; }
.good li, .bad li { margin-bottom:6px; }
details { background:#fff; border:1px solid #e7e1d8; border-radius:12px; padding:12px 16px; margin-bottom:10px; }
summary { font-weight:600; cursor:pointer; font-size:.95rem; }
details .body { padding-top:10px; font-size:.9rem; line-height:1.6; }
.bigbtn { width:100%; padding:26px; font-size:1.35rem; border-radius:16px; }
.bigbtn.stop { background:#c62828; }
.statrow { display:flex; gap:12px; flex-wrap:wrap; margin:14px 0; }
.stat { flex:1; min-width:110px; background:#fff; border:1px solid #e7e1d8; border-radius:12px; padding:12px; text-align:center; }
.stat .v { font-size:1.3rem; font-weight:650; }
.stat .l { font-size:.72rem; color:#8a8378; text-transform:uppercase; }
.pulse { animation:pulse 1.2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.55} }
.quickrow { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.quickbtn { padding:20px 8px; font-size:1.05rem; border-radius:14px; }