/* Power: this stop's own drawings (05-17 sections.power). Shared looks are in living/explain.css. */
.pw-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.pw-tab { padding: 9px 14px; border-radius: 999px; border: 1px solid var(--rule); background: rgba(255,255,255,0.7); font: 600 13.5px/1 var(--wum-body); color: var(--ink); cursor: pointer; transition: background 0.25s, color 0.25s, border-color 0.25s; }
.pw-tab[aria-pressed="true"] { background: var(--ink); color: #FFF4EA; border-color: var(--ink); }
.pw-storm { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 26px; align-items: stretch; }
.pw-viewbox { position: relative; border-radius: 16px; overflow: hidden; background: #2A1C16; }
.pw-viewbox svg, .pw-viewbox canvas { display: block; width: 100%; height: auto; aspect-ratio: 600 / 340; }
.pw-viewbox canvas { position: absolute; inset: 0; pointer-events: none; }
.pw-viewbox .pw-sun, .pw-viewbox .pw-haze, .pw-viewbox .pw-film { transition: opacity 0.9s; }
.pw-viewbox stop { transition: stop-color 0.9s; }
.pw-lamp { animation: pulse 1.6s ease-in-out infinite; }
.pw-read { display: grid; align-content: center; gap: 12px; padding: 22px; border-radius: 16px; background: rgba(255,255,255,0.62); border: 1px solid var(--rule); }
.pw-read h4 { margin: 0; font: 700 26px/1 var(--wum-display); text-transform: uppercase; }
.pw-read p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--muted); }
.pw-meter { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 4px 10px; }
.pw-meter small { font: 600 11px/1.2 var(--wum-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.pw-meter .meter { grid-column: 2; }
.pw-meter .ico { grid-row: span 2; }
.pw-meter .ico { font-size: 20px; color: #C77B2A; }
.pw-meter.on .ico { color: #2F8F5B; }
.pw-meter .meter { position: relative; height: 12px; border-radius: 8px; background: rgba(0,0,0,0.08); overflow: hidden; }
.pw-meter .meter i { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: linear-gradient(90deg, #F2C35C, #E0825E); transition: width 0.9s cubic-bezier(.3,.7,.2,1); }
.pw-meter.on .meter i { background: linear-gradient(90deg, #6CCB8F, #2F8F5B); }
.pw-read .pw-safe { color: var(--ink); font-weight: 600; }
.pw-heatwrap { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 30px; align-items: center; }
.pw-court { max-width: 300px; justify-self: center; }
.pw-fieldwrap { max-width: 860px; }
.pw-heat, .pw-court, .pw-field { width: 100%; height: auto; display: block; }
.pw-glow path { animation: pulse 2.6s ease-in-out infinite; }
.pw-glow path:nth-child(2n) { animation-delay: -1.3s; }
.pw-note { margin: 16px 0 0; max-width: 72ch; }
@media (max-width: 960px) {
  .pw-storm, .pw-heatwrap { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pw-fieldwrap { overflow-x: auto; margin: 0 -6px; padding: 0 6px; }
  .pw-fieldwrap .pw-field { min-width: 500px; }
}
@media (prefers-reduced-motion: reduce) { .pw-lamp, .pw-glow path { animation: none; } }