/* screens.css 各画面の固有スタイル（共通部品は base.css。色は必ずCSS変数を使う） */
.screen-title{font-size:1.125rem;font-weight:700;margin:.25rem 0 var(--gap)}
.hint{font-size:.8125rem;color:var(--text-dim);margin-top:.25rem}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.stat{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:.5rem .75rem}
.stat-label{font-size:.8125rem;color:var(--text-dim)}
.stat-value{font-size:1rem;font-weight:700;font-variant-numeric:tabular-nums;word-break:break-word}
.kv{display:flex;justify-content:space-between;gap:var(--gap);padding:.375rem 0;border-bottom:1px solid var(--border);font-size:.875rem}
.kv:last-child{border-bottom:0}
.kv .k{color:var(--text-dim);flex:none}
.kv .v{text-align:right;font-variant-numeric:tabular-nums;word-break:break-word}

/* データ画面: 年チップ */
.year-chips{display:flex;flex-wrap:wrap;gap:.375rem;margin:.5rem 0}
.year-chip{min-height:44px;min-width:3.5rem;padding:0 .5rem;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:var(--text-dim);font-size:.875rem;font-variant-numeric:tabular-nums;transition:transform .1s}
.year-chip.pressed{transform:scale(.94)}
.year-chip.st-latest{color:var(--buy);border-color:var(--buy)}
.year-chip.st-update{color:var(--warn);border-color:var(--warn)}
.year-chip.st-local{color:var(--accent);border-color:var(--accent)}
.year-chip.sel{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:.5rem;font-size:.8125rem;color:var(--text-dim)}
.op{margin-top:.5rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.btn-row .btn{flex:1 1 auto}

/* 表（整合性レポートなど） */
.tbl{font-size:.8125rem;font-variant-numeric:tabular-nums}
.tbl th,.tbl td{padding:.25rem .375rem;border-bottom:1px solid var(--border);text-align:right}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl th{color:var(--text-dim);font-weight:400}

/* 設定画面 */
.form-grid{display:grid;grid-template-columns:1fr;gap:0}
.check{display:flex;align-items:center;gap:.75rem;min-height:44px;margin-bottom:.5rem}
.check input{width:1.5rem;height:1.5rem;accent-color:var(--accent)}
.log-box{max-height:12rem;overflow:auto;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:.5rem;font-size:.75rem;white-space:pre-wrap;word-break:break-all;color:var(--text-dim)}

/* チャート画面 */
.chart-box{width:100%;height:58vh;min-height:320px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-elev)}
.ctl-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.5rem}
.ctl-grid .field{margin-bottom:0}
.chip-btn{display:inline-flex;align-items:center;gap:.25rem;min-height:36px;padding:0 .625rem;border-radius:999px;border:1px solid currentColor;background:none;font-size:.8125rem}
.chip-btn.pressed{opacity:.6}
.chip-list{display:flex;flex-wrap:wrap;gap:.375rem;margin-top:.5rem}
.chart-box{height:52vh}

/* ルール画面 */
.code-input{width:100%;min-height:10rem;padding:.5rem .75rem;background:var(--bg);border:1px solid var(--border);border-radius:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1rem;line-height:1.4;resize:vertical}
.err-item{padding:.5rem .75rem;margin-bottom:.5rem;border:1px solid var(--sell);border-radius:10px;font-size:.875rem;word-break:break-word}
.err-item .path{font-size:.75rem;color:var(--text-dim);font-family:ui-monospace,Menlo,monospace}
.warn-item{padding:.5rem .75rem;margin-bottom:.5rem;border:1px solid var(--warn);border-radius:10px;font-size:.875rem;word-break:break-word}
.list-item{padding:.5rem 0;border-bottom:1px solid var(--border)}
.list-item:last-child{border-bottom:0}
.list-item .name{font-weight:700;word-break:break-word}
.btn-sm{min-height:36px;padding:.25rem .75rem;font-size:.875rem}
.lines li{margin:.25rem 0;font-size:.875rem}
.lines{padding-left:1.125rem;margin:.25rem 0}

/* 結果画面 */
.tbl,.heat{display:block;max-width:100%;overflow-x:auto}
.stat-grid>*,.ctl-grid>*,.form-grid>*{min-width:0}
.heat td{min-width:1rem;padding:.125rem;text-align:center;font-size:.625rem}
.heat th{padding:.125rem;font-size:.625rem}
.hint.buy{color:var(--buy)} .hint.sell{color:var(--sell)} .hint.warn{color:var(--warn)}
svg text{font-family:var(--font)}
