.estate-explorer-page { background: #f5f7fb; }
.explorer-hero { padding-bottom: 42px; }
.explorer-topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 34px; }
.explorer-home-link { color: #dce9ff; font-weight: 700; text-decoration: none; font-size: .92rem; }
.explorer-home-link:hover { color: white; text-decoration: underline; }
.explorer-subheadline { max-width: 700px; }
.explorer-query-card { margin-top: 30px; padding: 28px; }
.explorer-sentence { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: #17325d; font-size: 1.12rem; line-height: 1.65; }
.explorer-sentence select, .range-input { min-height: 42px; border: 1px solid #b7c6dc; border-radius: 8px; background: white; color: #17325d; font: inherit; font-weight: 700; }
.explorer-sentence select { padding: 6px 30px 6px 10px; max-width: 190px; }
.range-input { display: inline-flex; align-items: center; padding-left: 10px; min-width: 126px; }
.range-input span { color: #496584; font-weight: 700; }
.range-input input { width: 96px; border: 0; outline: 0; padding: 7px 8px 7px 3px; color: #17325d; font: inherit; font-weight: 700; background: transparent; }
.explorer-query-footer { display: flex; gap: 18px; align-items: center; justify-content: space-between; margin-top: 22px; }
.explorer-query-footer .helper { margin: 0; max-width: 650px; }
.explorer-query-footer button { white-space: nowrap; }
.explorer-main { padding: 40px 0 72px; }
.explorer-empty { margin-top: 0; }
.explorer-loading { margin: 24px 0; }
.explorer-description, .explorer-meta { color: #60718a; margin: 8px 0 0; line-height: 1.55; }
.explorer-range-pills { display: flex; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.explorer-range-pills span { background: #edf3fc; color: #31567f; border-radius: 999px; padding: 6px 9px; font-size: .78rem; font-weight: 700; }
.explorer-legend { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; margin: 16px 0 3px; color: #5d6f88; font-size: .86rem; }
.legend-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-left: 7px; }
.legend-dot:first-child { margin-left: 0; }.legend-dot.below { background:#4c91d4; }.legend-dot.within { background:#0a9f70; }.legend-dot.above { background:#da8a39; }
.explorer-scatter-wrap { height: 410px; }
.estate-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.estate-button { text-align: left; border: 1px solid #cfdae9; background: white; color: #14335d; border-radius: 9px; padding: 11px 13px; cursor: pointer; min-width: 180px; flex: 1 1 210px; }
.estate-button:hover, .estate-button:focus-visible, .estate-button.is-selected { border-color: #0a7a9d; box-shadow: 0 0 0 3px rgba(10,122,157,.13); outline: 0; }
.estate-button strong, .estate-button span { display:block; }.estate-button span { color:#62748c; font-size:.83rem; margin-top:3px; }
.explorer-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.explorer-ratio-wrap { height: 330px; }
.explorer-ratio-legend { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; margin: 13px 0 1px; color: #5d6f88; font-size: .82rem; font-weight: 700; }
.ratio-legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }.ratio-legend-dot.below { background: #0a9f70; }.ratio-legend-dot.above { background: #d97706; }
.ratio-legend-line { width: 20px; border-top: 2px dashed #64748b; display: inline-block; }
.estate-detail-loading { display: grid; gap: 10px; padding: 15px 18px; border: 1px solid #bfdbfe; border-radius: 12px; background: #eff6ff; color: #17325d; }
.estate-detail-loading-top { display: grid; grid-template-columns: 20px 1fr auto; gap: 10px; align-items: center; }
.estate-detail-loading-top strong, .estate-detail-loading-top span { display: block; }.estate-detail-loading-top strong { font-size: .94rem; }.estate-detail-loading-top div span { color: #496584; font-size: .82rem; margin-top: 2px; }.estate-detail-loading-top > span:last-child { color: #1d4ed8; font-size: .9rem; font-weight: 800; }
.estate-detail-spinner { width: 16px; height: 16px; border: 2px solid #bfdbfe; border-top-color: #2563eb; border-radius: 50%; animation: estate-detail-spin .8s linear infinite; }
@keyframes estate-detail-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .estate-detail-spinner { animation: none; } }
@media (max-width: 720px) { .explorer-topbar { margin-bottom: 24px; }.explorer-query-card { padding: 20px; }.explorer-sentence { gap: 7px; font-size: 1rem; }.explorer-sentence select { max-width: 160px; }.explorer-query-footer { align-items: stretch; flex-direction: column; }.explorer-query-footer button { width: 100%; }.explorer-scatter-wrap { height: 300px; }.explorer-detail-grid { grid-template-columns: 1fr; }.explorer-range-pills { justify-content: flex-start; }.section-head { flex-direction: column; }.estate-button { min-width: 0; flex-basis: 100%; }.estate-buttons::before { content: 'Estate names and values'; flex-basis: 100%; color: #496584; font-size: .82rem; font-weight: 800; } }
