/* カブラボ マーケットデータ 共通スタイル（/market/ と /market-pro/ で共用）
   配色・書体はメンバーページ（members/index.html）に合わせる */
:root{--bg:#0A0A0B;--surface:#111113;--surface2:#1a1a1e;--border:#28282e;--red:#E5635E;--red-border:rgba(229,99,94,.3);
  --text:#F5F5F4;--muted:#aaaaaa;--sub:#8a8a8a;--accent2:#E8A598;--good:#4CC38A;--warn:#F2B84B;--bad:#E5635E;--line:#E5635E;--line2:#7FA7D9}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:'Noto Sans JP',sans-serif;min-height:100vh;-webkit-font-smoothing:antialiased;font-feature-settings:"palt";line-height:1.7}
a{color:inherit;text-decoration:none}
.mono{font-family:'JetBrains Mono',monospace}
header{border-bottom:1px solid var(--border);padding:0 20px;height:64px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50;background:var(--bg)}
.logo{display:flex;align-items:center;gap:10px}
.logo img{width:34px;height:34px;border-radius:7px}
.logo b{font-size:13px}
.logo small{display:block;font-size:10px;color:var(--muted);letter-spacing:.1em;font-weight:300}
.badge{font-size:11px;letter-spacing:.08em;color:var(--red);border:1px solid var(--red-border);padding:3px 10px;border-radius:2px;white-space:nowrap}
main{max-width:880px;margin:0 auto;padding:28px 16px 56px}
.label{font-size:11px;letter-spacing:.15em;color:var(--muted);margin-bottom:10px}
.label span{color:var(--red);margin-right:6px}
h1{font-size:24px;font-weight:700;line-height:1.4;margin-bottom:8px}
.lead{color:var(--accent2);font-size:14px;font-weight:300}
.asof{color:var(--sub);font-size:12px;margin-top:6px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:18px 18px 16px;margin-top:16px}
.card h2{font-size:16px;font-weight:700;display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.card h2 small{font-size:11px;color:var(--sub);font-weight:400}
.card p.note{font-size:12px;color:var(--sub);margin-top:8px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}
.kpi{background:var(--surface2);border-radius:8px;padding:10px 12px}
.kpi .k{font-size:11px;color:var(--muted)}
.kpi .v{font-family:'JetBrains Mono',monospace;font-size:20px;font-weight:700;margin-top:2px}
.kpi .v .sub{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:4px}
.kpi .v small{font-size:12px;font-weight:400;color:var(--muted);margin-left:2px}
.pill{display:inline-block;font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px;border:1px solid var(--border);white-space:nowrap}
.pill.good{color:var(--good);border-color:rgba(76,195,138,.45)}
.pill.warn{color:var(--warn);border-color:rgba(242,184,75,.45)}
.pill.bad{color:var(--bad);border-color:var(--red-border)}
.pill.neutral{color:var(--muted)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px;margin-top:16px}
@media (max-width:400px){.tiles{grid-template-columns:1fr}}
.tile .f{margin-top:10px;border-top:1px solid var(--border)}
.tile .f div{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:5px 0;border-bottom:1px solid var(--border)}
.tile .f span{color:var(--muted)}
.tile .f b{font-family:'JetBrains Mono',monospace;font-weight:500;text-align:right}
.tile{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.tile .n{font-size:12px;color:var(--muted)}
.tile .s{font-size:15px;font-weight:700;margin-top:4px}
.tile .s .pill{white-space:normal}
.tile .d{font-size:12px;color:var(--sub);margin-top:4px}
.thermo{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.thermo .score{font-family:'JetBrains Mono',monospace;font-size:52px;font-weight:700;line-height:1}
.thermo .band{font-size:20px;font-weight:700}
.bar{height:10px;border-radius:5px;background:linear-gradient(90deg,#7FA7D9,#4CC38A 40%,#F2B84B 70%,#E5635E);position:relative;margin-top:14px}
.bar i{position:absolute;top:-4px;width:4px;height:18px;background:#fff;border-radius:2px;transform:translateX(-2px)}
.bar-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--sub);margin-top:4px}
.chart{margin-top:12px;width:100%}
.chart svg{width:100%;height:auto;display:block}
table{width:100%;border-collapse:collapse;margin-top:10px;font-size:13px}
th,td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:right}
th:first-child,td:first-child{text-align:left}
th{color:var(--muted);font-weight:500;font-size:12px}
td.mono{font-family:'JetBrains Mono',monospace}
.pos{color:var(--good)}.neg{color:var(--bad)}
details{margin-top:10px}
summary{cursor:pointer;font-size:13px;color:var(--accent2)}
.cta{display:block;text-align:center;background:var(--red);color:#0A0A0B;font-weight:700;padding:14px;border-radius:8px;margin-top:20px}
.cta.ghost{background:transparent;color:var(--red);border:1px solid var(--red-border)}
.empty{color:var(--sub);font-size:13px;margin-top:8px}
.alert{background:#1b1710;border:1px solid rgba(242,184,75,.45);color:var(--warn);border-radius:8px;padding:12px 14px;font-size:13px;margin-top:16px}
.toc{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.toc a{font-size:12px;border:1px solid var(--border);border-radius:999px;padding:3px 10px;color:var(--muted)}
footer{border-top:1px solid var(--border);padding:22px 16px;text-align:center;font-size:11px;color:var(--sub);line-height:1.9}
/* 2つの表を横に並べる（PCは左右、640px以下は縦） */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:640px){.pair{grid-template-columns:1fr;gap:0}}
@media (max-width:480px){h1{font-size:20px}.thermo .score{font-size:44px}.kpi .v{font-size:18px}}

/* 公開版：指標をグループに分け、グループごとにコーポレートカラー（オレンジ系）の細い枠で区切る */
.grp{margin-top:26px}
.grp-h{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--g)}
.grp-h::before{content:"";width:10px;height:10px;border-radius:2px;background:var(--g)}
.grp-h small{font-weight:400;color:var(--sub);letter-spacing:0}
.grp .tiles{margin-top:10px}
.grp .tile{border:1px solid var(--gb);background:var(--surface)}
.grp .tile .n{color:var(--g);font-weight:700;font-size:13px}
.grp .tile .f{border-top-color:var(--gl)}
.grp .tile .f div{border-bottom-color:var(--gl)}
.card.accent{border-color:rgba(229,99,94,.6)}
.grp .card{border-color:var(--gb)}
.grp .card h2{color:var(--g)}
.grp .card h2 small{color:var(--sub)}
.grp>.card:first-of-type{margin-top:10px}
/* データの日付（右上）：白に近い薄い黄色で大きめに */
.asof-d{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:500;color:#F6E7A8;letter-spacing:.02em;white-space:nowrap}
.card h2{align-items:center}
.tile .n{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tile .n .asof-d{font-size:13px;font-weight:500}
/* 年・月タブ（騰落レシオ月別一覧） */
.tabs{margin-top:12px}
.tabs-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.tab{font-family:'JetBrains Mono',monospace;font-size:12px;padding:3px 10px;border:1px solid rgba(229,99,94,.45);border-radius:6px;color:var(--text)}
.tab:hover{background:rgba(229,99,94,.12)}
.tab.on{background:#E5635E;border-color:#E5635E;color:#fff;font-weight:700}
.tab.off{border-color:var(--border);color:#55555b;cursor:default}
.arc-tabs{margin:4px 0 12px}
.arc-tabs .tabs{margin-top:0}
/* 固定ヘッダー（64px）の下に隠れないよう、ページ内リンクで移ったときに余白を取る */
.card{scroll-margin-top:80px}
/* 会員版の見出し行：右端に Markdown ダウンロード */
.pro-head{display:flex;align-items:center;gap:12px}
.pro-head .md-btn{margin-left:auto}
.md-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid rgba(229,99,94,.5);border-radius:8px;background:transparent;color:var(--text);font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;cursor:pointer}
.md-btn:hover{background:rgba(229,99,94,.15)}
.md-btn:disabled{opacity:.5;cursor:wait}
.md-msg{min-height:1em;margin-top:4px;font-size:12px;color:var(--good);text-align:right}

/* 会員版：カードを16:9の画像でコピーするボタン（2026-10-22） */
.card h2 .ttl{display:inline-flex;align-items:center;gap:8px}
.card-clip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid rgba(229,99,94,.45);border-radius:7px;background:transparent;color:var(--sub);cursor:pointer;padding:0}
.card-clip:hover{background:rgba(229,99,94,.15);color:var(--text)}
.card-clip:disabled{opacity:.5;cursor:wait}
.clip-say{font-size:11px;font-weight:400;color:#F6E7A8}
.card-clip.lbl{width:auto;padding:0 8px 0 6px;gap:4px;font-size:11px;font-weight:700}
