/* Sayonara_Alice.exe — Contact Channel / shared editorial footer */
.contact-channel,
.contact-channel * {
  box-sizing: border-box;
}

.contact-channel {
  --contact-cyan: 102, 231, 255;
  --contact-blue: 55, 143, 255;
  --contact-violet: 119, 92, 255;
  isolation: isolate;
  position: relative;
  width: 100%;
  overflow: hidden;
  padding:
    clamp(4.8rem, 9vw, 8rem)
    max(clamp(1.2rem, 5vw, 4.5rem), env(safe-area-inset-right))
    max(clamp(3.4rem, 7vw, 6rem), env(safe-area-inset-bottom))
    max(clamp(1.2rem, 5vw, 4.5rem), env(safe-area-inset-left));
  border-block: 1px solid rgba(var(--contact-cyan), .09);
  color: #e9fbff;
  background:
    radial-gradient(ellipse at 18% 42%, rgba(var(--contact-blue), .07), transparent 37%),
    radial-gradient(ellipse at 82% 70%, rgba(var(--contact-violet), .055), transparent 42%),
    linear-gradient(180deg, rgba(0, 8, 18, .96), rgba(0, 4, 11, .985));
}

.contact-channel::before,
.contact-channel::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.contact-channel::before {
  inset: 0;
  z-index: -2;
  opacity: .28;
  background-image:
    linear-gradient(rgba(var(--contact-cyan), .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--contact-cyan), .035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
}

.contact-channel::after {
  left: 50%;
  bottom: 0;
  z-index: -1;
  width: min(980px, 82%);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--contact-cyan), .48), rgba(var(--contact-violet), .32), transparent);
  box-shadow: 0 0 17px rgba(var(--contact-cyan), .15);
  transform: translateX(-50%);
}

.contact-channel__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "copy actions"
    "status status";
  align-items: end;
  gap: clamp(2.2rem, 5vw, 5rem);
  width: min(1080px, 100%);
  margin-inline: auto;
  opacity: 0;
  transform: translateY(18px);
}

.contact-channel.is-revealed .contact-channel__inner {
  animation: contact-channel-reveal .9s cubic-bezier(.2, .72, .18, 1) both;
}

.contact-channel__copy {
  grid-area: copy;
  min-width: 0;
}

.contact-channel__kicker {
  margin: 0 0 clamp(1.2rem, 2vw, 1.75rem);
  color: rgba(142, 230, 250, .67);
  font: 700 clamp(.65rem, .9vw, .76rem)/1.2 var(--font-mono, "Courier New", monospace);
  letter-spacing: .19em;
  text-transform: uppercase;
}

.contact-channel__email {
  display: inline-block;
  max-width: 100%;
  color: #ecfcff;
  font: 560 clamp(1.15rem, 3vw, 2.25rem)/1.15 Inter, system-ui, sans-serif;
  letter-spacing: -.025em;
  text-decoration: none;
  overflow-wrap: anywhere;
  text-shadow: 0 0 26px rgba(var(--contact-cyan), .09);
  transition: color .22s ease, text-shadow .22s ease;
}

.contact-channel__email:hover,
.contact-channel__email:focus-visible {
  color: #aaf3ff;
  text-shadow: 0 0 22px rgba(var(--contact-cyan), .24);
}

.contact-channel__email:focus-visible,
.contact-channel__button:focus-visible {
  outline: 1px solid rgba(var(--contact-cyan), .85);
  outline-offset: 5px;
}

.contact-channel__description {
  max-width: 660px;
  margin: 1rem 0 0;
  color: rgba(198, 227, 234, .67);
  font-size: clamp(.93rem, 1.4vw, 1.08rem);
  line-height: 1.65;
}

.contact-channel__actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .7rem;
  min-width: 0;
}

.contact-channel__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 154px;
  min-height: 48px;
  padding: .82rem 1.05rem;
  border: 1px solid rgba(var(--contact-cyan), .25);
  border-radius: 0;
  color: rgba(222, 249, 255, .9);
  background: rgba(3, 18, 31, .72);
  box-shadow: inset 0 0 20px rgba(var(--contact-blue), .025);
  font: 700 .66rem/1.25 var(--font-mono, "Courier New", monospace);
  letter-spacing: .12em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: border-color .22s ease, color .22s ease, background .22s ease, box-shadow .22s ease;
}

.contact-channel__button:hover,
.contact-channel__button:focus-visible {
  color: #effdff;
  border-color: rgba(var(--contact-cyan), .58);
  background: rgba(5, 31, 49, .82);
  box-shadow: inset 0 0 24px rgba(var(--contact-blue), .06), 0 0 20px rgba(var(--contact-cyan), .055);
}

.contact-channel__button--send::after {
  content: "↗";
  margin-left: .65rem;
  color: rgba(130, 235, 255, .72);
}

.contact-channel__status {
  grid-area: status;
  display: grid;
  grid-template-columns: 8px auto;
  align-items: center;
  justify-content: start;
  gap: .7rem;
  min-height: 22px;
  margin-top: clamp(.4rem, 1vw, .9rem);
  color: rgba(127, 210, 228, .52);
  font: 700 .58rem/1.4 var(--font-mono, "Courier New", monospace);
  letter-spacing: .16em;
  text-transform: uppercase;
}

.contact-channel__status i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(var(--contact-cyan), .7);
  box-shadow: 0 0 8px rgba(var(--contact-cyan), .55);
  animation: contact-channel-pulse 7.4s ease-in-out infinite paused;
}

.contact-channel.has-feedback .contact-channel__status {
  color: rgba(185, 243, 255, .88);
}

.contact-channel__trace {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1.5rem;
  height: 1px;
  overflow: hidden;
  background: rgba(var(--contact-cyan), .08);
}

.contact-channel__trace i {
  position: absolute;
  top: 0;
  left: -16%;
  width: 16%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(171, 245, 255, .86), transparent);
  box-shadow: 0 0 9px rgba(var(--contact-cyan), .45);
  animation: contact-channel-scan 9.6s cubic-bezier(.44, .04, .55, .96) infinite paused;
}

.contact-channel__ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.contact-channel__ambient i,
.contact-channel__ambient b {
  position: absolute;
}

.contact-channel__ambient i:first-child {
  left: 6%;
  top: 32%;
  width: 18%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--contact-cyan), .18));
}

.contact-channel__ambient i:nth-child(2) {
  right: 9%;
  bottom: 24%;
  width: 62px;
  height: 62px;
  border: 1px solid rgba(var(--contact-violet), .08);
  border-color: rgba(var(--contact-violet), .11) transparent rgba(var(--contact-cyan), .08);
  border-radius: 50%;
  animation: contact-channel-phase 13s ease-in-out infinite paused;
}

.contact-channel__ambient b {
  right: clamp(1.2rem, 4vw, 3.5rem);
  top: 20%;
  color: rgba(var(--contact-cyan), .055);
  font: 700 clamp(2rem, 6vw, 5.4rem)/1 var(--font-mono, monospace);
  letter-spacing: -.08em;
}

.contact-channel.is-in-view:not(.is-page-hidden) .contact-channel__status i,
.contact-channel.is-in-view:not(.is-page-hidden) .contact-channel__trace i,
.contact-channel.is-in-view:not(.is-page-hidden) .contact-channel__ambient i:nth-child(2) {
  animation-play-state: running;
}

.contact-channel__clipboard-fallback {
  position: fixed;
  left: -9999px;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
}

@keyframes contact-channel-reveal {
  0% { opacity: 0; transform: translateY(18px); }
  58% { opacity: 1; }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes contact-channel-pulse {
  0%, 34%, 44%, 78%, 100% { opacity: .48; transform: scale(.82); }
  38% { opacity: 1; transform: scale(1.42); }
  41% { opacity: .68; transform: scale(.96); }
  82% { opacity: .9; transform: scale(1.15); }
}

@keyframes contact-channel-scan {
  0%, 16% { left: -16%; opacity: 0; }
  21% { opacity: 1; }
  47% { left: 100%; opacity: .78; }
  51%, 100% { left: 100%; opacity: 0; }
}

@keyframes contact-channel-phase {
  0%, 31%, 55%, 100% { opacity: .28; transform: scale(.92) rotate(-8deg); }
  39% { opacity: .58; transform: scale(1.04) rotate(-2deg); }
  44% { opacity: .34; transform: scale(.97) rotate(2deg); }
  76% { opacity: .46; transform: scale(1) rotate(5deg); }
}

@media (max-width: 900px) {
  .contact-channel__inner {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "copy" "actions" "status";
    align-items: start;
    gap: 2rem;
  }

  .contact-channel__actions {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .contact-channel {
    padding-top: clamp(4rem, 18vw, 5.2rem);
  }

  .contact-channel__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .contact-channel__button {
    width: 100%;
    min-width: 0;
  }

  .contact-channel__status {
    align-items: start;
    letter-spacing: .11em;
  }

  .contact-channel__ambient b {
    top: 12%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .contact-channel__inner {
    opacity: 1;
    transform: none;
  }

  .contact-channel.is-revealed .contact-channel__inner,
  .contact-channel *,
  .contact-channel *::before,
  .contact-channel *::after {
    animation: none !important;
    transition: none !important;
  }

  .contact-channel__status i { opacity: .72; transform: none; }
  .contact-channel__trace i { left: 42%; opacity: .5; }
  .contact-channel__ambient i:nth-child(2) { opacity: .34; transform: none; }
}