:root{
  --bg:#ffffff;
  --card:#f7f8fb;
  --border:#e2e5ec;
  --text:#14171f;
  --sub:#565c6b;
  --accent:#d70a1e;
  --accent2:#ff6b35;
  --accent3:#ffb703;
  --accent4:#2ec4b6;
  --accent5:#3a86ff;
  --good:#0f9d58;
  --warn:#e65100;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Hiragino Sans","Noto Sans JP",-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:700;
  line-height:1.5;
  padding:12px;
}
h1{font-size:22px;margin:0 0 10px;color:var(--accent);letter-spacing:-0.02em;text-align:center;}
h2{font-size:18px;margin:20px 0 8px;padding-left:8px;border-left:6px solid var(--accent);}
h3{font-size:16px;margin:14px 0 6px;color:var(--accent2);}
p{margin:5px 0;font-size:16px;font-weight:700;}
.lead{font-size:15px;color:var(--sub);margin:0 0 12px;text-align:center;}

.tabs{
  display:flex;
  gap:6px;
  margin:0 0 14px;
  position:sticky;
  top:0;
  background:#fff;
  padding:6px 0;
  z-index:10;
  border-bottom:2px solid var(--border);
}
.tab-btn{
  flex:1;
  padding:11px 4px;
  border:none;
  border-radius:10px 10px 0 0;
  background:var(--card);
  color:var(--sub);
  font-weight:800;
  font-size:15px;
  cursor:pointer;
}
.tab-btn.active{background:var(--accent);color:#fff;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

.badge{display:inline-block;background:var(--accent);color:#fff;font-size:14px;padding:3px 10px;border-radius:20px;margin-right:6px;}
.badge.done{background:var(--good);}
.badge.todo{background:var(--warn);}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin:10px 0;}
.highlight{background:linear-gradient(135deg,#fff3e0,#ffe0e6);border:2px solid var(--accent);border-radius:14px;padding:14px;margin:10px 0 16px;}
.highlight .num{font-size:28px;color:var(--accent);line-height:1;}

.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0;}
@media (max-width:520px){.grid3{grid-template-columns:1fr;}}
.stat{background:#fff;border:1px solid var(--border);border-radius:12px;padding:10px;text-align:center;}
.stat .v{font-size:22px;}
.stat .k{font-size:14px;color:var(--sub);font-weight:700;}
.stat.c1 .v{color:var(--accent);}
.stat.c2 .v{color:var(--accent2);}
.stat.c3 .v{color:var(--good);}

.steps{list-style:none;padding:0;margin:10px 0;counter-reset:step;}
.steps li{
  counter-increment:step;
  position:relative;
  padding:9px 10px 9px 42px;
  margin-bottom:6px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  font-size:15px;
}
.steps li::before{
  content:counter(step);
  position:absolute;left:8px;top:50%;transform:translateY(-50%);
  width:24px;height:24px;background:var(--accent);color:#fff;border-radius:50%;
  font-size:14px;display:flex;align-items:center;justify-content:center;
}

.timeline{position:relative;margin:16px 0;padding-left:22px;border-left:4px solid var(--accent);}
.timeline .tl-item{position:relative;margin-bottom:14px;background:#fff;border:1px solid var(--border);border-radius:10px;padding:9px 11px;}
.timeline .tl-item::before{content:"";position:absolute;left:-29px;top:12px;width:12px;height:12px;background:var(--accent);border-radius:50%;border:2px solid #fff;}
.tl-date{font-size:14px;color:var(--accent);margin-bottom:2px;}
.tl-title{font-size:16px;}
.tl-desc{font-size:15px;color:var(--sub);font-weight:700;margin-top:2px;}

.checklist{list-style:none;padding:0;margin:10px 0;}
.checklist li{position:relative;padding:9px 10px 9px 40px;margin-bottom:6px;background:#fff;border:1px solid var(--border);border-radius:10px;font-size:15px;}
.checklist li.done{border-left:5px solid var(--good);}
.checklist li.todo{border-left:5px solid var(--warn);}
.checklist li::before{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:16px;}
.checklist li.done::before{content:"✅";}
.checklist li.todo::before{content:"🔲";}

.table-wrap{overflow-x:auto;overscroll-behavior-x:none;margin:10px 0;border:1px solid var(--border);border-radius:10px;-webkit-overflow-scrolling:touch;}
table{border-collapse:collapse;width:100%;min-width:480px;font-size:15px;}
th,td{border-bottom:1px solid var(--border);padding:8px 9px;text-align:center;white-space:nowrap;}
th{background:var(--accent);color:#fff;font-size:14px;}
tr:nth-child(even) td{background:#fafbfd;}
.hit{background:#fff3cd !important;font-weight:800;}

.chart-wrap{display:flex;flex-direction:column;align-items:center;margin:10px 0 16px;}
.chart-wrap svg{overflow:visible;}
.chart-wrap svg text{font-weight:900;}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:10px;font-size:15px;}
.legend span{display:flex;align-items:center;gap:5px;}
.dot{width:14px;height:14px;border-radius:3px;display:inline-block;}

.note{background:#fff8e1;border:1px solid #ffe082;border-radius:10px;padding:9px 11px;font-size:15px;color:#7a5c00;margin:8px 0;}
.warn-box{background:#fdecea;border:1px solid #f5b5ae;border-radius:10px;padding:9px 11px;font-size:15px;color:#8a1f11;margin:8px 0;}
.good-box{background:#e8f8ee;border:1px solid #a8e6bd;border-radius:10px;padding:9px 11px;font-size:15px;color:#0f5c2e;margin:8px 0;}
.src{font-size:14px;color:var(--sub);font-weight:700;margin-top:20px;border-top:1px solid var(--border);padding-top:8px;line-height:1.55;}