#page { overflow: visible; }
html { overflow-x: hidden; }
.pt-wrap { --rk-blue: #2c7eb9; font-feature-settings: "palt"; max-width: 1200px; margin: 0 auto; }
.pt-wrap *, .pt-hero, .pt-hero * { box-sizing: border-box; }
.pt-hero { position: relative; width: 100vw; max-width: 100vw; margin: -25px 0 1px calc(50% - 50vw); padding: 26px 0 30px; background: linear-gradient(rgba(8,40,90,0.22), rgba(8,40,90,0.04)), url('/weather/amedas/ranking_hero.webp') center 60% / cover no-repeat, linear-gradient(125deg, #a6dcff 0%, #e8f7ff 52%, #8dccff 100%); font-feature-settings: "palt"; }
.pt-hero-inner { width: min(1100px, calc(100% - 40px)); margin-inline: auto; position: relative; z-index: 1; }
.pt-eyebrow { margin: 0 0 2px; color: #eaf6ff; font-size: 11px; font-weight: 900; letter-spacing: 0.14em; text-shadow: 0 1px 4px rgba(8,40,90,0.6); }
.pt-hero h1 { margin: 0; color: #fff; font-size: clamp(24px, 3vw, 36px); line-height: 1.3; letter-spacing: 0.02em; text-shadow: 0 2px 8px rgba(8,40,90,0.55); }
.pt-hero h1 small { font-size: 0.6em; font-weight: 600; }
.pt-title-sub { margin: 5px 0 0; font-size: 14px; font-weight: 600; color: #f2f9ff; text-shadow: 0 1px 5px rgba(8,40,90,0.55); }
.pt-upd { display: inline-flex; align-items: center; gap: 6px; margin: 12px 0 14px; padding: 6px 14px; border-radius: 999px; background: rgba(255,255,255,0.88); color: #16324f; font-size: 12.5px; font-weight: bold; }
.pt-upd svg { width: 15px; height: 15px; color: var(--rk-blue); flex-shrink: 0; }
.pt-sumbox { background: rgba(255,255,255,0.82); border: 1px solid rgba(255,255,255,0.95); border-radius: 18px; padding: 14px 16px 16px; box-shadow: 0 8px 20px rgba(30,80,130,0.14); }
.pt-sumbox-title { margin: 0 0 10px; font-size: 14px; font-weight: 800; color: #16324f; }
.pt-stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.pt-scard { padding: 10px 8px 12px; border: 1px solid #e2ecf5; border-radius: 12px; background: #fff; text-align: center; }
.pt-scard .pt-scard-label { display: flex; align-items: center; justify-content: center; gap: 5px; margin: 0; font-size: 11px; font-weight: 800; color: #33475b; }
.pt-scard .pt-scard-label .pt-ico-s { display: inline-flex; width: 18px; height: 18px; flex-shrink: 0; }
.pt-scard .pt-scard-label .pt-ico-s svg { width: 100%; height: 100%; }
.pt-scard .pt-scard-value { display: block; margin: 4px 0 0; font-size: 22px; font-weight: bold; line-height: 1.15; letter-spacing: -0.02em; }
.pt-scard .pt-scard-value small { padding-left: 2px; font-size: 11.5px; letter-spacing: 0; }
.pt-panel { background: #fff; padding: 0 14px 14px; margin-bottom: 14px; overflow: hidden; }
.pt-panel h2:first-child { margin-left: -14px; margin-right: -14px; }
.pt-panel h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; padding: 8px 1.8%; font-size: 18px; font-weight: 800; color: #FFF; background-color: var(--rk-blue); line-height: 1.35; }
.pt-panel h2 .pt-h2-ico { display: inline-flex; width: 23px; height: 23px; flex-shrink: 0; color: #FFF; }
.pt-panel h2 .pt-h2-ico svg { width: 100%; height: 100%; }
.pt-panel h2 .pt-h2-time { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 5px 11px; border: 1px solid #dfe7ee; border-radius: 6px; background: #fff; color: #333; font-size: 13px; font-weight: 500; line-height: 1.4; white-space: nowrap; }
.pt-panel h2 .pt-h2-time svg { width: 15px; height: 15px; color: var(--rk-blue); flex-shrink: 0; }
.pt-legend-bar { width: 50%; height: 12px; border-radius: 6px; margin: 4px 0 2px; background: linear-gradient(to right, rgb(43,80,200) 0%, rgb(47,156,224) 20%, rgb(87,199,133) 40%, rgb(242,212,61) 60%, rgb(242,139,46) 80%, rgb(229,50,30) 100%); }
.pt-legend-ticks { display: flex; justify-content: space-between; width: 50%; font-size: 10px; color: #6b7f92; margin-bottom: 6px; }
.pt-leaflet { width: 100%; height: 420px; background: #fff; border: 1px solid #e2ecf5; border-radius: 8px; }
.pt-leaflet .sq-pin-box { width: 100%; height: 100%; background: rgba(51, 51, 51, 0.5); }
.pt-map-hint { font-size: 11px; color: #6b7f92; margin: 6px 0 0; }
.pt-popup { text-align: center; }
.pt-popup strong { font-size: 12.5px; }
.pt-popup-temp { font-size: 20px; font-weight: bold; line-height: 1.3; }
/* 24時間推移ブロック */
.pt-chart-block { border: 1px solid #e2ecf5; border-radius: 10px; padding: 10px 12px 12px; margin-bottom: 12px; }
.pt-chart-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.pt-chart-head h3 { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 15px; font-weight: 800; color: #16324f; }
.pt-chart-head h3 .pt-ico-s { display: inline-flex; width: 20px; height: 20px; flex-shrink: 0; }
.pt-chart-head h3 .pt-ico-s svg { width: 100%; height: 100%; }
.pt-chart-head .pt-now { font-size: 13px; color: #33475b; }
.pt-chart-head .pt-now strong { font-size: 17px; }
.pt-chart-head .pt-mm { margin-left: auto; font-size: 11.5px; color: #5c7188; }
.pt-chart-box { width: 100%; height: 230px; }
.pt-source { font-size: 12px; color: #6b7f92; line-height: 1.8; }
/* 周辺の観測点 */
.pt-near { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pt-near a { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; padding: 10px 12px; border: 1px solid #cfe0ee; border-radius: 8px; background: #f6fafd; color: #1c5c96; font-size: 13px; font-weight: bold; text-decoration: none; }
.pt-near a:hover, .pt-near a:active { background: #1c5c96; color: #fff; border-color: #1c5c96; }
.pt-near a .pt-near-sub { font-size: 10.5px; font-weight: normal; color: #7a8fa5; }
.pt-near a:hover .pt-near-sub, .pt-near a:active .pt-near-sub { color: #cfe4f5; }
/* エリア別リンク（PC=地方見出し+全県一覧 / SP=地方タブ切替） */
.rk-al-pc { display: block; }
.rk-al-sp { display: none; }
.rk-al-row { display: grid; grid-template-columns: 110px 1fr; border-bottom: 1px solid #edf2f7; }
.rk-al-row:last-child { border-bottom: none; }
.rk-al-region { display: flex; align-items: center; padding: 10px 8px; font-size: 13px; font-weight: bold; color: #333; }
.rk-al-prefs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 0; align-items: center; }
.rk-al-prefs a { display: inline-block; padding: 7px 12px; border: 1px solid #cfe0ee; border-radius: 999px; background: #f6fafd; color: #1c5c96; font-size: 13px; text-decoration: none; }
.rk-al-prefs a:hover, .rk-al-prefs a:active { background: #1c5c96; color: #fff; border-color: #1c5c96; }
.rk-al-tabs { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
.rk-al-tabs button { flex-shrink: 0; padding: 8px 16px; border: 1px solid #cfe0ee; border-radius: 999px; background: #fff; color: #1c5c96; font-size: 13px; font-weight: bold; cursor: pointer; white-space: nowrap; }
.rk-al-tabs button.on { background: #1c5c96; color: #fff; border-color: #1c5c96; }
.rk-al-body { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-top: 10px; }
.rk-al-body a { display: block; padding: 10px 4px; border: 1px solid #cfe0ee; border-radius: 8px; background: #f6fafd; color: #1c5c96; font-size: 13px; text-align: center; text-decoration: none; }
.rk-al-body a:hover, .rk-al-body a:active { background: #1c5c96; color: #fff; border-color: #1c5c96; }
/* 同じ都道府県の観測点一覧（表示中の地点は青塗り・リンクなし） */
.pt-plist { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; }
.pt-plist a { display: block; padding: 9px 4px; border: 1px solid #cfe0ee; border-radius: 8px; background: #f6fafd; color: #1c5c96; font-size: 13px; text-align: center; text-decoration: none; }
.pt-plist a:hover, .pt-plist a:active { background: #1c5c96; color: #fff; border-color: #1c5c96; }
.pt-plist .pt-plist-cur { display: block; padding: 9px 4px; border: 1px solid #1c5c96; border-radius: 8px; background: #1c5c96; color: #fff; font-size: 13px; font-weight: bold; text-align: center; cursor: default; }
/* 基本情報 */
.pt-info { width: 100%; border-collapse: collapse; font-size: 13px; }
.pt-info th, .pt-info td { padding: 9px 10px; border-bottom: 1px solid #edf2f7; text-align: left; }
.pt-info th { width: 130px; background: #f6fafd; color: #33475b; font-size: 12px; white-space: nowrap; }
@media (max-width: 860px) {
  .pt-hero { padding: 14px 0 20px; }
  .pt-hero-inner { width: min(1100px, calc(100% - 24px)); }
  .pt-eyebrow { display: none; }
  .pt-hero h1 { font-size: 22px; }
  .pt-title-sub { font-size: 12px; }
  .pt-upd { margin: 10px 0 12px; font-size: 11px; }
  .pt-sumbox { padding: 12px 10px; border-radius: 13px; }
  .pt-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .pt-scard .pt-scard-value { font-size: 19px; }
  .pt-leaflet { height: 340px; }
  .pt-near { grid-template-columns: 1fr 1fr; }
  .rk-al-pc { display: none; }
  .rk-al-sp { display: block; }
}