.earthquake-page { min-width:0; }
.earthquake-page h1 { max-width:24ch; }
.earthquake-page > header p { max-width:78ch; }
.earthquake-toolbar,.earthquake-globe-controls,.earthquake-pagination { display:flex; align-items:center; flex-wrap:wrap; gap:.65rem; }
.earthquake-toolbar { justify-content:flex-end; }
.earthquake-button { border:1px solid #89b7c9; border-radius:.65rem; color:var(--ink,#08233f); background:#fff; padding:.6rem .85rem; min-height:44px; cursor:pointer; font:inherit; font-weight:650; line-height:1.3; }
.earthquake-button:hover { background:#e6f6fb; }
.earthquake-button:disabled { cursor:default; opacity:.55; }
.earthquake-button[aria-pressed="true"] { box-shadow:inset 0 0 0 2px #006f9d; }
.earthquake-status { min-height:1.65em; margin:.7rem 0; }
.earthquake-status-warning { padding:.75rem 1rem; background:#fff3d9; border-inline-start:4px solid #af6100; color:#613900; border-radius:.4rem; }
.earthquake-stats { display:grid; grid-template-columns:1fr 1fr 1.6fr; gap:1rem; margin:1rem 0; }
.earthquake-stat { display:flex; flex-direction:column; padding:1rem 1.2rem; background:#eef9fc; border:1px solid var(--line,#c8e2e9); border-radius:1rem; min-width:0; }
.earthquake-stat span { color:#3e596f; font-size:.9rem; }
.earthquake-stat strong { font-size:clamp(1.2rem,2.3vw,1.7rem); line-height:1.5; }
.earthquake-stat:last-child strong { font-size:1.05rem; padding-top:.4rem; }
.earthquake-range,.earthquake-timezone { font-size:.9rem; color:#3e596f; margin:.35rem 0; }
.earthquake-globe-section { margin-top:2rem; border:1px solid #c8e2e9; border-radius:1.3rem; overflow:hidden; background:#062035; color:#f4fbff; box-shadow:0 12px 35px #08233f18; }
.earthquake-globe-section h2 { margin:1.35rem 1.35rem .9rem; font-size:clamp(1.5rem,3vw,2rem); }
.earthquake-globe-controls { margin:0 1.35rem .65rem; }
.earthquake-globe-controls .earthquake-button { font-size:.88rem; background:#12374d; color:#eefbff; border-color:#558399; }
.earthquake-globe-controls .earthquake-button:hover { background:#234d64; }
.earthquake-globe-controls .earthquake-button[aria-pressed="true"] { box-shadow:inset 0 0 0 2px #89ddf2; }
.earthquake-globe { position:relative; width:100%; height:clamp(350px,57vw,590px); background:radial-gradient(ellipse at center,#15405a 0,#092b42 42%,#061c30 76%); }
.earthquake-canvas { display:block; width:100%; height:100%; touch-action:none; cursor:grab; }
.earthquake-canvas:active { cursor:grabbing; }
.earthquake-canvas:focus-visible { outline-offset:-5px; outline-color:#e6c5ff; }
.earthquake-globe-message { position:absolute; z-index:1; top:50%; inset-inline:0; transform:translateY(-50%); width:min(80%,38rem); margin:0 auto; padding:1.2rem; border:1px solid #6593ad; border-radius:1rem; background:#082940; color:#fff; text-align:center; }
.earthquake-globe-failed { height:220px; min-height:220px; }
.earthquake-help,.earthquake-attribution { margin:.75rem 1.35rem; color:#c1dbe9; font-size:.9rem; }
.earthquake-attribution { font-size:.8rem; padding-bottom:.7rem; }
.earthquake-legend { display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1.3rem; margin:1rem 1.35rem; font-size:.85rem; }
.earthquake-legend-entry { display:inline-flex; align-items:center; gap:.4rem; }
.earthquake-legend-dot { width:var(--marker-size); height:var(--marker-size); min-width:var(--marker-size); border-radius:50%; background:var(--marker-color); border:1px solid #ffffffb3; }
.earthquake-detail { margin:1.2rem 0 2rem; border:1px solid #92bbc9; border-radius:1rem; padding:1.25rem; background:#f4fbfd; scroll-margin-top:6rem; }
.earthquake-detail h2 { font-size:1.2rem; margin-bottom:.8rem; }
.earthquake-detail dl { display:grid; grid-template-columns:minmax(7rem,auto) 1fr; gap:.35rem 1.2rem; margin:0 0 1rem; }
.earthquake-detail dt { color:#3e596f; }
.earthquake-detail dd { margin:0; overflow-wrap:anywhere; font-weight:600; }
.earthquake-detail > .earthquake-button { margin-inline-start:1rem; }
.earthquake-filters { display:grid; grid-template-columns:2fr 1fr 1.3fr auto; gap:1rem; align-items:end; padding:1.1rem; background:#eef9fc; border:1px solid #c8e2e9; border-radius:1rem; }
.earthquake-filters label { display:flex; flex-direction:column; gap:.3rem; min-width:0; font-size:.9rem; font-weight:650; }
.earthquake-filters input,.earthquake-filters select { width:100%; max-width:100%; height:46px; border:1px solid #89adbd; border-radius:.6rem; padding:.55rem .65rem; background:white; color:#08233f; font:inherit; }
.earthquake-list-summary { margin:1rem 0 .7rem; color:#3e596f; }
.earthquake-table-wrap { width:100%; overflow-x:auto; border:1px solid #c8e2e9; border-radius:.8rem; }
.earthquake-table { border-collapse:collapse; width:100%; font-size:.92rem; }
.earthquake-table th { padding:.8rem .7rem; background:#e7f4f8; color:#08233f; text-align:start; white-space:nowrap; }
.earthquake-table td { padding:.7rem; border-top:1px solid #d9e7ec; vertical-align:middle; }
.earthquake-table td:nth-child(1),.earthquake-table td:nth-child(3),.earthquake-table td:nth-child(4),.earthquake-table td:nth-child(5) { white-space:nowrap; }
.earthquake-table td:nth-child(2) { min-width:12rem; width:40%; }
.earthquake-table tbody tr:hover { background:#f1fafd; }
.earthquake-row-selected { background:#dceff7!important; box-shadow:inset 4px 0 0 #006f9d; }
.earthquake-row-open { border:0; padding:.25rem 0; color:#006287; background:transparent; cursor:pointer; text-align:start; text-decoration:underline; text-underline-offset:.2em; font:inherit; font-weight:600; min-height:38px; }
.earthquake-magnitude { font-size:1.1rem; font-weight:750; }
.earthquake-empty { padding:1.5rem; border:1px dashed #8eb3c2; border-radius:.7rem; text-align:center; }
.earthquake-pagination { justify-content:center; padding:1.25rem 0; }
.earthquake-pagination span { min-width:8rem; text-align:center; }
@media(max-width:760px) {
  .earthquake-filters { grid-template-columns:1fr 1fr; }
  .earthquake-stats { gap:.55rem; grid-template-columns:1fr 1fr; }
  .earthquake-stat { padding:.8rem; }
  .earthquake-stat:last-child { grid-column:1/-1; }
  .earthquake-globe-controls { gap:.5rem; margin-inline:.8rem; }
  .earthquake-globe-controls .earthquake-button { font-size:.8rem; padding:.5rem .6rem; }
  .earthquake-help,.earthquake-attribution,.earthquake-legend { margin-inline:.8rem; }
  .earthquake-table-wrap { border:0; overflow:visible; }
  .earthquake-table,.earthquake-table tbody { display:block; }
  .earthquake-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .earthquake-table tr { display:grid; grid-template-columns:1fr 1fr; border:1px solid #bdd6e0; border-radius:.8rem; margin-bottom:.8rem; overflow:hidden; padding:.55rem; }
  .earthquake-table td { display:block; border:0; padding:.35rem .45rem; min-width:0!important; width:auto!important; white-space:normal!important; }
  .earthquake-table td::before { content:attr(data-label); display:block; color:#486175; font-size:.75rem; font-weight:500; }
  .earthquake-table td:nth-child(2) { grid-column:1/-1; grid-row:1; }
  .earthquake-table td:nth-child(1) { grid-row:2; }
  .earthquake-row-open { min-height:34px; }
}
@media(max-width:420px) { .earthquake-filters { grid-template-columns:1fr; } .earthquake-detail dl { grid-template-columns:1fr; gap:.1rem; } .earthquake-detail dd { margin-bottom:.55rem; } }
@media(prefers-reduced-motion:reduce) { .earthquake-page { scroll-behavior:auto; } }