[data-theme="beach"] {
  --blanket-white: #fdf6f0;
  --fringe-bg: #fca5a5;

  /* Sand: fractal-noise + diffuse-lighting SVG */
  --sand: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='190' height='254' preserveAspectRatio='none'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='0.080 0.200' numOctaves='4' seed='7' result='n'/><feDiffuseLighting in='n' lighting-color='%23fff' surfaceScale='1.1' diffuseConstant='1.05'><feDistantLight azimuth='235' elevation='55'/></feDiffuseLighting></filter><rect width='100%25' height='100%25' filter='url(%23s)' opacity='0.58'/></svg>");

  --blanket: repeating-linear-gradient(
    45deg,
    #ff6b6b 0px,
    #ff6b6b 15px,
    #fed7aa 15px,
    #fed7aa 30px,
    #60a5fa 30px,
    #60a5fa 45px,
    #fca5a5 45px,
    #fca5a5 60px
  );
  --fringe: repeating-linear-gradient(
    90deg,
    #ffffff 0 3px,
    var(--fringe-bg) 2px 6px
  );

  --font-family: "Outfit", sans-serif;
  --text-color: #ffffff;
  --page-bg: var(--sand) center / cover no-repeat, #e8cba3;
  --container-bg: transparent;
  --card-border: transparent;
  --card-shadow: 1px 1px 6px rgba(74, 40, 12, 0.35);
  --card-front-bg: transparent;
  --card-back-bg: transparent;
  --theme-cycle-bg: var(--blanket-white);
  --theme-cycle-color: #fca5a5;
  --icon-circle-bg: #ff6b6b;
  --icon-circle-pad: 0.28rem;
}

[data-theme="beach"] body {
  background-blend-mode: overlay;
}

[data-theme="beach"] .theme-cycle {
  box-shadow: none;
  border: transparent;
  background-blend-mode: overlay;
}

[data-theme="beach"] .title {
  font-family: "Original Surfer", sans-serif;
}

[data-theme="beach"] .roles,
[data-theme="beach"] .contact-links {
  font-weight: 700;
}

[data-theme="beach"] .flip-card-front,
[data-theme="beach"] .flip-card-back {
  border: none;
  border-radius: 0;
  text-shadow:
    0 0 2px #000000,
    0 0 1px #000000;
  background:
    var(--fringe) top / 100% 15px repeat-x,
    var(--fringe) bottom / 100% 15px repeat-x,
    var(--blanket),
    var(--blanket-white);
}
