/* site.css — リーチラボ 共通スタイル（A案ネオンホール: 黒地×ネオン・製品アイデンティティとしてダーク固定） */
:root {
  --bg:#07070f; --panel:#0e0e1a; --panel2:#12141f; --line:#1c2230;
  --tx:#e5e7eb; --tx2:#8b95a8; --tx3:#5b6373;
  --gold:#ffd700; --pink:#e11d48; --cyan:#22d3ee; --green:#22c55e; --seg:#ff3b3b;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; }
body {
  background:var(--bg); color:var(--tx); min-height:100dvh;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans",Meiryo,sans-serif;
  line-height:1.65;
}
main { max-width:720px; margin:0 auto; padding:0 16px 64px; }
a { color:var(--cyan); }

/* ナビ */
nav.site {
  position:sticky; top:0; z-index:10; display:flex; align-items:center; gap:14px;
  padding:10px 16px; background:rgba(7,7,15,.92); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line); font-size:13px;
}
nav.site .brand { font-weight:900; letter-spacing:1px; color:var(--tx); text-decoration:none; }
nav.site .brand em { color:var(--gold); font-style:normal; }
nav.site a { color:var(--tx2); text-decoration:none; }
nav.site a.cta {
  margin-left:auto; background:linear-gradient(160deg,var(--pink),#9f1239); color:#fff;
  padding:7px 16px; border-radius:99px; font-weight:800;
  box-shadow:0 0 16px rgba(225,29,72,.45);
}

/* 見出し・ヒーロー */
h1 { font-size:24px; margin:26px 0 6px; letter-spacing:1px; }
h2 { font-size:17px; margin:34px 0 10px; padding-left:10px; border-left:4px solid var(--gold); }
h3 { font-size:14px; margin:18px 0 8px; color:#fde68a; }
.lead { color:var(--tx2); font-size:13.5px; }
.hero {
  margin:22px 0 8px; padding:26px 20px; border-radius:18px; position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 85% 15%, rgba(255,215,0,.14), transparent 45%),
    radial-gradient(circle at 10% 90%, rgba(34,211,238,.12), transparent 45%),
    linear-gradient(160deg,#12102a,#0a0918);
  border:1px solid #262b45;
}
.hero h1 { margin:0 0 6px; font-size:26px; }
.hero .tag { display:inline-block; font-size:11px; color:#07070f; background:var(--gold); border-radius:6px; padding:1px 8px; font-weight:900; margin-bottom:10px; }

/* カード */
.card {
  background:var(--panel); border:1px solid var(--line); border-radius:16px;
  padding:18px; margin:14px 0;
}
.card.machine { position:relative; overflow:hidden; }
.card.machine::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(-55deg, transparent 0 26px, rgba(255,215,0,.045) 26px 52px);
}
.card .specband { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.card .specband b {
  font-size:12px; background:#0b0b16; border:1px solid #2a3040; border-radius:8px;
  padding:4px 10px; color:#fde68a; font-weight:700;
}
.btnrow { display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.btn {
  display:inline-block; text-decoration:none; text-align:center; font-weight:800; font-size:14px;
  padding:12px 22px; border-radius:12px; border:1px solid #3a4152; color:var(--tx);
}
.btn.primary { background:linear-gradient(160deg,var(--pink),#9f1239); border:none; color:#fff; box-shadow:0 0 18px rgba(225,29,72,.4); }
.btn.gold { background:linear-gradient(160deg,#b8860b,#7c5203); border:none; color:#fff7e0; }

/* 表 */
.table-wrap { overflow-x:auto; margin:10px 0; border:1px solid var(--line); border-radius:12px; }
table { width:100%; border-collapse:collapse; font-size:13px; background:var(--panel); }
th, td { text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); }
thead th { color:var(--tx2); font-size:11.5px; background:var(--panel2); white-space:nowrap; }
tbody th { color:var(--tx2); font-weight:700; white-space:nowrap; width:120px; }
tr:last-child td, tr:last-child th { border-bottom:none; }
td.num { font-variant-numeric:tabular-nums; white-space:nowrap; }
.cred-hot { color:var(--gold); font-weight:800; }
.cred-sure { color:#f0abfc; font-weight:900; }

/* コールアウト */
.note, .warn {
  border-radius:12px; padding:12px 14px; font-size:12.5px; margin:12px 0; line-height:1.7;
}
.note { background:rgba(34,211,238,.06); border:1px solid rgba(34,211,238,.3); color:#bfeafd; }
.warn { background:rgba(255,215,0,.05); border:1px solid rgba(255,215,0,.35); color:#fde9a8; }

/* 検証モード */
.simbox { background:var(--panel2); border:1px solid #2a3040; border-radius:16px; padding:16px; margin:14px 0; }
.simrow { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:8px 0; }
.simrow label { font-size:12px; color:var(--tx2); width:84px; flex:none; }
.simrow button, .simrow select, .simrow input {
  background:#0b0b16; color:var(--tx); border:1px solid #3a4152; border-radius:9px;
  padding:8px 14px; font-size:13px;
}
.simrow button.run { background:linear-gradient(160deg,#0891b2,#155e75); border:none; font-weight:800; }
.simrow button.cancel { color:#fca5a5; border-color:#7f1d1d; }
.simrow button:disabled { opacity:.4; }
.simrow input { width:130px; }
#simProg { height:8px; border-radius:99px; background:#1c2230; overflow:hidden; margin:10px 0; }
#simProg i { display:block; height:100%; width:0%; background:linear-gradient(90deg,var(--cyan),#0891b2); transition:width .15s; }
.simstats { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; margin-top:12px; }
.simstats .kpi { background:#0b0b16; border:1px solid #262b38; border-radius:10px; padding:9px 12px; }
.simstats .kpi .l { font-size:10.5px; color:var(--tx3); }
.simstats .kpi .v { font-size:16px; font-weight:800; color:var(--cyan); font-variant-numeric:tabular-nums; }
.simstats .kpi .s { font-size:10.5px; color:var(--tx2); }
.simstats .kpi.main .v { color:var(--gold); }
#simCanvas { width:100%; height:220px; background:#0b0b16; border:1px solid #262b38; border-radius:12px; margin-top:12px; }

footer.page { margin-top:48px; padding-top:16px; border-top:1px solid var(--line); color:var(--tx3); font-size:11.5px; }