/* Sea fish guide pages (/sea-fish-guide/...). Uses the site tokens from style.css. Sussex orange: #c2410c (5.2:1 on white). */
.fg-hero .phero-in{max-width:820px;padding-bottom:clamp(96px,10vw,140px)}
.fg-hero .lede{max-width:720px}
.fg-stats{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.fg-stats li{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.34);border-radius:999px;padding:7px 16px;font-size:.9rem;color:#fff;line-height:1.4}
.fg-stats b{font-size:1.08rem;margin-right:3px}
.fg-sci{color:#fff;margin:-4px 0 16px;line-height:1.5}
.fg-sci i{font-size:1.2rem}
.fg-sci span{display:block;font-size:.9rem;opacity:.92}
.fg-pills{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pill-sx{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#9a3412;font-weight:700;font-size:.88rem;border-radius:999px;padding:5px 14px 5px 5px;line-height:1.3}
.pill-sx .sx{width:26px;height:26px}
.pill-no{display:inline-flex;align-items:center;background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.38);border-radius:999px;padding:7px 14px;font-size:.86rem;line-height:1.3}
.rbadge{display:inline-flex;align-items:center;border-radius:999px;padding:6px 14px;font-weight:700;font-size:.86rem;border:1px solid;line-height:1.3}
.rchip{display:inline-block;border-radius:6px;padding:3px 8px;font-size:.72rem;font-weight:600;border:1px solid;line-height:1.35}
.r-c{background:#e5f6ec;color:#0b6136;border-color:#a8dcbd}
.r-u{background:#fff3df;color:#7a3e00;border-color:#f2c88a}
.r-n{background:#eef2f6;color:#3f5163;border-color:#cfd8e1}
.fph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:linear-gradient(135deg,#e3f5fa,#c4e8f3);color:var(--teal);font-size:.78rem;text-align:center}
.fsil{width:62%;max-width:180px;height:auto}

/* hub: search, chips, grid */
.fg-tools{padding-top:24px}
.fg-bar{display:flex;align-items:center;gap:10px;background:#fff;border:2px solid var(--line);border-radius:14px;padding:6px 8px 6px 14px;box-shadow:var(--shadow2)}
.fg-bar:focus-within{border-color:var(--aqua);box-shadow:0 0 0 4px rgba(12,183,234,.18)}
.fg-qi{display:flex}.fg-qi svg{width:24px;height:24px;color:var(--sea)}
#fg-q{flex:1;min-width:0;border:0;outline:0;font:500 1.02rem/1.3 var(--sans);padding:12px 4px;min-height:48px;background:transparent;color:var(--text)}
#fg-q::placeholder{color:#6b7d8f}
.fg-sortl{font-size:.8rem;color:var(--muted);font-weight:600}
#fg-sort,.rt-tools select{font:600 .9rem var(--sans);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-height:44px;background:var(--foam);color:var(--navy);cursor:pointer}
.fg-chips{display:flex;gap:8px;overflow-x:auto;flex-wrap:nowrap;padding:14px 2px 8px;scrollbar-width:thin;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.chip{flex:none;scroll-snap-align:start;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--navy);font:600 .88rem/1 var(--sans);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.chip:hover{border-color:var(--sea)}
.chip[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.chip-sx{color:#9a3412;border-color:#f1c3a8}
.chip-sx[aria-pressed=true]{background:#c2410c;border-color:#c2410c;color:#fff}
.chip .sx{width:22px;height:22px}
.fg-meta{display:flex;justify-content:space-between;gap:10px 18px;flex-wrap:wrap;align-items:center;margin:6px 0 18px}
#fg-count{margin:0;font-weight:700;color:var(--navy)}
.fg-legend{margin:0;display:flex;align-items:center;gap:6px 8px;flex-wrap:wrap;font-size:.84rem;color:var(--muted);line-height:1.5}
.fg-legend .sx{width:22px;height:22px}
.fg-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(205px,100%),1fr));gap:18px}
.fc,.fc-a{min-width:0}
.fc{content-visibility:auto;contain-intrinsic-size:auto 320px}
.fc[hidden]{display:none}
.fc-a{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--text);box-shadow:var(--shadow2);transition:transform .2s,box-shadow .2s,border-color .2s}
.fc-a:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#9fd9ea;color:var(--text)}
.fc-a:focus-visible{outline:3px solid var(--pink);outline-offset:2px}
.fc-img{position:relative;display:block;aspect-ratio:3/2;background:linear-gradient(135deg,#e3f5fa,#c4e8f3);overflow:hidden}
.fc-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.fc-a:hover .fc-img img{transform:scale(1.05)}
.fc-img .fph{position:absolute;inset:0}
.sx{display:inline-block;width:22px;height:22px;flex:none;vertical-align:middle}
.sx.on{position:absolute;top:8px;left:8px;width:30px;height:30px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.fc-b{display:flex;flex-direction:column;gap:2px;padding:12px 14px 14px;flex:1}
.fc-n{font-weight:700;color:var(--navy);font-size:1.02rem;line-height:1.25}
.fc-s{font-size:.8rem;color:var(--muted);line-height:1.3}
.fc-f{font-size:.78rem;color:#33475b;line-height:1.45;margin:7px 0 10px;flex:1}
.fc .rchip{align-self:flex-start}
.fg-none{text-align:center;padding:40px 0}
.fg-none p{font-weight:700;color:var(--navy)}
.fg-back{margin-top:28px;text-align:center}
.fg-three{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fg-tile{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;text-decoration:none;color:var(--text);box-shadow:var(--shadow2);transition:transform .2s}
.fg-tile:hover{transform:translateY(-3px);color:var(--text)}
.fg-tk{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sea)}
.fg-tt{font-weight:700;color:var(--navy);font-size:1.15rem;line-height:1.3}
.fg-tx{font-size:.92rem;color:var(--muted);line-height:1.6}

/* species page */
.fg-top{padding:0;margin-top:-74px;z-index:2}
.fg-top-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:26px;align-items:start}
.fg-fig{margin:0;background:#fff;border-radius:16px;box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--line)}
.fg-frame{background:linear-gradient(135deg,#eef9fc,#d9f0f7);display:flex;align-items:center;justify-content:center;aspect-ratio:3/2}
.fg-frame img{width:100%;height:100%;object-fit:contain}
.fg-frame.fph{padding:20px;font-size:.92rem}
.fg-fig figcaption{font-size:.8rem;color:var(--muted);padding:12px 16px;line-height:1.6}
.fg-fig figcaption span{color:var(--text);font-weight:600}
.fg-facts{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:20px 22px 8px}
.fg-facts h2{font-size:1.15rem;margin-bottom:8px}
.fg-facts dl{margin:0}
.fg-facts div{padding:10px 0;border-top:1px solid var(--line)}
.fg-facts dt{font:700 .68rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sea);margin-bottom:5px}
.fg-facts dd{margin:0;font-size:.9rem;line-height:1.55;color:var(--text)}
.fg-body{padding-top:44px}
.fg-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:44px;align-items:start}
.fg-main h2{font-size:clamp(1.35rem,2.4vw,1.7rem);margin-top:1.5em}
.fg-main .inshort{margin-bottom:6px}
.fg-side{display:grid;gap:16px}
.fg-box{background:linear-gradient(140deg,#00607d,#0088ab);color:#fff;border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.fg-box h2{color:#fff;font-size:1.15rem}
.fg-box p{font-size:.92rem;line-height:1.65}
.fg-box a{color:#fff;font-weight:700}
.fg-box a:hover{color:#fff;text-decoration-thickness:2px}
.fg-box.lt{background:#fff;color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow2)}
.fg-box.lt h2{color:var(--navy)}
.fg-box.lt a{color:var(--sea)}
.fg-trips,.fg-read{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}
.fg-trips li{background:rgba(255,255,255,.13);border-radius:10px;padding:10px 12px;line-height:1.4}
.fg-trips a{display:block}
.fg-trips span{display:block;font-size:.8rem;opacity:.92;margin-top:2px}
.fg-read li{font-size:.92rem;line-height:1.45}
.fg-rec{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:14px 0 18px}
.fg-rec div{background:var(--foam);border-radius:10px;padding:12px 14px}
.fg-rec dt{font:700 .66rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sea);margin-bottom:6px}
.fg-rec dd{margin:0;font-weight:700;color:var(--navy);font-size:.95rem;line-height:1.35}
.fg-fun{background:var(--sand);border-left:5px solid #c2410c;padding:16px 20px;border-radius:10px}
.fg-small{font-size:.86rem;color:var(--muted)}
.fg-main .faq{margin:10px 0 6px}
.fg-rel .sec-h{margin-bottom:24px}

/* Sussex page */
.sxnav ul{list-style:none;margin:0 0 16px;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.sxnav a{display:inline-flex;min-height:44px;align-items:center;padding:8px 14px;border-radius:999px;background:var(--foam);color:var(--navy);text-decoration:none;font-weight:600;font-size:.88rem}
.sxnav a:hover{background:#d3eef7;color:var(--navy)}
.sxg{margin-top:34px}
.sxg h2{font-size:1.5rem;display:flex;align-items:center;gap:10px}
.sxg h2 span{font-size:.85rem;background:#c2410c;color:#fff;border-radius:999px;padding:3px 10px;letter-spacing:0}
.sxl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:14px}
.sxl li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow2);content-visibility:auto;contain-intrinsic-size:auto 170px}
.sxl img,.sxl .fph{width:72px;height:72px;border-radius:10px;flex:none;object-fit:cover}
.sxl p{margin:0 0 4px;font-size:.88rem;line-height:1.55}
.sxn{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sxn a{text-decoration:none;color:var(--navy)}
.sxn .fn{font-weight:700;font-size:1rem}
.sxn .fs{font-size:.8rem;color:var(--muted)}
.sxm,.sxs{color:var(--muted)}
.sxs a{color:var(--sea)}

/* records + credits tables */
.rt-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:26px 0 6px}
.rt-tools label{font-size:.8rem;font-weight:700;color:var(--muted)}
.rt-tools input{flex:1 1 220px;min-height:46px;border:2px solid var(--line);border-radius:10px;padding:8px 12px;font:500 1rem var(--sans);color:var(--text)}
.rt-tools input:focus{outline:0;border-color:var(--aqua)}
.rt-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow2);background:#fff;margin-top:10px;-webkit-overflow-scrolling:touch}
.rt{width:100%;border-collapse:collapse;font-size:.88rem;min-width:860px}
.rt th,.rt td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;line-height:1.45}
.rt thead th{background:var(--navy);color:#fff;font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.rt thead button{all:unset;cursor:pointer;display:inline-flex;gap:6px;align-items:center;min-height:36px}
.rt thead button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.rt thead button span::after{content:"\21C5";opacity:.55}
.rt th[aria-sort=ascending] button span::after{content:"\25B2";opacity:1}
.rt th[aria-sort=descending] button span::after{content:"\25BC";opacity:1}
.rt tbody th{font-weight:400;background:#fff;position:sticky;left:0;z-index:1;min-width:170px}
.rt tbody tr:nth-child(even) td,.rt tbody tr:nth-child(even) th{background:#f6fbfd}
.rt tbody th a{text-decoration:none;color:var(--navy)}
.rt .fn{font-weight:700}
.rt .fs{display:block;font-size:.76rem;color:var(--muted)}
.rt tr[hidden]{display:none}
.rt .sx{width:20px;height:20px}
.rt .na{color:var(--muted);font-style:italic}
.rt .rbadge{font-size:.74rem;padding:4px 10px;white-space:nowrap}
.rt td a{color:var(--sea)}
.rt.cr{min-width:680px}

@media (max-width:1000px){.fg-cols{grid-template-columns:1fr}.fg-side{position:static}}
@media (max-width:900px){.fg-top-in{grid-template-columns:1fr}.fg-top{margin-top:-56px}}
@media (max-width:800px){.fg-three{grid-template-columns:1fr}}
@media (max-width:560px){.fg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fc-b{padding:10px 11px 12px}.fc-n{font-size:.95rem}.fc-f{font-size:.74rem}.fg-bar{flex-wrap:wrap;padding:6px 10px}.fg-bar #fg-q{flex-basis:calc(100% - 40px)}.fg-sortl{margin-left:auto}.fg-hero .phero-in{padding-bottom:90px}.rt-tools input{flex-basis:100%}}
@media (prefers-reduced-motion:reduce){.fc-a,.fc-img img,.fg-tile{transition:none}.fc-a:hover,.fc-a:hover .fc-img img,.fg-tile:hover{transform:none}}
@media (min-width:1100px){.fg-chips{flex-wrap:wrap;overflow:visible}}
.rt td:last-child{white-space:nowrap}
/* 11 Nov 26: PDF download button on species pages */
.fg-dl{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:18px 0 6px}
.fg-dl .btn{padding:13px 20px;font-size:.84rem}
.fg-dl span{font-size:.86rem;color:var(--muted);line-height:1.5;flex:1 1 220px}