body[data-mode="jpod"] .workspace{grid-template-columns:minmax(0,1fr) 320px}
body[data-mode="jpod"] .map{height:clamp(460px,64vh,620px)}
.date-ticker{position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:620;width:220px;max-width:calc(100% - 24px);background:rgba(255,255,255,.94);border:1px solid #88aebb;border-radius:10px;box-shadow:0 3px 14px #073d5522;padding:9px 12px;text-align:left;pointer-events:none}
.date-ticker b{display:block;font-size:20px;line-height:1.15;color:#123b51}
.date-ticker span{display:block;font-size:12px;line-height:1.35;margin-top:3px;color:#456574}
.play-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;margin:12px 0 8px}
.play-row button{width:100%}
.mobile-play{display:none}
.timeline-range{width:100%;accent-color:#0b7793;min-height:32px}
.timeline-labels{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#5b7380;margin-top:2px}
.jpod-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.jpod-stats>div{background:#eef7fa;border-radius:7px;padding:9px;font-size:12px}
.jpod-stats b{display:block;font-size:18px;color:#123b51;margin-top:2px}
.latest-box{border-left:3px solid #e77922;background:#fff7e9;padding:10px;margin:12px 0;font-size:13px;line-height:1.5}
.latest-box b{display:block;margin-bottom:3px}
.whale-wrap{background:transparent;border:0}
.whale-marker{width:58px;height:40px;filter:drop-shadow(0 2px 3px #062d3c88);display:block}
.whale-tag{display:block;background:#123b51;color:white;border-radius:9px;font:700 9px/16px Arial;text-align:center;padding:0 6px;width:max-content;margin:-2px auto 0;box-shadow:0 1px 4px #0004}
.acoustic-icon{display:block;width:13px;height:13px;background:#8b4eb5;border:2px solid white;box-shadow:0 0 0 1px #5a2d78;transform:rotate(45deg)}
.legend .line{width:22px;border-top:3px dashed #e77922;flex:none}
.legend .dot{width:12px;height:12px;border-radius:50%;background:#126c8e;border:2px solid white;box-shadow:0 0 0 1px #126c8e;flex:none}
.legend .diamond{width:11px;height:11px;background:#8b4eb5;border:2px solid white;box-shadow:0 0 0 1px #5a2d78;transform:rotate(45deg);flex:none}
.legend .legend-whale-img{width:26px;height:20px;object-fit:contain;flex:none}
.jpod-popup{max-width:250px}.jpod-popup b{display:block;margin-bottom:4px}.jpod-popup small{display:block;margin-top:6px;color:#607684;line-height:1.4}
@media(max-width:760px){body[data-mode="jpod"] .workspace{display:flex;flex-direction:column}body[data-mode="jpod"] .map-stack{display:grid;gap:14px}body[data-mode="jpod"] .map{height:520px}.date-ticker{top:48px;right:8px;transform:none;width:158px;padding:7px 9px;border-radius:8px}.date-ticker b{font-size:16px}.date-ticker span{font-size:10px}.play-row{grid-template-columns:1fr}.mobile-play{display:block;position:absolute;left:10px;bottom:74px;z-index:640;min-height:44px;padding:10px 14px;border:1px solid #0b5f78;border-radius:9px;background:rgba(11,119,147,.95);box-shadow:0 3px 12px #073d5540;color:#fff;font:700 14px/1.2 Arial;cursor:pointer}.mobile-play:active{transform:translateY(1px)}.whale-marker{width:48px;height:34px}}
@media(max-width:430px){body[data-mode="jpod"] .map{height:455px}.date-ticker{top:46px;right:7px;width:146px;padding:6px 8px}.date-ticker b{font-size:14px}.date-ticker span{font-size:9px}.mobile-play{left:7px;bottom:70px;min-height:42px;padding:9px 12px;font-size:13px}.jpod-stats{grid-template-columns:1fr 1fr}.jpod-stats b{font-size:16px}}
@media(prefers-reduced-motion:reduce){.whale-wrap{transition:none}}

.latest-ring{border:3px solid #d34b24;border-radius:50%;background:transparent;box-shadow:0 0 0 2px #fff inset,0 1px 5px #0005}

.season-card{grid-column:1;background:#fff;border:1px solid #c5d8e0;border-radius:12px;box-shadow:0 2px 12px #0b40541a;padding:18px;margin-top:14px}
.season-card h2{margin:0 0 6px;font-size:23px;color:#123b51}
.season-note{margin:0 0 14px;color:#4e6875;font-size:13px;line-height:1.5}
.season-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.season-grid article{background:#eef7fa;border-radius:8px;padding:12px}
.season-grid h3{margin:0 0 5px;font-size:16px;color:#0b6683}
.season-grid p{margin:0;font-size:13px;line-height:1.5;color:#294d5d}
.season-card .sources{margin:12px 0 0;font-size:11px;line-height:1.55;color:#607684}
@media(max-width:760px){.season-card{padding:14px}.season-card h2{font-size:20px}.season-grid{grid-template-columns:1fr}.season-grid article{padding:11px}}
@media(max-width:430px){.season-card{margin-top:10px;padding:12px}.season-card h2{font-size:18px}.season-grid p{font-size:12px}}

.track-picker{position:absolute;left:10px;right:10px;bottom:12px;z-index:630;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;pointer-events:auto}
.track-picker button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:52px;padding:6px 4px;border:1px solid #8fb0bc;border-radius:9px;background:rgba(255,255,255,.93);box-shadow:0 2px 9px #073d551f;color:#234857;font:700 12px/1.2 Arial;cursor:pointer}
.track-picker button.active{background:#123b51;color:#fff;border-color:#123b51}
.track-picker button i{width:10px;height:10px;border-radius:50%;background:var(--swatch);box-shadow:0 0 0 2px #fff,0 0 0 3px #567;flex:none;margin-bottom:3px}
.track-picker button small{font-size:9px;font-weight:400;opacity:.82;margin-top:2px;white-space:nowrap}
.group-note{background:#eef7fa;border-left:3px solid #0b7793;border-radius:5px;padding:9px;margin:12px 0;font-size:12px;line-height:1.45;color:#355565}
@media(max-width:760px){.date-ticker{top:48px;transform:none}.track-picker{display:flex;overflow-x:auto;scrollbar-width:none}.track-picker button{flex:0 0 96px;min-height:48px}.track-picker button small{font-size:8px}}
@media(max-width:430px){.date-ticker{top:46px;transform:none}.track-picker{left:7px;right:7px;bottom:8px}.track-picker button{flex-basis:88px;font-size:11px}}
[hidden]{display:none!important}

@media(min-width:761px){
 body[data-mode="jpod"] .workspace{grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:auto;align-items:start}
 body[data-mode="jpod"] .map-stack{display:grid;gap:14px;grid-column:1}
 body[data-mode="jpod"] .side{grid-column:2;align-self:start}
 body[data-mode="jpod"] .season-card{margin-top:0}
}
.fade-dot{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#126c8e 0 45%,#126c8e55 55% 100%);border:2px solid white;box-shadow:0 0 0 1px #126c8e;flex:none}
