body[data-coast] { isolation: isolate; }
.coast-scene {
  position: fixed;
  inset: 0;
  z-index: -3;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
  opacity: calc(var(--coast-intensity) * var(--coast-depth, 1));
  --coast-x: 0px;
  --coast-y: 0px;
  --coast-scroll: 0px;
  --coast-intensity: .54;
  mask-image: linear-gradient(90deg, var(--ink) 0%, var(--ink) 5%, transparent 32%, transparent 68%, var(--ink) 95%, var(--ink));
}
[data-coast="home"] .coast-scene { --coast-intensity: 1; }
[data-coast="reading"] .coast-scene,
[data-coast="account"] .coast-scene,
[data-coast="community"] .coast-scene { --coast-intensity: .28; }
.coast-scene__light {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 2% 20%, var(--coast-light), transparent 48%), radial-gradient(ellipse at 110% 70%, var(--coast-silver), transparent 50%);
}
.coast-scene__palm, .coast-scene__fronds { position: absolute; display: block; }
.coast-scene img { display: block; width: 100%; height: auto; max-width: none; }
.coast-scene__palm {
  width: 600px;
  left: calc(50% - 820px);
  top: 120px;
  opacity: var(--coast-palm-opacity);
  transform: translate3d(calc(var(--coast-x) * -.45), calc(var(--coast-y) * -.45 - var(--coast-scroll)), 0) rotate(-3deg);
  transform-origin: 45% 95%;
  filter: grayscale(1) brightness(var(--coast-palm-light));
}
.coast-scene__fronds {
  width: 730px;
  right: calc(50% - 1110px);
  top: 165px;
  opacity: var(--coast-frond-opacity);
  transform: translate3d(var(--coast-x), calc(var(--coast-y) - var(--coast-scroll) * 1.65), 0) rotate(-12deg);
  filter: grayscale(1) brightness(var(--coast-palm-light));
}
.coast-scene__setting {
  position: absolute;
  inset: 70px -25px -25px;
  background-size: cover;
  background-position: center;
  opacity: 0;
  filter: grayscale(.6) blur(6px);
  transition: opacity 500ms ease;
}
.coast-scene.is-selected .coast-scene__setting { opacity: var(--coast-setting-opacity); }
.coast-scene.is-selected .coast-scene__palm,
.coast-scene.is-selected .coast-scene__fronds { opacity: .15; }
body[data-coast] .section--alt { background: transparent; }
.hero--coast { min-height: min(730px, calc(100svh - 72px)); display: grid; align-items: center; padding-block: 110px 130px; }
.hero--coast::after { display: none; }
.hero--coast .hero__title { font-size: clamp(48px, 8.2vw, 118px); letter-spacing: -.035em; }
.hero--coast .hero__inner { gap: 25px; }
.hero--coast .hero__kicker { margin-bottom: 5px; }
.hero--coast .hero__lede { max-width: 530px; }
.hero--coast .hero__cta { margin-top: 12px; }
.hero--coast .hero__title .accent::after { left: 2%; right: 2%; height: 3px; bottom: -.02em; }
[data-coast="home"] .about-item { position: relative; background: transparent; transition: border-color 300ms ease; }
[data-coast="home"] .about-item::before { content: ""; position: absolute; top: -1px; left: 0; width: 100%; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform 550ms var(--motion-ease); }
[data-coast="home"] .about-item.is-current::before { transform: scaleX(1); }
[data-coast="home"] .about-item.is-current .about-item__num::after { opacity: 1; }
[data-coast="home"] .about-item.is-current .about-item__icon { opacity: 1; }
[data-coast="departments"] .dept-card { transition: border-color 240ms ease; }
[data-coast="departments"] .dept-card:hover { transform: none; box-shadow: none; }
[data-coast="departments"] .dept-card__body { transition: translate 500ms var(--motion-ease); }
[data-coast="departments"] .dept-card__media { filter: grayscale(.7); transform: scale(1.015); transition: transform 900ms var(--motion-ease), filter 500ms ease; }
[data-coast="departments"] .dept-card__go { transition: transform 350ms var(--motion-ease); }
[data-coast="departments"] .dept-card__title::after { transform: scaleX(.45); transform-origin: left; transition: transform 500ms var(--motion-ease); }
[data-coast="departments"] .dept-card:focus-visible { outline: 2px solid var(--ink); outline-offset: 5px; }
[data-coast="departments"] .dept-card:focus-visible .dept-card__media { filter: grayscale(0); transform: scale(1.06); }
[data-coast="departments"] .dept-card:focus-visible .dept-card__title::after { transform: scaleX(1); }
[data-coast="news"] .news-card:hover { transform: none; }
[data-coast="news"] .news-card__body h3 a { text-decoration: none; background: linear-gradient(var(--ink), var(--ink)) left bottom / 0% 1px no-repeat; transition: background-size 380ms var(--motion-ease); }
[data-coast="news"] .news-card:focus-within h3 a { background-size: 100% 1px; }
[data-coast="gallery"] .shot--card { transition: border-color 220ms ease; }
[data-coast="gallery"] .shot--card:hover { transform: none; box-shadow: none; }
[data-coast="gallery"] .shot--card img { transition: transform 650ms var(--motion-ease), filter 400ms ease; }
[data-coast="gallery"] .shot--card:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
[data-coast="calendar"] .event-row { position: relative; }
[data-coast="calendar"] .event-row::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--ink); transform: scaleY(0); transform-origin: top; transition: transform 300ms var(--motion-ease); }
[data-coast="calendar"] .event-row:focus-visible::before { transform: scaleY(1); }
[data-coast="calendar"] .event-row__date { transition: color 250ms ease, background 250ms ease; }
[data-coast="calendar"] .cal__cell { transition: background 200ms ease; }
[data-coast="calendar"] .cal__cell:focus-within { background: var(--surface-3); box-shadow: inset 0 2px var(--ink); }
[data-coast="reading"] .rules-toc__list a { transition: border-color 240ms ease, color 240ms ease, background 240ms ease; }
.coast-reading { position: fixed; z-index: 103; top: 0; left: 0; width: 100%; height: 2px; background: var(--ink); transform-origin: left; transform: scaleX(0); pointer-events: none; }
[data-coast="account"] .input { transition: border-color 220ms ease, box-shadow 220ms ease; }
[data-coast="account"] .appstep-dot b { transition: color 250ms ease, background 250ms ease, border-color 250ms ease; }
[data-coast="account"] .char-card { transition: border-color 250ms ease; }
[data-coast="account"] .char-card:hover { transform: none; }
[data-coast="account"] .char-card:focus-within { border-color: var(--ink); }
@media (hover: hover) and (pointer: fine) {
  [data-coast="departments"] .dept-card:hover .dept-card__media { filter: grayscale(0); transform: scale(1.06); }
  [data-coast="departments"] .dept-card:hover .dept-card__body { translate: 0 -6px; }
  [data-coast="departments"] .dept-card:hover .dept-card__title::after { transform: scaleX(1); }
  [data-coast="departments"] .dept-card:hover .dept-card__go { transform: translate(2px, -2px); }
  [data-coast="news"] .news-card:hover h3 a { background-size: 100% 1px; }
  [data-coast="gallery"] .shot--card:hover img { transform: scale(1.025); }
  [data-coast="calendar"] .event-row:hover::before { transform: scaleY(1); }
  [data-coast="calendar"] .event-row:hover .event-row__date { background: var(--ink); color: var(--bg); }
  [data-coast="calendar"] .cal__cell.has-events:hover { background: var(--surface-2); }
}
@media (min-width: 2000px) {
  .coast-scene__palm { left: 0; width: 32vw; }
  .coast-scene__fronds { right: -5vw; width: 37vw; }
}
@media (max-width: 1100px) {
  .coast-scene__palm { left: -100px; width: 440px; top: 130px; }
  .coast-scene__fronds { right: -340px; width: 630px; top: 260px; }
}
@media (max-width: 700px) {
  .coast-scene { --coast-intensity: .28; mask-image: linear-gradient(90deg, var(--ink), transparent 37%, transparent 70%, var(--ink)); }
  [data-coast="home"] .coast-scene { --coast-intensity: .65; }
  .coast-scene__palm { width: 300px; left: -115px; top: 120px; }
  .coast-scene__fronds { width: 390px; right: -240px; top: 355px; }
  .hero--coast { min-height: min(700px, calc(100svh - 66px)); padding: 92px 0 105px; }
  .hero--coast .hero__inner { gap: 24px; }
  .hero--coast .hero__title { font-size: clamp(42px, 10.5vw, 70px); }
  .hero--coast .hero__lede { max-width: 280px; }
  .hero--coast .hero__cta { gap: 10px; margin-top: 8px; }
  [data-coast="departments"] .dept-card__media { filter: grayscale(.15); }
}
@media (prefers-reduced-motion: reduce) {
  .coast-scene__palm { transform: rotate(-3deg); }
  .coast-scene__fronds { transform: rotate(-12deg); }
  [data-coast="departments"] .dept-card__media,
  [data-coast="departments"] .dept-card:hover .dept-card__media,
  [data-coast="departments"] .dept-card:focus-visible .dept-card__media { transform: none; }
  [data-coast="departments"] .dept-card:hover .dept-card__body { translate: none; }
  [data-coast="gallery"] .shot--card:hover img { transform: none; }
}

