body { background-color: #fafafa; font-family: 'Noto Sans JP', sans-serif; color: #1a1a3e; }
.section-card {
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 2px 12px rgba(26,26,62,0.07);
  margin-bottom: 1.5rem;
  overflow: hidden;
}
.section-header {
  background: #1a1a3e;
  color: #fff;
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.section-header .num {
  background: #47d6d4;
  color: #1a1a3e;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  flex-shrink: 0;
}
.section-body { padding: 1.25rem 1.5rem; }

details summary {
  cursor: pointer;
  list-style: none;
  user-select: none;
}
details summary::-webkit-details-marker { display: none; }
details summary::after {
  content: '\ea4e';
  font-family: 'remixicon';
  float: right;
  transition: transform 0.3s;
  color: #47d6d4;
  font-size: 1.1rem;
}
details[open] summary::after {
  transform: rotate(180deg);
}
details summary {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  background: #f0fafa;
  border-left: 3px solid #47d6d4;
  font-weight: 600;
  color: #1a1a3e;
  margin-bottom: 0;
}
details[open] summary {
  border-radius: 0.5rem 0.5rem 0 0;
}
details .detail-body {
  padding: 1rem;
  background: #f8ffff;
  border-left: 3px solid #47d6d4;
  border-radius: 0 0 0.5rem 0.5rem;
}

.tip-box {
  background: #e8fafa;
  border-left: 4px solid #47d6d4;
  border-radius: 0 0.5rem 0.5rem 0;
  padding: 0.75rem 1rem;
  margin: 0.75rem 0;
}
.warn-box {
  background: #fff3ee;
  border-left: 4px solid #e85d2c;
  border-radius: 0 0.5rem 0.5rem 0;
  padding: 0.75rem 1rem;
  margin: 0.75rem 0;
}
.mode-badge {
  display: inline-block;
  background: #1a1a3e;
  color: #47d6d4;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 3px;
  letter-spacing: 0.05em;
  vertical-align: middle;
  margin-right: 0.25rem;
}
.preset-card {
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 0.75rem;
}
.preset-hard { background: linear-gradient(135deg, #1a1a3e 0%, #2a2a5e 100%); color: #fff; }
.preset-normal { background: linear-gradient(135deg, #2a6e4e 0%, #3a9e6e 100%); color: #fff; }
.preset-easy { background: linear-gradient(135deg, #b85d0c 0%, #e85d2c 100%); color: #fff; }
.preset-label { font-size: 0.7rem; opacity: 0.75; letter-spacing: 0.08em; text-transform: uppercase; }
.preset-title { font-weight: 700; font-size: 1rem; margin: 0.15rem 0; }
.preset-desc { font-size: 0.82rem; opacity: 0.9; }
.preset-names { font-size: 0.75rem; opacity: 0.75; margin-top: 0.3rem; }

.data-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.data-table th { background: #1a1a3e; color: #47d6d4; padding: 0.5rem 0.75rem; text-align: left; font-weight: 600; }
.data-table td { padding: 0.5rem 0.75rem; border-bottom: 1px solid #e8e8f0; }
.data-table tr:nth-child(even) td { background: #f4f4fa; }
.data-table tr:last-child td { border-bottom: none; }

.mode-grid { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
@media (min-width: 640px) { .mode-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .mode-grid { grid-template-columns: 1fr 1fr 1fr; } }

.mode-card {
  background: #f4f4fa;
  border-radius: 0.75rem;
  padding: 1rem;
  border-top: 3px solid #47d6d4;
  transition: box-shadow 0.2s;
}
.mode-card:hover { box-shadow: 0 4px 12px rgba(26,26,62,0.12); }
.mode-card .mode-en { font-size: 0.7rem; font-weight: 700; color: #47d6d4; letter-spacing: 0.08em; text-transform: uppercase; }
.mode-card .mode-ja { font-weight: 600; font-size: 0.9rem; color: #1a1a3e; margin: 0.2rem 0; }
.mode-card .mode-desc { font-size: 0.8rem; color: #555; }

.tag { display: inline-block; background: #e8e8f8; color: #1a1a3e; font-size: 0.72rem; padding: 0.1rem 0.5rem; border-radius: 20px; margin: 0.15rem; }
.tag-accent { background: #e0fafa; color: #1a8e8c; }

.nav-top {
  background: #1a1a3e;
  padding: 0.75rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  position: sticky;
  top: 0;
  z-index: 50;
}
.nav-top a { color: #47d6d4; font-size: 0.875rem; font-weight: 500; text-decoration: none; display: flex; align-items: center; gap: 0.35rem; }
.nav-top a:hover { color: #fff; }
.nav-title { color: #fff; font-size: 0.875rem; font-weight: 600; margin-left: auto; opacity: 0.8; }

.hero {
  background: linear-gradient(135deg, #1a1a3e 0%, #0e2a4a 100%);
  padding: 2.5rem 1.5rem 2rem;
  color: #fff;
  text-align: center;
}
.hero-sub { color: #47d6d4; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 0.5rem; }
.hero h1 { font-family: 'Noto Serif JP', serif; font-size: clamp(1.5rem, 5vw, 2.25rem); font-weight: 700; margin-bottom: 0.75rem; }
.hero p { font-size: 0.875rem; opacity: 0.8; max-width: 480px; margin: 0 auto; }
.hero-version { display: inline-block; background: rgba(71,214,212,0.2); border: 1px solid #47d6d4; color: #47d6d4; font-size: 0.75rem; padding: 0.2rem 0.75rem; border-radius: 20px; margin-top: 0.75rem; }

.toc { background: #fff; border-radius: 1rem; box-shadow: 0 2px 12px rgba(26,26,62,0.07); padding: 1.25rem 1.5rem; margin-bottom: 1.5rem; }
.toc h2 { font-size: 0.875rem; font-weight: 700; color: #1a1a3e; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.5rem; }
.toc ol { counter-reset: toc-counter; list-style: none; padding: 0; margin: 0; }
.toc ol li { counter-increment: toc-counter; display: flex; align-items: baseline; gap: 0.5rem; padding: 0.3rem 0; border-bottom: 1px dashed #e8e8f0; }
.toc ol li:last-child { border-bottom: none; }
.toc ol li::before { content: counter(toc-counter); background: #1a1a3e; color: #47d6d4; font-size: 0.65rem; font-weight: 700; width: 1.3rem; height: 1.3rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.toc ol li a { font-size: 0.85rem; color: #1a1a3e; text-decoration: none; }
.toc ol li a:hover { color: #47d6d4; }

.sub-section { margin-bottom: 1.25rem; }
.sub-section h3 { font-size: 0.95rem; font-weight: 700; color: #1a1a3e; margin-bottom: 0.6rem; padding-bottom: 0.3rem; border-bottom: 2px solid #e8e8f0; display: flex; align-items: center; gap: 0.4rem; }
.sub-section h3 .accent-dot { width: 8px; height: 8px; background: #47d6d4; border-radius: 50%; display: inline-block; flex-shrink: 0; }

.icon-accent { color: #47d6d4; }
.icon-cta { color: #e85d2c; }

footer {
  background: #1a1a3e;
  color: rgba(255,255,255,0.6);
  text-align: center;
  padding: 1.25rem 1rem;
  font-size: 0.8rem;
  margin-top: 2rem;
}

/* Game mode list */
.game-mode-list { list-style: none; padding: 0; margin: 0; }
.game-mode-list li {
  display: flex; align-items: flex-start; gap: 0.6rem;
  padding: 0.5rem 0; border-bottom: 1px solid #f0f0f8;
}
.game-mode-list li:last-child { border-bottom: none; }
.game-mode-list .gm-icon { width: 1.75rem; height: 1.75rem; background: #e8e8f8; border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 0.9rem; }
.game-mode-list .gm-en { font-size: 0.75rem; font-weight: 700; color: #47d6d4; letter-spacing: 0.05em; }
.game-mode-list .gm-ja { font-size: 0.875rem; font-weight: 600; color: #1a1a3e; }

/* Course style tags */
.course-style-grid { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.4rem; }
.cs-tag { background: #1a1a3e; color: #47d6d4; font-size: 0.7rem; font-weight: 600; padding: 0.2rem 0.6rem; border-radius: 4px; letter-spacing: 0.06em; }

/* Inline icon label row */
.info-row { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.4rem 0; font-size: 0.875rem; border-bottom: 1px solid #f0f0f8; }
.info-row:last-child { border-bottom: none; }
.info-row .ir-key { font-weight: 600; min-width: 9rem; flex-shrink: 0; font-size: 0.82rem; color: #1a1a3e; }
.info-row .ir-val { color: #444; font-size: 0.82rem; }

.launch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
@media (min-width: 640px) { .launch-grid { grid-template-columns: 1fr 1fr 1fr; } }
.launch-item { background: #f4f4fa; border-radius: 0.5rem; padding: 0.6rem 0.75rem; border-left: 3px solid #47d6d4; }
.launch-item .li-name { font-size: 0.72rem; font-weight: 700; color: #47d6d4; }
.launch-item .li-desc { font-size: 0.78rem; color: #333; margin-top: 0.15rem; }

/* ===== 2026.10 追補 ===== */
.new-badge { display:inline-block; background:#e85d2c; color:#fff; font-size:0.6rem; font-weight:700; letter-spacing:0.08em; padding:0.1rem 0.45rem; border-radius:3px; vertical-align:middle; margin-left:0.35rem; }
.toc ol li .new-badge { font-size:0.55rem; }
.steps { list-style:none; padding:0; margin:0; counter-reset: step; }
.steps > li { counter-increment: step; position:relative; padding:0 0 1rem 2.75rem; }
.steps > li::before { content: counter(step); position:absolute; left:0; top:0; width:2rem; height:2rem; border-radius:50%; background:#1a1a3e; color:#47d6d4; font-weight:700; font-size:0.85rem; display:flex; align-items:center; justify-content:center; }
.steps > li::after { content:''; position:absolute; left:0.97rem; top:2.1rem; bottom:0.2rem; width:2px; background:#e0f5f5; }
.steps > li:last-child::after { display:none; }
.steps .st-title { font-weight:700; font-size:0.92rem; color:#1a1a3e; line-height:1.7; padding-top:0.28rem; min-height:2rem; }
.steps .st-desc { font-size:0.83rem; color:#555; line-height:1.75; }
kbd.k { display:inline-flex; align-items:center; justify-content:center; min-width:1.9rem; height:1.9rem; padding:0 0.45rem; background:#fff; border:1px solid #cfd2e3; border-bottom-width:3px; border-radius:6px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:0.78rem; font-weight:700; color:#1a1a3e; white-space:nowrap; }
kbd.k.wide { min-width:3.2rem; }
.key-table { width:100%; border-collapse:collapse; font-size:0.84rem; }
.key-table td { padding:0.45rem 0.5rem; border-bottom:1px solid #eef0f6; vertical-align:middle; }
.key-table tr:last-child td { border-bottom:none; }
.key-table td.kc { width:7.5rem; white-space:nowrap; }
.key-table .en { display:block; font-size:0.68rem; color:#8a8ca8; letter-spacing:0.03em; }
.key-group { font-size:0.72rem; font-weight:700; color:#47d6d4; letter-spacing:0.12em; text-transform:uppercase; margin:1.1rem 0 0.35rem; }
.key-hero { display:flex; flex-wrap:wrap; gap:0.6rem; margin:0.5rem 0 1rem; }
.key-hero .kh { flex:1 1 9rem; background:#f4f4fa; border-radius:0.75rem; padding:0.75rem; text-align:center; }
.key-hero .kh .lbl { font-size:0.78rem; color:#1a1a3e; font-weight:600; margin-top:0.4rem; }
.rec-table { width:100%; border-collapse:collapse; font-size:0.82rem; min-width:34rem; }
.rec-table th { background:#1a1a3e; color:#fff; padding:0.55rem 0.6rem; text-align:left; font-weight:600; font-size:0.78rem; }
.rec-table th:first-child { background:#0e0e2a; color:#47d6d4; }
.rec-table td { padding:0.5rem 0.6rem; border-bottom:1px solid #e8e8f0; vertical-align:top; }
.rec-table td:first-child { font-weight:600; color:#1a1a3e; background:#f7f7fb; white-space:nowrap; }
.rule-card { background:#f8f9fc; border:1px solid #eceef5; border-radius:0.75rem; padding:0.8rem 0.9rem; }
.rule-card .rc-en { font-size:0.7rem; font-weight:700; color:#47d6d4; letter-spacing:0.08em; }
.rule-card .rc-ja { font-weight:700; font-size:0.92rem; color:#1a1a3e; margin:0.1rem 0 0.25rem; }
.rule-card .rc-desc { font-size:0.8rem; color:#555; line-height:1.7; }
.rule-card .rc-meta { font-size:0.72rem; color:#1a8e8c; margin-top:0.35rem; font-weight:600; }
.rule-grid { display:grid; grid-template-columns:1fr; gap:0.6rem; }
@media (min-width: 640px) { .rule-grid { grid-template-columns:1fr 1fr; } }
.trouble-item { border:1px solid #eceef5; border-radius:0.75rem; padding:0.85rem 1rem; margin-bottom:0.6rem; background:#fff; }
.trouble-item .ti-q { font-weight:700; font-size:0.9rem; color:#1a1a3e; display:flex; gap:0.45rem; align-items:flex-start; }
.trouble-item .ti-q i { color:#e85d2c; margin-top:0.15rem; }
.trouble-item .ti-a { font-size:0.83rem; color:#444; line-height:1.8; margin-top:0.35rem; padding-left:1.45rem; }
.gloss { display:grid; grid-template-columns:1fr; gap:0; }
@media (min-width: 640px) { .gloss { grid-template-columns:1fr 1fr; column-gap:1.25rem; } }
.gloss dt { font-weight:700; font-size:0.86rem; color:#1a1a3e; padding-top:0.6rem; }
.gloss dt span { font-weight:500; font-size:0.72rem; color:#8a8ca8; margin-left:0.35rem; }
.gloss dd { font-size:0.8rem; color:#555; line-height:1.7; margin:0.1rem 0 0; padding-bottom:0.6rem; border-bottom:1px dashed #e8e8f0; }
.flight-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0.4rem; font-size:0.74rem; text-align:center; }
.flight-grid .fh { font-weight:700; color:#fff; background:#1a1a3e; border-radius:0.4rem; padding:0.35rem 0.2rem; font-size:0.7rem; }
.flight-grid .fc { background:#f4f4fa; border-radius:0.4rem; padding:0.45rem 0.25rem; color:#1a1a3e; line-height:1.45; }
.flight-grid .fc b { display:block; font-size:0.8rem; }
.src-list { font-size:0.72rem; color:#8a8ca8; line-height:1.8; word-break:break-all; }
.src-list a { color:#1a8e8c; }

/* ===== manual-v2 共通追加（GAMEDAY / AIトレーナー） ===== */
.lead { font-size:0.9rem; color:#444; line-height:1.95; }
.cmp-table { width:100%; border-collapse:collapse; font-size:0.82rem; min-width:32rem; }
.cmp-table th { background:#1a1a3e; color:#fff; padding:0.55rem 0.7rem; text-align:left; font-weight:600; }
.cmp-table th:first-child { background:#0e0e2a; color:#47d6d4; width:22%; }
.cmp-table td { padding:0.55rem 0.7rem; border-bottom:1px solid #e8e8f0; vertical-align:top; line-height:1.7; }
.cmp-table td:first-child { font-weight:600; background:#f7f7fb; }
.cmp-table td.hl { background:#effcfc; }
.screen-fig { background:#f4f4fa; border-radius:0.9rem; padding:1rem; margin:0.75rem 0 0.4rem; }
.screen-fig svg { width:100%; height:auto; display:block; }
.fig-cap { font-size:0.72rem; color:rgba(26,26,62,0.45); text-align:center; margin:0.35rem 0 1rem; }
.btn-label { display:inline-block; background:#1a1a3e; color:#fff; font-size:0.72rem; font-weight:700; letter-spacing:0.04em; padding:0.12rem 0.55rem; border-radius:4px; white-space:nowrap; }
.btn-label.teal { background:#47d6d4; color:#1a1a3e; }
.menu-cards { display:grid; grid-template-columns:1fr; gap:0.6rem; }
@media (min-width:640px){ .menu-cards { grid-template-columns:1fr 1fr; } }
@media (min-width:900px){ .menu-cards.five { grid-template-columns:repeat(3,1fr); } }
.menu-card { border-radius:0.8rem; padding:0.9rem 1rem; background:linear-gradient(135deg,#1a1a3e 0%,#24245a 100%); color:#fff; position:relative; overflow:hidden; }
.menu-card::after { content:''; position:absolute; right:-20px; top:-20px; width:90px; height:90px; border-radius:50%; background:radial-gradient(circle, rgba(71,214,212,.25), transparent 70%); }
.menu-card .mc-en { font-size:0.68rem; letter-spacing:0.12em; color:#47d6d4; font-weight:700; }
.menu-card .mc-ja { font-weight:700; font-size:0.98rem; margin:0.15rem 0 0.3rem; }
.menu-card .mc-desc { font-size:0.78rem; color:rgba(255,255,255,0.75); line-height:1.7; }
.note-unv { font-size:0.72rem; color:#8a8ca8; }
.scene-grid { display:grid; grid-template-columns:1fr; gap:0.7rem; }
@media (min-width:640px){ .scene-grid { grid-template-columns:1fr 1fr; } }
.scene { border:1px solid #eceef5; border-radius:0.8rem; padding:0.9rem 1rem; background:#fff; }
.scene .sc-h { display:flex; align-items:center; gap:0.5rem; font-weight:700; color:#1a1a3e; font-size:0.92rem; }
.scene .sc-h i { width:2rem; height:2rem; border-radius:50%; background:#e8fafa; color:#1a8e8c; display:flex; align-items:center; justify-content:center; font-size:1rem; }
.scene ul { margin:0.5rem 0 0; padding-left:1.1rem; font-size:0.8rem; color:#555; line-height:1.85; list-style:disc; }
.cp-acc { border:1px solid #eceef5; border-radius:0.8rem; margin-bottom:0.6rem; overflow:hidden; background:#fff; }
.cp-acc > summary { list-style:none; cursor:pointer; padding:0.85rem 1rem; display:flex; align-items:center; gap:0.7rem; background:#fff; border-left:none; border-radius:0; }
.cp-acc > summary::-webkit-details-marker { display:none; }
.cp-acc > summary::after { content:'\ea4e'; font-family:'remixicon'; margin-left:auto; color:#47d6d4; transition:transform .25s; }
.cp-acc[open] > summary::after { transform:rotate(180deg); }
.cp-acc[open] > summary { border-bottom:1px solid #eceef5; }
.cp-step { width:2rem; height:2rem; border-radius:50%; background:#1a1a3e; color:#47d6d4; font-weight:700; font-size:0.78rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.cp-title { font-weight:700; color:#1a1a3e; font-size:0.95rem; line-height:1.3; }
.cp-title small { display:block; font-weight:500; font-size:0.72rem; color:#8a8ca8; letter-spacing:0.05em; }
.cp-count { background:#e8fafa; color:#1a8e8c; font-size:0.72rem; font-weight:700; padding:0.15rem 0.6rem; border-radius:2rem; white-space:nowrap; margin-left:0.25rem; }
.cp-body { padding:0.75rem 1rem 0.9rem; }
.cp-body > p { font-size:0.8rem; color:#666; margin-bottom:0.5rem; line-height:1.75; }
.cp-list { display:grid; grid-template-columns:1fr; gap:0; }
@media (min-width:640px){ .cp-list { grid-template-columns:1fr 1fr; column-gap:1.2rem; } }
.cp-item { padding:0.5rem 0; border-bottom:1px dashed #e8e8f0; }
.cp-item .ja { font-weight:700; font-size:0.85rem; color:#1a1a3e; }
.cp-item .en { font-size:0.68rem; color:#1a8e8c; letter-spacing:0.02em; margin-left:0.3rem; }
.cp-item .d { font-size:0.78rem; color:#555; line-height:1.7; margin-top:0.1rem; }
.cp-total { display:grid; grid-template-columns:repeat(4,1fr); gap:0.4rem; margin-top:0.8rem; }
@media (min-width:640px){ .cp-total { grid-template-columns:repeat(8,1fr); } }
.cp-total div { background:#f4f4fa; border-radius:0.5rem; padding:0.45rem 0.2rem; text-align:center; }
.cp-total b { display:block; font-size:1.1rem; color:#1a1a3e; }
.cp-total span { font-size:0.62rem; color:#8a8ca8; letter-spacing:0.02em; }
.cp-total .sum { background:#1a1a3e; }
.cp-total .sum b { color:#47d6d4; }
.cp-total .sum span { color:rgba(255,255,255,.6); }
.metric-grid { display:grid; grid-template-columns:1fr; gap:0.6rem; }
@media (min-width:640px){ .metric-grid { grid-template-columns:1fr 1fr; } }
.metric { border-radius:0.8rem; padding:0.9rem 1rem; background:#f8f9fc; border:1px solid #eceef5; }
.metric .m-en { font-size:0.68rem; font-weight:700; letter-spacing:0.1em; color:#47d6d4; }
.metric .m-ja { font-weight:700; font-size:0.95rem; color:#1a1a3e; margin:0.1rem 0 0.3rem; }
.metric .m-desc { font-size:0.8rem; color:#555; line-height:1.75; }

.scroll-hint { display:none; font-size:0.7rem; color:#8a8ca8; text-align:right; margin-bottom:0.25rem; }
@media (max-width: 640px) { .scroll-hint { display:block; } }

/* ===== 2026.10.27 実機の画面写真（GAMEDAY / AIMY） ===== */
.fig { margin:0.8rem 0 0.35rem; }
.fig img { display:block; width:100%; height:auto; border-radius:0.75rem; border:1px solid rgba(26,26,62,0.08); box-shadow:0 2px 10px rgba(26,26,62,0.08); background:#0b0b14; }
.fig.narrow { max-width:26rem; margin-left:auto; margin-right:auto; }
.fig.tall { max-width:15rem; margin-left:auto; margin-right:auto; }
.fig-row { display:grid; grid-template-columns:1fr; gap:0.75rem; align-items:start; }
@media (min-width:640px){ .fig-row { grid-template-columns:1fr 1fr; } .fig-row .fig { margin-top:0; } }
.legend { list-style:none; padding:0; margin:0.5rem 0 1.1rem; display:grid; gap:0.4rem; }
.legend li { display:flex; gap:0.6rem; font-size:0.84rem; color:#444; line-height:1.75; }
.legend .n { flex-shrink:0; width:1.45rem; height:1.45rem; border-radius:50%; background:#e85d2c; color:#fff; font-weight:700; font-size:0.74rem; display:flex; align-items:center; justify-content:center; margin-top:0.18rem; box-shadow:0 0 0 2px #fff, 0 0 0 3px rgba(232,93,44,0.25); }
.legend b { color:#1a1a3e; }
.real-tag { display:inline-block; font-size:0.62rem; font-weight:700; letter-spacing:0.06em; color:#1a8e8c; background:#e8fafa; border-radius:3px; padding:0.05rem 0.4rem; margin-right:0.35rem; vertical-align:middle; }