.kento-special-page .skill-page {
  --kento-ink: #282334;
  --kento-muted: #686170;
  --kento-purple: #6656c9;
  --kento-rose: #b54b87;
  --kento-apricot: #a8583e;
  --kento-line: #e8e2ed;
  --kento-soft: #f8f5fa;
  --kento-tint: #f3eef7;
  color: var(--kento-ink);
  background: #fff;
}

.kento-special-page .skill-hero {
  color: var(--kento-ink);
  border-bottom: 1px solid #e4dbe9;
  background:
    radial-gradient(circle at 82% 16%, rgba(229, 154, 103, .24), transparent 29%),
    radial-gradient(circle at 68% 44%, rgba(197, 84, 150, .18), transparent 35%),
    radial-gradient(circle at 18% 12%, rgba(102, 86, 201, .16), transparent 30%),
    linear-gradient(145deg, #f3f0fa 0%, #faf3f7 56%, #f8eee9 100%);
}

.kento-special-page .skill-hero::before {
  opacity: .42;
  background-image:
    linear-gradient(rgba(102, 86, 201, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(102, 86, 201, .055) 1px, transparent 1px);
  mask-image: linear-gradient(90deg, #000, transparent 82%);
}

.kento-special-page .skill-hero .eyebrow,
.kento-special-page .skill-section .eyebrow {
  width: fit-content;
  color: var(--kento-purple);
}

.kento-special-page .skill-page .eyebrow::before {
  background: linear-gradient(90deg, var(--kento-purple), var(--kento-rose), var(--kento-apricot));
}

.kento-special-page .skill-hero h1 {
  color: #211c2b;
}

.kento-special-page .skill-hero__mark {
  color: var(--kento-purple);
  filter: drop-shadow(0 12px 22px rgba(197, 84, 150, .18));
}

.kento-special-page .skill-hero__lead,
.kento-special-page .skill-hero__support {
  color: var(--kento-muted);
}

.kento-special-page .skill-hero__label {
  color: var(--kento-purple);
  opacity: .045;
}

.kento-special-page .skill-hero .button {
  color: #fff;
  border: 0;
  background: linear-gradient(110deg, var(--kento-purple), var(--kento-rose) 58%, var(--kento-apricot));
  box-shadow: 0 16px 34px rgba(126, 72, 151, .2);
}

.kento-special-page .skill-hero .button:hover {
  color: #fff;
  box-shadow: 0 20px 42px rgba(126, 72, 151, .28);
  transform: translateY(-1px);
}

.kento-special-page .skill-hero .button:focus-visible,
.kento-special-page .copy-button:focus-visible,
.kento-special-page summary:focus-visible,
.kento-special-page .skill-disclaimer a:focus-visible {
  outline: 3px solid rgba(102, 86, 201, .35);
  outline-offset: 3px;
}

.kento-special-page .skill-intro {
  background: #fff;
}

.kento-special-page .skill-intro__copy,
.kento-special-page .skill-section__heading > p:not(.eyebrow),
.kento-special-page .install-method__instruction {
  color: var(--kento-muted);
}

.kento-special-page .skill-benefits {
  color: var(--kento-ink);
  border-top: 1px solid #e4dbe9;
  border-bottom: 1px solid #e4dbe9;
  background:
    linear-gradient(120deg, rgba(102, 86, 201, .11), rgba(197, 84, 150, .085) 52%, rgba(229, 154, 103, .12)),
    var(--kento-tint);
}

.kento-special-page .benefit-list {
  color: var(--kento-ink);
}

.kento-special-page .benefit-list p,
.kento-special-page .benefit-list p:last-child {
  border-color: var(--kento-line);
}

.kento-special-page .benefit-list__emphasis {
  text-decoration: none;
  background-image: linear-gradient(90deg, var(--kento-purple), var(--kento-rose), var(--kento-apricot));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 4px;
}

.kento-special-page .skill-install {
  border-bottom: 1px solid #e8e1ec;
  background: var(--kento-soft);
}

.kento-special-page .install-method {
  border: 1px solid var(--kento-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 22px 58px rgba(65, 47, 78, .12);
}

.kento-special-page .install-method code,
.kento-special-page .skill-use__body code {
  color: #393241;
  border: 1px solid var(--kento-line);
  border-radius: 10px;
  background: #f9f7fb;
}

.kento-special-page .install-fallback,
.kento-special-page .install-advanced {
  border-color: var(--kento-line);
}

.kento-special-page .install-fallback summary,
.kento-special-page .install-advanced summary {
  color: #4f4659;
}

.kento-special-page .copy-button {
  color: #756c7d;
}

.kento-special-page .copy-button:hover,
.kento-special-page .copy-button:focus-visible {
  color: var(--kento-purple);
  background: #eeeaf7;
}

.kento-special-page .copy-button.is-copied {
  color: #7b3565;
  background: #f5e7f0;
}

.kento-special-page .install-copy .copy-status.sr-only {
  color: #fff;
  background: #42394d;
  box-shadow: 0 4px 12px rgba(40, 35, 52, .18);
}

.kento-special-page .install-support,
.kento-special-page .install-support a {
  color: var(--kento-muted);
}

.kento-special-page .install-support a {
  text-decoration-color: var(--kento-rose);
  text-underline-offset: .18em;
}

.kento-special-page .skill-use {
  color: var(--kento-ink);
  border-bottom: 1px solid #e5dce9;
  background:
    radial-gradient(circle at 82% 20%, rgba(229, 154, 103, .2), transparent 31%),
    radial-gradient(circle at 16% 78%, rgba(102, 86, 201, .16), transparent 34%),
    linear-gradient(135deg, #f2edf7, #f8f2f7 56%, #f8eee9);
}

.kento-special-page .skill-use .eyebrow {
  color: var(--kento-purple);
}

.kento-special-page .skill-use__lead {
  color: var(--kento-muted);
}

.kento-special-page .skill-prompt {
  color: var(--kento-ink);
  border: 1px solid var(--kento-line);
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 18px 45px rgba(65, 47, 78, .12);
}

.kento-special-page .skill-prompt__text {
  color: #756d7b;
}

.kento-special-page .skill-use__note {
  color: #756d7b;
  opacity: 1;
}

.kento-special-page .skill-faq {
  background: #fff;
}

.kento-special-page .skill-faq__list,
.kento-special-page .skill-faq details {
  border-color: var(--kento-line);
}

.kento-special-page .skill-faq summary {
  color: var(--kento-ink);
}

.kento-special-page .skill-faq details p {
  color: var(--kento-muted);
}

.kento-special-page .skill-disclaimer {
  color: #756d7b;
  border-top: 1px solid #eee9f1;
  background: #fcfbfd;
}

@media (max-width: 760px) {
  .kento-special-page .skill-hero {
    min-height: 580px;
    background:
      radial-gradient(circle at 88% 12%, rgba(229, 154, 103, .23), transparent 34%),
      radial-gradient(circle at 18% 38%, rgba(102, 86, 201, .16), transparent 36%),
      linear-gradient(155deg, #f3f0fa, #f8f2f8 62%, #f8eee9);
  }

  .kento-special-page .skill-hero h1 {
    display: block;
    font-size: clamp(36px, 10vw, 42px);
  }

  .kento-special-page .skill-hero h1 > span {
    white-space: nowrap;
  }

  .kento-special-page .skill-hero__mark {
    display: block;
    margin-bottom: .2em;
  }

  .kento-special-page .install-method {
    border-radius: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kento-special-page .skill-hero .button {
    transition: none;
  }
}