.pro-ui .fish-radar-card{position:relative;overflow:hidden;padding:22px 18px;border:1px solid var(--line);border-radius:var(--radius,22px);background:var(--panel);box-shadow:var(--shadow);color:var(--text)}
.fish-radar-card:before{content:'';position:absolute;z-index:-1;width:180px;height:180px;right:-80px;top:-70px;border-radius:50%;border:1px solid #37c7ed22;box-shadow:0 0 0 22px #37c7ed0b,0 0 0 44px #37c7ed08;pointer-events:none}
.fish-radar-card .section-kicker{color:#83bdcf;font-size:10px;letter-spacing:.18em}
.pro-ui .fish-radar-card .radar-title h2{font-size:clamp(25px,7vw,34px);line-height:1.12;letter-spacing:-.035em;color:#f2fbff;margin:12px 0 8px}
.radar-title h2 em{font-style:normal;color:#39d6ef}
.pro-ui .fish-radar-card .radar-title p{font-size:11px;line-height:1.5;color:#9fb8c9;margin:0 0 20px}
.radar-location{display:flex;align-items:center;gap:11px;padding:13px 0 16px;border-bottom:1px solid #5a8aa332}
.radar-waves{display:grid;place-items:center;width:36px;height:36px;border:1px solid #3c829b;border-radius:50%;color:#64dced;font-size:29px;line-height:1}
.radar-location>div{flex:1;min-width:0}
.pro-ui .fish-radar-card .radar-location h3{font-size:17px;line-height:1.4;margin:0;color:#edf9ff}
.radar-location small{font-size:10px;color:#93b8c9}
.radar-location-dot,.radar-list-heading i{flex:none;width:6px;height:6px;background:#39d6ef;border-radius:50%;box-shadow:0 0 10px #39d6ef88}
.pro-ui .fish-radar-card .radar-list-heading{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:600;margin:15px 0 10px;color:#d5eaf4}
.radar-fish-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.radar-fish-row{display:flex;align-items:center;gap:10px;min-width:0;padding:12px 10px;border:1px solid #4d799239;border-radius:15px;background:linear-gradient(120deg,#12304670,#071725);box-shadow:inset 0 1px 0 #c9f4ff06}
.radar-fish-photo{position:relative;display:block;flex:0 0 70px;width:70px;height:48px;overflow:hidden;border-radius:8px;background:#142e41;color:#7aa8b8}
.radar-fish-photo svg,.radar-fish-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.radar-fish-photo img{background:#142e41}
.radar-fish-copy{flex:1;min-width:0}
.radar-fish-copy b{display:block;font-size:14px;line-height:1.4;font-weight:650;color:#f2fbff;overflow-wrap:anywhere}
.radar-fish-copy small{display:block;font-size:9px;line-height:1.5;color:#8fadc0;margin-top:3px}
.radar-score{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:50%;background:conic-gradient(var(--ring) calc(var(--score)*1%),#20374a 0);box-shadow:0 0 10px #38c9ed10}
.radar-score>span{display:flex;flex-direction:column;align-items:center;justify-content:center;width:41px;height:41px;background:#081c2b;border-radius:50%}
.radar-score b{font-size:16px;line-height:1.1;color:#f4fbff}
.radar-score small{font-size:7px;line-height:1.5;color:#91acbf}
.radar-more,.radar-layer,.radar-credits{margin-top:14px;border-top:1px solid #4d799234;padding-top:12px;color:#9fb8c9}
.radar-more summary,.radar-layer summary,.radar-credits summary{font-size:11px;cursor:pointer;color:#adcddb}
.radar-more summary span{float:right;color:#72d7e7}
.radar-more[open] .radar-fish-list{margin-top:12px}
.pro-ui .fish-radar-card .radar-layer h3{font-size:14px;color:#e0f3ff;margin:12px 0 6px}
.pro-ui .fish-radar-card .radar-layer p,.radar-layer small,.pro-ui .fish-radar-card .radar-boundary,.pro-ui .fish-radar-card .radar-credits p{font-size:10px;line-height:1.65;color:#9fb8c9}
.radar-credits a,.fish-radar-card .radar-link{color:#5edcea}
.radar-credits p{overflow-wrap:anywhere}
.radar-credits summary{font-size:9px}
.radar-boundary{margin:14px 0 0}
.fish-radar-card .radar-link{font-size:12px}
@media(max-width:360px){.pro-ui .fish-radar-card{padding:18px 12px}.radar-fish-photo{flex-basis:56px;width:56px}.radar-fish-row{gap:8px;padding:10px 8px}.radar-fish-copy b{font-size:12px}}
/* Match existing theme tokens on every surface and text element. */
.fish-radar-card:before{display:none}
.fish-radar-card .section-kicker,.radar-location small,.radar-fish-copy small,.radar-score small,.radar-layer small{color:var(--muted)}
.pro-ui .fish-radar-card .radar-title h2,.pro-ui .fish-radar-card .radar-location h3,.pro-ui .fish-radar-card .radar-list-heading,.radar-fish-copy b,.radar-score b,.pro-ui .fish-radar-card .radar-layer h3{color:var(--text)}
.radar-title h2 em,.radar-waves,.radar-more summary span,.fish-radar-card .radar-link{color:var(--accent)}
.pro-ui .fish-radar-card .radar-title p,.pro-ui .fish-radar-card .radar-layer p,.pro-ui .fish-radar-card .radar-boundary,.pro-ui .fish-radar-card .radar-credits p{color:var(--muted)}
.radar-location,.radar-waves,.radar-more,.radar-layer,.radar-credits{border-color:var(--line)}
.radar-more summary,.radar-layer summary,.radar-credits summary{color:var(--text)}
.radar-location-dot,.radar-list-heading i{background:var(--accent);box-shadow:none}
.radar-fish-row{background:var(--panel2);border-color:var(--line);box-shadow:none;padding:14px 10px}
.radar-fish-photo{flex-basis:82px;width:82px;height:50px;background:none;border-radius:0;overflow:visible;color:var(--muted)}
.radar-fish-cutout{display:block;width:100%;height:100%;background:none!important;overflow:hidden}
.radar-score{background:conic-gradient(var(--ring) calc(var(--score)*1%),var(--line) 0);box-shadow:none}
.radar-score>span{background:var(--panel2)}
@media(max-width:360px){.radar-fish-photo{flex-basis:65px;width:65px}}
/* The SVG clips its own cell even when Android changes image-box proportions. */
html body.pro-ui .radar-fish-photo{overflow:hidden!important;isolation:isolate;flex-shrink:0}
html body.pro-ui .radar-fish-photo>svg{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:100%;overflow:hidden}

