/**
 * FM-POLISH-005C — Welcome Inset Edge Blend
 * Soft inward-cut corners + edge blending. Composition unchanged.
 */

:root {
  --fm-p5c-cut: 24px;
  --fm-p5c-cut-soft: 1.5px;
}

body.fm-polish-005c-auth {
  --fm-p5c-cut: 24px;
}

/* Soft circular bites at each corner — background shows through */
body.fm-polish-005c-auth .fm-auth-card {
  --fm-p5c-cut: 24px;
  border-radius: 0 !important; /* silhouette comes from the mask */
  border: 0 !important;
  background-color: #EDE6D6 !important;
  background-image:
    linear-gradient(180deg, rgba(255, 252, 245, 0.22) 0%, transparent 34%),
    linear-gradient(180deg, #F0EBE0 0%, #E8E1D0 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    0 1px 1px rgba(14, 35, 27, 0.035),
    0 10px 26px rgba(14, 35, 27, 0.075),
    0 32px 72px rgba(12, 30, 24, 0.11),
    0 -18px 56px rgba(245, 241, 232, 0.10) !important;
  -webkit-mask-image:
    radial-gradient(circle at 0 0,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 100% 0,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 100% 100%,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 0 100%,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px));
  mask-image:
    radial-gradient(circle at 0 0,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 100% 0,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 100% 100%,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px)),
    radial-gradient(circle at 0 100%,
      transparent calc(var(--fm-p5c-cut) - var(--fm-p5c-cut-soft)),
      #000 calc(var(--fm-p5c-cut) + 0.25px));
  -webkit-mask-size: 51% 51%;
  mask-size: 51% 51%;
  -webkit-mask-position: top left, top right, bottom right, bottom left;
  mask-position: top left, top right, bottom right, bottom left;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  /* Soft green-grey edge via outline outside mask? outline follows border-box before mask.
     Use filter drop-shadow for ambient edge that follows the masked silhouette. */
  filter:
    drop-shadow(0 1px 1px rgba(14, 35, 27, 0.04))
    drop-shadow(0 14px 36px rgba(12, 30, 24, 0.12));
}

/* Top edge — faint green→graphite, below 1px visual weight */
body.fm-polish-005c-auth .fm-auth-card::before {
  height: 1px !important;
  top: 0;
  left: var(--fm-p5c-cut);
  right: var(--fm-p5c-cut);
  width: auto;
  opacity: 0.55;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(127, 146, 136, 0.45) 18%,
    rgba(30, 74, 56, 0.5) 50%,
    rgba(63, 69, 66, 0.4) 82%,
    transparent 100%
  ) !important;
  border-radius: 0;
  z-index: 2;
  pointer-events: none;
}

body.fm-polish-005c-auth .fm-auth-card > * {
  position: relative;
  z-index: 1;
}

/* Focus rings must stay visible — pad content away from cut zones */
body.fm-polish-005c-auth .fm-auth-card {
  padding-left: max(22px, calc(var(--fm-p5c-cut) * 0.55 + 14px)) !important;
  padding-right: max(22px, calc(var(--fm-p5c-cut) * 0.55 + 14px)) !important;
}

body.fm-polish-005c-auth .fm-auth-btn:focus-visible {
  outline: 2px solid #214B39;
  outline-offset: 3px;
  z-index: 3;
}

/* —— Cut depth by breakpoint —— */
@media (min-width: 901px) {
  body.fm-polish-005c-auth .fm-auth-card {
    --fm-p5c-cut: 26px;
  }
}

@media (max-width: 900px) {
  body.fm-polish-005c-auth .fm-auth-card {
    --fm-p5c-cut: 18px;
  }
}

@media (max-width: 640px) {
  body.fm-polish-005c-auth .fm-auth-card {
    --fm-p5c-cut: 12px;
  }
  body.fm-polish-005c-auth .fm-auth-card {
    filter:
      drop-shadow(0 1px 1px rgba(14, 35, 27, 0.03))
      drop-shadow(0 10px 28px rgba(12, 30, 24, 0.12));
  }
}

/* Short height: slightly shallower cuts so content breathes */
@media (max-height: 820px) {
  body.fm-polish-005c-auth .fm-auth-card {
    --fm-p5c-cut: 20px;
  }
}

@media (max-height: 760px) and (min-width: 641px) {
  body.fm-polish-005c-auth .fm-auth-card {
    --fm-p5c-cut: 16px;
  }
}

/* RTL — same geometric mask (symmetric) */
html[dir="rtl"] body.fm-polish-005c-auth .fm-auth-card {
  -webkit-mask-position: top right, top left, bottom left, bottom right;
  mask-position: top right, top left, bottom left, bottom right;
}

/* Neutralize prior hard radius/border from 005/005A on auth cards */
body.fm-polish-005c-auth.fm-polish-005a-auth .fm-auth-card,
body.fm-polish-005c-auth.fm-polish-005-auth .fm-auth-card {
  border-radius: 0 !important;
  border-color: transparent !important;
}
