:root { --ar-blue: var(--accent); --ar-blue-soft: var(--accent-soft); --ar-orange: #c2410c; --ar-orange-soft: #fff1e6;
  --ar-teal: #0f766e; --ar-teal-soft: #eaf7f5; --ar-purple: #6d3fc7; --ar-purple-soft: #f3effd; --ar-gray: #7a8594; --ar-gray-soft: var(--surface-2);
  --ar-hero: #eaf2ff; --ar-term: var(--accent); --ar-term-line: #9cbbe3; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ar-orange: #f0a070; --ar-orange-soft: #2e2018; --ar-teal: #5cc8bb; --ar-teal-soft: #142a28;
  --ar-purple: #b39cf5; --ar-purple-soft: #231c38; --ar-hero: #15233a; --ar-term-line: #4f73a3; } }
:root[data-theme="dark"] { --ar-orange: #f0a070; --ar-orange-soft: #2e2018; --ar-teal: #5cc8bb; --ar-teal-soft: #142a28;
  --ar-purple: #b39cf5; --ar-purple-soft: #231c38; --ar-hero: #15233a; --ar-term-line: #4f73a3; }
.tone-blue { --t: var(--ar-blue); --ts: var(--ar-blue-soft); } .tone-orange { --t: var(--ar-orange); --ts: var(--ar-orange-soft); }
.tone-teal { --t: var(--ar-teal); --ts: var(--ar-teal-soft); } .tone-purple { --t: var(--ar-purple); --ts: var(--ar-purple-soft); }
.tone-gray { --t: var(--ar-gray); --ts: var(--ar-gray-soft); }
/* 章ごとに色を変えるための追加の色 */
.tone-green { --t: #15803d; --ts: #e9f7ee; } .tone-red { --t: #b91c1c; --ts: #fdecec; } .tone-cyan { --t: #0e7490; --ts: #e6f6fa; } .tone-pink { --t: #be185d; --ts: #fdebf3; } .tone-indigo { --t: #4338ca; --ts: #ecebfc; } .tone-slate { --t: #475569; --ts: #eef1f5; } .tone-fuchsia { --t: #a21caf; --ts: #faeafc; } .tone-lime { --t: #4d7c0f; --ts: #f0f7e4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .tone-green { --t: #5fd38d; --ts: #13291c; } :root:not([data-theme="light"]) .tone-red { --t: #f58a8a; --ts: #2e1717; } :root:not([data-theme="light"]) .tone-cyan { --t: #5ccbe3; --ts: #10272e; } :root:not([data-theme="light"]) .tone-pink { --t: #f48fbd; --ts: #2e1522; } :root:not([data-theme="light"]) .tone-indigo { --t: #a5a0f5; --ts: #1c1b3a; } :root:not([data-theme="light"]) .tone-slate { --t: #a7b4c6; --ts: #1e242d; } :root:not([data-theme="light"]) .tone-fuchsia { --t: #e48af0; --ts: #2a1530; } :root:not([data-theme="light"]) .tone-lime { --t: #a3d65c; --ts: #1d2610; } }
:root[data-theme="dark"] .tone-green { --t: #5fd38d; --ts: #13291c; } :root[data-theme="dark"] .tone-red { --t: #f58a8a; --ts: #2e1717; } :root[data-theme="dark"] .tone-cyan { --t: #5ccbe3; --ts: #10272e; } :root[data-theme="dark"] .tone-pink { --t: #f48fbd; --ts: #2e1522; } :root[data-theme="dark"] .tone-indigo { --t: #a5a0f5; --ts: #1c1b3a; } :root[data-theme="dark"] .tone-slate { --t: #a7b4c6; --ts: #1e242d; } :root[data-theme="dark"] .tone-fuchsia { --t: #e48af0; --ts: #2a1530; } :root[data-theme="dark"] .tone-lime { --t: #a3d65c; --ts: #1d2610; }
.ar-page { gap: 18px; }
.ar-page .card { border-radius: 16px; }
.ar-page p { margin: 0; }
.ar-crumb a { color: var(--ink-3); }
/* 冒頭 */
.ar-hero { background: var(--ar-hero); border-radius: 20px; padding: clamp(22px, 4vw, 40px); display: flex; flex-direction: column; gap: 14px; }
.ar-hero h1 { margin: 0; font-family: var(--f-display); font-weight: 900; font-size: clamp(26px, 4vw, 38px); line-height: 1.4; max-width: 820px; }
.ar-lead { font-size: 16px; line-height: 1.85; color: var(--ink-2); max-width: 820px; }
.ar-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--ink-2); }
.ar-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ar-chip { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--surface); color: var(--accent); }
.ar-chip.main { background: var(--accent); color: #fff; } .ar-chip.hot { background: var(--ar-orange); color: #fff; }
.ar-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-top: 8px; }
.ar-stat { background: var(--surface); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.ar-stat b { font-size: 32px; font-weight: 900; line-height: 1.15; color: var(--accent); }
.ar-stat span { font-size: 13px; line-height: 1.6; color: var(--ink-2); } .ar-stat small { font-size: 11px; color: var(--ink-3); }
/* 30秒で読む */
.ar-30 { display: flex; flex-direction: column; gap: 14px; }
.ar-30-h { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.ar-30-h h2 { margin: 0; font-size: 18px; font-weight: 900; } .ar-30-h p { font-size: 13px; color: var(--ink-2); }
.ar-30-c { display: flex; align-items: center; gap: 8px; margin-left: auto; } .ar-30-n { font-size: 13px; font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; min-width: 64px; text-align: right; }
.ar-30-c button { width: 44px; height: 44px; border-radius: 22px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ar-30-c button:disabled { opacity: .35; cursor: default; }
.ar-slides { list-style: none; margin: 0; padding: 0 0 4px; display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; }
.ar-slides::-webkit-scrollbar { display: none; }
.ar-sl { flex: 0 0 min(300px, 80vw); height: calc(min(300px, 80vw) * 4 / 3); box-sizing: border-box; scroll-snap-align: start; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }
.ar-sl-k { font-size: 12px; font-weight: 700; color: var(--accent); } .ar-sl-n { font-size: 12px; color: var(--accent); }
.ar-sl-m { display: flex; flex-direction: column; gap: 8px; }
.ar-sl h3 { margin: 0; font-size: 20px; font-weight: 900; line-height: 1.45; white-space: pre-line; }
.ar-sl p { font-size: 13px; line-height: 1.65; color: var(--ink-2); white-space: pre-line; }
.ar-sl.cover { background: var(--accent); border-color: var(--accent); color: #fff; }
.ar-sl.cover h3 { font-size: 22px; } .ar-sl.cover .ar-sl-k, .ar-sl.cover .ar-sl-n, .ar-sl.cover p { color: #e3ecf7; }
.ar-sl.end { background: var(--ar-hero); border-color: var(--ar-hero); }
.ar-sl.chart { gap: 4px; } .ar-sl.chart h3 { font-size: 17px; } .ar-sl.chart p { font-size: 12px; line-height: 1.55; } .ar-sl.chart .ar-sl-m { gap: 6px; }
.ar-sl.list { gap: 4px; } .ar-sl.list h3 { font-size: 16px; line-height: 1.4; } .ar-sl.list p { font-size: 11.5px; line-height: 1.5; } .ar-sl.list .ar-sl-m { gap: 6px; }
.ar-sl-cta { align-self: flex-start; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 20px; background: var(--accent); color: #fff; font-size: 13px; font-weight: 700; }
.ar-sl-cta:hover { text-decoration: none; opacity: .9; }
/* バフェット流チェックへの誘導 */
.ar-step-go { font-size: 13px; font-weight: 700; margin-top: auto; padding-top: 6px; }
.ar-bfcta { border-radius: 14px; background: var(--accent); color: #fff; padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; margin: 4px 0; }
.ar-bfcta .ar-k { font-size: 12px; font-weight: 700; color: #cfe0f5; } .ar-bfcta > b { font-size: 18px; } .ar-bfcta p { margin: 0; font-size: 14px; line-height: 1.75; color: #e3ecf7; } .ar-bfcta p b { color: #fff; font-size: 16px; margin: 0 2px; }
.ar-bfbtn { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin-top: 6px; }
.ar-bfbtn a { color: #fff; font-weight: 700; font-size: 14px; } .ar-bfbtn a.p { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 22px; background: #fff; color: var(--accent); }
.ar-bfbtn a:hover { text-decoration: none; opacity: .9; }
.ar-bftry { border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; background: var(--surface); margin: 4px 0; }
.ar-bftry > b { font-size: 16px; } .ar-bftry p { margin: 0; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.ar-bfin { display: flex; gap: 8px; } .ar-bfin input { flex: 1; min-width: 0; min-height: 44px; border: 1px solid var(--line); border-radius: 10px; padding: 0 12px; font: inherit; font-size: 15px; text-transform: uppercase; background: var(--surface); color: var(--ink); }
.ar-bfin button { min-height: 44px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--accent); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.ar-bfchips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; color: var(--ink-2); }
.ar-bfchips a { font-weight: 700; font-size: 13px; padding: 5px 12px; border-radius: 8px; background: var(--accent-soft); color: var(--accent); } .ar-bfchips a:hover { text-decoration: none; }
.ar-bfside ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ar-bfside li { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--line-2, #e9edf1); font-size: 13px; }
.ar-bfside .no { width: 18px; font-weight: 900; color: var(--accent); text-align: center; } .ar-bfside li a { flex: 1; min-width: 0; color: var(--ink); font-weight: 700; display: flex; flex-direction: column; }
.ar-bfside li a small { font-weight: 400; color: var(--ink-3); font-size: 11px; } .ar-bfside li > b { font-size: 15px; } .ar-bfside li > b small { font-size: 11px; color: var(--ink-3); font-weight: 400; }
.ar-bfside > a { font-size: 13px; font-weight: 700; } .ar-bfside > small { font-size: 11px; color: var(--ink-3); }
.ar-sl-li { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ar-sl-li li { background: var(--surface-2); border-radius: 9px; padding: 5px 10px; display: flex; flex-direction: column; gap: 1px; }
.ar-sl-li small { font-size: 10px; letter-spacing: -.01em; font-weight: 700; color: var(--accent); } .ar-sl-li b { font-size: 13px; font-weight: 900; line-height: 1.4; } .ar-sl-li span { font-size: 10.5px; line-height: 1.45; color: var(--ink-2); }
.ar-sl-li b a, .ar-sl-li b span { white-space: nowrap; color: var(--ink); font-size: inherit; line-height: inherit; } .ar-sl-li b a:hover { color: var(--accent); } .ar-sl-li b .sep { color: var(--ink-3, #9aa6b4); }
.ar-sl.end .ar-sl-li li { background: rgba(255,255,255,.7); }
.ar-sl.chart .ar-sc-b { height: 130px; }
.ar-sc { display: flex; flex-direction: column; gap: 4px; } .ar-sc small { align-self: flex-end; font-size: 10px; color: var(--ink-3); }
.ar-sc-b { display: flex; align-items: flex-end; gap: 6px; height: 92px; border-bottom: 1px solid var(--line); }
.ar-sc-b > div { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; }
.ar-sc-b b { font-size: 10px; font-variant-numeric: tabular-nums; } .ar-sc-b i { width: 100%; border-radius: 3px 3px 0 0; background: var(--accent); }
.ar-sc-b .fc i { opacity: .45; } .ar-sc-x { display: flex; gap: 6px; } .ar-sc-x span { flex: 1; text-align: center; font-size: 10px; color: var(--ink-3); }
.ar-ss { display: flex; flex-direction: column; gap: 5px; } .ar-ss .ar-stock { display: flex; align-items: center; gap: 8px; padding: 6px 9px; border-radius: 8px; background: var(--surface-2); color: var(--ink); font-size: 12px; }
.ar-ss .ar-stock small { flex: 1; } .ar-ss .ar-stock em { font-style: normal; font-weight: 700; color: var(--accent); }
.ar-segs { display: flex; gap: 4px; } .ar-segs i { flex: 1; height: 4px; border-radius: 2px; background: var(--line); } .ar-segs i.on { background: var(--accent); }
/* 本文 */
.ar-grid { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.ar-main { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 18px; font-size: 16px; line-height: 1.9; }
.ar-side { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 14px; position: sticky; top: 12px; }
.ar-sec { padding: clamp(20px, 3.5vw, 36px) clamp(18px, 3.5vw, 40px); display: flex; flex-direction: column; gap: 18px; scroll-margin-top: 16px; }
.ar-sec h2 { margin: 0; font-family: var(--f-display); font-size: clamp(21px, 2.6vw, 25px); font-weight: 900; line-height: 1.5; scroll-margin-top: 16px; }
.ar-sec h3 { margin: 0; font-size: 17px; font-weight: 900; line-height: 1.5; }
.ar-ch { font-size: 13px; font-weight: 700; color: var(--t); margin-bottom: -10px; }
.ar-list { margin: 0; padding-left: 1.4em; display: flex; flex-direction: column; gap: 4px; }
.ar-note { font-size: 12px; line-height: 1.7; color: var(--ink-3); }
.ar-term { display: inline; padding: 0; margin: 0; border: 0; background: none; font: inherit; color: var(--ar-term); cursor: pointer; text-align: inherit;
  text-decoration: underline dotted 2px var(--ar-term-line); text-underline-offset: 4px; }
.ar-term:hover, .ar-term[aria-expanded="true"] { text-decoration-color: var(--ar-term); }
.ar-hint { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
.ar-hint i { display: inline-block; width: 28px; border-bottom: 2px dotted var(--ar-term-line); }
.ar-duo { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.ar-duo-i, .ar-step { background: var(--ts); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 4px; }
.ar-duo-i b { font-size: 21px; font-weight: 900; } .ar-duo-i > span:last-child, .ar-step > span:not(.ar-k) { font-size: 14px; line-height: 1.7; color: var(--ink-2); }
.ar-k { font-size: 12px; font-weight: 700; color: var(--t); }
.ar-band { background: var(--ts); border-radius: 14px; padding: 20px 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 30px; }
.ar-band-i { display: flex; flex-direction: column; } .ar-band-i .ar-k { color: var(--ink-2); font-weight: 400; }
.ar-band-i b { font-size: 40px; font-weight: 900; line-height: 1.1; } .ar-band-i em { font-style: normal; color: var(--t); }
.ar-band p { flex: 1 1 260px; font-size: 14px; line-height: 1.7; color: var(--ink-2); }
.ar-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.ar-cd { border: 1px solid var(--line); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.ar-cd-h { display: flex; align-items: center; gap: 10px; }
.ar-cd-h i { flex: none; width: 30px; height: 30px; border-radius: 15px; background: var(--t); color: #fff; font-style: normal; font-weight: 700; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.ar-cd h3 { font-size: 16px; } .ar-cd > p { font-size: 14px; line-height: 1.7; color: var(--ink-2); }
.ar-cd-stat { margin-top: auto; background: var(--surface-2); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; }
.ar-cd-stat b { font-size: 22px; font-weight: 900; color: var(--t); } .ar-cd-stat span { font-size: 12px; line-height: 1.6; color: var(--ink-2); }
.ar-callout { background: var(--ts); border-radius: 14px; padding: 18px 20px; display: flex; gap: 12px; color: var(--t); }
.ar-callout svg { flex: none; margin-top: 3px; } .ar-callout b { color: var(--ink); font-size: 15px; } .ar-callout p { color: var(--ink-2); font-size: 14px; line-height: 1.8; }
.ar-steps { display: flex; flex-wrap: wrap; gap: 10px; } .ar-step { flex: 1 1 180px; } .ar-step b { font-size: 18px; font-weight: 900; }
.ar-steps.flow { flex-direction: column; gap: 22px; } .ar-steps.flow .ar-step { flex: none; position: relative; display: grid; grid-template-columns: 76px 190px 1fr; align-items: center; gap: 4px 14px; padding: 14px 18px; }
.ar-steps.flow .ar-step:not(:last-child)::after { content: ""; position: absolute; left: 50%; bottom: -17px; border: 7px solid transparent; border-top: 9px solid var(--t); opacity: .55; transform: translateX(-50%); }
@media (max-width: 640px) { .ar-steps.flow .ar-step { grid-template-columns: 1fr; } }
.ar-table { border: 1px solid var(--line); border-radius: 12px; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ar-table table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.65; }
.ar-table th { background: var(--surface-2); text-align: left; padding: 11px 14px; font-weight: 700; white-space: normal; border-bottom: 0; color: var(--ink); font-size: 13px; }
.ar-table td { padding: 11px 14px; border-top: 1px solid var(--line); border-bottom: 0; vertical-align: top; color: var(--ink-2); text-align: left; white-space: normal; }
.ar-table td.head { font-weight: 700; color: var(--ink); white-space: nowrap; } .ar-table td.key { font-weight: 700; }
.ar-mk { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; margin-left: 6px; border-radius: 10px; font-size: 12px; font-weight: 700; vertical-align: 1px; }
.ar-mk.m0 { background: var(--accent-soft); color: var(--accent); } .ar-mk.m1 { background: var(--ar-orange-soft); color: var(--ar-orange); } .ar-mk.m2 { background: var(--surface-2); color: var(--down); }
.ar-mcs { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.ar-mc { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.ar-mc b { color: var(--t); font-size: 15px; } .ar-mc small { font-size: 12px; font-weight: 700; } .ar-mc span { font-size: 13px; line-height: 1.7; color: var(--ink-2); }
.ar-chart { margin: 0; border: 1px solid var(--line); border-radius: 14px; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.ar-chart figcaption { display: flex; flex-direction: column; } .ar-chart figcaption b { font-size: 16px; } .ar-chart figcaption span { font-size: 13px; color: var(--ink-2); }
.ar-bc { display: flex; align-items: flex-end; gap: clamp(6px, 2vw, 18px); height: 240px; border-bottom: 1px solid var(--line); padding: 0 6px; }
.ar-bc-c { flex: 1; height: 100%; display: grid; grid-template-rows: auto 1fr; align-items: end; justify-items: center; position: relative; padding-bottom: 0; }
.ar-bc-c b { font-size: 13px; font-variant-numeric: tabular-nums; align-self: end; }
.ar-bc-c i { width: 70%; max-width: 64px; border-radius: 6px 6px 0 0; background: var(--accent); max-height: 190px; }
.ar-bc-c.fc i { opacity: .45; }
.ar-bc-c span { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: calc(100% + clamp(6px, 2vw, 18px)); margin-top: 6px; font-size: 12px; line-height: 1.35; color: var(--ink-2); text-align: center; white-space: normal; }   /* 長い名前は2行に折り返す（隣と重ならない） */
.ar-bc + .ar-unit { margin-top: 40px; } .ar-unit { font-size: 12px; color: var(--ink-3); text-align: right; }
.ar-hb { display: flex; flex-direction: column; gap: 8px; }
.ar-hb-r { display: flex; align-items: center; gap: 10px; }
.ar-hb-l { flex: 0 0 clamp(120px, 30%, 210px); font-size: 13px; line-height: 1.4; text-align: right; }
.ar-hb-t { flex: 1; position: relative; height: 22px; }
.ar-hb-t i { position: absolute; } .ar-hb-t .z { top: -4px; bottom: -4px; border-left: 1px solid var(--ink-3); }
.ar-hb-t .avg { top: -4px; bottom: -4px; border-left: 2px dotted var(--ink); }
.ar-hb-t .bar { top: 3px; height: 16px; border-radius: 4px; background: #93b8e6; } .ar-hb-t .bar.hi { background: var(--accent); } .ar-hb-t .bar.neg { background: var(--ar-orange); }
.ar-hb-r > b { flex: 0 0 64px; font-size: 13px; color: var(--accent); font-variant-numeric: tabular-nums; } .ar-hb-r > b.neg { color: var(--ar-orange); }
.ar-sgs { display: flex; flex-direction: column; gap: 12px; }
.ar-sg { border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-wrap: wrap; gap: 12px 22px; align-items: center; }
.ar-sg-t { flex: 1 1 260px; display: flex; flex-direction: column; gap: 4px; } .ar-sg-t > p:not(.ar-note) { font-size: 14px; line-height: 1.6; color: var(--ink-2); }
.ar-sg-h { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .ar-sg-h h3 { font-size: 16px; }
.ar-badge { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 999px; } .ar-badge.lv1 { background: var(--accent-soft); color: var(--accent); }
.ar-badge.lv2 { background: var(--ar-teal-soft); color: var(--ar-teal); } .ar-badge.lv3 { background: var(--surface-2); color: var(--ink-2); }
.ar-sg-s { flex: 1 1 300px; display: flex; flex-wrap: wrap; gap: 8px; }
.ar-sg-s .ar-stock { min-width: 128px; padding: 8px 12px; border-radius: 12px; background: var(--surface-2); display: flex; flex-direction: column; color: var(--ink); }
.ar-sg-s .ar-stock b { color: var(--accent); } .ar-sg-s .ar-stock small { font-size: 11px; color: var(--ink-2); } .ar-sg-s .ar-stock .gr em { font-style: normal; font-weight: 700; }
a.ar-stock:hover { text-decoration: none; outline: 2px solid var(--accent-soft); }
.ar-tl { list-style: none; margin: 0 0 0 8px; padding: 0; border-left: 2px solid var(--line); }
.ar-tl li { position: relative; padding: 2px 0 16px 22px; display: flex; flex-direction: column; }
.ar-tl li::before { content: ""; position: absolute; left: -7px; top: 9px; width: 12px; height: 12px; border-radius: 6px; background: var(--t, var(--accent)); }
.ar-tl b { font-size: 15px; } .ar-tl em { font-style: normal; font-size: 20px; font-weight: 700; }
.ar-toc { padding: 26px clamp(18px, 3.5vw, 40px); } .ar-toc h2, .ar-gl h2, .ar-src h2 { margin: 0 0 10px; font-size: 20px; font-weight: 900; }
.ar-toc ol { list-style: none; margin: 0; padding: 0; } .ar-toc li { border-top: 1px solid var(--line); padding: 10px 0; display: flex; flex-direction: column; gap: 4px; }
.ar-toc a { display: flex; align-items: center; gap: 12px; color: var(--ink); min-height: 32px; } .ar-toc a:hover { text-decoration: none; color: var(--accent); }
.ar-toc a i { flex: none; min-width: 30px; height: 30px; border-radius: 15px; background: var(--t); color: #fff; font-style: normal; font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.ar-toc a i.tone-gray { background: var(--surface-2); color: var(--ink-2); } .ar-toc a b { font-size: 15px; line-height: 1.5; }
.ar-toc li > div { display: flex; flex-wrap: wrap; gap: 4px 14px; padding-left: 42px; font-size: 13px; color: var(--ink-2); }
.ar-sum { background: var(--ar-hero); border: 0; padding: 28px clamp(18px, 3.5vw, 40px); } .ar-sum h2 { margin: 0 0 8px; font-size: 22px; font-weight: 900; }
.ar-sum ul { margin: 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: 6px; font-size: 15px; line-height: 1.85; }
.ar-gl-more { margin: 10px 0 0; font-size: 13px; font-weight: 700; }
.ar-gl dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.ar-gl dl > div { background: var(--surface-2); border-radius: 12px; padding: 12px 14px; scroll-margin-top: 16px; } .ar-gl dl > div:target { outline: 2px solid var(--accent); }
.ar-gl dt { font-size: 14px; font-weight: 900; } .ar-gl dd { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: var(--ink-2); }
.ar-src ul { margin: 0 0 10px; padding-left: 1.2em; font-size: 14px; line-height: 1.8; columns: 2 280px; column-gap: 28px; } .ar-src li { break-inside: avoid; }
.ar-side .card { padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.ar-sh, .ar-stoc > b { font-size: 14px; }
.ar-stoc a { display: flex; gap: 10px; padding: 6px 0; font-size: 14px; line-height: 1.5; color: var(--ink-2); } .ar-stoc a:hover { color: var(--accent); text-decoration: none; }
.ar-stoc a i { flex: none; width: 4px; border-radius: 2px; background: var(--t); }
.ar-chipl { display: flex; flex-wrap: wrap; gap: 6px; } .ar-chipl .ar-stock { font-size: 12px; font-weight: 700; padding: 6px 9px; border-radius: 8px; background: var(--accent-soft); color: var(--accent); }
.ar-rel { display: flex; flex-direction: column; gap: 2px; color: var(--ink); padding: 6px 0; } .ar-rel i { font-style: normal; font-size: 12px; color: var(--ink-3); } .ar-rel span { font-weight: 700; line-height: 1.5; }
.ar-share { display: flex; flex-wrap: wrap; gap: 8px; }
.ar-share a, .ar-share button { min-height: 40px; padding: 0 16px; border-radius: 20px; font: inherit; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; cursor: pointer; }
.ar-share a { background: var(--ink); color: var(--surface); } .ar-share a:hover { text-decoration: none; opacity: .9; }
.ar-share button { border: 1px solid var(--line); background: var(--surface); color: var(--ink); }
/* 用語の吹き出し */
.ar-pop { position: absolute; z-index: 70; width: min(320px, calc(100vw - 24px)); background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 12px 32px rgba(17,24,39,.18); padding: 14px 14px 12px 18px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.75; }
.ar-pop::before { content: ""; position: absolute; top: -7px; left: var(--ax, 30px); width: 12px; height: 12px; background: var(--surface); border-left: 1px solid var(--line); border-top: 1px solid var(--line); transform: rotate(45deg); }
.ar-pop.sheet { position: fixed; left: 0; right: 0; bottom: 0; top: auto; width: auto; border-radius: 18px 18px 0 0; padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)); }
.ar-pop.sheet::before { display: none; }
.ar-pop-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.ar-pop-h b { font-size: 17px; font-weight: 900; display: block; } .ar-pop-h small { font-size: 12px; color: var(--ink-2); display: block; }
.ar-pop-x { flex: none; width: 36px; height: 36px; border: 0; border-radius: 18px; background: var(--surface-2); color: var(--ink-2); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ar-pop-ex { background: var(--accent-soft); border-radius: 10px; padding: 9px 12px; font-size: 13px; line-height: 1.6; } .ar-pop-ex span { display: block; font-size: 11px; font-weight: 700; color: var(--accent); }
.ar-pop p { margin: 0; } .ar-pop a { font-size: 13px; font-weight: 700; }
/* 一覧ページ */
.ar-lis { display: flex; flex-direction: column; gap: 14px; }
.ar-li { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; padding: 22px 24px; }
.ar-li-t { flex: 999 1 420px; display: flex; flex-direction: column; gap: 8px; } .ar-li h2 { margin: 0; font-size: 20px; font-weight: 900; line-height: 1.5; }
.ar-li h2 a { color: var(--ink); } .ar-li-t > p:not(.ar-meta) { font-size: 14px; line-height: 1.8; color: var(--ink-2); }
.ar-li-t .ar-chip { background: var(--accent-soft); }
.ar-li-s { flex: 1 1 180px; background: var(--ar-hero); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; }
.ar-li-s b { font-size: 26px; font-weight: 900; color: var(--accent); } .ar-li-s span { font-size: 12px; color: var(--ink-2); line-height: 1.6; }
.ar-li-go { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 22px; background: var(--accent); color: #fff; font-weight: 700; }
.ar-li-go:hover { text-decoration: none; opacity: .92; }
/* 指標の解説カード・さくいん・早見表・式の図 */
.ar-mt { border: 1px solid var(--line); border-left: 4px solid var(--t); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 16px; }
.ar-mt:target { animation: ar-hl 2.2s ease-out; } @keyframes ar-hl { 0%, 40% { box-shadow: 0 0 0 4px var(--ts); background: var(--ts); } 100% { box-shadow: none; background: transparent; } }
.ar-mt-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ar-mt-h h3 { font-size: 19px; } .ar-mt-h small { display: block; font-size: 12px; color: var(--ink-3); line-height: 1.5; }
.ar-mt-g { flex: none; font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: var(--ts); color: var(--t); }
.ar-mt-f { background: var(--ts); border-radius: 10px; padding: 10px 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.ar-mt-f span { font-size: 11px; font-weight: 700; color: var(--t); } .ar-mt-f b { font-size: 16px; line-height: 1.6; }
.ar-mt-d { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.ar-mt-d > div { display: grid; grid-template-columns: 6.5em 1fr; gap: 10px; } .ar-mt-d dt { font-size: 12px; font-weight: 700; color: var(--ink-2); padding-top: 3px; }
.ar-mt-d dd { margin: 0; font-size: 14px; line-height: 1.75; }
.ar-mt-ex { background: var(--surface-2); border-radius: 10px; padding: 9px 12px; font-size: 13px; line-height: 1.7; } .ar-mt-ex span, .ar-mt-live span, .ar-mt-where span { display: block; font-size: 11px; font-weight: 700; color: var(--ink-3); }
.ar-mt-live { font-size: 13px; line-height: 1.7; border-top: 1px dashed var(--line); padding-top: 8px; } .ar-mt-live b { color: var(--t); font-size: 15px; } .ar-mt-live small { display: block; font-size: 11px; color: var(--ink-3); }
.ar-mt-where { font-size: 13px; line-height: 1.7; color: var(--ink-2); }
@media (max-width: 600px) { .ar-mt-d > div { grid-template-columns: 1fr; gap: 0; } }
.ar-cm { display: flex; flex-direction: column; gap: 6px; } .ar-cm-t { font-size: 13px; font-weight: 700; color: var(--t); }
.ar-cm td a { font-weight: 700; }
.ar-mi { padding: 24px clamp(18px, 3.5vw, 40px); display: flex; flex-direction: column; gap: 14px; scroll-margin-top: 12px; }
.ar-mi h2 { margin: 0; font-size: 22px; font-weight: 900; } .ar-mi-top p { font-size: 14px; color: var(--ink-2); line-height: 1.7; margin-top: 4px; }
.ar-mi-s { display: flex; align-items: center; gap: 8px; border: 2px solid var(--accent); border-radius: 12px; padding: 0 12px; background: var(--surface); color: var(--accent); }
.ar-mi-s input { flex: 1; min-width: 0; min-height: 46px; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; color: var(--ink); }
.ar-mi-gs { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.ar-mi-g { border-radius: 12px; background: var(--ts); padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.ar-mi-gh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; } .ar-mi-gh b { font-size: 15px; color: var(--t); } .ar-mi-gh span { font-size: 12px; color: var(--ink-2); flex: 1 1 100%; }
.ar-mi-ch { font-size: 12px; font-weight: 700; color: var(--t); }
.ar-mi-c { display: flex; flex-wrap: wrap; gap: 6px; }
.ar-mi-c a { display: inline-flex; align-items: baseline; gap: 4px; min-height: 32px; align-items: center; padding: 3px 10px; border-radius: 8px; background: var(--surface); color: var(--ink); font-size: 13px; font-weight: 700; line-height: 1.35; }
.ar-mi-c a small { font-size: 10.5px; font-weight: 400; color: var(--ink-3); } .ar-mi-c a:hover { text-decoration: none; outline: 2px solid var(--t); }
.ar-mi-c a.hit { background: var(--t); color: #fff; } .ar-mi-c a.hit small { color: #fff; opacity: .85; }
.ar-mi-none { font-size: 14px; color: var(--ink-2); }
.ar-mi-fab { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px)); z-index: 60; display: inline-flex; align-items: center; gap: 6px;
  min-height: 46px; padding: 0 16px; border: 0; border-radius: 23px; background: var(--accent); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
  box-shadow: 0 6px 18px rgba(17,24,39,.22); transition: opacity .2s, transform .2s; }
@media (max-width: 720px) { .ar-mi-fab { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); } } .ar-mi-fab[hidden] { display: inline-flex; opacity: 0; transform: translateY(12px); pointer-events: none; }
.ar-qr { display: flex; flex-direction: column; gap: 10px; }
.ar-qr-tool { display: flex; flex-direction: column; gap: 8px; } .ar-qr-b { display: flex; flex-wrap: wrap; gap: 6px; }
.ar-qr-b button { min-height: 34px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.ar-qr-b button.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.ar-qr-hd, .ar-qr-r { display: grid; grid-template-columns: minmax(150px, 1.2fr) 88px minmax(170px, 1.4fr) 2fr; gap: 12px; align-items: start; }
.ar-qr-hd { font-size: 12px; font-weight: 700; color: var(--ink-2); background: var(--surface-2); border-radius: 10px; padding: 9px 12px; }
.ar-qr-l { display: flex; flex-direction: column; }
.ar-qr-r { padding: 10px 12px; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.6; }
.ar-qr-r a { display: flex; flex-direction: column; color: var(--ink); } .ar-qr-r a b { color: var(--t); font-size: 14px; } .ar-qr-r a small { font-size: 11px; color: var(--ink-3); }
.ar-qr-g { font-size: 11px; font-weight: 700; color: var(--t); background: var(--ts); border-radius: 999px; padding: 2px 8px; justify-self: start; }
.ar-qr-f { font-weight: 700; } .ar-qr-w { color: var(--ink-2); }
@media (max-width: 760px) { .ar-qr-hd { display: none; } .ar-qr-r { grid-template-columns: 1fr auto; gap: 4px 10px; } .ar-qr-r a { grid-column: 1; } .ar-qr-g { grid-column: 2; grid-row: 1; }
  .ar-qr-f, .ar-qr-w { grid-column: 1 / -1; } }
.ar-eq { margin: 0; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.ar-eq figcaption { display: flex; flex-direction: column; } .ar-eq figcaption b { font-size: 15px; } .ar-eq figcaption span { font-size: 13px; color: var(--ink-2); }
.ar-eq-r { display: flex; flex-direction: column; gap: 6px; } .ar-eq-l { font-size: 13px; font-weight: 700; color: var(--t); }
.ar-eq-x { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ar-eq-i { background: var(--surface-2); border-radius: 12px; padding: 8px 14px; display: flex; flex-direction: column; min-width: 92px; }
.ar-eq-i span { font-size: 12px; color: var(--ink-2); line-height: 1.4; } .ar-eq-i b { font-size: 21px; font-weight: 900; line-height: 1.3; font-variant-numeric: tabular-nums; } .ar-eq-i small { font-size: 11px; color: var(--ink-3); }
.ar-eq-i.res { background: var(--t); } .ar-eq-i.res span, .ar-eq-i.res small { color: #fff; opacity: .9; } .ar-eq-i.res b { color: #fff; }
.ar-eq-i.neg b { color: var(--ar-orange); } .ar-eq-i.res.neg { background: var(--ar-orange); } .ar-eq-i.res.neg b { color: #fff; }
.ar-eq-op { font-style: normal; font-size: 22px; font-weight: 900; color: var(--t); }
@media (max-width: 600px) { .ar-eq-i { min-width: 0; padding: 7px 10px; } .ar-eq-i b { font-size: 18px; } }
@media (max-width: 900px) { .ar-side { position: static; } .ar-stoc { display: none; } }
@media (max-width: 600px) { .ar-hb-l { flex-basis: 40%; font-size: 12px; } .ar-band-i b { font-size: 32px; } .ar-table td.head { white-space: normal; min-width: 5.5em; } }