/* Cabo Catch Guide. All component rules are intentionally scoped. */
.catch-guide { --catch-rule: rgba(34,48,63,.15); --catch-teal: #28594e; }
.catch-guide [hidden], .catch-dialog [hidden] { display: none !important; }
.catch-guide { scroll-margin-top: 78px; }
.catch-heading { display: grid; grid-template-columns: 1.15fr 1fr; gap: 4rem; align-items: end; margin-bottom: 3rem; }
.catch-heading .section-title { margin: 0; max-width: 18ch; font-size: clamp(2.2rem,4.2vw,3.6rem); }
.catch-heading-note { padding-bottom: .2rem; max-width: 440px; }
.catch-heading-note p { color: var(--paper-mist); margin: 1rem 0; line-height: 1.65; }
.catch-edition, .catch-overline { display: block; font: 500 .65rem/1.5 var(--font-mono); letter-spacing: .13em; text-transform: uppercase; }
.catch-edition { color: #84621c; }
.catch-inline-link { color: var(--paper-ink); font-size: .85rem; font-weight: 700; text-decoration: none; border-bottom: 1px solid #ac8e50; padding-bottom: .25rem; }
.catch-inline-link span { margin-left: 1rem; }
.catch-tools { display: flex; align-items: center; gap: 1.4rem; border-block: 1px solid var(--catch-rule); padding: 1.1rem 0; }
.catch-month-label { display: flex; align-items: center; gap: 1rem; font-size: .83rem; font-weight: 700; }
.catch-month-label select { font: 700 .95rem var(--font-body); color: var(--paper-ink); border: 1px solid #9b917d; background: #fffaf0; padding: .7rem 2.1rem .7rem .9rem; border-radius: 3px; cursor: pointer; }
.catch-tools > p { font-size: .78rem; color: var(--paper-mist); }
.catch-view-switch { margin-left: auto; display: flex; background: rgba(34,48,63,.06); padding: 4px; border-radius: 5px; }
.catch-view-switch button { background: none; border: 0; padding: .65rem .85rem; font: 600 .76rem var(--font-body); color: var(--paper-mist); cursor: pointer; border-radius: 3px; white-space: nowrap; }
.catch-view-switch button[aria-pressed="true"] { background: var(--paper-ink); color: #fffaf0; box-shadow: 0 2px 6px #22303f15; }
.catch-top { position: relative; display: flex; align-items: center; gap: 2rem; padding: 1.4rem 2rem; margin: 1.4rem 0 2.5rem; background: radial-gradient(ellipse at 80% 0, #21453e 0, transparent 70%), var(--ink-2); color: var(--foam); border: 1px solid #36514c; border-radius: 5px; overflow: hidden; }
.catch-top-caption { flex: 0 0 240px; border-right: 1px solid #a1bbb42b; padding-right: 1.5rem; }
.catch-top-caption .catch-overline { color: var(--gold-2); margin-bottom: .45rem; }
.catch-top-caption h3 { font-size: 1.35rem; line-height: 1.3; }
.catch-top-caption > span:last-child { display: block; font-size: .72rem; margin-top: .5rem; color: #acbdbd; }
.catch-top-fish { display: flex; align-items: stretch; flex: 1; gap: .8rem; min-width: 0; }
.catch-top-fish button { flex: 1; min-width: 0; border: none; background: transparent; color: var(--foam); cursor: pointer; display: flex; flex-direction: column; align-items: center; font: 500 .78rem var(--font-body); padding: .4rem; border-radius: 3px; }
.catch-top-fish img { width: 180px; height: 82px; object-fit: contain; margin-bottom: .35rem; transition: transform .25s ease; filter: drop-shadow(0 5px 8px #0005); }
.catch-top-fish button:hover img { transform: translateY(-4px); }
.catch-calendar-head { display: flex; justify-content: space-between; gap: 1rem; align-items: end; margin-bottom: 1.1rem; scroll-margin-top: 105px; }
.catch-calendar-head .catch-overline { color: #806321; }
.catch-calendar-head p { font-size: .82rem; color: var(--paper-mist); margin-top: .3rem; }
.catch-legend { display: flex; flex-wrap: wrap; gap: 1.2rem; font-size: .72rem; }
.catch-legend > span { display: inline-flex; align-items: center; gap: .4rem; }
.catch-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.catch-dot--peak { background: #ae7b18; }.catch-dot--good { background: #397768; }.catch-dot--fair { background: #bcb094; }.catch-dot--low { background: #87949d; }
.catch-year { overflow-x: auto; border: 1px solid var(--catch-rule); border-radius: 5px; background: #fffdf542; scrollbar-color: #ac9974 #e8dfce; }
.catch-table { width: 100%; min-width: 1050px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.catch-table thead th { height: 49px; text-align: center; font: 500 .69rem var(--font-mono); text-transform: uppercase; color: var(--paper-mist); letter-spacing: .05em; background: #e9e1d0; border-bottom: 1px solid var(--catch-rule); }
.catch-table thead th:first-child { width: 290px; text-align: left; padding-left: 1.1rem; }
.catch-table th:first-child { position: sticky; left: 0; z-index: 2; background-color: #f4eddf; }
.catch-table tbody th, .catch-table tbody td { border-bottom: 1px solid var(--catch-rule); }
.catch-table tbody tr:last-child th, .catch-table tbody tr:last-child td { border-bottom: 0; }
.catch-table tbody td { text-align: center; padding: 0 4px; transition: background .2s; }
.catch-table .is-month { background: #d5a8481c; box-shadow: inset 1px 0 #b992432e, inset -1px 0 #b992432e; }
.catch-table thead .is-month { background: var(--paper-ink); color: var(--gold-2); box-shadow: none; }
.catch-table tbody tr:hover td { background-color: #fffdf5; }
.catch-table tbody tr:hover td.is-month { background-color: #ead4a6; }
.catch-species { display: grid; grid-template-columns: 116px 1fr 16px; align-items: center; gap: .6rem; min-height: 92px; color: var(--paper-ink); text-align: left; text-decoration: none; padding: .5rem .9rem; }
.catch-species img { width: 116px; height: 64px; object-fit: contain; transition: transform .22s; }
.catch-species:hover img { transform: translateX(-3px) scale(1.04); }
.catch-species strong { display: block; font-size: .82rem; line-height: 1.25; }
.catch-species small { display: block; font-size: .61rem; color: var(--paper-mist); font-weight: 400; margin-top: .3rem; line-height: 1.3; }
.catch-species-arrow { color: #886725; font-size: .95rem; font-weight: 400; }
.catch-rating { display: inline-block; width: 100%; max-width: 59px; padding: .35rem .15rem; border-radius: 3px; font: 600 .66rem/1.25 var(--font-body); }
.catch-rating--peak { color: #493309; background: #e4bd67; }
.catch-rating--good { color: #235045; background: #bcd2c5; }
.catch-rating--fair { color: #665535; background: #e5dbc3; }
.catch-rating--low { color: #53606b; background: #dce0df; }
.catch-conditions { font-size: .77rem; color: var(--paper-mist); margin-top: 1rem; max-width: 76ch; }
.catch-shortlist { position: relative; display: flex; align-items: center; gap: 1.7rem; margin-top: 2rem; border-top: 2px solid #ac8541; border-bottom: 1px solid var(--catch-rule); padding: 1.6rem 0 2rem; flex-wrap: wrap; }
.catch-shortlist-intro .catch-overline { color: #856625; margin-bottom: .3rem; }
.catch-shortlist-intro h3 { font-size: 1.15rem; }.catch-shortlist-intro h3 span { font: .7rem var(--font-mono); color: var(--paper-mist); margin-left: .5rem; }
.catch-selections { display: flex; gap: .6rem; flex: 1; flex-wrap: wrap; }
.catch-selections > p { font-size: .82rem; color: var(--paper-mist); }
.catch-selection { display: flex; align-items: center; gap: .3rem; padding: .3rem .35rem .3rem .6rem; background: #fffaf0; border: 1px solid var(--catch-rule); border-radius: 3px; font-size: .75rem; }
.catch-selection button { min-width: 30px; min-height: 34px; border: none; background: transparent; color: #6c5c40; cursor: pointer; font-size: 1rem; }
.catch-shortlist > .btn { font-size: .8rem; padding: .8rem 1.1rem; }
.catch-live { flex-basis: 100%; font-size: .76rem; line-height: 1.4; color: #6d5420; }
.catch-live:empty { display: none; }
.catch-month-list { display: grid; grid-template-columns: repeat(2,1fr); gap: .65rem; }
.catch-month-card { display: grid; grid-template-columns: 125px 1fr auto; align-items: center; gap: .8rem; text-decoration: none; padding: .75rem 1rem; background: #fffdf570; border: 1px solid var(--catch-rule); border-radius: 4px; color: var(--paper-ink); }
.catch-month-card img { width: 125px; height: 74px; object-fit: contain; transition: transform .2s; }
.catch-month-card:hover img { transform: translateX(-3px); }
.catch-month-card strong { display: block; font-size: .9rem; }.catch-month-card small { font-size: .7rem; color: var(--paper-mist); }
.catch-month-card .catch-rating { width: 48px; }
.catch-fallbacks { margin-top: 2rem; }
.catch-fallback-profile { border-top: 1px solid var(--catch-rule); padding: 1rem 0; scroll-margin-top: 100px; }
.catch-fallback-profile summary { cursor: pointer; font-weight: 700; }.catch-fallback-profile summary span { font-size: .75rem; color: var(--paper-mist); margin-left: 1rem; font-weight: 400; }
.catch-fallback-profile .catch-profile-copy { padding-top: 1rem; }
.catch-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem 2rem; margin: 1.6rem 0; }
.catch-facts dt { font: 500 .64rem var(--font-mono); text-transform: uppercase; letter-spacing: .09em; margin-bottom: .45rem; }
.catch-facts dd { font-size: .86rem; line-height: 1.65; }
.catch-guide :is(a,button,select):focus-visible { outline: 2px solid #825900; outline-offset: 4px; }

/* One native modal; the existing gallery keeps its own behavior. */
body.catch-modal-open { overflow: hidden; }
.catch-dialog { width: min(900px,calc(100% - 3rem)); max-height: min(92dvh,1000px); margin: auto; padding: 0; border: 1px solid #7c775954; border-radius: 8px; background: var(--ink-2); color: var(--foam); box-shadow: 0 40px 120px #0009; font-family: var(--font-body); overflow-y: auto; scrollbar-color: #50636b #071726; }
.catch-dialog::backdrop { background: #010811c9; backdrop-filter: blur(7px); }
.catch-dialog[open] { animation: catch-enter .25s ease-out; }
@keyframes catch-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.catch-dialog-shell { position: relative; }
.catch-dialog-bar { position: sticky; top: 0; z-index: 4; display: flex; justify-content: space-between; align-items: center; padding: .7rem 1.5rem; background: #071726f5; border-bottom: 1px solid var(--line); }
.catch-dialog-bar .catch-overline { color: var(--gold-2); }
.catch-icon-button { width: 40px; height: 40px; border: 1px solid #81959d45; border-radius: 50%; background: transparent; color: var(--foam); cursor: pointer; font-size: 1rem; }
.catch-dialog-art { position: relative; height: 260px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: radial-gradient(ellipse at 50% 65%,#405c593d,transparent 65%); }
.catch-dialog-art::after { content: ''; position: absolute; width: 430px; height: 430px; border: 1px solid #a3b6bd12; border-radius: 50%; top: -90px; pointer-events: none; }
.catch-art-word { position: absolute; font: 700 clamp(6rem,15vw,11rem)/1 var(--font-display); letter-spacing: .12em; color: #aec5d20a; pointer-events: none; }
.catch-dialog-art img { position: relative; z-index: 1; width: 80%; height: 215px; object-fit: contain; filter: drop-shadow(0 15px 18px #0007); }
.catch-art-caption { position: absolute; bottom: 8px; font: .57rem var(--font-mono); letter-spacing: .17em; color: #8ea7b0; text-transform: uppercase; }
.catch-dialog-content { padding: 1.6rem 2.6rem 1.3rem; }
.catch-profile-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; }
.catch-profile-heading .catch-overline { color: var(--gold-2); margin-bottom: .4rem; }
.catch-profile-heading h2, .catch-inquiry h2 { font-size: clamp(1.8rem,4vw,2.7rem); line-height: 1.15; color: var(--foam); }
.catch-alias { font-size: .78rem; color: var(--mist); margin-top: .35rem; }
.catch-month-badge { border-left: 1px solid var(--line-strong); padding-left: 1.2rem; text-align: right; flex-shrink: 0; }
.catch-month-badge small { display: block; font: .65rem var(--font-mono); margin-bottom: .5rem; color: var(--mist); }
.catch-month-badge .catch-rating { width: 65px; padding-block: .45rem; }
.catch-dialog [data-fish-intro] { font-size: .97rem; line-height: 1.7; color: #cfdae2; }
.catch-dialog .catch-facts { padding-top: 1.3rem; border-top: 1px solid var(--line); margin: 1.4rem 0; }
.catch-dialog .catch-facts dt { color: var(--gold-2); }.catch-dialog .catch-facts dd { color: #b6c7d5; font-size: .82rem; }
.catch-dialog .catch-season-copy { font-size: .8rem; color: #d7e1e6; margin-bottom: .8rem; }
.catch-mini-season { display: grid; grid-template-columns: repeat(12,1fr); gap: 4px; margin-bottom: 1.5rem; }
.catch-mini-month { text-align: center; padding: .5rem 2px; border: 1px solid transparent; border-radius: 3px; }
.catch-mini-month.is-month { border-color: var(--gold); }
.catch-mini-month small { display: block; color: var(--mist); font: .56rem var(--font-mono); margin-bottom: .45rem; text-transform: uppercase; }
.catch-mini-month .catch-rating { font-size: .57rem; padding: .3rem .1rem; }
.catch-profile-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.catch-profile-actions .btn { font-size: .82rem; padding: .85rem 1.1rem; flex: 1.2; }
.catch-secondary-button { font: 600 .8rem var(--font-body); padding: .85rem 1rem; border: 1px solid #a3b6bd50; color: var(--foam); background: transparent; border-radius: var(--radius-sm); cursor: pointer; flex: 1; }
.catch-secondary-button:hover { background: #ffffff08; }
.catch-dialog-status { font-size: .76rem; color: var(--gold-2); margin-top: .6rem; min-height: 1.3em; }
.catch-profile-nav { display: flex; justify-content: space-between; align-items: center; padding-top: .8rem; border-top: 1px solid var(--line); margin-top: .8rem; }
.catch-profile-nav button, .catch-back { min-height: 40px; border: 0; background: none; color: #c4d1da; font: .76rem var(--font-body); cursor: pointer; }
.catch-profile-nav span { font: .64rem var(--font-mono); color: var(--mist); }
.catch-inquiry { padding: 1rem 2.6rem 2rem; }
.catch-back { margin-bottom: 1rem; }.catch-inquiry > .catch-overline { color: var(--gold-2); margin-bottom: .6rem; }
.catch-inquiry-lede { color: #b6c7d5; font-size: .9rem; margin: 1rem 0 1.5rem; max-width: 55ch; }
.catch-target-fields { border: 1px solid var(--line-strong); padding: .9rem 1rem 1rem; margin-bottom: 1rem; border-radius: 5px; }
.catch-target-fields legend { padding: 0 .4rem; font-size: .78rem; color: #dce6eb; }.catch-target-fields legend span { color: var(--mist); font-size: .67rem; margin-left: .5rem; }
.catch-target-fields > div { display: flex; flex-wrap: wrap; gap: .45rem; }
.catch-target-option { position: relative; display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; padding: .4rem .6rem; min-height: 36px; background: #ffffff05; border: 1px solid var(--line); border-radius: 3px; color: #b6c7d5; font-size: .72rem; }
.catch-target-option:has(input:checked) { border-color: #d5a84899; background: #d5a84814; color: var(--gold-2); }
.catch-target-option input { accent-color: var(--gold); }
.catch-target-option:has(input:disabled) { opacity: .5; cursor: default; }
.catch-field { display: flex; flex-direction: column; gap: .4rem; min-width: 0; }
.catch-field > span { color: #d9e3eb; font-size: .7rem; font-weight: 600; }.catch-field em { color: #94a9ba; font-size: .65rem; font-weight: 400; font-style: normal; margin-left: .25rem; }
.catch-field :is(input,select,textarea) { width: 100%; background: #0e2537; border: 1px solid #70899b60; border-radius: 4px; color: var(--foam); font: .85rem/1.4 var(--font-body); padding: .75rem .85rem; min-height: 45px; }
.catch-field textarea { resize: vertical; min-height: 75px; }.catch-field option { background: #0e2537; }
.catch-field :is(input,textarea)::placeholder { color: #99adbb; opacity: 1; }
.catch-inquiry-month { max-width: 260px; margin-bottom: 1.2rem; }
.catch-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.2rem; }
.catch-field small { color: #ffc5b5; font-size: .72rem; }.catch-field small:empty { display: none; }
.catch-field [aria-invalid="true"] { border-color: #eaa890; }
.catch-submit { margin-top: 1.4rem; width: 100%; }
.catch-dialog button:disabled { opacity: .55; cursor: wait; }
.catch-form-status { color: var(--gold-2); margin-top: .8rem; font-size: .85rem; line-height: 1.55; }
.catch-form-status.is-error { color: #ffc5b5; }
.catch-inquiry-fine { color: #91a8b8; font-size: .72rem; line-height: 1.5; margin-top: .8rem; }
.catch-contact-options { display: flex; flex-wrap: wrap; gap: .6rem 1rem; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .75rem; }
.catch-contact-options span { color: var(--mist); }.catch-contact-options a { color: var(--gold-2); text-decoration: none; }
.catch-dialog :is(button,a,input,select,textarea):focus-visible { outline: 2px solid var(--gold-2); outline-offset: 3px; }
.catch-dialog h2:focus { outline: none; }
.catch-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width:1080px) { .catch-tools > p { display: none; }.catch-top-caption { flex-basis: 210px; }.catch-heading { gap: 2rem; }.catch-month-card { grid-template-columns: 95px 1fr auto; }.catch-month-card img { width: 95px; } }
@media (max-width:720px) {
  .catch-heading { grid-template-columns: 1fr; gap: 1.4rem; margin-bottom: 2rem; }.catch-heading .section-title { font-size: 2.25rem; }.catch-heading-note p { font-size: .94rem; }.catch-edition { font-size: .59rem; }
  .catch-tools { flex-wrap: wrap; gap: 1rem; }.catch-month-label { justify-content: space-between; width: 100%; }.catch-month-label select { width: 48%; }.catch-view-switch { width: 100%; margin-left: 0; }.catch-view-switch button { flex: 1; }
  .catch-top { flex-direction: column; align-items: stretch; gap: .8rem; padding: 1.2rem; margin-bottom: 1.8rem; }.catch-top-caption { flex-basis: auto; border: none; padding: 0; }.catch-top-caption h3 { font-size: 1.15rem; }.catch-top-caption > span:last-child { margin-top: .25rem; }.catch-top-fish { gap: .25rem; }.catch-top-fish button { font-size: .67rem; line-height: 1.25; }.catch-top-fish img { height: 65px; width: 100%; }
  .catch-calendar-head { flex-direction: column; align-items: start; gap: .8rem; }.catch-legend { gap: 1.15rem; }
  .catch-table { min-width: 940px; }.catch-table thead th:first-child { width: 172px; }.catch-species { grid-template-columns: 64px 1fr; gap: .4rem; padding: .5rem; min-height: 80px; }.catch-species img { width: 64px; height: 52px; }.catch-species strong { font-size: .72rem; }.catch-species small { font-size: .55rem; }.catch-species-arrow { display: none; }
  .catch-month-list { grid-template-columns: 1fr; }.catch-month-card { grid-template-columns: 95px 1fr auto; gap: .7rem; padding: .65rem .8rem; }.catch-month-card strong { font-size: .85rem; }.catch-month-card small { font-size: .63rem; }.catch-month-card img { height: 65px; }
  .catch-shortlist { flex-direction: column; align-items: stretch; gap: 1rem; padding-block: 1.3rem; }.catch-selections { flex: auto; }.catch-shortlist > .btn { width: 100%; }.catch-facts { grid-template-columns: 1fr; gap: 1rem; }
  .catch-dialog { width: calc(100% - 1rem); max-height: 95dvh; border-radius: 6px; }.catch-dialog-bar { padding: .5rem 1rem; }.catch-dialog-art { height: 195px; }.catch-dialog-art img { width: 92%; height: 164px; }.catch-art-caption { font-size: .48rem; }.catch-dialog-content { padding: 1.2rem 1.15rem; }.catch-profile-heading h2 { font-size: 1.85rem; }.catch-profile-heading { gap: .5rem; }.catch-month-badge { padding-left: .65rem; }.catch-month-badge small { font-size: .57rem; }.catch-dialog [data-fish-intro] { font-size: .88rem; }.catch-dialog .catch-facts { grid-template-columns: 1fr; }.catch-mini-season { grid-template-columns: repeat(6,1fr); }.catch-profile-actions { flex-direction: column; }.catch-profile-actions > * { width: 100%; }.catch-inquiry { padding: 1rem 1.15rem 1.4rem; }.catch-form-grid { grid-template-columns: 1fr; }.catch-inquiry-month { max-width: none; }.catch-inquiry h2 { font-size: 2rem; }
}
@media (prefers-reduced-motion:reduce) { .catch-guide *, .catch-dialog, .catch-dialog * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
