
@font-face {
  font-family: "Fraunces"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fonts/abyss-fraunces-var.woff2") format("woff2");
}
@font-face {
  font-family: "Hanken Grotesk"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fonts/abyss-hanken-var.woff2") format("woff2");
}

:root[data-theme="abyss"] {
  color-scheme: dark;
  --ab-surface: #0F6E6A;
  --ab-jade:    #3FD9BE;
  --ab-deep:    #030A14;
  --ab-pink:    #F7C5D5;
  --ab-foam:    #E9FBF6;
  --ab-foam-2:  #C4E3DC;
  --ab-hair:    rgba(63, 217, 190, 0.38);
  --ab-hair-2:  rgba(63, 217, 190, 0.2);
  --ab-ease:    cubic-bezier(0.22, 0.8, 0.2, 1);
  --ab-slow:    cubic-bezier(0.32, 0.72, 0, 1);
  --font-ab-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-ab-body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;

  --bg:       var(--ab-surface);
  --shell:    var(--ab-surface);
  --core:     rgba(3, 10, 20, 0.5);
  --fg:       var(--ab-foam);
  --muted-fg: var(--ab-foam-2);
  --navy:     var(--ab-foam);
  --navy-2:   var(--ab-foam-2);
  --navy-deep: var(--ab-deep);
  --action:      var(--ab-foam);
  --action-lift: var(--ab-pink);
  --action-deep: var(--ab-pink);
  --action-wash: rgba(247, 197, 213, 0.12);
  --on-action:   var(--ab-deep);
  --hair:     var(--ab-hair);
  --hair-2:   var(--ab-hair-2);
  --nav-ink:  var(--ab-foam);
  --edge:        var(--ab-hair);
  --quiet:       rgba(3, 10, 20, 0.4);
  --quiet-ink:   var(--ab-foam);
  --edge-action: var(--ab-foam);
  --action-soft: rgba(233, 251, 246, 0.1);
  --nav-accent:  var(--ab-pink);
  --inner-hi: transparent;
  --grain:    0;
  --select-bg:  var(--ab-pink);
  --select-ink: var(--ab-deep);
  --on-band:      var(--ab-foam);
  --on-band-2:    var(--ab-foam-2);
  --band-accent:  var(--ab-foam);
  --band-hair:    var(--ab-hair);
  --r-out: 24px; --r-in: 18px; --r-sm: 10px; --r-pill: 999px;
}
:root[data-theme="abyss"]:not(#_) {
  color-scheme: dark;
  --bg:       var(--ab-surface);
  --shell:    var(--ab-surface);
  --core:     rgba(3, 10, 20, 0.5);
  --fg:       var(--ab-foam);
  --muted-fg: var(--ab-foam-2);
  --navy:     var(--ab-foam);
  --navy-2:   var(--ab-foam-2);
  --navy-deep: var(--ab-deep);
  --action:      var(--ab-foam);
  --action-lift: var(--ab-pink);
  --action-deep: var(--ab-pink);
  --action-wash: rgba(247, 197, 213, 0.12);
  --on-action:   var(--ab-deep);
  --hair:     var(--ab-hair);
  --hair-2:   var(--ab-hair-2);
  --nav-ink:  var(--ab-foam);
  --edge:        var(--ab-hair);
  --quiet:       rgba(3, 10, 20, 0.4);
  --quiet-ink:   var(--ab-foam);
  --edge-action: var(--ab-foam);
  --action-soft: rgba(233, 251, 246, 0.1);
  --inner-hi: transparent;
  --grain:    0;
  --select-bg:  var(--ab-pink);
  --select-ink: var(--ab-deep);
  --on-band:      var(--ab-foam);
  --on-band-2:    var(--ab-foam-2);
  --band-accent:  var(--ab-foam);
  --band-hair:    var(--ab-hair);
  --gp-paper:      var(--ab-surface);
  --gp-ink:        var(--ab-foam);
  --gp-field:      var(--ab-deep);
  --gp-foreground: var(--ab-foam);
  --r-out: 24px; --r-in: 18px; --r-sm: 10px; --r-pill: 999px;
  scrollbar-color: #1B5560 var(--ab-deep);
}

:root[data-theme="abyss"] { background-color: var(--ab-surface); }
:root[data-theme="abyss"] body {
  background: transparent; color: var(--ab-foam);
  font-family: var(--font-ab-body); font-size: 1.125rem; line-height: 1.65; font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
:root[data-theme="abyss"] ::selection { background: var(--ab-pink); color: var(--ab-deep); }

.ab-deep { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; contain: strict; }
.ab-deep > * { position: absolute; inset: 0; will-change: opacity; }
:root:not([data-theme="abyss"]) .ab-deep { display: none; }
.ab-l-surface { background: linear-gradient(180deg, #17908A 0%, #0F6E6A 22%, #0A5059 46%, #07383F 70%, #052A34 100%); }
.ab-l-mid     { background: linear-gradient(180deg, #0C5560 0%, #08394A 52%, #062838 100%); opacity: 0; }
.ab-l-deep    { background: linear-gradient(180deg, #051A28 0%, #030A14 55%, #020812 100%); opacity: 0; }
.ab-l-black   { background: linear-gradient(180deg, #020912 0%, #010409 100%); opacity: 0; }
.ab-l-sun {
  background: radial-gradient(120% 62% at 50% -12%, rgba(120, 245, 220, 0.5) 0%, rgba(63, 217, 190, 0.2) 38%, rgba(63, 217, 190, 0) 70%);
}
.ab-shafts { opacity: 0.8; overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.87) 0%, rgba(0, 0, 0, 0.4) 51%, rgba(0, 0, 0, 0.04) 100%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.87) 0%, rgba(0, 0, 0, 0.4) 51%, rgba(0, 0, 0, 0.04) 100%); }
.ab-shaft {
  position: absolute; top: -14%; width: 16%; height: 130%;
  background: linear-gradient(90deg, rgba(190, 255, 238, 0) 0%, rgba(190, 255, 238, 0.3) 50%, rgba(190, 255, 238, 0) 100%);
  transform-origin: 50% 0; animation: ab-sway 17s ease-in-out infinite alternate;
}
.ab-shaft:nth-child(1) { left: -2%;  animation-duration: 19s; transform: rotate(-9deg); }
.ab-shaft:nth-child(2) { left: 22%;  animation-duration: 23s; animation-delay: -6s; width: 11%; transform: rotate(-3deg); }
.ab-shaft:nth-child(3) { left: 47%;  animation-duration: 21s; animation-delay: -11s; width: 20%; transform: rotate(5deg); }
.ab-shaft:nth-child(4) { left: 74%;  animation-duration: 25s; animation-delay: -3s; width: 13%; transform: rotate(10deg); }
@keyframes ab-sway { from { rotate: -3.2deg; } to { rotate: 3.4deg; } }
.ab-caustic { inset: -640px 0 0 -640px; background-repeat: repeat; background-size: 640px 640px; opacity: 0; }
.ab-caustic.a { animation: ab-drift-a 70s linear infinite; }
.ab-caustic.b { right: -440px; background-size: 440px 440px; animation: ab-drift-b 90s linear infinite; }
@keyframes ab-drift-a { to { transform: translate3d(640px, 320px, 0); } }
@keyframes ab-drift-b { to { transform: translate3d(-440px, 440px, 0); } }
.ab-l-veil { background: linear-gradient(180deg, rgba(5, 42, 52, 0) 0%, rgba(5, 42, 52, 0) 34%, rgba(5, 42, 52, 0.9) 62%, rgba(5, 42, 52, 0.95) 100%); }
.ab-motes { width: 100%; height: 100%; }

:root[data-theme="abyss"] .island {
  background: rgba(3, 14, 22, 0.58); border: 1px solid var(--ab-hair); border-radius: 999px;
  -webkit-backdrop-filter: blur(16px) saturate(1.2); backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: none;
}
:root[data-theme="abyss"] .brand-mark { fill: var(--ab-foam); color: var(--ab-foam); }
:root[data-theme="abyss"] .brand { color: var(--ab-foam); }
:root[data-theme="abyss"] :is(.island-links a, .vent-trigger, .vent-panel a, .foot-nav a) {
  font-family: var(--font-ab-body); font-weight: 500; font-size: 1.0625rem; color: var(--ab-foam); letter-spacing: 0.01em;
}
:root[data-theme="abyss"] .island-links a:hover, :root[data-theme="abyss"] .vent-trigger:hover,
:root[data-theme="abyss"] .vent-trigger[aria-expanded="true"] { color: var(--ab-pink); }
:root[data-theme="abyss"] .island-links a[aria-current], :root[data-theme="abyss"] .vent-trigger[aria-current] { color: var(--ab-pink); }
:root[data-theme="abyss"] .vent-panel {
  background: rgba(3, 12, 22, 0.92); border: 1px solid var(--ab-hair); border-radius: 22px; box-shadow: none;
}
:root[data-theme="abyss"] .vent-panel a { border-radius: 14px; }
:root[data-theme="abyss"] .vent-panel a:hover { background: rgba(247, 197, 213, 0.1); color: var(--ab-pink); }
:root[data-theme="abyss"] .vent-panel a[aria-current] { color: var(--ab-pink); background: transparent; }
:root[data-theme="abyss"] .vent-all::before, :root[data-theme="abyss"] .vent-sep::before { background: var(--ab-hair); }
:root[data-theme="abyss"] .icon-btn { border: 1px solid var(--ab-hair); color: var(--ab-foam); background: transparent; border-radius: 999px; }
:root[data-theme="abyss"] .icon-btn:hover, :root[data-theme="abyss"] .theme-btn[aria-expanded="true"] { background: rgba(247, 197, 213, 0.1); border-color: var(--ab-pink); color: var(--ab-pink); }
:root[data-theme="abyss"] .theme-btn .sun, :root[data-theme="abyss"] .theme-btn .tech { display: none; }
:root[data-theme="abyss"] .theme-btn .moon { display: none; }
:root[data-theme="abyss"] .theme-btn .abyss { display: block; }
:root[data-theme="abyss"] .tm-menu {
  --tm-ring: var(--ab-pink);
  background: rgba(3, 12, 22, 0.94); border: 1px solid var(--ab-hair); border-radius: 22px; box-shadow: none;
}
:root[data-theme="abyss"] .tm-name { color: var(--ab-foam); font-family: var(--font-ab-body); }
:root[data-theme="abyss"] .menu { background: rgba(3, 10, 20, 0.96); -webkit-backdrop-filter: none; backdrop-filter: none; }
:root[data-theme="abyss"] .menu a { color: var(--ab-foam); font-family: var(--font-ab-display); font-weight: 300; border-bottom: 1px solid var(--ab-hair-2); }
:root[data-theme="abyss"] .menu a[aria-current] { color: var(--ab-pink); }
:root[data-theme="abyss"] .menu-foot, :root[data-theme="abyss"] .menu-foot a { color: var(--ab-foam-2); font-size: 1.125rem; }

:root[data-theme="abyss"] .btn {
  font-family: var(--font-ab-body); font-weight: 600; font-size: 1.0625rem; letter-spacing: 0.005em;
  border-radius: 999px; box-shadow: none;
  transition: background-color 420ms var(--ab-ease), color 420ms var(--ab-ease), border-color 420ms var(--ab-ease), transform 420ms var(--ab-ease);
}
:root[data-theme="abyss"] .btn.solid { background: var(--ab-foam); color: var(--ab-deep); }
:root[data-theme="abyss"] .btn.solid:hover { background: var(--ab-pink); color: var(--ab-deep); }
:root[data-theme="abyss"] .btn.solid .pip { background: rgba(3, 10, 20, 0.12); color: var(--ab-deep); }
:root[data-theme="abyss"] .btn.line { background: transparent; border: 1px solid rgba(233, 251, 246, 0.6); color: var(--ab-foam); }
:root[data-theme="abyss"] .btn.line:hover { background: rgba(247, 197, 213, 0.12); border-color: var(--ab-pink); color: var(--ab-pink); }
:root[data-theme="abyss"] .btn.line .pip { background: rgba(233, 251, 246, 0.14); color: var(--ab-foam); }
:root[data-theme="abyss"] .text-link { color: var(--ab-foam); font-weight: 500; text-decoration: underline; text-decoration-color: var(--ab-hair); text-underline-offset: 7px; text-decoration-thickness: 1px; }
:root[data-theme="abyss"] .text-link:hover { color: var(--ab-pink); text-decoration-color: var(--ab-pink); }
:root[data-theme="abyss"] :is(.foot a, .foot-nav a):hover { color: var(--ab-pink); }
:root[data-theme="abyss"] a:focus-visible, :root[data-theme="abyss"] button:focus-visible, :root[data-theme="abyss"] [tabindex]:focus-visible {
  outline: 2px solid var(--ab-pink); outline-offset: 4px;
}
:root[data-theme="abyss"] .skip { background: var(--ab-foam); color: var(--ab-deep); }

:root[data-theme="abyss"] :is(h1, h2, h3, .big-quote, .num, .yr, .statement) {
  font-family: var(--font-ab-display); font-weight: 300; font-optical-sizing: auto; font-variation-settings: "wght" 300;
  letter-spacing: -0.02em; color: var(--ab-foam);
}
:root[data-theme="abyss"] h2 { font-size: clamp(2.6rem, 6vw, 5rem); line-height: 1.02; margin: 0 0 clamp(36px, 5vw, 64px); }
:root[data-theme="abyss"] .lede { font-size: 1.25rem; line-height: 1.6; color: var(--ab-foam-2); }
:root[data-theme="abyss"] :is(p, li, dd, dt, blockquote, figcaption, small) { font-family: var(--font-ab-body); }

.ab-hero {
  position: relative; z-index: 0; isolation: isolate;
  min-height: max(700px, calc(var(--vh, 1svh) * 100));
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 0 clamp(36px, 6vh, 72px); touch-action: pan-y; overflow: hidden;
}
.ab-stage { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.ab-word {
  position: absolute; left: 50%; top: clamp(112px, 17svh, 190px);
  width: min(80vw, 1160px); height: auto; transform: translateX(-50%);
  fill: var(--ab-foam); overflow: visible;
}
.ab-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: pan-y; }
.ab-live .ab-word { opacity: 0; }
.ab-words {
  position: relative; z-index: 2; text-align: center;
  display: flex; flex-direction: column; align-items: center;
  margin-top: calc(clamp(112px, 17svh, 190px) + min(80vw, 1160px) * 0.2236 + clamp(18px, 3svh, 34px));
}
.ab-motto {
  margin: 0; font-family: var(--font-ab-display); font-weight: 300; font-size: clamp(1.9rem, 3.4vw, 2.9rem);
  letter-spacing: -0.015em; line-height: 1.1; color: var(--ab-foam);
}
.ab-place { margin: 14px 0 clamp(26px, 4svh, 50px); font-size: 1rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ab-foam-2); display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; }
.ab-place span + span::before { content: ""; display: inline-block; width: 28px; height: 1px; background: var(--ab-hair); vertical-align: middle; margin-right: 14px; }
.ab-words .statement { font-size: clamp(1.45rem, 2.2vw, 1.95rem); line-height: 1.25; max-width: 30ch; margin: 0 0 10px; text-wrap: balance; }
.ab-words .lede { margin: 0 0 26px; max-width: 44ch; }
.ab-words .hero-actions { margin: 0; }
@media (max-width: 700px) {
  .ab-word { width: 90vw; top: 112px; }
  .ab-words { margin-top: calc(112px + 90vw * 0.2236 + 20px); }
}

:root[data-theme="abyss"] .ventures { position: relative; isolation: isolate; }
:root[data-theme="abyss"] .ventures > * { position: relative; z-index: 1; }
:root[data-theme="abyss"] .ventures > .ab-school { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; pointer-events: none; }
:root[data-theme="abyss"] .v-preview { display: none !important; }
:root[data-theme="abyss"] .v-index { display: grid; grid-template-columns: minmax(0, 1fr); gap: 56px; border: 0; margin-top: 0; }
:root[data-theme="abyss"] .v-index li { border: 0; }
:root[data-theme="abyss"] .v-index:hover .v-row { opacity: 1; }
:root[data-theme="abyss"] .v-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ph ph" "name arrow" "what when";
  gap: 6px 18px; padding: 0; align-items: baseline;
}
:root[data-theme="abyss"] .ab-ph {
  grid-area: ph; display: block; aspect-ratio: 16 / 10; overflow: hidden; margin-bottom: 20px;
  border-radius: 20px; border: 1px solid var(--ab-hair); background: rgba(3, 10, 20, 0.5);
  transition: border-color 500ms var(--ab-ease), transform 700ms var(--ab-slow);
}
:root[data-theme="abyss"] .ab-ph img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; transition: transform 900ms var(--ab-slow); }
:root[data-theme="abyss"] .ab-ph img.ab-pixel { image-rendering: pixelated; background: #FEF1DE; }
:root[data-theme="abyss"] .v-name {
  font-family: var(--font-ab-display); font-weight: 300; font-size: clamp(2rem, 3.4vw, 2.9rem);
  letter-spacing: -0.02em; line-height: 1.06; color: var(--ab-foam);
}
:root[data-theme="abyss"] .v-what, :root[data-theme="abyss"] .v-when { font-size: 1.0625rem; color: var(--ab-foam-2); }
:root[data-theme="abyss"] .v-row:hover .v-name { transform: none; }
:root[data-theme="abyss"] .v-row:hover .ab-ph, :root[data-theme="abyss"] .v-row:focus-visible .ab-ph { border-color: var(--ab-pink); }
:root[data-theme="abyss"] .v-row:hover .ab-ph img, :root[data-theme="abyss"] .v-row:focus-visible .ab-ph img { transform: scale(1.035); }
:root[data-theme="abyss"] .v-row:hover .v-name, :root[data-theme="abyss"] .v-row:focus-visible .v-name { color: var(--ab-pink); }
:root[data-theme="abyss"] .v-row:focus-visible { outline: 2px solid var(--ab-pink); outline-offset: 10px; border-radius: 22px; }
:root[data-theme="abyss"] .v-arrow { color: var(--ab-foam); }
@media (min-width: 900px) {
  :root[data-theme="abyss"] .v-index { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(72px, 8vw, 112px) clamp(48px, 7vw, 104px); }
  :root[data-theme="abyss"] .v-row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ph ph" "name arrow" "what when"; padding: 0; }
  :root[data-theme="abyss"] .v-what, :root[data-theme="abyss"] .v-when { font-size: 1.0625rem; }
}

:root[data-theme="abyss"] .proof dd { font-size: clamp(3.2rem, 7.4vw, 6.2rem); font-weight: 300; letter-spacing: -0.03em; }
:root[data-theme="abyss"] .proof dt { font-size: 1.0625rem; color: var(--ab-foam-2); }
:root[data-theme="abyss"] .proof > div { border-top: 1px solid var(--ab-hair); padding-top: 22px; }
:root[data-theme="abyss"] .quote { border-top: 1px solid var(--ab-hair); }
:root[data-theme="abyss"] .quote blockquote { font-size: 1.1875rem; line-height: 1.62; color: var(--ab-foam); }
:root[data-theme="abyss"] .quote figcaption { font-size: 1rem; color: var(--ab-foam-2); }

:root[data-theme="abyss"] .works, :root[data-theme="abyss"] .about-bleed { background: transparent; }
:root[data-theme="abyss"] .ww-cap { color: var(--ab-foam); font-family: var(--font-ab-body); }
:root[data-theme="abyss"] .ww-cap small { color: var(--ab-foam-2); font-size: 0.9375rem; }
:root[data-theme="abyss"] .ww-hint { font-family: var(--font-ab-body); color: var(--ab-foam-2); }
:root[data-theme="abyss"] .big-quote { font-size: clamp(2rem, 4.4vw, 3.4rem); line-height: 1.14; font-weight: 300; max-width: 22ch; }
:root[data-theme="abyss"] .big-quote b { font-weight: 400; color: var(--ab-pink); }
:root[data-theme="abyss"] .who-line { color: var(--ab-foam-2); font-size: 1.1875rem; }
:root[data-theme="abyss"] .portrait { border-radius: 0; }

:root[data-theme="abyss"] footer { border-top: 1px solid var(--ab-hair-2); }
:root[data-theme="abyss"] .foot, :root[data-theme="abyss"] .foot a { color: var(--ab-foam-2); font-size: 1.0625rem; }
:root[data-theme="abyss"] .foot .brand { color: var(--ab-foam); }
:root[data-theme="abyss"] .foot-nav { border-bottom: 1px solid var(--ab-hair-2); }

:root[data-theme="abyss"] main > #contact {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: max(780px, calc(var(--vh, 1svh) * 100));
  display: flex; align-items: flex-end;
  padding-block: 0 clamp(72px, 10vh, 130px) !important;
}
:root[data-theme="abyss"] main > #contact > .ab-lure { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; pointer-events: none; }
:root[data-theme="abyss"] main > #contact > .contact {
  position: relative; z-index: 1; display: block; width: 100%;
  background: transparent; border: 0; border-radius: 0; color: var(--ab-foam); overflow: visible;
  padding-block: 0;
}
:root[data-theme="abyss"] .contact h2 { color: var(--ab-foam); font-size: clamp(3rem, 7vw, 6rem); margin-bottom: 18px; }
:root[data-theme="abyss"] .contact p { color: var(--ab-foam-2); font-size: 1.25rem; max-width: 34ch; margin: 0 0 30px; }
:root[data-theme="abyss"] .contact .contact-addr { color: var(--ab-foam-2); font-family: var(--font-ab-body); font-size: 1.0625rem; margin: 22px 0 0; }
:root[data-theme="abyss"] .contact .btn { min-height: 58px; font-size: 1.125rem; }
:root[data-theme="abyss"] .contact .btn.solid { background: var(--ab-foam); color: var(--ab-deep); position: relative; }
:root[data-theme="abyss"] .contact .btn.solid:hover { background: var(--ab-pink); color: var(--ab-deep); }
:root[data-theme="abyss"] .contact .btn.solid .pip { background: rgba(3, 10, 20, 0.12); color: var(--ab-deep); }
:root[data-theme="abyss"] .contact .btn.line { background: transparent; border-color: rgba(233, 251, 246, 0.6); color: var(--ab-foam); }
:root[data-theme="abyss"] .contact .btn.line:hover { background: rgba(247, 197, 213, 0.12); border-color: var(--ab-pink); color: var(--ab-pink); }
:root[data-theme="abyss"] .contact .btn.line .pip { background: rgba(233, 251, 246, 0.14); color: var(--ab-foam); }
:root[data-theme="abyss"] .btn.ab-lit::before {
  content: ""; position: absolute; z-index: -1; inset: -46px -56px; border-radius: 999px; pointer-events: none;
  background: radial-gradient(closest-side, rgba(247, 197, 213, 0.34), rgba(247, 197, 213, 0));
  opacity: var(--ab-lit, 0.4);
}
@media (max-width: 899px) {
  :root[data-theme="abyss"] main > #contact { min-height: 820px; }
}

.ab-flood-fx { position: fixed; left: 0; top: 0; z-index: 2000; pointer-events: none; view-transition-name: ab-flood-fx; }
::view-transition-group(ab-flood-fx), ::view-transition-image-pair(ab-flood-fx),
::view-transition-old(ab-flood-fx), ::view-transition-new(ab-flood-fx) { animation: none; mix-blend-mode: normal; }
:root[data-theme="abyss"] .contact-pick legend { font-size: 0.9375rem; letter-spacing: 0.1em; color: var(--ab-foam-2); }
:root[data-theme="abyss"] .contact-pick span { font-size: 1rem; border-color: var(--ab-hair); color: var(--ab-foam); }
:root[data-theme="abyss"] .contact-pick label:hover span { border-color: var(--ab-pink); color: var(--ab-pink); }
:root[data-theme="abyss"] .contact-pick input:checked + span { background: var(--ab-foam); border-color: var(--ab-foam); color: var(--ab-deep); }
:root[data-theme="abyss"] .contact-pick input:focus-visible + span { outline: 2px solid var(--ab-pink); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .ab-shaft, .ab-caustic { animation: none !important; }
  :root[data-theme="abyss"] .ab-ph, :root[data-theme="abyss"] .ab-ph img { transition: none; }
}
