@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');

:root { --tide-ink:#031a23; --tide-deep:#052c37; --tide-aqua:#52f0d0; --tide-coral:#ff6b5f; --tide-mist:#dffbf5; }
html { scroll-behavior:smooth; scrollbar-width:none; }
html::-webkit-scrollbar, body::-webkit-scrollbar, .shelf-track::-webkit-scrollbar { display:none; }
body.tide-app { margin:0; background:var(--tide-ink); color:#f5fffd; font-family:'DM Sans',sans-serif; letter-spacing:0; overflow-x:hidden; scrollbar-width:none; background-image:none; }
.tide-app *, .tide-app *::before, .tide-app *::after { box-sizing:border-box; letter-spacing:0; }
.tide-app h1,.tide-app h2,.tide-app h3 { font-family:'Manrope',sans-serif; letter-spacing:0; }
.tide-header { position:absolute; z-index:20; inset:0 0 auto; height:76px; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; }
.tide-brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font:700 19px 'Manrope',sans-serif; }
.tide-logo { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(255,255,255,.5); background:rgba(3,26,35,.5); backdrop-filter:blur(12px); border-radius:50%; font-size:12px; }
.tide-menu-button { width:48px; height:48px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(3,26,35,.56); backdrop-filter:blur(12px); display:grid; place-content:center; gap:5px; cursor:pointer; }
.tide-menu-button span { display:block; width:19px; height:1px; background:#fff; }
.tide-drawer { position:fixed; z-index:60; inset:0 0 0 auto; width:min(88vw,390px); padding:22px; background:#ecfffb; color:var(--tide-ink); transform:translateX(102%); transition:transform .3s ease; display:flex; flex-direction:column; }
.tide-drawer.open { transform:translateX(0); }
.tide-drawer-head { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #9bc8bf; padding-bottom:18px; }
.tide-drawer-head strong { font:700 20px 'Manrope',sans-serif; }
.tide-drawer-head button { width:40px; height:40px; border:0; background:transparent; color:var(--tide-ink); font-size:31px; cursor:pointer; }
.tide-drawer-links { display:grid; padding:28px 0; }
.tide-drawer-links a { color:var(--tide-ink); text-decoration:none; font:700 24px 'Manrope',sans-serif; padding:15px 0; border-bottom:1px solid #c2ded8; }
.tide-account { display:flex; align-items:center; gap:12px; margin-top:auto; padding:20px 0; }
.tide-account .btn,.tide-account .textlink { color:var(--tide-ink); font:700 14px 'DM Sans',sans-serif; text-decoration:none; }
.tide-account .btn { border:1px solid var(--tide-ink); padding:11px 16px; border-radius:999px; background:transparent; }
.tide-drawer-legal { display:flex; flex-wrap:wrap; gap:13px; font-size:12px; }
.tide-drawer-legal a { color:#38645d; }
.tide-veil { display:none; position:fixed; z-index:50; inset:0; border:0; background:rgba(0,12,17,.62); }
.tide-veil.open { display:block; }
.tide-hero { min-height:92svh; position:relative; display:flex; align-items:flex-end; padding:110px 18px 42px; background-image:linear-gradient(180deg,rgba(1,15,21,.08) 30%,rgba(1,19,26,.9) 84%,var(--tide-ink)),url('/static/brand/dabblewise-club.webp'); background-size:cover; background-position:59% center; }
.tide-hero-copy { max-width:580px; }
.tide-kicker { margin:0 0 12px; color:var(--tide-aqua); font-size:12px; font-weight:700; text-transform:uppercase; }
.tide-hero h1 { margin:0; max-width:8ch; font-size:50px; line-height:.94; font-weight:800; }
.tide-hero-copy>p:not(.tide-kicker) { max-width:35ch; margin:18px 0 24px; color:#d4e7e5; font-size:15px; line-height:1.6; }
.tide-primary { display:flex; align-items:center; justify-content:space-between; width:min(100%,300px); min-height:55px; padding:0 18px; border:0; border-radius:4px; background:var(--tide-aqua); color:var(--tide-ink); font:700 15px 'DM Sans',sans-serif; cursor:pointer; }
.tide-primary span { font-size:20px; }
.tide-sonar { position:absolute; top:88px; right:16px; display:flex; align-items:center; gap:8px; padding:8px 12px; background:rgba(3,26,35,.7); border:1px solid rgba(255,255,255,.24); backdrop-filter:blur(12px); border-radius:999px; font-size:11px; }
.tide-sonar i { width:8px; height:8px; border-radius:50%; background:var(--tide-aqua); box-shadow:0 0 0 5px rgba(82,240,208,.16); }
.tide-sonar strong { color:var(--tide-aqua); }
.tide-main { max-width:1440px; margin:auto; padding:18px 14px 70px; }
.tide-status { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #16454f; margin-bottom:24px; }
.tide-status div { min-width:0; padding:13px 9px; border-right:1px solid #16454f; }
.tide-status div:last-child { border:0; }
.tide-status span,.tide-status strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tide-status span { color:#77a7a7; font-size:9px; text-transform:uppercase; }
.tide-status strong { margin-top:5px; font-size:12px; }
.tide-note { margin:0 0 24px; padding:14px; border-left:3px solid var(--tide-coral); background:#0a3540; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:13px; }
.tide-note .btn { color:var(--tide-aqua); white-space:nowrap; }
.tide-zones { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:42px; }
.tide-zones a { min-height:112px; padding:13px; color:#fff; text-decoration:none; border:1px solid #1a4d56; background:#082b34; display:flex; flex-direction:column; justify-content:flex-end; }
.tide-zones span { color:var(--tide-aqua); font-size:10px; margin-bottom:auto; }
.tide-zones strong { font:700 15px 'Manrope',sans-serif; }
.tide-zones small { color:#78a5a5; font-size:10px; margin-top:4px; }
.tide-app .shelf { width:100%; margin:0 0 42px; min-width:0; }
.tide-app .shelf-head { display:grid; grid-template-columns:1fr auto; align-items:end; gap:2px 10px; margin:0 0 15px; }
.tide-app .shelf-head p { grid-column:1/-1; margin:0; color:var(--tide-aqua); font-size:10px; font-weight:700; text-transform:uppercase; }
.tide-app .shelf-head h2 { margin:0; font-size:22px; line-height:1.1; }
.tide-app .shelf-head .tally { color:#75a3a3; font-size:10px; text-align:right; }
.tide-app .shelf-track { display:flex!important; width:100%; gap:10px; overflow-x:auto!important; overflow-y:hidden; padding:0 1px 8px; scroll-snap-type:x mandatory; scrollbar-width:none; }
.tide-app .tile { flex:0 0 38vw; max-width:172px; padding:0; border:0; background:transparent; text-align:left; scroll-snap-align:start; color:#fff; cursor:pointer; }
.tide-app .tile .art { display:block; position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:2px; border:1px solid #1e5058; background:#092a32; margin:0 0 9px; }
.tide-app .tile .art img { width:100%; height:100%; object-fit:cover; }
.tide-app .tile .label { display:block; padding:0; }
.tide-app .tile .name { display:block; color:#f3ffff; font-size:12px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.tide-app .tile .kind { display:block; margin-top:3px; color:var(--tide-aqua); font-size:9px; text-transform:uppercase; }
.tide-app .tile .go,.tide-app .tile .fresh { display:none; }
.tide-featured { padding-top:6px; }
.tide-featured .tile { flex-basis:68vw; max-width:300px; }
.tide-featured .tile .art { aspect-ratio:16/10; }
.tide-channel-grid { min-width:0; }
.tide-catalog { padding-top:25px; border-top:1px solid #1e4f57; }
.tide-app .tile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px 8px; }
.tide-app .tile-grid .tile { width:100%; max-width:none; }
.tide-app .tile-grid .tile .name { font-size:10px; }
.tide-footer { padding:28px 16px 90px; border-top:1px solid #16454f; display:grid; gap:10px; color:#78a5a5; font-size:11px; }
.tide-footer strong { color:#fff; font:700 19px 'Manrope',sans-serif; }
.tide-footer nav { display:flex; flex-wrap:wrap; gap:14px; margin-top:8px; }
.tide-footer a { color:#b9d3d0; }
@media (min-width:760px) {
  .tide-header { height:92px; padding:20px 30px; }
  .tide-hero { min-height:820px; padding:150px 6vw 80px; background-position:center; }
  .tide-hero h1 { font-size:78px; }
  .tide-sonar { top:115px; right:32px; }
  .tide-main { padding:34px 32px 90px; }
  .tide-zones { grid-template-columns:repeat(4,1fr); }
  .tide-zones a { min-height:145px; }
  .tide-channel-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 36px; }
  .tide-app .tile { flex-basis:180px; max-width:180px; }
  .tide-featured .tile { flex-basis:300px; max-width:300px; }
  .tide-app .tile-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:26px 14px; }
  .tide-footer { grid-template-columns:auto 1fr auto; align-items:center; padding:35px 32px; }
}

/* Casino-first density and readable type. */
.tide-app { font-size:16px; }
.tide-hero { min-height:340px; padding-top:90px; padding-bottom:24px; }
.tide-kicker { font-size:13px; letter-spacing:0; }
.tide-hero h1 { font-size:48px; line-height:.98; }
.tide-hero-copy>p:not(.tide-kicker) { font-size:16px; }
.tide-primary { min-height:52px; font-size:16px; }
.tide-sonar { font-size:13px; }
.tide-main { max-width:1600px; }
.tide-status span { font-size:12px; }
.tide-status strong { font-size:15px; }
.tide-note { font-size:14px; }
.tide-zones a { min-height:104px; }
.tide-zones span,.tide-zones small { font-size:12px; }
.tide-zones strong { font-size:16px; }
.tide-app .shelf-head p { font-size:12px; letter-spacing:0; }
.tide-app .shelf-head h2 { font-size:27px; }
.tide-app .shelf-head .tally { font-size:13px; }
.tide-app .tile { flex-basis:44vw; max-width:180px; }
.tide-app .tile .name,
.tide-app .tile-grid .tile .name { font-size:14px; }
.tide-app .tile .kind { font-size:12px; letter-spacing:0; }
.tide-footer { font-size:13px; }

@media (min-width:760px) {
  .tide-hero { min-height:430px; padding-bottom:44px; }
  .tide-hero h1 { font-size:68px; }
  .tide-main { padding-inline:40px; }
  .tide-app .tile { flex-basis:190px; max-width:190px; }
  .tide-featured .tile { flex-basis:300px; max-width:300px; }
}
