/* Shoreline: the coast our hub is drawn on.
   A golden-hour sea by day and a moonlit one at night (the visitor's setting or the day/night switch),
   a dive under the water below the hero, and the seabed in the footer.
   Everything here is scoped to shore-* classes or to sections that hold a shore widget. */
:root{
  --shore-sky-a:#0f3c58;--shore-sky-b:#2a6a88;--shore-sky-c:#8eb0b8;--shore-sky-d:#f2b47c;--shore-sky-e:#f5956a;
  --shore-sun-core:#fff4d6;--shore-sun-glow:#ffc27a;--shore-glow-a:.75;--shore-sun-lift:22px;--shore-sun-size:84px;
  --shore-hl1:#7f98a1;--shore-hl2:#3f6272;--shore-hl3:#2a4858;--shore-lamp:#ffe6a6;--shore-beam-a:0;--shore-win-a:0;
  --shore-sea1:#9aaead;--shore-sea2:#5f8a9a;--shore-sea3:#356c84;--shore-sea4:#21536b;--shore-crest:#ffe7c2;--shore-glitter:#fff0c8;--shore-glint-a:1;
  --shore-sand1:#e8c48e;--shore-sand2:#d1a368;--shore-wet:#b8916a;--shore-wetsheen:#f2c99a;--shore-foam:#fff8ec;
  --shore-dune:#b98d55;--shore-dune2:#a27a47;--shore-grass:#6e7a3f;--shore-grass2:#8c9550;
  --shore-cloud1:#ffe1bd;--shore-cloud2:#ec9d7f;--shore-cloud-a:.85;--shore-star-a:0;--shore-gull:#21394a;--shore-sail:#fff1da;
  --shore-deep0:#1f7ea3;--shore-deep1:#145474;--shore-deep2:#0b3047;--shore-deep3:#071f30;--shore-buoy:#f2b950;--shore-ray-a:.85;
  --shore-hero-fg:#fbf6ec;--shore-hero-muted:#dce8ec;--shore-scrim:rgba(6,26,40,.5);
  --shore-line:#d6cebc;--shore-panel:#f8f6f0;
}
/* Night: the visitor's setting, unless they chose Day or Night with the switch (data-theme). */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --shore-sky-a:#030a12;--shore-sky-b:#081a2a;--shore-sky-c:#12304a;--shore-sky-d:#26496a;--shore-sky-e:#2f557a;
  --shore-sun-core:#efeadb;--shore-sun-glow:#9fb8d0;--shore-glow-a:.35;--shore-sun-lift:150px;--shore-sun-size:56px;
  --shore-hl1:#152a3b;--shore-hl2:#0c1c29;--shore-hl3:#08141e;--shore-beam-a:1;--shore-win-a:1;
  --shore-sea1:#1e3a55;--shore-sea2:#15304a;--shore-sea3:#0f2c41;--shore-sea4:#0a2233;--shore-crest:#9fc3d3;--shore-glitter:#dfe8ee;--shore-glint-a:.7;
  --shore-sand1:#39434a;--shore-sand2:#2c343a;--shore-wet:#232b31;--shore-wetsheen:#3a5468;--shore-foam:#a9c7d6;
  --shore-dune:#222b31;--shore-dune2:#1a2227;--shore-grass:#2a3a35;--shore-grass2:#33463f;
  --shore-cloud1:#2a4560;--shore-cloud2:#1a3046;--shore-cloud-a:.55;--shore-star-a:1;--shore-gull:#5d7488;--shore-sail:#a9bccb;
  --shore-deep0:#0e3a52;--shore-deep1:#0a2a3d;--shore-deep2:#061b29;--shore-deep3:#03101a;--shore-ray-a:.4;
  --shore-scrim:rgba(0,8,14,.45);
  --shore-line:#213d50;--shore-panel:#122634;
  --gsy-color-background:#0d1f2a;--gsy-color-surface:#122634;--gsy-color-text:#e6eff2;--gsy-color-muted:#9bb0ba;
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --shore-sky-a:#030a12;--shore-sky-b:#081a2a;--shore-sky-c:#12304a;--shore-sky-d:#26496a;--shore-sky-e:#2f557a;
  --shore-sun-core:#efeadb;--shore-sun-glow:#9fb8d0;--shore-glow-a:.35;--shore-sun-lift:150px;--shore-sun-size:56px;
  --shore-hl1:#152a3b;--shore-hl2:#0c1c29;--shore-hl3:#08141e;--shore-beam-a:1;--shore-win-a:1;
  --shore-sea1:#1e3a55;--shore-sea2:#15304a;--shore-sea3:#0f2c41;--shore-sea4:#0a2233;--shore-crest:#9fc3d3;--shore-glitter:#dfe8ee;--shore-glint-a:.7;
  --shore-sand1:#39434a;--shore-sand2:#2c343a;--shore-wet:#232b31;--shore-wetsheen:#3a5468;--shore-foam:#a9c7d6;
  --shore-dune:#222b31;--shore-dune2:#1a2227;--shore-grass:#2a3a35;--shore-grass2:#33463f;
  --shore-cloud1:#2a4560;--shore-cloud2:#1a3046;--shore-cloud-a:.55;--shore-star-a:1;--shore-gull:#5d7488;--shore-sail:#a9bccb;
  --shore-deep0:#0e3a52;--shore-deep1:#0a2a3d;--shore-deep2:#061b29;--shore-deep3:#03101a;--shore-ray-a:.4;
  --shore-scrim:rgba(0,8,14,.45);
  --shore-line:#213d50;--shore-panel:#122634;
  --gsy-color-background:#0d1f2a;--gsy-color-surface:#122634;--gsy-color-text:#e6eff2;--gsy-color-muted:#9bb0ba;
  color-scheme:dark;
}

/* No scrollbar: the depth gauge on the right shows where you are. */
html{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none}

/* ---------- the section a scene sits in (never one that only wraps it, like a module page) ---------- */
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene)){position:relative;overflow:hidden;isolation:isolate;background:var(--shore-sky-a);color:var(--shore-hero-fg)}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene))::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--shore-scrim),transparent 62%)}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene))>.gsy-container,.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene))>.gsy-row{position:relative;z-index:5}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene)) :is(h1,h2,h3,.gsy-heading){color:inherit;text-shadow:0 2px 24px rgba(4,20,32,.35)}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene)) .gsy-text{color:var(--shore-hero-muted)}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene)) .gsy-button-outline{color:var(--shore-hero-fg);border-color:currentColor}
.gsy-widget-shore-scene{margin:0!important}
.shore-scene{position:absolute;inset:0;z-index:0;pointer-events:none}
.gsy-section:has(.shore-hero[data-dive]){min-height:max(760px,calc(100svh - var(--gsy-header-height,68px)))!important}
.gsy-section:has(.shore-banner){min-height:300px}

/* the coast */
.shore-coast{position:absolute;inset:0;overflow:hidden;--sea-h:230px;--sand-h:118px;--head-h:190px;--sun-x:49%}
.shore-sun-left .shore-coast{--sun-x:30%}.shore-sun-right .shore-coast{--sun-x:66%}
.shore-banner .shore-coast{--sea-h:34%;--sand-h:0px;--head-h:min(26vw,150px)}
.shore-coast>.c-sky{position:absolute;left:0;right:0;top:0;bottom:var(--sea-h);background:linear-gradient(180deg,var(--shore-sky-a) 0%,var(--shore-sky-b) 42%,var(--shore-sky-c) 72%,var(--shore-sky-d) 92%,var(--shore-sky-e) 100%)}
.shore-coast>.c-sea{position:absolute;left:0;right:0;bottom:0;height:var(--sea-h);background:linear-gradient(var(--shore-sea1),var(--shore-sea4))}
.shore-coast>.c-sea>svg{position:absolute;inset:0;width:100%;height:100%}
.shore-coast>.c-sand{position:absolute;left:0;right:0;bottom:0;height:var(--sand-h);background:linear-gradient(var(--shore-sand1),var(--shore-sand2))}
.shore-coast>.c-sand:has(svg){background:none}
.shore-coast>.c-sand svg{position:absolute;inset:0;width:100%;height:100%}
.shore-coast .c-stars{position:absolute;inset:0;opacity:var(--shore-star-a)}
.shore-coast .c-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff}
.shore-coast .c-cloud{position:absolute;border-radius:999px;background:linear-gradient(180deg,var(--shore-cloud1),var(--shore-cloud2));-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);opacity:var(--shore-cloud-a);filter:blur(1.2px)}
.shore-coast .c-gull{position:absolute;left:0;color:var(--shore-gull)}
.shore-coast .c-gull svg{display:block;width:100%;height:auto;overflow:visible}
.shore-coast .c-sun{position:absolute;left:var(--sun-x);bottom:calc(var(--sea-h) + var(--shore-sun-lift));width:var(--shore-sun-size);height:var(--shore-sun-size);transform:translateX(-50%)}
.shore-banner .c-sun{--shore-sun-lift:12px;--shore-sun-size:54px}
.shore-coast .c-sun .glow{position:absolute;left:50%;top:50%;width:1000%;height:640%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,var(--shore-sun-glow),transparent);opacity:var(--shore-glow-a);border-radius:50%}
.shore-coast .c-sun .disc{position:absolute;inset:0;border-radius:50%;background:var(--shore-sun-core);box-shadow:0 0 34px 8px var(--shore-sun-glow)}
.shore-coast .c-far{position:absolute;left:0;bottom:calc(var(--sea-h) - 3px);width:62%;height:calc(var(--head-h) * .34)}
.shore-coast .c-head{position:absolute;right:0;bottom:calc(var(--sea-h) - 6px);height:var(--head-h);aspect-ratio:640/230;max-width:64%;overflow:visible}
.shore-coast .c-boat{position:absolute;left:71%;bottom:calc(var(--sea-h) - 9px);width:40px}
.shore-coast .c-haze{position:absolute;left:0;right:0;top:0;height:22px;background:linear-gradient(var(--shore-sky-e),transparent);opacity:.5}
.shore-coast .c-glint{position:absolute;left:var(--sun-x);top:3px;height:64%;width:0;opacity:var(--shore-glint-a)}
.shore-coast .c-glint i{position:absolute;border-radius:2px;background:var(--shore-glitter);filter:blur(.4px)}
.shore-coast .c-dune{position:absolute;left:0;bottom:0;height:calc(var(--sand-h) * 1.55);aspect-ratio:560/170;max-width:46%}

/* ---------- the fisherman and the crab ---------- */
.shore-cast{position:relative;height:clamp(380px,44vw,560px);margin-bottom:0}
.gsy-widget-shore-cast{margin-top:0}
.shore-char{position:absolute;cursor:pointer;background:none;border:0;padding:0;transform-origin:50% 100%;z-index:2}
.shore-char img{display:block;width:100%;height:auto;pointer-events:none;user-select:none;transition:filter .25s}
.shore-char:hover img{filter:drop-shadow(0 8px 12px rgba(6,26,40,.3)) brightness(1.05)}
.shore-char:focus-visible{outline:2px solid var(--shore-buoy);outline-offset:4px;border-radius:12px}
.shore-fisher{bottom:52px;right:34%;width:min(250px,52%)}
.shore-crab{bottom:42px;right:0;width:min(140px,28%)}
.shore-cast:not(.has-fisher) .shore-crab{right:auto;left:50%;transform:translateX(-50%)}
.shore-cast:not(.has-crab) .shore-fisher{right:auto;left:50%;transform:translateX(-50%)}
.shore-body{display:block;position:relative;transform-origin:50% 55%}
.shore-shadow{position:absolute;left:12%;right:12%;bottom:-6px;height:12px;border-radius:50%;background:rgba(10,30,40,.22);filter:blur(3px);z-index:-1}
.shore-lid{position:absolute;border-radius:50%;transform:scaleY(0);transform-origin:50% 0}
.shore-fisher .shore-lid{width:5.4%;height:3.9%;top:16.6%}
.shore-fisher .shore-lid.l{left:42.9%;background:#f3c2a4}.shore-fisher .shore-lid.r{left:57.6%;background:#e3aa8e}
.shore-crab .shore-lid{width:10.6%;height:13.6%;top:18.4%;background:#c4552a}
.shore-crab .shore-lid.l{left:34%}.shore-crab .shore-lid.r{left:59.7%}
.shore-bubble,.shore-say{position:absolute;z-index:6;margin:0;background:#fbf8f1;color:#13222d;padding:10px 14px;border-radius:16px;font-weight:600;font-size:14.5px;line-height:1.35;box-shadow:0 12px 32px -16px rgba(15,42,61,.45);border:1px solid #d9cfbb;text-shadow:none}
.shore-bubble::after,.shore-say::after{content:"";position:absolute;width:14px;height:14px;background:inherit;border-right:1px solid #d9cfbb;border-bottom:1px solid #d9cfbb;transform:rotate(45deg);bottom:-8px}
.shore-bubble{bottom:calc(52px + min(250px,52%) * 1.53 + 8px);right:58%;max-width:220px}
.shore-bubble::after{right:26px}
.shore-say{width:max-content;max-width:190px;font-size:13.5px;pointer-events:none}
.shore-say::after{left:var(--tip,50%)}
.shore-peek-wrap{position:relative;height:0;z-index:3}
.shore-peek{bottom:-14px;right:34px;width:110px;transform-origin:50% 100%;position:absolute}
.gsy-widget-shore-cast:has(.shore-peek){margin:0}
/* click effects */
.shore-fx{position:absolute;pointer-events:none;border-radius:50%}
.shore-fx.sand{background:var(--shore-sand1);margin:-6px 0 0 -6px}
.shore-fx.drop{background:var(--shore-foam)}
.shore-fx.ripple{border:2px solid var(--shore-foam);background:none;height:5px!important;width:12px!important}
.shore-fx.spark{background:var(--shore-glitter);border-radius:2px;transform-origin:50% 100%;box-shadow:0 0 6px var(--shore-sun-glow)}
.shore-fx.leap{border-radius:0;width:58px;height:30px;filter:drop-shadow(0 3px 4px rgba(6,26,40,.25))}
.shore-fx.leap svg{width:100%;height:100%;display:block}

/* ---------- the dive ---------- */
.shore-dive{position:absolute;left:0;right:0;top:100%;height:170%;z-index:6;pointer-events:none}
.shore-dive-top{position:absolute;left:0;right:0;top:-38px;width:100%;height:40px;display:block}
.shore-dive-body{position:absolute;inset:0;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(180deg,rgba(111,190,214,.42) 0%,rgba(47,140,174,.78) 14%,var(--shore-deep0) 36%,var(--shore-deep0) 100%)}
.shore-dive-msg{position:absolute;z-index:7;left:0;right:0;bottom:14%;display:grid;justify-items:center;gap:12px;text-align:center;color:#f1f8fa;opacity:0;pointer-events:none;padding-inline:16px}
.shore-dive-msg h2{margin:0;font-family:var(--gsy-font-heading);font-size:clamp(34px,5vw,64px);line-height:1.05;text-shadow:0 2px 24px rgba(3,20,32,.4)}
.shore-eyebrow{margin:0;font-family:var(--gsy-font-heading);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--shore-buoy)}
.shore-arrow{width:22px;height:34px;border:2px solid rgba(255,255,255,.6);border-radius:12px;position:relative;margin-top:8px}
.shore-arrow::after{content:"";position:absolute;left:50%;top:7px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:#fff}
.shore-bubbleup{position:absolute;border-radius:50%;border:1.5px solid rgba(220,240,250,.55);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.5),transparent 60%);z-index:1;pointer-events:none}

/* ---------- underwater: every section below a hero that dives ---------- */
.gsy-page:has(.shore-hero[data-dive]){position:relative;overflow-x:clip;background:linear-gradient(180deg,var(--shore-deep0) 0%,var(--shore-deep0) var(--shore-top,0px),var(--shore-deep1) calc(var(--shore-top,0px) + (100% - var(--shore-top,0px)) * .34),var(--shore-deep2) calc(var(--shore-top,0px) + (100% - var(--shore-top,0px)) * .7),var(--shore-deep3) 100%)}
.gsy-page:has(.shore-hero[data-dive])>.gsy-section:not(:has(.shore-scene)){position:relative;z-index:1;background:transparent;color:#f1f8fa;
  --gsy-color-text:#f1f8fa;--gsy-color-muted:#cfe2e9;--gsy-color-surface:rgba(4,24,38,.3);--gsy-color-primary:var(--shore-buoy)}
.shore-deep :is(h1,h2,h3,h4,.gsy-heading){color:#f1f8fa}
.shore-deep .gsy-text,.shore-deep .gsy-feature-text,.shore-deep .gsy-stat span{color:#cfe2e9}
.shore-deep .gsy-button:not(.gsy-button-link):not(.gsy-button-outline){background:var(--shore-buoy);color:#0b3047;border-color:var(--shore-buoy)}
.shore-deep .gsy-button-outline{color:#f1f8fa;border-color:rgba(255,255,255,.7)}
.shore-deep .gsy-feature,.shore-deep .lic-card,.shore-card>.gsy-container>.gsy-row,.shore-card>.gsy-row{background:rgba(4,24,38,.3);border:1px solid rgba(255,255,255,.14);border-radius:20px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 18px 40px -24px rgba(3,16,26,.6)}
.shore-deep .gsy-feature{padding:24px}
.shore-card>.gsy-container>.gsy-row,.shore-card>.gsy-row{padding:30px 34px}
@media (min-width:768px){.shore-card .gsy-row>.gsy-col+.gsy-col{border-left:1px solid rgba(255,255,255,.14);padding-left:24px}}
.shore-deep .gsy-feature-icon{background:rgba(242,185,80,.15);color:var(--shore-buoy);border-radius:14px}
.shore-deep .gsy-stat strong{color:#fff}
.shore-deep pre.gansey-code{border:1px solid rgba(255,255,255,.1);background:#0b3047}
.shore-deep .lic-price,.shore-deep .lic-h{color:#f1f8fa}
.shore-snow{position:absolute;z-index:0;width:3px;height:3px;border-radius:50%;background:rgba(220,240,248,.5);pointer-events:none}
.shore-fish{position:absolute;z-index:0;width:46px;pointer-events:none}
.shore-fish svg{display:block;width:100%;height:auto}

/* ---------- the home page, section by section ---------- */
/* eyebrows: a heading widget with the shore-eyebrow class */
.shore-eyebrow :is(h1,h2,h3,h4,h5,h6){font-family:var(--gsy-font-heading)!important;font-weight:600!important;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--gsy-color-muted)}
.gsy-section:is(:has(>.shore-scene),:has(>.gsy-row>.gsy-col>.gsy-widget-shore-scene)) .shore-eyebrow :is(h5,h6){color:var(--shore-hero-muted)}
.shore-deep .shore-eyebrow :is(h5,h6){color:#cfe2e9}
.gsy-widget.shore-eyebrow+.gsy-widget{margin-top:10px}
/* the hero copy: top of the beach, on the container's left edge */
.gsy-section:has(.shore-hero)>.gsy-row{min-height:max(760px,calc(100svh - var(--gsy-header-height,68px)));align-items:end}
.gsy-section:has(.shore-hero)>.gsy-row>.gsy-col:has(>.gsy-widget-shore-scene){align-self:start;padding:64px 0 250px;max-width:560px}
.gsy-section:has(.shore-hero)>.gsy-row>.gsy-col:has(>.gsy-widget-shore-scene)>.gsy-widget+.gsy-widget{margin-top:18px}
.gsy-section:has(.shore-hero) h1{font-size:clamp(40px,5.4vw,70px);text-wrap:balance}
.shore-w{display:inline-block}
.gsy-section:has(.shore-hero) .gsy-text{font-size:18px;max-width:52ch}
.gsy-section:has(.shore-hero) .gsy-text p{margin:0}
.gsy-section:has(.shore-hero) .gsy-widget-button.gsy-inline{margin-right:12px}
.gsy-section:has(.shore-hero) .gsy-button-outline{box-shadow:inset 0 0 0 1.5px currentColor}
/* section heads */
.shore-deep .gsy-col>.gsy-widget-heading:has(h2){max-width:720px}
.shore-deep h2.gsy-heading{font-size:clamp(32px,4.2vw,50px)}
.shore-deep .gsy-col>.gsy-widget-heading:has(h2)+.gsy-widget{margin-top:40px}
/* the stats card */
.shore-card .gsy-stat{gap:4px}
.shore-card .gsy-stat strong{font-size:54px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.shore-card .gsy-stat span{color:#a9c4cf!important;font-size:15px;max-width:26ch}
/* feature cards, with the mockup's icons (drawn by shoreline.js) */
.shore-deep .gsy-features{gap:18px}
.shore-deep .gsy-feature{position:relative;overflow:hidden;display:grid;gap:10px;align-content:start;justify-items:start;text-align:left}
.shore-deep .gsy-feature::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:radial-gradient(circle at 8px 10px,#fff 6px,transparent 6.5px) 0 0/16px 8px repeat-x;opacity:.1}
.shore-deep .gsy-feature-title{font-family:var(--gsy-font-heading);font-size:24px;line-height:1.05;color:#f1f8fa}
.shore-deep .gsy-feature-text{margin:0}
.shore-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(242,185,80,.15);color:var(--shore-buoy)}
.shore-ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* the two plans */
.shore-deep .lic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0}
.shore-deep .lic-card{border-radius:22px;padding:28px;gap:14px;background:rgba(4,24,38,.3);border-color:rgba(255,255,255,.14);color:#f1f8fa}
.shore-deep .lic-card h3{font-size:30px;color:#f1f8fa}
.shore-deep .lic-featured{background:rgba(3,16,26,.5);border-color:rgba(255,255,255,.12)}
.shore-deep .lic-tag,.shore-deep .lic-tick{color:var(--shore-buoy)}
.shore-deep .lic-lead{color:#cfe2e9}
.shore-deep .lic-featured .lic-lead{color:#a9c4cf}
.gsy-section:has(+.shore-check){padding-bottom:0!important}
/* the licence check, under the plans */
.shore-check{padding-top:28px!important}
.shore-check>.gsy-row{border-radius:22px;padding:28px;gap:24px;background:rgba(4,24,38,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);align-items:center}
.shore-check h3{font-size:28px}
.shore-check .gsy-widget-heading+.gsy-widget{margin-top:6px}
.shore-check .lic-lookup{max-width:none;gap:10px}
.shore-check .lic-lookup label{font-family:var(--gsy-font-heading);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#cfe2e9}
.shore-check .lic-row{gap:10px}
.shore-check .lic-row input{flex:1 1 220px;border-radius:999px;padding:.7rem 1rem;border:1.5px solid rgba(255,255,255,.28);background:rgba(4,24,38,.3);color:#f1f8fa;font-size:14px}
.shore-check .lic-row input::placeholder{color:#9bb7c3}
.shore-check-res{grid-column:1/-1;margin-top:4px}
.shore-check-res .lic-result{display:grid;gap:6px;padding:14px 16px;border-radius:14px;background:rgba(3,16,26,.35);border:1px dashed rgba(255,255,255,.28);color:#f1f8fa}
.shore-check-res .lic-result :is(p,h3,dl){margin:0}
.shore-check-res .lic-result dl{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;font-size:14px}
.shore-check-res .lic-result dt{color:#9bb7c3}
.shore-check-res .lic-eyebrow{font-family:var(--gsy-font-heading);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--shore-buoy)}

/* sunlight from the surface, fixed to the screen while underwater */
.shore-sunrays{position:fixed;left:0;right:0;top:0;height:100vh;z-index:0;pointer-events:none;opacity:0}
.shore-rays{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:var(--shore-ray-a);mix-blend-mode:screen;-webkit-mask-image:linear-gradient(#000 0%,rgba(0,0,0,.55) 45%,transparent 100%);mask-image:linear-gradient(#000 0%,rgba(0,0,0,.55) 45%,transparent 100%)}
.shore-rays i{position:absolute;top:-6%;height:118%;border-radius:0 0 50% 50%;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(205,240,255,.26) 38%,rgba(205,240,255,0) 82%);filter:blur(16px);transform-origin:50% 0}
.shore-rays .caustic{position:absolute;left:-10%;right:-10%;top:0;height:170px;opacity:.5;background-image:radial-gradient(ellipse 60px 16px at 30% 40%,rgba(255,255,255,.6),transparent 70%),radial-gradient(ellipse 38px 11px at 76% 66%,rgba(255,255,255,.5),transparent 70%),radial-gradient(ellipse 48px 13px at 56% 18%,rgba(255,255,255,.45),transparent 70%);background-size:180px 70px;filter:blur(2px);-webkit-mask-image:linear-gradient(#000,transparent);mask-image:linear-gradient(#000,transparent)}

/* ---------- the header: logo, four links, the day/night switch and Sign in ---------- */
body .gsy-header{background:color-mix(in srgb,var(--shore-panel) 92%,transparent);color:var(--gsy-color-text);border-bottom:1px solid var(--shore-line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .4s,color .4s,border-color .4s}
.gsy-header .gsy-section{background:transparent!important;color:inherit}
.shore-head .gsy-row{min-height:var(--gsy-header-height,68px);align-items:center}
.shore-head .gsy-col:last-child{display:flex;align-items:center;justify-content:flex-end;gap:22px}
.shore-head .gsy-widget{margin:0!important}
.gsy-site-name{gap:10px;font-size:23px;letter-spacing:.02em}
.gsy-site-name::before{content:"";width:30px;height:30px;border-radius:9px;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);
  background:radial-gradient(circle at 6px -2px,transparent 6px,var(--shore-buoy) 6.5px) -3px 21px/12px 12px repeat-x,repeating-linear-gradient(180deg,#1f5f86 0 5px,#e9f1f4 5px 9px)}
.shore-navlink .gsy-button-link{position:relative;font-weight:600;font-size:1rem;color:inherit;text-decoration:none!important}
.shore-navlink .gsy-button-link::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:#1f5f86;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.shore-navlink .gsy-button-link:hover::after{transform:scaleX(1)}
.shore-signin .gsy-button{padding:5.6px 14.4px;font-size:13px;line-height:1.6;color:#fff;border:1.5px solid transparent}
.shore-tide{position:absolute;left:0;bottom:-3px;height:3px;width:100%;background:var(--shore-buoy);transform-origin:left;transform:scaleX(0);pointer-events:none}
.shore-mode{display:inline-flex;gap:2px;padding:3px;border-radius:999px;border:1px solid color-mix(in srgb,var(--gsy-color-text) 22%,transparent);background:var(--shore-panel)}
.shore-mode button{display:inline-flex;align-items:center;border:0;background:none;padding:2px 9px;border-radius:999px;font:600 12px/1.5 var(--gsy-font-body);color:var(--gsy-color-muted);cursor:pointer;white-space:nowrap}
.shore-mode button[aria-pressed="true"]{background:#1f5f86;color:#fff}
.shore-mode svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.shore-mode button:focus-visible{outline:2px solid var(--shore-buoy);outline-offset:1px}
/* while underwater */
.gsy-header.shore-under{background:rgba(6,30,45,.62)!important;color:#eaf4f7;border-color:rgba(255,255,255,.1)}
.gsy-header.shore-under :is(a,.gsy-site-name-text,.gsy-button-link){color:#eaf4f7}
.gsy-header.shore-under .gsy-button:not(.gsy-button-link):not(.gsy-button-outline){background:var(--shore-buoy);color:#0b3047;border-color:var(--shore-buoy)}
.gsy-header.shore-under .shore-navlink .gsy-button-link::after{background:var(--shore-buoy)}
.gsy-header.shore-under .shore-mode{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22)}
.gsy-header.shore-under .shore-mode button{color:#cfe2e9}
.gsy-header.shore-under .shore-mode button[aria-pressed="true"]{background:var(--shore-buoy);color:#0b3047}

/* depth gauge */
.shore-gauge{position:fixed;z-index:45;right:max(14px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);display:grid;justify-items:center;gap:8px;pointer-events:none}
.shore-gauge .track{position:relative;width:3px;height:min(44vh,320px);border-radius:3px;background:rgba(120,140,150,.35);box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.shore-gauge .track::before,.shore-gauge .track::after{content:"";position:absolute;left:-4px;width:11px;height:1.5px;background:rgba(120,140,150,.55)}
.shore-gauge .track::before{top:0}.shore-gauge .track::after{bottom:0}
.shore-gauge i{position:absolute;left:50%;top:0;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:var(--shore-buoy);box-shadow:0 0 0 3px rgba(242,185,80,.28),0 1px 4px rgba(0,0,0,.3)}
.shore-gauge b{font:600 11px/1 ui-monospace,Menlo,Consolas,monospace;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.55);font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- the seabed (the footer) ---------- */
.gsy-section:has(.shore-seabed){position:relative;overflow:hidden;isolation:isolate;background:var(--shore-deep3)!important;color:#d7e7ee;padding-top:60px!important;padding-bottom:200px!important}
.gsy-section:has(.shore-seabed)>.gsy-container,.gsy-section:has(.shore-seabed)>.gsy-row{position:relative;z-index:3}
.gsy-section:has(.shore-seabed) .gsy-row{gap:28px}
.gsy-section:has(.shore-seabed) .gsy-site-name{color:#fff}
.gsy-section:has(.shore-seabed) .gsy-widget+.gsy-widget{margin-top:10px}
.gsy-section:has(.shore-seabed) .gsy-text{color:#a9c4cf;max-width:34ch}
.gsy-section:has(.shore-seabed) .gsy-text p{margin:0}
.shore-foot-h :is(h1,h2,h3,h4){font-family:var(--gsy-font-heading);font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:#9fc2cf}
.gsy-widget.shore-footlink{margin-top:6px!important}
.shore-footlink .gsy-button-link{font-weight:400;color:#e7f1f4;font-size:1rem}
.gsy-widget-shore-seabed{margin:0!important}
.shore-seabed{position:absolute;inset:0;z-index:0;pointer-events:none}
.shore-floor{position:absolute;left:0;right:0;bottom:0;height:110px;z-index:2}
.shore-floor svg{width:100%;height:100%;display:block}
.shore-kelp{position:absolute;bottom:60px;width:40px;z-index:1;transform-origin:50% 100%}
.shore-walker{position:absolute;bottom:26px;left:0;width:90px;height:auto;z-index:3}
.gsy-footer:has(.shore-seabed){background:var(--shore-deep3)}

/* ---------- banners on the module, theme and licence pages ---------- */
:is(.reg-hero,.lic-hero){position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--shore-sky-a),var(--shore-sky-b) 55%,var(--shore-sea3));color:var(--shore-hero-fg);min-height:260px;display:flex;align-items:flex-end}
:is(.reg-hero,.lic-hero)>.gsy-container{position:relative;z-index:5;width:100%}
:is(.reg-hero,.lic-hero) :is(h1,h2,p,a){color:inherit}
:is(.reg-hero,.lic-hero)::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--shore-scrim),transparent 70%)}
:is(.reg-hero,.lic-hero)>.shore-scene{z-index:0}

@media (max-width:760px){
  .shore-navlink{display:none!important}
  .shore-head .gsy-col:last-child{gap:10px}
  .shore-deep .lic-grid{grid-template-columns:1fr}
  .gsy-section:has(.shore-hero)>.gsy-row>.gsy-col:has(>.gsy-widget-shore-scene){padding:40px 0 0}
}
@media (max-width:860px){
  .shore-coast{--sea-h:200px;--head-h:120px;--sun-x:66%}
  .shore-cast{height:420px}
  .shore-fisher{right:38%;width:190px}
  .shore-crab{right:4%;width:112px}
  .shore-bubble{bottom:auto;top:0;right:auto;left:0}
}
@media (max-width:560px){
  .shore-gauge{right:max(5px,env(safe-area-inset-right,0px))}
  .shore-gauge .track{height:34vh}
  .shore-gauge b{font-size:10px}
  .shore-card>.gsy-container>.gsy-row,.shore-card>.gsy-row{padding:22px 20px}
}
@media (prefers-reduced-motion:reduce){.shore-dive{display:none}}