/* /ai/ LP — aibou skin (replaces Apple LP 2026-08-30)
   Scoped like the Apple block: only when #lp / #intro is visible.
   Quiz screens keep style.css defaults. */

body:has(#lp:not([hidden])),
body:has(#intro:not([hidden])) {
  background: #f4f8fb !important;
  background-image: none !important;
}

.lp {
  --lp-bg: #f4f8fb;
  --lp-paper: #ffffff;
  --lp-ink: #2b3948;
  --lp-secondary: #46586b;
  --lp-caption: #6f8499;
  --lp-line: #e2ebf3;
  --lp-link: #4f8fdc;
  --lp-fsrs: #4f8fdc;
  --lp-display: "Noto Sans JP", "Hiragino Sans", sans-serif;
  --lp-primary: #4f8fdc;
  --lp-primary-dark: #3a74bd;
  --lp-primary-tint: #eef4fb;
  background: var(--lp-bg);
  color: var(--lp-ink);
  font-family: var(--lp-display);
}

.lp__eyebrow {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  margin: 0 auto 18px !important;
  padding: 6px 12px !important;
  border: 1px solid var(--lp-line) !important;
  border-radius: 9999px !important;
  background: var(--lp-primary-tint) !important;
  color: var(--lp-primary) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

.lp__display {
  font-family: var(--lp-display) !important;
  font-weight: 700 !important;
  font-size: clamp(28px, 6vw, 44px) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.02em !important;
  color: var(--lp-ink) !important;
}

.lp__lead {
  font-family: var(--lp-display) !important;
  font-size: clamp(15px, 2vw, 17px) !important;
  line-height: 1.7 !important;
  color: var(--lp-secondary) !important;
}

.lp .btn {
  font-family: var(--lp-display) !important;
  font-weight: 700 !important;
  border-radius: 9999px !important;
  box-shadow: none !important;
}

.lp .btn--primary,
.lp .btn--upgrade,
.lp .btn--primary.btn--upgrade {
  background: var(--lp-primary) !important;
  color: #fff !important;
  border-color: transparent !important;
}

.lp .btn--primary:hover,
.lp .btn--upgrade:hover,
.lp .btn--primary.btn--upgrade:hover {
  background: var(--lp-primary-dark) !important;
  box-shadow: none !important;
}

.lp .btn--ghost,
.lp .btn--ghost.btn--upgrade {
  background: var(--lp-paper) !important;
  color: var(--lp-primary) !important;
  border: 1.5px solid var(--lp-line) !important;
}

.lp .btn--ghost:hover,
.lp .btn--ghost.btn--upgrade:hover {
  border-color: #c9dbef !important;
  background: var(--lp-primary-tint) !important;
}

/* kill Apple black / gray leftovers inside LP */
.lp .plan-card,
.lp .lp-band,
.lp .lp-today,
.lp .fsrs,
.lp .faq,
.lp .waitlist,
.lp .lp__closing,
.lp .lp__footer,
.lp .lp__sticky {
  font-family: var(--lp-display) !important;
}

.lp .lp-band {
  background: var(--lp-paper) !important;
  border-color: var(--lp-line) !important;
  color: var(--lp-ink) !important;
}

.lp .lp-band__line {
  color: var(--lp-ink) !important;
  font-weight: 700 !important;
}

.lp .fsrs,
.lp .lp-today,
.lp .pro-plan,
.lp .faq,
.lp .waitlist {
  background: transparent !important;
}

.lp .plan-card {
  background: var(--lp-paper) !important;
  border: 1px solid var(--lp-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 1px 3px rgba(43, 57, 72, 0.04) !important;
}

.lp .plan-card--pro {
  border: 1.5px solid var(--lp-primary) !important;
  background: #fbfdff !important;
}

.lp .plan-card__name,
.lp .plan-card__price,
.lp .plan-card__price strong,
.lp .pro-plan__title,
.lp .lp-today__title,
.lp .fsrs__title,
.lp .faq__q {
  color: var(--lp-ink) !important;
  font-family: var(--lp-display) !important;
}

.lp .plan-card__perks--pro li::before,
.lp .plan-card__perks li::before {
  background: var(--lp-primary) !important;
}

.lp .pro-plan__eyebrow {
  color: var(--lp-primary) !important;
  background: var(--lp-primary-tint) !important;
  border-radius: 9999px;
  display: inline-block;
  padding: 4px 10px;
  font-weight: 700;
}

.lp a,
.lp .lp__signin-link,
.lp .lp__consent-link,
.lp .faq__link,
.lp .pro-manage-link,
.lp .lp__closingPro a {
  color: var(--lp-primary) !important;
}

.lp .lp__sticky {
  background: rgba(244, 248, 251, 0.92) !important;
  border-top: 1px solid var(--lp-line) !important;
  backdrop-filter: blur(10px);
}

.lp .lp__stickyPro {
  background: var(--lp-primary-tint) !important;
  border: 1px solid var(--lp-line) !important;
  color: var(--lp-ink) !important;
}

.lp .lp__stickyProPrice {
  color: var(--lp-primary) !important;
  font-weight: 700 !important;
}

/* Soften Apple-only huge whitespace a bit for aibou */
.lp__hero {
  padding: clamp(48px, 8vw, 88px) 24px clamp(40px, 6vw, 72px) !important;
}

.lp .shot,
.lp .lp__shots img,
.lp .lp__shots figure {
  border-radius: 16px !important;
  border: 1px solid var(--lp-line) !important;
  box-shadow: 0 1px 3px rgba(43, 57, 72, 0.04) !important;
}


/* Brand wordmark — no N tile, no headphones */
.brand__name { display: none !important; }
.brand__mark { display: none !important; }
.brand__mark-img {
  display: block !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
}
.lp__footerLogo {
  font-family: "Noto Sans JP", "Hiragino Sans", system-ui, sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: #2b3948 !important;
}

/* ── subtract: one CTA, quiet login, no Apple leftover ── */
.lp__piyo {
  display: block;
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
}

.lp__cta {
  flex-direction: column;
  align-items: center;
  gap: 0 !important;
}

.lp .btn.btn--primary {
  min-width: 240px;
  min-height: 52px;
  font-weight: 700 !important;
}

.lp .btn-google.btn-google--quiet {
  min-width: 0 !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--lp-primary) !important;
  font-family: var(--lp-display) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0;
  gap: 0;
}

.lp .btn-google.btn-google--quiet .btn-google__icon {
  display: none !important;
}

.lp .btn-google.btn-google--quiet:hover {
  background: none !important;
  box-shadow: none !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.lp .lp__signin-hint {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 16px !important;
}

.lp .lp__signin-link {
  color: var(--lp-primary) !important;
  font-weight: 700 !important;
}

.lp .lp__signin-link:hover {
  color: var(--lp-primary-dark) !important;
}

.lp .phone,
.lp .phone--tilt-l,
.lp .phone--tilt-c,
.lp .phone--tilt-r {
  transform: none !important;
}

.lp .phone img {
  border-radius: 16px !important;
  border: 1px solid var(--lp-line) !important;
  box-shadow: 0 1px 3px rgba(43, 57, 72, 0.04) !important;
  background: #fff !important;
}

.lp .phone figcaption {
  font-weight: 700 !important;
  color: var(--lp-caption) !important;
}

.lp .lp__closing,
.lp .lp__footer {
  border-top: 1px solid var(--lp-line) !important;
}

.lp .faq__q::before {
  content: none !important;
}

.lp .fsrs__title,
.lp .lp-today__title,
.lp .pro-plan__title,
.lp .faq__title,
.lp .waitlist__title {
  font-weight: 700 !important;
}


/* Pro カード内の実測。ライトと混ぜない */
.lp .plan-card__proof {
  margin: 16px 0 4px;
  padding: 14px 16px 12px;
  text-align: left;
  background: #f5f5f7;
  border: 0;
  border-radius: 14px;
}
.lp .plan-card__proofKicker {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #86868b;
}
.lp .plan-card__proofLead {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: #1d1d1f;
}
.lp .plan-card__proofLead + .plan-card__proofLead {
  margin-top: 0.45rem;
}
.lp .plan-card__proofLead strong {
  color: #1d7f96;
  font-weight: 700;
}
.lp .plan-card__proofMeta {
  margin: 0.5rem 0 0;
  font-size: 12px;
  font-weight: 500;
  color: #86868b;
}

/* #login-lp: Google をメールの上に置く */
.lp .waitlist .btn-google {
  width: 100%;
  max-width: none;
  min-width: 0;
  min-height: 48px;
  margin: 0 0 16px;
  border-radius: 12px;
}
.lp .waitlist__or {
  margin: 0 0 16px;
  font-size: 13px;
  font-weight: 500;
  color: #86868b;
}