/* ai-tradelog.com 下層ページ共通。配色と文字はトップ(index.html)と揃える */
:root{
  --ground:#000000; --sink:#050505; --surface:#0B0B0D; --raise:#141418;
  --ink:#F5F5F7; --head:#FFFFFF; --body:#C6C6D0; --muted:#94949F; --line:#232329;
  --profit:#8B7FE8; --loss:#E8A0C0; --accent:#8B7FE8; --gold:#C4B26A;
  --mono:ui-monospace,SFMono-Regular,Menlo,"Courier New",monospace;
}
*{box-sizing:border-box}
html{background:#000000}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:system-ui,-apple-system,"Hiragino Sans","Noto Sans JP",sans-serif;
  line-height:1.85; -webkit-font-smoothing:antialiased}
a{color:var(--accent)}

/* 上部ナビ */
.topnav{border-bottom:1px solid var(--line); background:var(--ground)}
.tn-in{max-width:880px; margin:0 auto; padding:14px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px}
.tn-brand{color:var(--head); text-decoration:none; font-weight:700; font-size:19px; letter-spacing:.02em}
.tn-links{display:flex; gap:22px}
.tn-links a{color:var(--muted); text-decoration:none; font-size:15px}
.tn-links a:hover, .tn-links a[aria-current]{color:var(--ink)}

.wrap{max-width:760px; margin:0 auto; padding:0 20px 90px}

/* パンくず */
.crumb{font-size:13px; color:var(--muted); margin:26px 0 0}
.crumb a{color:var(--muted); text-decoration:none}
.crumb a:hover{color:var(--ink)}

/* 記事 */
.eyebrow{font-size:13px; letter-spacing:.14em; color:var(--accent); font-weight:600}
article h1{margin:10px 0 0; color:var(--head); font-size:27px; line-height:1.45;
  letter-spacing:-.01em; text-wrap:balance}
.a-date{font-size:13px; color:var(--muted); margin-top:12px}
.a-lead{font-size:16px; color:var(--ink); margin-top:26px; line-height:1.95}
article h2{margin:56px 0 0; color:var(--gold); font-size:21px; line-height:1.5; letter-spacing:-.01em}
article h3{margin:34px 0 0; color:var(--head); font-size:19px; line-height:1.5}
article p{font-size:16px; color:var(--body); margin:16px 0 0}
article p.strong, article b{color:var(--ink)}
article ul, article ol{margin:16px 0 0; padding-left:24px; font-size:16px; color:var(--body)}
article li{margin-top:8px}
.note-box{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:20px 22px; margin-top:24px; font-size:15px; color:var(--body)}
.num-table{width:100%; border-collapse:collapse; font-size:15px; margin-top:18px}
.num-table th{background:var(--raise); text-align:left; font-size:13px; color:var(--muted);
  font-weight:500; padding:11px 14px; border-bottom:1px solid var(--line)}
.num-table td{padding:11px 14px; border-bottom:1px solid var(--line); color:var(--body);
  font-variant-numeric:tabular-nums}
.num-table td.bad{color:var(--loss)}
.num-table td.good{color:var(--profit)}
.tablewrap{overflow-x:auto; margin-top:6px}

/* 目次 */
.toc{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:20px 22px; margin-top:30px}
.toc-t{font-size:13px; letter-spacing:.1em; color:var(--muted); font-weight:600}
.toc ol{margin:10px 0 0; padding-left:22px; font-size:15px}
.toc li{margin-top:7px}
.toc a{color:var(--body); text-decoration:none}
.toc a:hover{color:var(--ink)}

/* 担当プロフィール */
.author{display:flex; gap:16px; align-items:flex-start; background:var(--surface);
  border:1px solid var(--line); border-radius:12px; padding:20px; margin-top:26px}
.author img{width:84px; height:84px; border-radius:10px; object-fit:cover; flex:none;
  border:1px solid var(--line)}
.au-role{font-size:13px; color:var(--muted); letter-spacing:.04em}
.au-name{margin:2px 0 0; font-size:18px; color:var(--head); font-weight:700}
.au-name .kana{font-size:12px; color:var(--muted); font-weight:400; margin-left:8px}
.au-body p{font-size:14px; color:var(--body); margin:8px 0 0; line-height:1.8}
.au-trait{font-size:13px; color:var(--muted); margin-top:6px}

/* 一覧ページのカード */
.list-head h1{margin:14px 0 0; color:var(--head); font-size:26px; line-height:1.45}
.list-head p{font-size:16px; color:var(--body); margin-top:14px}
.cards{display:flex; flex-direction:column; gap:14px; margin-top:30px}
.card{display:block; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:22px; text-decoration:none; transition:border-color .15s}
.card:hover{border-color:#3A3A44}
.card .c-date{font-size:13px; color:var(--muted)}
.card h2{margin:6px 0 0; font-size:19px; color:var(--head); line-height:1.55}
.card p{font-size:15px; color:var(--body); margin:10px 0 0; line-height:1.8}
.card .c-by{font-size:13px; color:var(--muted); margin-top:12px}
.coming{margin-top:34px}
.coming h2{font-size:16px; color:var(--muted); font-weight:600; margin:0}
.coming ul{margin:12px 0 0; padding-left:22px; font-size:15px; color:var(--muted)}
.coming li{margin-top:6px}

/* 記事末の導線 */
.next{margin-top:56px; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:22px}
.next p{margin:0; font-size:15px; color:var(--body)}
.next a.btn{display:inline-block; margin-top:14px; background:var(--gold); color:#0A0A0A;
  font-weight:700; text-decoration:none; padding:12px 22px; border-radius:10px; font-size:15px}
.next a.plain{display:inline-block; margin-top:12px; font-size:15px}

/* フッター */
.site-foot{border-top:1px solid var(--line); margin-top:70px}
.sf-in{max-width:880px; margin:0 auto; padding:26px 20px 40px;
  display:flex; flex-direction:column; gap:12px}
.sf-menu{display:flex; gap:22px; flex-wrap:wrap}
.sf-menu a{color:var(--body); text-decoration:none; font-size:15px}
.sf-menu a:hover{color:var(--ink)}
.sf-note{color:var(--muted); font-size:13px; line-height:1.8}
.sf-note a{color:var(--accent); text-decoration:none}

/* 画面下の固定メニューバー(スマホのみ)。下部が隠れないよう余白を足す */
.tabbar{position:fixed; left:0; right:0; bottom:0; display:none; z-index:50;
  background:#0B0B0D; border-top:1px solid var(--line)}
.tabbar a{flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:9px 0 calc(9px + env(safe-area-inset-bottom));
  color:var(--muted); text-decoration:none; font-size:13px; letter-spacing:.02em}
.tabbar svg{width:21px; height:21px}
.tabbar a[aria-current]{color:var(--gold)}
@media(max-width:760px){.tabbar{display:flex} body{padding-bottom:72px}}

/* ヘッダーはハンバーガー。押すと下にメニューが開く */
.tn-burger{background:none; border:0; padding:6px; cursor:pointer; color:var(--ink); display:flex}
.tn-menu{display:none; background:var(--surface); border-bottom:1px solid var(--line)}
.tn-menu.open{display:block}
.tn-menu a{display:block; padding:15px 20px; color:var(--body); text-decoration:none;
  font-size:15px; border-top:1px solid var(--line)}
.tn-menu a[aria-current]{color:var(--gold)}

/* 会員向けの続きの案内 */
.lock{margin-top:44px; background:var(--surface); border:1px solid #3A3320; border-radius:12px; padding:26px 22px}
.lock svg{color:var(--gold)}
.lock-t{margin:10px 0 0; color:var(--head); font-size:17px; font-weight:700}
.lock ul{margin:12px 0 0; padding-left:22px; font-size:15px; color:var(--body)}
.lock li{margin-top:7px}
.lock p{font-size:15px; color:var(--muted); margin:14px 0 0}

.tn-burger{flex-direction:column; align-items:center; gap:2px}
.tn-burger span{font-size:13px; letter-spacing:.08em; color:var(--muted); line-height:1}

.tn-brand img{display:block; height:44px; width:auto}
