/* Minimal, readable, SEO-friendly base */
:root{
  --bg:#fff; --fg:#1a1a1a; --muted:#6b7280; --link:#0f62fe; --accent:#10b981; --border:#e5e7eb; --max:860px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP",sans-serif;line-height:1.75}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
header,main,footer{width:100%;}
.container{max-width:var(--max);margin:0 auto;padding:20px}
header{border-bottom:1px solid var(--border);background:#fafafa}
.site-title{font-size:1.5rem;margin:0}
.site-desc{color:var(--muted);margin:.25rem 0 0}
nav ul{list-style:none;margin:10px 0 0;padding:0;display:flex;gap:12px;flex-wrap:wrap}
nav a{display:block;padding:6px 10px;border-radius:9999px;background:#f0f2f5}
.breadcrumb{font-size:.875rem;color:var(--muted);margin:10px 0}
h1{font-size:2rem;margin:1.2rem 0 .6rem}
h2{font-size:1.5rem;margin:1.2rem 0 .6rem}
h3{font-size:1.25rem;margin:1rem 0 .5rem}
.lead{font-size:1.05rem;color:#374151}
.card{border:1px solid var(--border);border-radius:14px;padding:16px;margin:14px 0;background:#fff}
.card h3{margin-top:0}
.grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:740px){.grid{grid-template-columns:1fr 1fr}}
.meta{font-size:.85rem;color:var(--muted)}
footer{border-top:1px solid var(--border);background:#fafafa;margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:10px}
small{color:var(--muted)}
.skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{position:static;width:auto;height:auto;padding:8px;background:#000;color:#fff;border-radius:8px}
.toc{border-left:4px solid var(--accent);padding-left:12px;background:#f7fff9;border-radius:8px;margin:16px 0}
.toc h2{margin-top:.4rem}
.toc ol{margin:0;padding-left:18px}
blockquote{border-left:4px solid #e5e7eb;margin:1rem 0;padding:.5rem 1rem;background:#fafafa}
code,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;background:#f6f8fa;padding:.2em .35em;border-radius:6px}
figure{margin:1rem 0}
img{max-width:100%;height:auto}

/* 黄色い蛍光ペンのヌル塗り */
.ymarker{
  padding: 0 .12em;                      /* 端が少しはみ出す感じ */
  background:
    linear-gradient(transparent 58%, rgba(255,241,118,.95) 0) /* 明るい黄 */
  ;
  box-shadow:
    inset 0 -.18em 0 rgba(255,235,59,.6); /* 下辺に濃い黄で“にじみ” */
}

/* 太い赤文字 */
.hutoaka{
  color:#c81e1e;          /* 濃い赤 */
  font-weight:800;        /* 太く */
  letter-spacing:.01em;   /* わずかに詰める（好みで調整可） */
}