/* /realestate/ 共通スタイル。
   色は必ず --kb-* トークンから読む。面と文字を別々に決めると、
   片方のテーマで白地に白文字になる（実測あり）。 */
.re-hero{background:var(--kb-surface);border:1px solid var(--kb-border);border-radius:var(--kb-radius-lg);padding:18px;margin:0 0 14px}
.re-hero h1{font-size:var(--kb-fs-h1);font-weight:800;color:var(--kb-text);margin:0 0 6px;line-height:1.3}
.re-hero p{font-size:.82rem;color:var(--kb-text-2);margin:0;line-height:1.8;max-width:78ch}
.re-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:8px;margin-top:14px}
.re-kpi{background:var(--kb-surface-2);border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);padding:9px 11px}
.re-kpi span{display:block;font-size:.66rem;color:var(--kb-text-3);margin-bottom:3px}
.re-kpi strong{display:block;font-size:1.05rem;font-weight:800;color:var(--kb-text);font-variant-numeric:tabular-nums;font-family:var(--kb-font-mono)}
.re-kpi em{display:block;font-style:normal;font-size:.63rem;color:var(--kb-text-muted);margin-top:2px}

.re-card{background:var(--kb-surface);border:1px solid var(--kb-border);border-radius:var(--kb-radius-lg);padding:14px 16px;margin:0 0 14px}
.re-card h2{font-size:var(--kb-fs-h2);font-weight:800;color:var(--kb-text);margin:0 0 4px}
.re-card h3{font-size:.86rem;font-weight:700;color:var(--kb-text);margin:14px 0 6px}
.re-card p.re-sub{font-size:.76rem;color:var(--kb-text-3);margin:0 0 10px;line-height:1.75}

.re-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.re-tile{display:block;background:var(--kb-surface-2);border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);padding:12px 13px;text-decoration:none}
.re-tile:hover{border-color:var(--kb-accent);background:var(--kb-surface-3)}
.re-tile b{display:block;font-size:.86rem;font-weight:700;color:var(--kb-text);margin-bottom:4px}
.re-tile span{display:block;font-size:.72rem;color:var(--kb-text-3);line-height:1.7}

.re-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 10px}
.re-tools label{font-size:.72rem;color:var(--kb-text-3);font-weight:600}
.re-tools select,.re-tools input{padding:5px 9px;border:1px solid var(--kb-border);border-radius:var(--kb-radius-md);background:var(--kb-surface-2);color:var(--kb-text);font-size:.78rem}
.re-btn{padding:5px 11px;border:1px solid var(--kb-border);border-radius:999px;background:var(--kb-surface-2);color:var(--kb-text-2);font-size:.74rem;font-weight:650;cursor:pointer}
.re-btn:hover{background:var(--kb-surface-3);color:var(--kb-text)}
.re-btn.is-on{background:var(--kb-accent);border-color:var(--kb-accent);color:#fff}

.re-scroll{overflow-x:auto}
.re-table{width:100%;border-collapse:collapse;font-size:.77rem}
.re-table th,.re-table td{padding:6px 9px;border-bottom:1px solid var(--kb-border);white-space:nowrap}
.re-table thead th{position:sticky;top:0;z-index:1;background:var(--kb-surface-2);color:var(--kb-text-3);font-weight:700;text-align:right}
.re-table thead th:first-child,.re-table td:first-child{text-align:left}
.re-table th.re-l,.re-table td.re-l{text-align:left}
.re-table td{text-align:right;color:var(--kb-text);font-variant-numeric:tabular-nums}
.re-table tbody tr:hover{background:var(--kb-surface-2)}
.re-table a{color:var(--kb-accent);text-decoration:none;font-weight:650}
.re-table a:hover{text-decoration:underline}
.re-up{color:var(--kb-positive)}
.re-dn{color:var(--kb-negative)}
.re-na{color:var(--kb-text-muted)}

.re-note{font-size:.74rem;color:var(--kb-text-3);line-height:1.85;margin:10px 0 0}
.re-note code{font-family:var(--kb-font-mono);font-size:.92em;color:var(--kb-text-2)}
.re-warn{border-left:3px solid var(--kb-warning);background:var(--kb-surface-2);padding:10px 12px;border-radius:var(--kb-radius-sm);font-size:.75rem;color:var(--kb-text-2);line-height:1.8;margin:10px 0 0}
.re-chip{display:inline-block;padding:1px 7px;border-radius:999px;border:1px solid var(--kb-border);background:var(--kb-surface-2);color:var(--kb-text-3);font-size:.66rem;font-weight:650;margin:0 4px 3px 0}
.re-chart{margin:8px 0 2px}
.re-legend{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 0;font-size:.72rem;color:var(--kb-text-3)}
.re-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}

.re-pick{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 10px;max-height:132px;overflow-y:auto}
.re-pick button{padding:3px 9px;border:1px solid var(--kb-border);border-radius:999px;background:var(--kb-surface-2);color:var(--kb-text-3);font-size:.72rem;font-weight:600;cursor:pointer}
.re-pick button.is-on{background:var(--kb-accent);border-color:var(--kb-accent);color:#fff}

@media(max-width:760px){
  .re-hero{padding:14px}
  .re-hero h1{font-size:var(--kb-fs-h1-sm)}
  .re-table th,.re-table td{padding:5px 7px;font-size:.73rem}
}