/* 会員サイト共通CSS（ライト基調・LPのsales.css系パレットに統一） */
:root{
  --ink:#17324d;--body:#304861;--blue:#1674c9;--teal:#008f8c;--green:#14965e;
  --coral:#f06452;--gold:#f5b72e;--cream:#fff8eb;--line:#d9e5ee;
  --shadow:0 14px 40px rgba(23,50,77,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:#e7edf5;color:#233c56;
  font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  font-size:1.075rem;line-height:1.85;
}
img{max-width:100%}
a{color:var(--blue)}
.wrap{width:min(1000px,calc(100% - 36px));margin:0 auto}

/* ヘッダー */
.site-header{
  position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line);
}
.site-header .inner{
  width:min(1000px,calc(100% - 36px));margin:0 auto;padding:14px 0;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none}
.brand .ja{font-size:1.3rem;font-weight:1000;color:var(--ink);letter-spacing:.04em}
.brand .en{font-size:.85rem;font-weight:900;color:var(--gold);letter-spacing:.28em}
.header-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:8px 20px;border-radius:999px;
  background:#fff;border:2px solid var(--blue);color:var(--blue);
  text-decoration:none;font-weight:900;font-size:1rem;white-space:nowrap;
}

/* パネル */
.panel{
  background:#fff;border:1px solid #c9d6e6;border-left:8px solid var(--blue);border-radius:20px;
  padding:26px 24px;box-shadow:0 16px 40px rgba(23,50,77,.14);
}
.panel + .panel{margin-top:18px}
.panel h3{font-size:1.28rem;margin-bottom:10px;color:#101c2e;font-weight:900}
.panel h3::before{content:"";display:inline-block;width:14px;height:14px;border-radius:4px;background:linear-gradient(135deg,var(--coral),var(--gold));margin-right:10px}

.note{
  margin-top:16px;padding:16px 18px;border:2px solid #f1c85b;background:#fffbed;
  border-radius:14px;font-size:1rem;color:var(--ink);
}

/* 音声ボックス */
.audio-box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 24px;box-shadow:var(--shadow)}
.audio-box audio{width:100%;margin-top:14px;min-height:54px}

/* フッター */
.site-footer{padding:44px 0 90px;color:#587087;font-size:.98rem}
.site-footer .test-note{
  border:2px solid #f1c85b;background:#fffbed;border-radius:14px;padding:14px 18px;
  color:var(--ink);font-weight:700;margin-bottom:20px;
}
.badge-ver{
  display:inline-block;margin-top:12px;padding:6px 14px;border:1px solid var(--line);
  border-radius:999px;color:#587087;font-size:.92rem;letter-spacing:.08em;background:#fff;
}

/* ===== ダークテーマ（右上トグルで切替・既定はライト） ===== */
html[data-theme="dark"] body{background:#0b1220;color:#dbe4ef}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .audio-box{background:#141e33;border-color:#31415a;box-shadow:0 16px 40px rgba(0,0,0,.45)}
html[data-theme="dark"] .panel h3,
html[data-theme="dark"] .audio-box h3{color:#f2f5f9 !important}
html[data-theme="dark"] .note{background:#1c2438;border-color:#8a6f2f;color:#f2f5f9}
html[data-theme="dark"] .placeholder{background:#141e33;border-color:#31415a;color:#b7c4d6}
html[data-theme="dark"] .site-footer{color:#93a5bb}
html[data-theme="dark"] .site-footer .test-note{background:#1c2438;border-color:#8a6f2f;color:#f2f5f9}
html[data-theme="dark"] .badge-ver{background:#141e33;border-color:#31415a;color:#b7c4d6}
