/* Public design system. All rules are scoped so shared admin views keep their UI. */
@font-face { font-family: 'Capturas Inter'; src: url('/fonts/Inter-Regular.otf') format('opentype'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: 'Capturas Inter'; src: url('/fonts/Inter-Bold.otf') format('opentype'); font-style: normal; font-weight: 600 900; font-display: swap; }
.cp-public { --ocean: #061827; --ink: #102c3d; --accent: #087f7a; --cyan: #16b8b0; --line: #dce6eb; --paper: #f4f8fa; font-family: 'Capturas Inter', ui-sans-serif, system-ui, sans-serif; background: var(--paper); color: var(--ink); }
.cp-public ::selection { background: #b2eee8; color: #061827; }
.cp-public :where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #0d9488; outline-offset: 4px; }
.cp-public :where(h1,h2,h3) { text-wrap: balance; }
.cp-public :where(p,li) { text-wrap: pretty; }
.cp-public .cp-site-main { min-width: 0; }
.cp-public .cp-site-main > :where(div,section) { min-width: 0; }
.cp-public .cp-site-main:not(.w-full) { max-width: 1360px; padding-top: 32px; }
.cp-skip-link { position: fixed; top: 12px; left: 12px; z-index: 200; transform: translateY(-160%); background: #fff; color: #061827; padding: 14px 20px; border-radius: 8px; }
.cp-skip-link:focus { transform: none; }
.cp-public .cp-site-header:not(.cp-home-header) { position: relative; z-index: 50; background: #061827; border-bottom: 1px solid #244554; color: #fff; }
.cp-public .cp-site-header nav { max-width: 1360px; padding-block: 20px; }
.cp-public .cp-site-header nav img { width: min(270px, 58vw) !important; height: auto !important; max-width: 100% !important; filter: brightness(0) invert(1); }
.cp-public .cp-site-header nav > div:first-child > a { min-width: 0; }
.cp-public .cp-site-header nav ul { color: #d9e2e8; gap: 3px; }
.cp-public .cp-site-header nav ul a { display: block; padding: 10px 13px; border-radius: 5px; font-size: 12px; letter-spacing: .015em; }
.cp-public .cp-site-header nav ul a:hover { color: #fff; background: #ffffff12; }
.cp-public .cp-site-header nav a[aria-current="page"] { background: #16b8b01c; color: #7fe8df; box-shadow: inset 0 -2px #16b8b0; }
.cp-public .cp-site-header nav button { min-width: 44px; min-height: 44px; flex-shrink: 0; }
.cp-public .cp-site-header nav button:hover { background: #ffffff19; }
.cp-public .cp-site-header nav > div[x-show] { color: #102c3d; box-shadow: 0 20px 60px #0003; }
.cp-public .cp-dev-info { color: #fef3c7; font: 11px ui-monospace, monospace; }
.cp-public .cp-dev-info summary { cursor: pointer; padding-block: 6px; }
.cp-noscript-nav { display: flex; flex-wrap: wrap; gap: 16px; color: #fff; }
.cp-public .cp-page-hero { isolation: isolate; position: relative; overflow: hidden; background: radial-gradient(ellipse at 90% 0, #14778166, transparent 55%), linear-gradient(125deg, #061827, #0b2942); color: #fff; border: 1px solid #274958; border-radius: 24px; margin-bottom: 36px; box-shadow: 0 24px 60px #06233412; }
.cp-public .cp-page-hero::before { content: ''; pointer-events: none; position: absolute; inset: 0; z-index: -1; opacity: .16; background-image: linear-gradient(#77cbd81f 1px, transparent 1px), linear-gradient(90deg,#77cbd81f 1px,transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(100deg,transparent,#000); }
.cp-public .cp-page-hero > .absolute.-z-10 { display: none; }
.cp-public .cp-page-hero h1 { font-size: clamp(32px, 4.2vw, 64px); line-height: 1.08; letter-spacing: -.045em; font-weight: 800; }
.cp-public .cp-page-hero h1 + p { line-height: 1.75; }
.cp-public .cp-page-hero > :where(div):not(.absolute) { position: relative; }
.cp-public .cp-page-hero :where(a,button).bg-white { color: #061827; background: #7ee7de; border-radius: 7px; }
.cp-public .cp-page-hero :where(a,button).bg-slate-900 { background: #ffffff0f; border: 1px solid #ffffff4d; border-radius: 7px; }
.cp-public .cp-public-section { scroll-margin-top: 24px; }
.cp-public .cp-public-section h2 { letter-spacing: -.035em; line-height: 1.18; }
.cp-public .cp-public-section:not(.cp-page-hero) > :where(h2,div > h2) { text-wrap: balance; }
.cp-public .cp-section-kicker { color: #087f7a; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; font-weight: 800; margin-bottom: 14px; }
.cp-public .cp-page-hero .cp-section-kicker { color: #7ee7de; }
.cp-public .cp-editorial-card { border-radius: 18px; border: 1px solid var(--line); box-shadow: 0 6px 22px #15354707; transition: transform .25s, box-shadow .25s, border-color .25s; }
.cp-public .cp-editorial-card:hover { transform: translateY(-5px); border-color: #8ac9c4; box-shadow: 0 20px 42px #15354712; }
.cp-public .cp-editorial-card :where(h2,h3) { letter-spacing: -.025em; }
.cp-public .cp-editorial-card :where(a).bg-slate-900 { background: #0b2942; border-radius: 7px; min-height: 44px; }
.cp-public .cp-editorial-card :where(a).bg-slate-900:hover { background: #087f7a; }
.cp-public .cp-public-section.bg-white { border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 8px 30px #15354705; }
.cp-public .cp-disclosure { border: 1px solid var(--line); border-radius: 14px; box-shadow: none; transition: border-color .2s; }
.cp-public .cp-disclosure[open] { border-color: #54aaa4; background: #f2fbf9; }
.cp-public .cp-disclosure summary { min-height: 32px; line-height: 1.5; }
.cp-public :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),select,textarea) { font-family: inherit; font-size: 16px; border-radius: 8px; }
.cp-public :where(input,select) { min-height: 44px; }
.cp-public :where(input[type="checkbox"],input[type="radio"]) { min-height: auto; accent-color: #087f7a; }
.cp-public :where(button[type="submit"],a.bg-sky-600,a.bg-cyan-300) { min-height: 44px; border-radius: 8px; }
.cp-public .cp-contact-intro { border-top: 3px solid #16b8b0; background: radial-gradient(circle at 100% 0,#b8eeea55,transparent 50%),#fff; box-shadow: 0 20px 70px #082c3c0a; }
.cp-public .cp-contact-intro h1 { font-size: clamp(32px, 4.5vw, 62px); letter-spacing: -.05em; max-width: 800px; }
.cp-public .cp-contact-intro a { overflow-wrap: anywhere; }
.cp-public .cp-home-page { background: var(--paper); }
.cp-public .cp-explore-tools { max-width: 1360px; margin: 0 auto; padding: 80px 32px; }
.cp-public .cp-explore-intro { display: grid; grid-template-columns: 1.1fr 1fr; gap: 18px 64px; align-items: end; margin-bottom: 36px; }
.cp-public .cp-explore-intro .cp-section-kicker { grid-column: 1 / -1; margin: 0; }
.cp-public .cp-explore-intro h2 { font-size: clamp(32px, 3.7vw, 52px); letter-spacing: -.045em; line-height: 1.1; font-weight: 800; }
.cp-public .cp-explore-intro > p:last-child { max-width: 420px; color: #526c7b; font-size: 15px; line-height: 1.8; }
.cp-public .cp-tools-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.cp-public .cp-tool-card { position: relative; overflow: hidden; border: 1px solid #284b5a; background: radial-gradient(circle at 100% 100%,#0d6a6a45,transparent 65%),#0b2437; color: #fff; border-radius: 18px; padding: 28px; transition: transform .25s,border-color .25s; }
.cp-public .cp-tool-card:hover { transform: translateY(-5px); border-color: #16b8b0; }
.cp-public .cp-tool-index { display: flex; justify-content: space-between; gap: 16px; color: #a8c4ce; letter-spacing: .12em; font-size: 9px; }
.cp-public .cp-tool-icon { display: block; margin: 32px 0 20px; width: 30px; height: 30px; color: #64ddd2; }
.cp-public .cp-tool-card h3 { font-size: 24px; letter-spacing: -.035em; font-weight: 700; }
.cp-public .cp-tool-card p { min-height: 72px; margin-top: 12px; font-size: 14px; line-height: 1.8; color: #bacdd5; }
.cp-public .cp-tool-link { display: flex; justify-content: space-between; border-top: 1px solid #ffffff20; padding-top: 20px; margin-top: 24px; font-size: 12px; font-weight: 700; color: #88e5db; }
.cp-public .cp-home-page > .cp-public-section:not(.sr-only) { padding-top: clamp(48px, 6vw, 88px); padding-bottom: clamp(48px, 6vw, 88px); animation: none; }
.cp-public .cp-home-page .cp-public-section > div > div > h2, .cp-public .cp-home-page .cp-public-section > div > h2 { font-size: clamp(28px, 3.4vw, 46px); }
.cp-public .cp-home-page .cp-card { border-radius: 18px; box-shadow: 0 8px 28px #16394708; }
.cp-public .cp-home-page .cp-tide-feature { border-radius: 24px; border: 1px solid #2b6370; background: radial-gradient(ellipse at 95% 0,#128f8b44,transparent 65%),#061827; }
.cp-public .cp-site-footer { position: relative; background: #061827; margin-top: 72px; border-top: 1px solid #32515a; }
.cp-public .cp-site-footer::before { content: ''; position: absolute; top: -1px; left: 8%; width: 24%; height: 2px; background: linear-gradient(90deg,#16b8b0,transparent); }
.cp-public .cp-site-footer h3 { letter-spacing: -.02em; }
.cp-public .cp-site-footer a:hover { color: #7ee7de; }
.cp-public .cp-site-footer .rounded-3xl { border-radius: 16px; }
.cp-public .tide-premium-card { border-radius: 20px; box-shadow: 0 10px 36px #082f4910; }
.cp-public .tide-section-dark, .cp-public .radar-shell { background: radial-gradient(ellipse at 90% 0,#14778155,transparent 60%),linear-gradient(125deg,#061827,#0b2942); }
.cp-public .radar-card { border-radius: 18px; border-color: #76d4cb3b; }
.cp-public .cp-legacy-tides { background: var(--paper); gap: 20px; padding: 20px; }
.cp-public .cp-legacy-tides > aside { flex-shrink: 0; border-radius: 16px; box-shadow: 0 4px 24px #082f4910; }
.cp-public .cp-legacy-tides > div { min-width: 0; }
.cp-public .cp-legacy-tides > div > div:first-child { border-radius: 14px; flex-wrap: wrap; gap: 12px; }
.cp-public .cp-site-main table { border-collapse: collapse; }
.cp-public .cp-site-main th { font-size: 11px; letter-spacing: .04em; }
.cp-public .cp-site-main td { font-variant-numeric: tabular-nums; }
.cp-public .cp-site-main tbody tr { border-bottom: 1px solid #e1e9ee; }
.cp-public .cp-site-main tbody tr:last-child { border-bottom: 0; }
@keyframes cpPanelEntrance { from { transform: translateY(12px); } to { transform: none; } }
@media (prefers-reduced-motion: no-preference) { .cp-public .cp-entered { animation: cpPanelEntrance .5s ease-out; } }
@media (max-width: 900px) { .cp-public .cp-site-header nav ul a { padding-inline: 8px; } .cp-public .cp-site-header nav img { width: min(220px,58vw) !important; } }
@media (max-width: 767px) {
 .cp-public .cp-explore-tools { padding: 48px 24px; }
 .cp-public .cp-explore-intro, .cp-public .cp-tools-grid { grid-template-columns: 1fr; gap: 20px; }
 .cp-public .cp-tool-card p { min-height: 0; }
 .cp-public .cp-site-main:not(.w-full) { padding-inline: 16px; padding-top: 20px; }
 .cp-public .cp-page-hero { border-radius: 16px; margin-bottom: 24px; }
 .cp-public .cp-page-hero.h-\[420px\] { height: auto; min-height: 480px; }
 .cp-public .cp-legacy-tides { flex-direction: column; padding: 12px; }
 .cp-public .cp-legacy-tides > aside { width: 100%; }
 .cp-public .cp-legacy-tides > aside nav { display: flex; flex-wrap: wrap; gap: 8px; }
 .cp-public .cp-site-footer { margin-top: 40px; }
}
@media (prefers-reduced-motion: reduce) { .cp-public .cp-editorial-card:hover, .cp-public .cp-tool-card:hover { transform: none; } .cp-public *, .cp-public *::before, .cp-public *::after { scroll-behavior: auto !important; } }
@media print { .cp-public .cp-site-header, .cp-public .cp-site-footer, .cp-skip-link { display: none; } .cp-public { background: white; color: black; } }
