/* ================================================================
   TNH Situation Center v4 — ธีมป่าทึบ · จัดหน้าใหม่ให้อ่านง่าย/เลื่อนง่าย
   ลำดับ: หัว (ติดบน) → เส้นทาง (1 บรรทัด) → ผลสรุป → [จุดตรวจ | แผนที่]
   ================================================================ */
#tnhSituationOverlay{
  --sx-glass:rgba(4,14,18,.80);
  --sx-glass2:rgba(6,20,22,.90);
  --sx-line:rgba(105,170,151,.16);
  --sx-line2:rgba(105,170,151,.30);
  --sx-text:#ecfdf5;
  --sx-muted:#94ada5;
  --sx-accent:#34d399;
  --sx-ok:#34d399;--sx-watch:#ffb347;--sx-risk:#ff5a6e;
  display:none;position:fixed;inset:0;z-index:12000;
  overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  color:var(--sx-text);
  background:
    radial-gradient(circle at 92% 2%,rgba(31,122,105,.14),transparent 30%),
    radial-gradient(circle at 0 78%,rgba(22,90,72,.10),transparent 27%),
    linear-gradient(180deg,rgba(3,12,18,.84),rgba(2,10,15,.97)),
    var(--tnh-forest-photo,url('https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=1800&q=76')) center top/cover no-repeat fixed;
  background-color:var(--tnh-forest-base,#030b0d);
}
#tnhSituationOverlay.open{display:block}
html.sx-lock,html.sx-lock body{overflow:hidden}
.sx-shell{max-width:640px;margin:0 auto;padding:0 14px calc(env(safe-area-inset-bottom,0px) + 28px)}
.sx-shell button{font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sx-shell [hidden]{display:none!important}

/* ---------- หัว (ติดด้านบนตอนเลื่อน) ---------- */
.sx-head{position:sticky;top:0;z-index:50;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:8px;
  margin:0 -14px 12px;padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px;
  background:linear-gradient(180deg,rgba(3,11,13,.96),rgba(3,11,13,.86));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--sx-line)}
.sx-icbtn{height:40px;border:1px solid var(--sx-line2);border-radius:13px;background:var(--sx-glass);color:#d1fae5;font-size:20px;line-height:1}
.sx-head div{text-align:center;min-width:0}
.sx-head b{display:block;font-size:17px}
.sx-head small{display:block;color:var(--sx-muted);font-size:11px;margin-top:1px}

/* ---------- ฟอร์มเส้นทาง (เปิดตลอด แบบเดิม) ---------- */
.sx-plan{padding:14px;border:1px solid var(--sx-line2);border-radius:20px;background:var(--sx-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 14px 40px rgba(0,0,0,.35);margin-bottom:12px}
.sx-plan-title{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:10px}
.sx-plan-title b{font-size:14px}
.sx-plan-title small{font-size:10.5px;color:var(--sx-muted);text-align:right}
#sxRouteForm{display:grid;grid-template-columns:1fr 42px;grid-template-areas:"f s" "t s" "g g";gap:8px;align-items:stretch}
#sxRouteForm .sx-field:first-child{grid-area:f}
#sxRouteForm .sx-field:nth-of-type(2){grid-area:t}
.sx-swap{grid-area:s;border:1px solid var(--sx-line2);border-radius:12px;background:rgba(52,211,153,.08);color:#a7f3d0;font-size:18px}
.sx-go{grid-area:g;height:46px;border:0;border-radius:13px;background:linear-gradient(135deg,#34d399,#10b981);color:#022c22;font-size:15px;font-weight:900;box-shadow:0 8px 22px rgba(16,185,129,.25)}
.sx-go:disabled{opacity:.6}
.sx-field{position:relative}
.sx-field .dot{position:absolute;left:13px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%}
.sx-field .dot.from{background:#6ee7b7;box-shadow:0 0 0 3px rgba(110,231,183,.18)}
.sx-field .dot.to{background:#fbbf24;box-shadow:0 0 0 3px rgba(251,191,36,.18)}
.sx-field input{width:100%;box-sizing:border-box;height:46px;padding:0 12px 0 32px;border:1px solid var(--sx-line2);border-radius:13px;background:rgba(2,10,13,.75);color:var(--sx-text);font-size:16px;font-family:inherit;outline:none}
.sx-field input::placeholder{color:#5f7a72}
.sx-field input:focus{border-color:rgba(52,211,153,.6);box-shadow:0 0 0 3px rgba(52,211,153,.14)}

/* ---------- ผลสรุป ---------- */
.sx-hero{display:flex;gap:13px;align-items:center;padding:15px;border-radius:20px;border:1px solid var(--sx-line2);background:var(--sx-glass);margin-bottom:12px}
.sx-hero-ico{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:15px;font-size:24px;font-weight:900;background:rgba(255,255,255,.06)}
.sx-hero-txt{min-width:0;flex:1}
.sx-hero-txt b{display:block;font-size:18px;line-height:1.3}
.sx-hero-txt small{display:block;font-size:11.5px;color:var(--sx-muted);margin-top:3px;line-height:1.5}
.sx-hero.ok{border-color:rgba(52,211,153,.4);background:linear-gradient(135deg,rgba(16,80,58,.55),var(--sx-glass) 70%)}
.sx-hero.ok .sx-hero-ico{background:rgba(52,211,153,.18);color:#6ee7b7}
.sx-hero.watch{border-color:rgba(255,179,71,.45);background:linear-gradient(135deg,rgba(110,70,10,.5),var(--sx-glass) 70%)}
.sx-hero.watch .sx-hero-ico{background:rgba(255,179,71,.18);color:#ffc978}
.sx-hero.risk{border-color:rgba(255,90,110,.5);background:linear-gradient(135deg,rgba(120,20,35,.55),var(--sx-glass) 70%)}
.sx-hero.risk .sx-hero-ico{background:rgba(255,90,110,.2);color:#ff8a99}
.sx-hero.err .sx-hero-ico{background:rgba(255,90,110,.15);color:#ff8a99}
.sx-counts{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.sx-counts span{padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:800;background:rgba(255,255,255,.06)}
.sx-counts .ok{color:#6ee7b7;background:rgba(52,211,153,.12)}
.sx-counts .watch{color:#ffc978;background:rgba(255,179,71,.13)}
.sx-counts .risk{color:#ff8a99;background:rgba(255,90,110,.14)}

/* ---------- แท็บ จุดตรวจ | แผนที่ ---------- */
.sx-seg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:4px;margin-bottom:12px;border:1px solid var(--sx-line);border-radius:15px;background:rgba(2,10,13,.7)}
.sx-seg button{height:40px;padding:0 4px;border:0;border-radius:11px;background:transparent;color:var(--sx-muted);font-size:13px;font-weight:800;white-space:nowrap}
.sx-seg button.on{background:var(--sx-accent);color:#022c22;box-shadow:0 4px 14px rgba(52,211,153,.25)}
.sx-seg em{font-style:normal;margin-left:5px;padding:1px 7px;border-radius:999px;background:rgba(0,0,0,.18);font-size:11px}
.sx-seg em:empty{display:none}

/* ---------- รายการจุด (แบบไทม์ไลน์) ---------- */
.sx-list{list-style:none;margin:0;padding:6px 0;border:1px solid var(--sx-line);border-radius:18px;background:var(--sx-glass)}
.sx-stop>button{width:100%;display:flex;gap:12px;padding:0 14px 0 12px;border:0;background:transparent;color:inherit;text-align:left}
.sx-rail{position:relative;flex:none;width:14px;display:flex;justify-content:center}
.sx-rail::before{content:'';position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:rgba(110,231,183,.22)}
.sx-stop:first-child .sx-rail::before{top:22px}
.sx-stop:last-child .sx-rail::before{bottom:calc(100% - 22px)}
.sx-rail i{position:relative;z-index:1;width:12px;height:12px;margin-top:16px;border-radius:50%;border:2px solid #06130f}
.sx-stop.from .sx-rail i,.sx-stop.to .sx-rail i{width:14px;height:14px;margin-top:15px;border-color:#fff}
.sx-stop.risk .sx-rail i{box-shadow:0 0 12px rgba(255,90,110,.9)}
.sx-stop-body{flex:1;min-width:0;padding:11px 0 12px;border-bottom:1px solid rgba(255,255,255,.05)}
.sx-stop:last-child .sx-stop-body{border-bottom:0}
.sx-stop-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sx-stop-top b{font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sx-why{display:block;margin-top:4px;font-size:12.5px;line-height:1.45;color:#d6ebe3}
.sx-why.minor{font-size:11.5px;color:var(--sx-muted)}
.sx-stop-top+.sx-why.minor{margin-top:3px}
.sx-stop:active .sx-stop-body{opacity:.7}
.sx-pill{flex:none;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:900;white-space:nowrap}
.sx-pill.ok{background:rgba(52,211,153,.14);color:#6ee7b7}
.sx-pill.watch{background:rgba(255,179,71,.16);color:#ffc978}
.sx-pill.risk{background:rgba(255,90,110,.2);color:#ff8a99}
.sx-pill.na{background:rgba(255,255,255,.07);color:#9aa9a4}
.sx-skel{height:62px;margin-bottom:8px;border-radius:14px;background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.08),rgba(255,255,255,.04));background-size:200% 100%;animation:sxSkel 1.2s linear infinite}
@keyframes sxSkel{to{background-position:-200% 0}}
.sx-note{margin-top:10px;padding:11px 13px;border-radius:14px;background:rgba(56,189,248,.07);border:1px solid rgba(56,189,248,.18);font-size:11.5px;line-height:1.55;color:#bfe3f2}
.sx-source{margin-top:10px;padding:0 13px;border-radius:14px;background:var(--sx-glass);border:1px solid var(--sx-line)}
.sx-source summary{padding:12px 0;font-size:12.5px;font-weight:800;color:#c7e9dc;cursor:pointer;list-style:none}
.sx-source summary::-webkit-details-marker{display:none}
.sx-source summary::after{content:'›';float:right;transition:transform .2s;color:var(--sx-muted)}
.sx-source[open] summary::after{transform:rotate(90deg)}
.sx-source p{margin:0 0 12px;font-size:11px;line-height:1.65;color:var(--sx-muted)}
.sx-source p b{color:#d6ebe3}
.sx-spin{display:inline-block;width:18px;height:18px;border:2.5px solid rgba(52,211,153,.25);border-top-color:var(--sx-accent);border-radius:50%;animation:sxSpin .8s linear infinite}
@keyframes sxSpin{to{transform:rotate(360deg)}}

/* ---------- แผนที่ (แท็บแยก สูงพอดีจอ ไม่แย่งการเลื่อนหน้า) ---------- */
.sx-mapbox{position:relative;height:calc(100vh - 170px);height:calc(100dvh - 170px);min-height:360px;max-height:760px;overflow:hidden;border:1px solid var(--sx-line2);border-radius:20px;background:#06110f;box-shadow:0 18px 44px rgba(0,0,0,.45)}
#tnhSituationMap{position:absolute;inset:0;background:#06110f}
.sx-mapbox .leaflet-tile-pane .leaflet-layer:first-child{filter:saturate(.75) brightness(.62) contrast(1.15) hue-rotate(-8deg)}
.sx-mapbox .leaflet-control-attribution{background:rgba(2,10,13,.6)!important;color:#7b958c!important;font-size:8px!important}
.sx-mapbox .leaflet-control-attribution a{color:#9ccfbd!important}
.sx-mapbox .leaflet-top.leaflet-right{top:52px}
.sx-mapbox .leaflet-bar{border:1px solid var(--sx-line2)!important;border-radius:12px!important;overflow:hidden}
.sx-mapbox .leaflet-bar a{width:36px!important;height:36px!important;line-height:36px!important;background:var(--sx-glass2);color:#d1fae5;border-color:var(--sx-line)}
.sx-mapbox .leaflet-popup-content-wrapper,.sx-mapbox .leaflet-popup-tip{background:#07161a;color:var(--sx-text);border:1px solid var(--sx-line2)}
.sx-mapbox .leaflet-popup-content{font-family:inherit;font-size:12.5px;line-height:1.55;margin:10px 12px}
.sx-mapbox .leaflet-popup-content small{color:#a7c4ba}
.sx-flood-tiles{filter:drop-shadow(0 0 1px rgba(56,189,248,.8))}
.sx-chips{position:absolute;z-index:800;left:10px;right:10px;top:10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center;pointer-events:none}
.sx-chips>*{pointer-events:auto}
.sx-chip{height:34px;padding:0 12px;border:1px solid var(--sx-line2);border-radius:999px;background:var(--sx-glass2);color:var(--sx-muted);font-size:12.5px;font-weight:800;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.sx-chip.on{background:#0f3b2d;border-color:rgba(52,211,153,.7);color:#a7f3d0}
#sxChipFlood.on{background:#0c3346;border-color:rgba(56,189,248,.7);color:#bae6fd}
.sx-chip:disabled{opacity:.45}
.sx-range{display:inline-flex;height:34px;padding:3px;gap:2px;border:1px solid rgba(56,189,248,.35);border-radius:999px;background:var(--sx-glass2)}
.sx-range button{min-width:34px;border:0;border-radius:999px;background:transparent;color:#8fb3c2;font-size:11.5px;font-weight:800}
.sx-range button.on{background:rgba(56,189,248,.25);color:#e0f2fe}
.sx-fit{position:absolute;z-index:800;right:10px;bottom:146px;width:38px;height:38px;border:1px solid var(--sx-line2);border-radius:12px;background:var(--sx-glass2);color:#d1fae5;font-size:17px}
.sx-mapbar{position:absolute;z-index:800;left:8px;right:8px;bottom:18px;padding:8px 10px;border-radius:15px;border:1px solid var(--sx-line2);background:rgba(3,12,14,.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sx-time{display:flex;align-items:center;gap:10px}
.sx-time>button{width:34px;height:34px;flex:none;border:0;border-radius:50%;background:var(--sx-accent);color:#022c22;font-size:12px;font-weight:900}
.sx-time input{flex:1;min-width:0;accent-color:var(--sx-accent)}
.sx-time span{flex:none;min-width:52px;text-align:right;font-size:11.5px;font-weight:700;color:#c7e9dc}
.sx-legend{display:flex;flex-wrap:wrap;gap:4px 11px;margin-top:6px;font-size:10.5px;color:#b6cdc5}
.sx-legend span{display:flex;align-items:center;gap:4px}
.sx-legend i{width:8px;height:8px;border-radius:50%}
.sx-legend .ok{background:var(--sx-ok)}.sx-legend .watch{background:var(--sx-watch)}.sx-legend .risk{background:var(--sx-risk)}
.sx-legend .flood{background:#38bdf8;border-radius:2px}
.sx-windy{display:flex;align-items:center;justify-content:center;gap:6px;height:38px;margin-top:8px;border-radius:11px;border:1px solid rgba(56,189,248,.45);background:linear-gradient(135deg,rgba(14,74,110,.85),rgba(8,40,60,.9));color:#e0f2fe;font-size:13px;font-weight:800;text-decoration:none}
.sx-windy span{font-size:14px;opacity:.8}
.sx-windy:active{transform:scale(.98)}
.sx-maphint{display:block;margin:8px 4px 0;font-size:11px;color:var(--sx-muted);text-align:center}
.sx-maphint:empty{display:none}




/* ---------- แจ้งเหตุจากผู้ใช้ ---------- */
.sx-report-cta{width:100%;display:flex;align-items:center;gap:12px;margin-bottom:12px;padding:12px 13px;border:1px solid rgba(255,179,71,.35);border-radius:18px;background:linear-gradient(135deg,rgba(90,52,8,.55),rgba(4,14,18,.85) 70%);color:inherit;text-align:left}
.sx-cta-ico{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:13px;background:rgba(255,179,71,.16);font-size:20px}
.sx-cta-txt{flex:1;min-width:0}
.sx-cta-txt b{display:block;font-size:14.5px}
.sx-cta-txt small{display:block;font-size:11px;color:#d9c4a3;margin-top:1px}
.sx-cta-go{flex:none;padding:8px 13px;border-radius:999px;background:#ffb347;color:#2b1700;font-size:12.5px;font-weight:900}
.sx-rhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px 10px}
.sx-rhead b{display:block;font-size:15px}
.sx-rhead small{display:block;font-size:10.5px;color:var(--sx-muted);margin-top:1px}
.sx-rnew{flex:none;height:36px;padding:0 14px;border:0;border-radius:999px;background:#ffb347;color:#2b1700;font-size:13px;font-weight:900}
.sx-rcard{margin-bottom:9px;border:1px solid var(--sx-line);border-radius:16px;background:var(--sx-glass);overflow:hidden}
.sx-rcard.closed,.sx-rcard.landslide{border-color:rgba(255,90,110,.35)}
.sx-rmain{width:100%;display:flex;gap:11px;padding:12px 13px 8px;border:0;background:transparent;color:inherit;text-align:left}
.sx-rico{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.07);font-size:19px}
.sx-rbody{flex:1;min-width:0}
.sx-rtop{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sx-rtop b{font-size:14.5px}
.sx-near{font-style:normal;padding:2px 8px;border-radius:999px;background:rgba(255,179,71,.18);color:#ffc978;font-size:10.5px;font-weight:800}
.sx-rplace{display:block;margin-top:3px;font-size:13px;color:#e2f3ec}
.sx-rnote{display:block;margin-top:3px;font-size:12.5px;color:#c4d9d1;line-height:1.45}
.sx-rtime{display:block;margin-top:4px;font-size:10.5px;color:var(--sx-muted)}
.sx-ract{display:flex;gap:6px;padding:0 13px 11px 62px}
.sx-ract button{height:32px;padding:0 11px;border:1px solid var(--sx-line2);border-radius:999px;background:rgba(2,10,13,.5);color:#c7e9dc;font-size:12px;font-weight:700}
.sx-ract button b{margin-left:2px;color:#fff}
.sx-ract .del{margin-left:auto;padding:0 10px}
.sx-rmsg{padding:0 13px 0 62px;font-size:11.5px;color:#ffc978}
.sx-rmsg:not(:empty){padding-bottom:10px}
.sx-linkbtn{margin-left:4px;padding:3px 10px;border:0;border-radius:999px;background:var(--sx-accent);color:#022c22;font-size:11.5px;font-weight:900}
.sx-empty small{color:var(--sx-muted)}
.sx-rpin{background:none;border:0}
.sx-rpin span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#1b1206;border:2px solid #ffb347;font-size:16px;box-shadow:0 3px 10px rgba(0,0,0,.6)}
.sx-rpin.near span{border-color:#ff5a6e;box-shadow:0 0 0 4px rgba(255,90,110,.25),0 3px 10px rgba(0,0,0,.6)}
.sx-spin.sm{width:12px;height:12px;border-width:2px;vertical-align:-2px}

/* bottom sheet */
.sx-sheet{position:fixed;inset:0;z-index:12500}
.sx-sheet-bg{position:absolute;inset:0;background:rgba(0,6,8,.6);opacity:0;transition:opacity .2s}
.sx-sheet.open .sx-sheet-bg{opacity:1}
.sx-sheet-card{position:absolute;left:0;right:0;bottom:0;max-width:640px;margin:0 auto;max-height:92vh;max-height:92dvh;overflow-y:auto;padding:8px 16px calc(env(safe-area-inset-bottom,0px) + 16px);border-radius:24px 24px 0 0;border:1px solid var(--sx-line2);border-bottom:0;
  background:linear-gradient(180deg,rgba(6,20,22,.98),rgba(3,11,13,.99));box-shadow:0 -20px 50px rgba(0,0,0,.5);transform:translateY(100%);transition:transform .22s ease-out}
.sx-sheet.open .sx-sheet-card{transform:none}
.sx-sheet-grip{width:40px;height:4px;margin:0 auto 8px;border-radius:4px;background:rgba(255,255,255,.2)}
.sx-sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.sx-sheet-head b{font-size:17px}
.sx-sheet-head .sx-icbtn{width:38px;height:38px}
.sx-lbl{margin:12px 2px 7px;font-size:12.5px;font-weight:800;color:#c7e9dc}
.sx-lbl small{font-weight:400;color:var(--sx-muted)}
.sx-types{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.sx-types button{display:flex;align-items:center;gap:7px;height:44px;padding:0 10px;border:1px solid var(--sx-line2);border-radius:12px;background:rgba(2,10,13,.6);color:#d6ebe3;font-size:13px;font-weight:700;text-align:left}
.sx-types button span{font-size:18px}
.sx-types button.on{border-color:#ffb347;background:rgba(255,179,71,.16);color:#fff;box-shadow:0 0 0 2px rgba(255,179,71,.25)}
.sx-gps{width:100%;height:44px;border:1px dashed rgba(52,211,153,.55);border-radius:12px;background:rgba(52,211,153,.07);color:#a7f3d0;font-size:14px;font-weight:800}
.sx-gps.on{border-style:solid;background:rgba(52,211,153,.16)}
.sx-gps-status{min-height:4px;margin:6px 2px;font-size:11.5px;color:#a7f3d0}
.sx-gps-status small{color:var(--sx-muted)}
.sx-input{width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--sx-line2);border-radius:12px;background:rgba(2,10,13,.75);color:var(--sx-text);font-size:16px;font-family:inherit;outline:none;resize:none}
.sx-input:focus{border-color:rgba(52,211,153,.6);box-shadow:0 0 0 3px rgba(52,211,153,.14)}
.sx-input::placeholder{color:#5f7a72}
.sx-sheet-err{min-height:4px;margin:8px 2px;font-size:12.5px;color:#ffb3bd;line-height:1.5}
.sx-sheet-card .sx-go{width:100%}
.sx-sheet-hint{display:block;margin-top:9px;text-align:center;font-size:10.5px;color:var(--sx-muted)}

/* การ์ดเดิม (หน้าประกาศ) */
.ann-situation{margin:0 0 14px;padding:16px;border-radius:22px;background:linear-gradient(145deg,rgba(6,24,22,.92),rgba(3,12,14,.96));border:1px solid rgba(105,170,151,.2);color:#fff}
.ann-situation-top{display:flex;gap:12px;align-items:center}
.ann-situation-icon{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;font-size:25px;background:rgba(52,211,153,.12)}
.ann-situation h3{margin:0 0 3px;font-size:18px}
.ann-situation p{margin:0;color:#9db8ae;font-size:11px}
.ann-situation button{width:100%;margin-top:12px;padding:11px;border:0;border-radius:13px;background:rgba(52,211,153,.14);color:#a7f3d0;font-weight:900}

/* ================================================================
   กล่องบนหน้าหลัก — ป่าทึบ + วงเรดาร์
   ================================================================ */
.situation-entry-card{
  background:
    radial-gradient(circle at 92% 50%,rgba(52,211,153,.20),transparent 45%),
    linear-gradient(180deg,rgba(3,12,18,.55),rgba(2,10,15,.80)),
    var(--tnh-forest-photo,url('https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=900&q=72')) center/cover no-repeat;
  border:1px solid rgba(105,170,151,.22);
}
.situation-entry-card::after{background:linear-gradient(115deg,rgba(3,12,14,.80) 28%,rgba(3,12,14,.18) 100%)}
.situation-entry-card .calendar-entry-overlay{min-height:112px}
.situation-entry-rings{position:absolute;right:-40px;top:50%;width:190px;height:190px;transform:translateY(-50%);pointer-events:none;z-index:1}
.situation-entry-rings i{position:absolute;inset:0;border:1.5px solid rgba(110,231,183,.38);border-radius:50%;animation:sxPing 3s ease-out infinite}
.situation-entry-rings i:nth-child(2){animation-delay:1s}.situation-entry-rings i:nth-child(3){animation-delay:2s}
@keyframes sxPing{0%{transform:scale(.25);opacity:1}100%{transform:scale(1);opacity:0}}
.situation-live{display:inline-block;vertical-align:middle;margin-left:4px;padding:2px 7px;border-radius:999px;background:#ff5a6e;color:#fff;font-size:9px;font-weight:900;letter-spacing:.06em;text-shadow:none}
@media (prefers-reduced-motion:reduce){.situation-entry-rings i{animation:none;opacity:.25}}