/* ============================================================
   FXチャート研究ノート（daiteblog.com）
   デザイン: チャート/分析ダッシュボード型（ライト）
   明るいグレー地 × チャコール文字 × ローソク足 赤(#d24b4b)/緑(#2fa36b)
   見出し=Noto Sans JP / 数値・ラベル=等幅(ui-monospace)
   グラデ/角丸ピル/blur sticky/hover浮き/紫青グラデ 禁止
   ============================================================ */

:root{
  --bg:#eceef1;          /* 明るいグレー地 */
  --panel:#ffffff;       /* パネル白 */
  --panel-2:#f5f6f8;     /* 薄いパネル */
  --ink:#23272e;         /* チャコール文字 */
  --ink-soft:#5b626c;    /* やや薄いチャコール */
  --ink-mute:#878d97;    /* ラベル等 */
  --rule:#d4d8dd;        /* 罫線 */
  --rule-strong:#b7bcc4;
  --up:#2fa36b;          /* 上げ=緑 */
  --down:#d24b4b;        /* 下げ=赤 */
  --up-bg:#e7f4ec;
  --down-bg:#f8e9e9;
  --accent:#2b3b52;      /* アクセント1: ネイビーチャコール（数値見出しの帯） */
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.85;
  font-weight:400;
}

.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;}

a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}

/* ---------- ヘッダー（フルワイド帯・stickyなし） ---------- */
.site-head{
  background:var(--accent);
  color:#fff;
  border-bottom:3px solid var(--down);
}
.site-head .inner{
  max-width:1080px;margin:0 auto;padding:14px 22px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.brand{
  color:#fff;font-weight:700;font-size:19px;letter-spacing:.02em;
  display:flex;flex-direction:column;line-height:1.25;
}
.brand small{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-weight:400;font-size:11px;letter-spacing:.14em;color:#9fb0c6;margin-top:2px;
}
.nav{display:flex;gap:20px;font-size:14px;}
.nav a{color:#d7dde6;}
.nav a:hover{color:#fff;text-decoration:none;}

/* ---------- レイアウト（フルワイド寄り） ---------- */
.wrap{max-width:1080px;margin:0 auto;padding:30px 22px 60px;}

.crumb{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;color:var(--ink-mute);margin-bottom:20px;letter-spacing:.02em;
}
.crumb a{color:var(--ink-soft);}

/* ---------- Hero（ダッシュボード見出し） ---------- */
.hero{
  background:var(--panel);
  border:1px solid var(--rule);
  border-left:5px solid var(--up);
  padding:32px 30px;
  margin-bottom:34px;
}
.hero .eyebrow{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;letter-spacing:.18em;color:var(--down);margin:0 0 10px;text-transform:uppercase;
}
.hero h1{
  font-size:30px;font-weight:700;line-height:1.4;margin:0 0 14px;letter-spacing:.01em;
}
.hero .lead{color:var(--ink-soft);font-size:15.5px;margin:0;max-width:760px;}

/* 指標ティッカー風 row（赤緑の機能色デモ） */
.ticker{
  display:flex;flex-wrap:wrap;gap:0;margin-top:24px;
  border:1px solid var(--rule);background:var(--panel-2);
}
.ticker .cell{
  flex:1 1 0;min-width:150px;padding:14px 16px;
  border-right:1px solid var(--rule);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.ticker .cell:last-child{border-right:0;}
.ticker .cell .k{font-size:11px;color:var(--ink-mute);letter-spacing:.08em;}
.ticker .cell .v{font-size:18px;font-weight:600;color:var(--ink);margin-top:3px;}
.ticker .up .v{color:var(--up);}
.ticker .down .v{color:var(--down);}

/* ---------- セクション見出し ---------- */
.sec-h{
  font-size:15px;font-weight:700;letter-spacing:.04em;
  margin:38px 0 14px;padding:8px 0 8px 14px;
  border-left:4px solid var(--accent);
  background:var(--panel-2);
}

/* ---------- 記事一覧: 横罫の解説リスト ---------- */
.feed{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule-strong);}
.feed li{
  border-bottom:1px solid var(--rule);
  background:var(--panel);
  padding:18px 20px;
  display:flex;gap:18px;align-items:flex-start;
}
.feed .tag{
  flex:0 0 auto;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;letter-spacing:.06em;
  color:var(--accent);border:1px solid var(--rule-strong);
  padding:3px 8px;margin-top:3px;white-space:nowrap;
}
.feed .body{flex:1 1 auto;}
.feed .body a{font-size:17px;font-weight:600;color:var(--ink);line-height:1.5;}
.feed .body a:hover{color:var(--accent);text-decoration:underline;}
.feed .body .desc{font-size:13.5px;color:var(--ink-soft);margin-top:5px;}
.feed .body .meta{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;color:var(--ink-mute);margin-top:7px;letter-spacing:.03em;
}

/* ---------- 記事本文 ---------- */
.post{
  background:var(--panel);
  border:1px solid var(--rule);
  padding:36px 38px;
}
.post h1{
  font-size:27px;font-weight:700;line-height:1.45;margin:0 0 14px;letter-spacing:.01em;
}
.post-meta{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;color:var(--ink-mute);
  padding-bottom:18px;margin-bottom:24px;border-bottom:1px solid var(--rule);letter-spacing:.02em;
}
.post-meta .author{color:var(--accent);font-weight:600;}

.post h2{
  font-size:21px;font-weight:700;margin:40px 0 14px;
  padding-left:13px;border-left:4px solid var(--down);line-height:1.5;
}
.post h3{
  font-size:17px;font-weight:600;margin:28px 0 10px;color:var(--accent);
  padding-bottom:5px;border-bottom:1px dashed var(--rule-strong);
}
.post p{margin:0 0 16px;}
.post ul,.post ol{margin:0 0 18px;padding-left:1.4em;}
.post li{margin-bottom:7px;}
.post strong{font-weight:700;color:var(--ink);}

/* ---------- 表 ---------- */
.tbl{
  width:100%;border-collapse:collapse;margin:8px 0 24px;font-size:14.5px;
  border:1px solid var(--rule-strong);
}
.tbl th,.tbl td{
  border:1px solid var(--rule);padding:10px 13px;text-align:left;vertical-align:top;
}
.tbl th{
  background:var(--accent);color:#fff;font-weight:600;font-size:13px;letter-spacing:.03em;
}
.tbl tr:nth-child(even) td{background:var(--panel-2);}
/* 行頭ラベル型（about等）*/
.tbl td:first-child{}
.tbl .up{color:var(--up);font-weight:600;}
.tbl .down{color:var(--down);font-weight:600;}
.tbl .num{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}

/* ---------- ノート（補足ボックス） ---------- */
.note{
  background:var(--panel-2);
  border:1px solid var(--rule-strong);
  border-top:3px solid var(--accent);
  padding:18px 20px;margin:24px 0;font-size:14.5px;color:var(--ink-soft);
}
.note .label{
  display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;letter-spacing:.12em;color:var(--accent);font-weight:600;
  margin-bottom:8px;text-transform:uppercase;
}

/* ---------- 図解（テキスト擬似チャート） ---------- */
.diagram{
  border:1px solid var(--rule-strong);background:var(--panel-2);
  padding:20px;margin:22px 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px;color:var(--ink-soft);line-height:1.7;overflow-x:auto;
}
.diagram .cap{
  font-size:11px;letter-spacing:.1em;color:var(--ink-mute);
  margin-bottom:12px;text-transform:uppercase;display:block;
}
.diagram .bull{color:var(--up);font-weight:600;}
.diagram .bear{color:var(--down);font-weight:600;}

/* ---------- CTA + ASPプレースホルダ ---------- */
.cta{
  border:1px solid var(--rule-strong);background:var(--panel-2);
  border-left:5px solid var(--down);
  padding:22px 24px;margin:30px 0;
}
.cta .ttl{font-weight:700;font-size:17px;margin:0 0 8px;}
.cta p{margin:0 0 12px;font-size:14.5px;color:var(--ink-soft);}
.asp-placeholder{
  margin-top:8px;padding:18px;text-align:center;
  border:1px dashed var(--rule-strong);background:var(--panel);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;color:var(--ink-mute);letter-spacing:.02em;
}

/* ---------- 著者カード ---------- */
.author-card{
  display:flex;gap:16px;align-items:flex-start;
  border:1px solid var(--rule);background:var(--panel-2);
  padding:18px 20px;margin:30px 0 22px;
}
.author-card .av{
  flex:0 0 auto;width:48px;height:48px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;
}
.author-card .nm{font-weight:700;font-size:15px;margin-bottom:4px;}
.author-card .bio{font-size:13px;color:var(--ink-soft);line-height:1.7;}

/* ---------- 内部リンク ---------- */
.related{
  border:1px solid var(--rule);background:var(--panel-2);
  padding:16px 20px;margin:24px 0;
}
.related .label{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;letter-spacing:.1em;color:var(--ink-mute);display:block;margin-bottom:8px;
}
.related ul{margin:0;padding-left:1.2em;font-size:14.5px;}
.related li{margin-bottom:5px;}

/* ---------- disclaimer ---------- */
.disclaimer{
  font-size:12px;line-height:1.8;color:var(--ink-mute);
  border-top:1px solid var(--rule);padding-top:18px;margin-top:30px;
}

/* ---------- お問い合わせフォーム ---------- */
.form label{display:block;font-weight:600;font-size:14px;margin:18px 0 6px;}
.form input,.form textarea{
  width:100%;padding:11px 12px;border:1px solid var(--rule-strong);
  background:var(--panel-2);font-family:inherit;font-size:15px;color:var(--ink);
}
.form textarea{min-height:150px;resize:vertical;}
.form button{
  margin-top:22px;padding:12px 30px;background:var(--accent);color:#fff;border:0;
  cursor:pointer;font-size:15px;letter-spacing:.04em;font-family:inherit;
}
.form button:hover{background:var(--down);}

/* ---------- フッター ---------- */
.site-foot{
  background:var(--accent);color:#aeb8c6;margin-top:40px;
  border-top:3px solid var(--up);
}
.site-foot .inner{max-width:1080px;margin:0 auto;padding:26px 22px;text-align:center;}
.site-foot nav{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;font-size:13px;}
.site-foot nav a{color:#d7dde6;}
.site-foot p{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;}

/* ---------- レスポンシブ ---------- */
@media (max-width:680px){
  body{font-size:15px;}
  .hero{padding:24px 20px;}
  .hero h1{font-size:23px;}
  .post{padding:24px 20px;}
  .post h1{font-size:22px;}
  .post h2{font-size:19px;}
  .ticker .cell{flex:1 1 50%;min-width:0;border-bottom:1px solid var(--rule);}
  .feed li{flex-direction:column;gap:8px;}
  .nav{gap:14px;}
}