/* v5.9.7 The Balboa Local: slender "Got a lead?" tab on the right edge (tip box mode).
   The tab glides in slowly once the page is showing; tapping it slides the "Have a tip?" card out from the side. */
html body .tbl-lead-side{position:fixed;right:0;top:42%;z-index:99990;transition:top .35s ease-out;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;pointer-events:none}
html body .tbl-lead-side .tbl-side-tab{pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:8px;width:34px;margin:0;padding:10px 0 12px;border:0!important;border-radius:12px 0 0 12px!important;background:var(--tbl-navy,#0b3a5c)!important;color:#fff!important;box-shadow:-3px 4px 14px rgba(8,30,48,.28)!important;cursor:pointer;transform:translate3d(110%,0,0);transition:transform 1.4s cubic-bezier(.22,.8,.24,1),background .2s ease;-webkit-tap-highlight-color:transparent;line-height:1}
html body .tbl-lead-side.is-in .tbl-side-tab{transform:translate3d(0,0,0)}
html body .tbl-lead-side.is-open .tbl-side-tab{transform:translate3d(110%,0,0);transition-duration:.35s}
html body .tbl-lead-side .tbl-side-tab:hover,html body .tbl-lead-side .tbl-side-tab:focus-visible{background:#185d8e!important}
html body .tbl-lead-side .tbl-side-tab:focus-visible{outline:2px solid #fff;outline-offset:-4px}
html body .tbl-lead-side .tbl-side-tab svg{flex:0 0 auto;width:18px;height:18px}
html body .tbl-lead-side .tbl-side-label{writing-mode:vertical-rl;font:700 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.02em;white-space:nowrap}
/* the card */
html body .tbl-lead-side .tbl-side-panel{pointer-events:auto;position:fixed;right:0;top:50%;box-sizing:border-box;width:min(340px,calc(100vw - 24px));padding:16px 16px 14px;background:var(--tbl-navy,#0b3a5c);color:#fff;border-radius:18px 0 0 18px;box-shadow:-8px 10px 30px rgba(5,20,33,.35);transform:translate3d(105%,-50%,0);transition:transform .55s cubic-bezier(.22,.8,.24,1);text-align:left}
html body .tbl-lead-side .tbl-side-panel[hidden]{display:none!important}
html body .tbl-lead-side.is-open .tbl-side-panel{transform:translate3d(0,-50%,0)}
html body .tbl-lead-side .tbl-lead-h{margin:0 36px 10px 0!important;padding:0!important;font:800 18px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#fff!important;letter-spacing:-.01em!important;border:0!important;text-align:left!important}
html body .tbl-lead-side .tbl-lead-x{position:absolute;top:6px;right:6px;width:36px;height:36px;padding:0;border:0!important;background:transparent!important;color:#fff!important;font:400 26px/36px system-ui,sans-serif!important;text-align:center;cursor:pointer;border-radius:50%;box-shadow:none!important}
html body .tbl-lead-side .tbl-lead-x:hover,html body .tbl-lead-side .tbl-lead-x:focus-visible{background:rgba(255,255,255,.14)!important}
html body .tbl-lead-side .tbl-lead-form{margin:0}
html body .tbl-lead-side textarea{display:block;width:100%;box-sizing:border-box;height:96px;min-height:96px;max-height:180px;resize:none;border:0!important;border-radius:10px!important;padding:10px 12px!important;font:16px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#0b2c48!important;background:#fff!important;box-shadow:none!important;margin:0!important}
html body .tbl-lead-side textarea::placeholder{color:#5d7283;opacity:1}
html body .tbl-lead-side textarea:focus{outline:3px solid rgba(255,255,255,.4);outline-offset:1px}
html body .tbl-lead-side .tbl-lead-send{display:block;width:100%;margin:10px 0 0!important;min-height:44px;border:0!important;border-radius:999px!important;background:#ff6b57!important;color:#fff!important;font:800 16px/1 system-ui,-apple-system,"Segoe UI",sans-serif!important;cursor:pointer;box-shadow:none!important;padding:0 18px!important}
html body .tbl-lead-side .tbl-lead-send:hover{background:#ff846f!important}
html body .tbl-lead-side .tbl-lead-send[disabled]{opacity:.7;cursor:default}
html body .tbl-lead-side .tbl-lead-msg{margin:8px 0 0!important;font:600 14px/1.35 system-ui,sans-serif!important;color:#ffd2cc!important}
html body .tbl-lead-side .tbl-lead-msg:empty{display:none}
html body .tbl-lead-side .tbl-lead-thanks{margin:8px 0!important;font:600 16px/1.4 system-ui,sans-serif!important;color:#fff!important}
html body .tbl-lead-side .bl-honey{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
html body .tbl-lead-side .bl-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:782px){
 html body .tbl-lead-side{top:38%}
 html body .tbl-lead-side .tbl-side-tab{width:30px;padding:9px 0 10px;gap:7px}
 html body .tbl-lead-side .tbl-side-tab svg{width:16px;height:16px}
 html body .tbl-lead-side .tbl-side-label{font-size:12px}
}
@media print{html body .tbl-lead-side{display:none!important}}
@media (prefers-reduced-motion:reduce){html body .tbl-lead-side .tbl-side-tab,html body .tbl-lead-side .tbl-side-panel{transition-duration:.01s}}
/* v5.9.8 Surf check tab: shown once the header's surf links have moved into it */
html body .tbl-lead-side.tbl-side-surf{display:none}
html.tbl-surf-moved body .tbl-lead-side.tbl-side-surf{display:block}
html body .tbl-side-surf .tbl-side-tab .tbl-side-surfer{width:22px;height:13px;overflow:visible}
html body .tbl-side-surf .tbl-side-panel{width:min(300px,calc(100vw - 24px))}
html body .tbl-side-surf .tbl-surf-wx{margin:0 36px 12px 0!important;font:600 15px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#dbe9f3!important}
html body .tbl-side-surf .tbl-surf-wx:empty{display:none}
html body .tbl-side-surf .tbl-surf-links{display:flex;flex-direction:column;gap:8px}
html body .tbl-side-surf .tbl-surf-links a{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:0 16px;border-radius:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff!important;text-decoration:none!important;font:700 16px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif}
html body .tbl-side-surf .tbl-surf-links a:hover,html body .tbl-side-surf .tbl-surf-links a:focus-visible{background:rgba(255,255,255,.2)}
/* v5.9.8 phones: the tab is a little see-through while reading (solid again when touched or opened) */
@media (max-width:782px){html body .tbl-lead-side .tbl-side-tab{opacity:.62}html body .tbl-lead-side .tbl-side-tab:active,html body .tbl-lead-side .tbl-side-tab:focus-visible{opacity:1}}
/* v5.9.8 a thin orange band around the Surf check tab so it stands out from all the blue */
html body .tbl-side-surf .tbl-side-tab.tbl-side-tab{border:2px solid #ff6b57!important;border-right:0!important}
/* v5.9.8 a thin orange band around the Surf check tab so it stands out from all the blue */
html body .tbl-side-surf .tbl-side-tab.tbl-side-tab{border:2px solid #ff6b57!important;border-right:0!important}
/* v5.9.8 Instagram tab (story pages): same slim tab with the thin orange band, a small follow card */
html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{border:2px solid #ff6b57!important;border-right:0!important}
html body .tbl-side-ig .tbl-side-panel{width:min(300px,calc(100vw - 24px))}
html body .tbl-side-ig .tbl-ig-text{margin:0 0 12px!important;font:500 15px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#dbe9f3!important}
html body .tbl-side-ig .tbl-ig-btn,html body .tbl-side-ig .tbl-ig-btn:visited{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:999px;background:#ff6b57;color:#fff!important;text-decoration:none!important;font:800 16px/1 system-ui,-apple-system,"Segoe UI",sans-serif}
html body .tbl-side-ig .tbl-ig-btn:hover{background:#ff846f}
/* v5.9.9 the cards, reworked: a light card that stands out from the navy page, a slim button */
html body .tbl-lead-side .tbl-side-panel.tbl-side-panel{background:#fff;color:#10283a;width:min(292px,calc(100vw - 24px));padding:16px 16px 14px;border-radius:16px 0 0 16px;border:1px solid #dbe4ec;border-right:0;border-left:4px solid #ff6b57;box-shadow:-10px 14px 36px rgba(5,20,33,.28)}
html body .tbl-lead-side .tbl-card-head{display:flex;align-items:center;gap:11px;margin:0 30px 12px 0}
html body .tbl-lead-side .tbl-card-ico{flex:0 0 auto;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#0b3a5c;color:#fff;font-size:20px;line-height:1}
html body .tbl-lead-side .tbl-lead-h.tbl-lead-h{margin:0!important;color:#0b2c48!important;font:800 17px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif!important}
html body .tbl-lead-side .tbl-card-handle{display:block;margin-top:2px;color:#5d7283;font:600 13px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif}
html body .tbl-lead-side .tbl-lead-x.tbl-lead-x{top:8px;right:6px;width:32px;height:32px;color:#5d7283!important;font-size:24px!important;line-height:32px!important}
html body .tbl-lead-side .tbl-lead-x.tbl-lead-x:hover{background:#eef3f7!important;color:#0b2c48!important}
html body .tbl-side-ig .tbl-ig-text.tbl-ig-text{margin:0 0 12px!important;color:#33505f!important;font:500 14.5px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif!important}
html body .tbl-side-ig .tbl-ig-btn,html body .tbl-side-ig .tbl-ig-btn:visited{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 18px;border-radius:999px;background:#0b3a5c;color:#fff!important;font:700 14.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none!important;box-shadow:none;outline:none}
html body .tbl-side-ig .tbl-ig-btn:hover{background:#185d8e}
html body .tbl-side-ig .tbl-ig-btn:focus-visible,html body .tbl-side-surf .tbl-surf-links a:focus-visible{outline:2px solid #ff6b57;outline-offset:2px}
html body .tbl-side-surf .tbl-surf-wx.tbl-surf-wx{margin:-4px 0 10px!important;color:#33505f!important;font:600 14px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important}
html body .tbl-side-surf .tbl-surf-links{gap:6px}
html body .tbl-side-surf .tbl-surf-links a{min-height:40px;padding:0 14px;border-radius:10px;background:#f3f7fa;border:1px solid #dbe4ec;color:#0b2c48!important;font-size:15px}
html body .tbl-side-surf .tbl-surf-links a:hover{background:#e6eff6}
/* ===== v5.9.9 Instagram: slim badge tab -> white pill "Newport, in your feed. >" with the badge; 3px orange line on both ===== */
html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{width:46px;padding:16px 0 12px;gap:0;border:3px solid #ff6b57!important;border-right:0!important;border-radius:16px 0 0 16px!important;background:#0b3a5c!important}
html body .tbl-side-ig .tbl-ig-badge{position:relative;display:grid;place-items:center;width:32px;height:32px;margin-top:10px;border-radius:9px;color:#fff}
html body .tbl-side-ig .tbl-ig-badge .tbl-ig-cam{width:30px;height:30px}
html body .tbl-side-ig .tbl-ig-img{width:100%;height:100%;object-fit:contain;display:block}
html body .tbl-side-ig .tbl-ig-surfer{position:absolute;left:50%;bottom:calc(100% - 7px);width:34px;height:19px;transform:translateX(-46%);overflow:visible;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))}
/* the pill */
html body .tbl-side-ig .tbl-side-panel.tbl-ig-pill{width:auto;max-width:calc(100vw - 20px);padding:0;right:10px;background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
html body .tbl-side-ig .tbl-ig-link,html body .tbl-side-ig .tbl-ig-link:visited{position:relative;display:flex;align-items:center;gap:12px;padding:10px 6px 10px 24px;background:#fff;border:3px solid #ff6b57;border-radius:999px;box-shadow:0 12px 30px rgba(5,20,33,.32);text-decoration:none!important;color:#0b2c48!important;-webkit-tap-highlight-color:transparent;transition:transform .15s ease,box-shadow .15s ease}
html body .tbl-side-ig .tbl-ig-link:hover{transform:translateY(-1px);box-shadow:0 16px 34px rgba(5,20,33,.36)}
html body .tbl-side-ig .tbl-ig-link:active{transform:scale(.98)}
html body .tbl-side-ig .tbl-ig-link:focus-visible{outline:3px solid #0b3a5c;outline-offset:3px}
html body .tbl-side-ig .tbl-ig-words{display:flex;flex-direction:column;min-width:0}
html body .tbl-side-ig .tbl-ig-words b{font:700 16.5px/1.22 system-ui,-apple-system,"Segoe UI",sans-serif;color:#0b2c48;white-space:nowrap}
html body .tbl-side-ig .tbl-ig-chev{font:400 34px/1 system-ui,sans-serif;color:#0b2c48;margin:-4px 2px 0 6px}
html body .tbl-side-ig .tbl-ig-circle{position:relative;flex:0 0 auto;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#0b3a5c;color:#fff;box-shadow:0 3px 10px rgba(5,20,33,.25)}
html body .tbl-side-ig .tbl-ig-circle .tbl-ig-cam{width:34px;height:34px}
html body .tbl-side-ig .tbl-ig-circle.has-img{background:#fff;overflow:visible}
html body .tbl-side-ig .tbl-ig-circle.has-img .tbl-ig-img{width:64px;height:64px;border-radius:50%;object-fit:cover}
html body .tbl-side-ig .tbl-ig-circle .tbl-ig-surfer{width:46px;height:26px;bottom:calc(100% - 9px)}
html body .tbl-side-ig .tbl-ig-pill .tbl-lead-x.tbl-lead-x{top:-12px;left:-10px;right:auto;width:28px;height:28px;border-radius:50%;background:#0b3a5c!important;color:#fff!important;font-size:18px!important;line-height:28px!important;box-shadow:0 2px 6px rgba(0,0,0,.3);border:2px solid #fff!important}
html body .tbl-side-ig .tbl-ig-pill .tbl-lead-x.tbl-lead-x:hover{background:#185d8e!important;color:#fff!important}
@media (max-width:782px){html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{width:42px}html body .tbl-side-ig .tbl-ig-words b{font-size:15.5px}html body .tbl-side-ig .tbl-ig-circle{width:58px;height:58px}html body .tbl-side-ig .tbl-ig-circle.has-img .tbl-ig-img{width:58px;height:58px}}
/* on the navy tab the surfer is drawn in white so he shows */
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer{width:40px;height:22px;bottom:calc(100% - 6px)}
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer path:last-child{stroke:#fff}
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer circle{fill:#fff;stroke:none}
html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{padding-top:22px}
/* v5.9.9 the pill, half as wide: three short lines, right-aligned, tucked against the arrow */
html body .tbl-side-ig .tbl-ig-link,html body .tbl-side-ig .tbl-ig-link:visited{gap:4px;padding:8px 5px 8px 14px}
html body .tbl-side-ig .tbl-ig-words{align-items:flex-end;text-align:right}
html body .tbl-side-ig .tbl-ig-words b{font:800 13.5px/1.12 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.01em}
html body .tbl-side-ig .tbl-ig-chev{font-size:28px;margin:-3px 2px 0 1px}
html body .tbl-side-ig .tbl-ig-circle,html body .tbl-side-ig .tbl-ig-circle.has-img .tbl-ig-img{width:58px;height:58px}
html body .tbl-side-ig .tbl-ig-circle .tbl-ig-cam{width:30px;height:30px}
@media (max-width:782px){html body .tbl-side-ig .tbl-ig-words b{font-size:13px}html body .tbl-side-ig .tbl-ig-circle,html body .tbl-side-ig .tbl-ig-circle.has-img .tbl-ig-img{width:54px;height:54px}}
/* v5.9.9 phones: only the tab's background is see-through; the camera (and the surfer) stay fully solid */
@media (max-width:782px){html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{opacity:1;background:rgba(11,58,92,.58)!important;border-color:rgba(255,107,87,.8)!important;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
 html body .tbl-side-ig .tbl-side-tab.tbl-side-tab:active,html body .tbl-side-ig .tbl-side-tab.tbl-side-tab:focus-visible{background:#0b3a5c!important}}
/* v5.9.11 the camera icon: a rounded square, shown whole (not cut into a circle) */
html body .tbl-side-ig .tbl-ig-badge.has-img{width:34px;height:34px;border-radius:8px}
html body .tbl-side-ig .tbl-ig-badge.has-img .tbl-ig-img{border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.35)}
html body .tbl-side-ig .tbl-ig-circle.has-img{background:#0b3a5c}
html body .tbl-side-ig .tbl-ig-circle.has-img .tbl-ig-img{width:38px!important;height:38px!important;border-radius:9px!important;object-fit:contain!important;box-shadow:0 1px 3px rgba(0,0,0,.35)}
/* v5.9.11 the Instagram pill matches the side tab: slate-blue background, orange words (a touch lighter so they read) */
html body .tbl-side-ig .tbl-ig-link.tbl-ig-link,html body .tbl-side-ig .tbl-ig-link.tbl-ig-link:visited{background:#2b5674;color:#ff8f78!important}
html body .tbl-side-ig .tbl-ig-words b{color:#ff8f78!important;text-shadow:0 1px 1px rgba(0,0,0,.25)}
html body .tbl-side-ig .tbl-ig-chev{color:#ff8f78!important}
html body .tbl-side-ig .tbl-ig-circle.has-img{background:#0b3a5c;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 3px 10px rgba(5,20,33,.3)}
/* v5.9.11 the surfer rides on top of the pill's orange edge (above the camera), not on the camera itself */
html body .tbl-side-ig .tbl-ig-circle .tbl-ig-surfer{width:48px;height:27px;bottom:calc(100% + 8px);left:44%;filter:drop-shadow(0 1px 1px rgba(255,255,255,.7))}
/* v5.9.11 on the side tab too, the surfer rides on top of the tab's orange edge */
html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{padding-top:12px;overflow:visible}
html body .tbl-side-ig .tbl-ig-badge{margin-top:0}
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer{width:40px;height:22px;bottom:calc(100% + 13px);left:46%;filter:drop-shadow(0 1px 1px rgba(255,255,255,.7))}
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer path:last-child{stroke:#0b3a5c}
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer circle{fill:#fff;stroke:#0b3a5c;stroke-width:1.5}
/* v5.10.27 the Instagram tab tucks a little further off the right edge (camera just peeks out),
   and the surfer on it faces left, with the right side of his wave going off-screen. Phones and computers. */
html body .tbl-side-ig .tbl-side-tab.tbl-side-tab{translate:9px 0}   /* separate from transform, so the slide in/out still works */
html body .tbl-side-ig .tbl-side-tab .tbl-ig-surfer{transform:translateX(-30%) scaleX(-1)!important}

/* ===== 1.2.3 SURF REPORT side tab: bright blue (#3550d6) with the site's coral edge, "Surf / Report" read across,
   the surfer riding on top; same size as the Instagram tab. The card lists the Newport breaks (Surfline links). ===== */
html body .tbl-side-surfrep .tbl-side-tab.tbl-side-tab{position:relative;width:46px;padding:12px 0 12px;gap:0;overflow:visible;border:3px solid #ea725a!important;border-right:0!important;border-radius:16px 0 0 16px!important;background:#3550d6!important}
html body .tbl-side-surfrep .tbl-side-tab.tbl-side-tab:hover,html body .tbl-side-surfrep .tbl-side-tab.tbl-side-tab:focus-visible{background:#2a43bd!important}
html body .tbl-side-surfrep .tbl-sr-surfer{position:absolute;left:46%;bottom:calc(100% + 11px);width:40px!important;height:22px!important;transform:translateX(-50%);overflow:visible;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(255,255,255,.7))}
html body .tbl-side-surfrep .tbl-sr-tabword{display:flex;flex-direction:column;align-items:center;gap:3px;color:#fff;font:900 11px/1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.04em;text-transform:uppercase}
html body .tbl-side-surfrep .tbl-sr-tabword b{font-weight:900;font-size:12.5px}
html body .tbl-side-surfrep .tbl-sr-tabword i{font-style:normal;font-weight:700;font-size:8.5px;letter-spacing:.08em;opacity:.92}
@media (max-width:782px){html body .tbl-side-surfrep .tbl-side-tab.tbl-side-tab{width:42px}}
/* the card */
html body .tbl-side-surfrep .tbl-side-panel{width:min(310px,calc(100vw - 24px));background:#0b3a5c;border:1px solid #5a91ac;border-right:0;padding:16px 16px 14px}
html body .tbl-side-surfrep .tbl-lead-h{margin-bottom:2px!important}
html body .tbl-side-surfrep .tbl-sr-sub{margin:0 36px 10px 0!important;font:500 13px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#a9cde3!important}
html body .tbl-side-surfrep .tbl-sr-list{display:flex;flex-direction:column;border-top:1px solid #5a91ac}
html body .tbl-side-surfrep .tbl-sr-spot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 2px;border-bottom:1px solid #5a91ac;color:#fff!important;text-decoration:none!important}
html body .tbl-side-surfrep .tbl-sr-spot b{display:block;font:700 16px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif}
html body .tbl-side-surfrep .tbl-sr-spot small{display:block;margin-top:2px;font:400 12.5px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;color:#a9cde3}
html body .tbl-side-surfrep .tbl-sr-go{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#3550d6;color:#fff;font:700 15px/1 system-ui,sans-serif;transition:transform .15s ease,background .15s ease}
html body .tbl-side-surfrep .tbl-sr-spot:hover .tbl-sr-go,html body .tbl-side-surfrep .tbl-sr-spot:focus-visible .tbl-sr-go{background:#ea725a;transform:translate(2px,-2px)}
html body .tbl-side-surfrep .tbl-sr-spot:focus-visible{outline:2px solid #8fd0f5;outline-offset:2px;border-radius:6px}
html body .tbl-side-surfrep .tbl-sr-all{display:inline-block;margin-top:12px;color:#8fd0f5!important;font:700 12.5px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none!important}
html body .tbl-side-surfrep .tbl-sr-all:hover{text-decoration:underline!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{background:#0b3a5c!important;color:#fff!important;border:1px solid #5a91ac!important;border-right:0!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-h{color:#fff!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-x{color:#fff!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot b{color:#fff!important}

/* ===== 1.2.4 Surf Report: full color on phones too, and each break is an obvious button ===== */
@media (max-width:782px){html body .tbl-lead-side.tbl-side-surfrep .tbl-side-tab.tbl-side-tab{opacity:1!important;background:#3550d6!important;-webkit-backdrop-filter:none;backdrop-filter:none}}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-wave{font-size:19px;margin-right:2px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-list{gap:7px;border-top:0}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot{padding:9px 10px 9px 12px;border:1px solid #5a91ac;border-radius:12px;background:rgba(255,255,255,.07);transition:background .15s ease,border-color .15s ease,transform .1s ease;-webkit-tap-highlight-color:transparent}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot:hover,html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot:focus-visible{background:rgba(53,80,214,.35);border-color:#8fd0f5}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot:active{transform:scale(.98);background:rgba(53,80,214,.5)}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot b{font-size:15.5px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot small{font-size:12px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-go{width:auto;height:auto;padding:6px 9px;border-radius:999px;font:800 10.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.03em;white-space:nowrap;gap:3px;display:inline-flex;align-items:center}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-go i{font-style:normal;font-size:12px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot:hover .tbl-sr-go,html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot:focus-visible .tbl-sr-go{transform:none;background:#ea725a}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-sub{margin-bottom:10px!important}
@media (max-width:782px){html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{padding:14px 12px 12px}html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot small{display:none}html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot{padding:10px 10px 10px 12px}}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-ft{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:999px;background:rgba(143,208,245,.16);color:#bfe6fb;font:700 11.5px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;font-style:normal;vertical-align:2px;white-space:nowrap}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-ft[hidden]{display:none}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-note{margin:9px 0 0!important;font:400 11px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif!important;color:#8fb6cc!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-note[hidden]{display:none}
html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{top:50%!important;max-height:calc(100vh - 32px);overflow:auto}   /* 1.2.4 always opens in the middle of the screen, wherever the tab is */
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-ft{display:block;width:max-content;margin:4px 0 0}

/* ===== 1.2.5 Surf Report tighter: no descriptions, slimmer buttons, tighter card, bright red wave sizes, clear round X ===== */
html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{width:min(268px,calc(100vw - 24px));padding:12px 12px 11px!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-h{margin:0 36px 1px 0!important;font-size:17px!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-sub{margin:0 36px 8px 0!important;font-size:12.5px!important;line-height:1.3!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-list{gap:6px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot{padding:7px 8px 7px 11px!important;border-radius:10px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot b{font-size:15px;line-height:1.15}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-ft{margin:3px 0 0;padding:0;background:none;color:#ff4f45!important;font:800 13px/1.15 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.01em;text-shadow:0 0 10px rgba(255,79,69,.25)}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-go{padding:5px 8px;font-size:10px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-note{margin-top:7px!important;font-size:10.5px!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-all{margin-top:6px;font-size:12px}
html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-x{top:8px!important;right:8px!important;width:30px!important;height:30px!important;font-size:21px!important;line-height:30px!important;background:rgba(255,255,255,.12)!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-x:hover,html body .tbl-lead-side.tbl-side-surfrep .tbl-lead-x:focus-visible{background:#ea725a!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{width:min(286px,calc(100vw - 20px))}html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-spot b{white-space:nowrap}

/* ===== 1.2.9 Surf Report: wave sizes in bright green, and the card flips out of the right edge like a door swinging open
   (same feel as the tabs and menus), then the breaks drop in ===== */
html body .tbl-lead-side.tbl-side-surfrep .tbl-sr-ft{color:#4ee08a!important;text-shadow:0 0 10px rgba(78,224,138,.25)!important}
html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{transform-origin:100% 50%;transform:translate3d(0,-50%,0) perspective(900px) rotateY(-92deg);opacity:0;transition:transform .34s cubic-bezier(.55,0,1,.6),opacity .2s ease .14s}
html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-side-panel.tbl-side-panel{transform:translate3d(0,-50%,0) perspective(900px) rotateY(0);opacity:1;transition:transform .85s cubic-bezier(.2,1.25,.35,1) .12s,opacity .15s ease .12s}
@keyframes tbl-sr-row{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-sr-spot{animation:tbl-sr-row .3s ease-out both}
html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-sr-spot:nth-child(1){animation-delay:.55s}
html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-sr-spot:nth-child(2){animation-delay:.62s}
html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-sr-spot:nth-child(3){animation-delay:.69s}
@media (prefers-reduced-motion:reduce){html body .tbl-lead-side.tbl-side-surfrep .tbl-side-panel.tbl-side-panel{transition:opacity .2s ease!important;transform:translate3d(0,-50%,0)!important}html body .tbl-lead-side.tbl-side-surfrep.is-open .tbl-sr-spot{animation:none}}

/* 1.2.53 Surf Report tab: the surfer rides LEFT, onto the page (wave on the right, surfer on the left) */
html body .tbl-side-surfrep .tbl-sr-surfer{transform:translateX(-50%) scaleX(-1)!important}
