/* Landing-only styles; privacy and support retain their existing document layout. */
html { scroll-behavior: auto; }
.landing {
  --paper: #fffdfd;
  --pink: #ffdde8;
  --blush: #f8afc5;
  --lavender: #ddd8ff;
  --purple: #9b8ce8;
  --pale-purple: #f5f3ff;
  --text: #1a1a1a;
  --subtext: #727083;
  --border: #eeebf2;
  --soft-shadow: 0 14px 32px rgb(65 43 82 / 8%);
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  margin: 0;
  background: var(--paper);
  color: var(--text);
  font-family: ui-rounded, "Hiragino Maru Gothic ProN", "Yu Gothic", "Segoe UI", sans-serif;
  line-height: 1.85;
}
.landing main { width: 100%; }
.landing h1, .landing h2, .landing h3 { color: var(--text); font-family: inherit; font-weight: 750; letter-spacing: -.045em; text-wrap: balance; }
.landing h1 { font-size: clamp(2.3rem, 4.3vw, 3.8rem); line-height: 1.35; }
.landing h2 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.65rem); line-height: 1.5; }
.landing h3 { margin: 0; font-size: clamp(1.55rem, 2.6vw, 2.25rem); line-height: 1.55; }
.landing p { color: var(--subtext); }
.landing a { text-underline-offset: 5px; }
.landing section[id] { scroll-margin-top: 112px; }
.wrap { width: min(1120px, calc(100% - 64px)); margin-inline: auto; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.line-icon { width: 22px; height: 22px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.skip-link { position: fixed; z-index: 100; top: -100px; left: 16px; padding: 12px 20px; background: white; border-radius: 12px; }
.skip-link:focus { top: 12px; }
.landing-header { position: sticky; top: 16px; z-index: 20; width: min(1040px, calc(100% - 40px)); margin: 16px auto 0; }
.landing-nav { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(270px, 1.15fr) minmax(245px, 1fr); align-items: center; gap: 18px; min-height: 70px; padding: 8px 12px 8px 20px; border-radius: 28px; background: #fff; box-shadow: 0 8px 24px rgb(65 43 82 / 8%); }
.landing-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--text); text-decoration: none; font-size: 1.3rem; font-weight: 800; white-space: nowrap; letter-spacing: -.045em; }
.landing-brand img { object-fit: contain; border-radius: 10px; }
.brand-dot { color: var(--purple); }
.nav-sections, .nav-controls { display: flex; align-items: center; }
.nav-sections { width: 100%; justify-self: stretch; justify-content: space-evenly; gap: 0; padding-inline: 8px; }
.nav-sections a { color: #646273; font-size: .82rem; font-weight: 600; text-decoration: none; }
.nav-sections a:hover, .quiet-link:hover, .footer-product a:hover { color: #705eb2; }
.nav-controls { justify-self: end; gap: 24px; padding-right: 6px; }
.landing .lang-select { border: 0; background: transparent; padding-left: 6px; font-size: .78rem; font-weight: 500; }
.pill-button { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 48px; padding: 12px 23px; border-radius: 999px; background: #eee9ff; color: #62518c; text-decoration: none; font-size: .85rem; font-weight: 750; }
.pill-button.primary { background: #8f7bd8; color: #fff; box-shadow: 0 8px 18px rgb(117 94 193 / 20%); }
.nav-cta { min-height: 44px; padding: 9px 18px; font-size: .78rem; white-space: nowrap; }
.nav-cta .line-icon { width: 18px; height: 18px; stroke-width: 2.2; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 28px; }
.quiet-link { display: inline-flex; align-items: center; gap: 10px; color: #676176; text-decoration: none; font-weight: 600; font-size: .85rem; }

.landing-hero { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 54px; padding-block: 72px 66px; min-height: 650px; }
.hero-content { position: relative; z-index: 2; }
.accent-text { color: #a070a5; }
.lead { max-width: 460px; margin: 24px 0 0; font-size: .95rem; line-height: 1.9; }
.micro-copy { display: flex; align-items: center; gap: 7px; margin-top: 22px; font-size: .69rem; }
.micro-copy .line-icon { width: 14px; height: 14px; color: #9b91af; }
.hero-stage { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 16px; min-width: 0; width: 100%; justify-self: center; margin-inline: auto; }
.hero-product { position: relative; display: flex; min-width: 0; flex-direction: column; align-items: center; padding: 24px 14px; border-radius: 32px; background: #ffedf3; }
.hero-product-pocket { background: #eeeaff; }
.hero-product-love, .hero-product-pocket { translate: 0; }
.hero-product strong { display: flex; align-items: center; gap: 8px; color: #1a1a1a; font-size: 1rem; letter-spacing: -.01em; }
.hero-product-purpose { margin: 8px 0 22px; font-size: .875rem; text-align: center; }
.product-icon { border-radius: 8px; box-shadow: 0 4px 10px rgb(71 47 83 / 9%); }
.hero-product .device { width: min(230px, 100%); margin: 0 auto; box-shadow: 0 10px 22px rgb(71 47 83 / 9%); }
.device { position: relative; width: 226px; padding: 7px; margin: 0; background: #fff; border-radius: 35px; box-shadow: 0 18px 38px rgb(71 47 83 / 12%); }
.app-screenshot-placeholder { aspect-ratio: 9 / 19.5; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px 15px; border: 1px dashed #e5cfd9; border-radius: 28px; background: linear-gradient(155deg, #fff9fb, #ffeff5); text-align: center; color: #9c6b83; }
.app-screenshot-placeholder strong { font-size: 1.1rem; letter-spacing: -.04em; }
.app-screenshot-placeholder > span:not(.placeholder-glyph) { font-size: .7rem; }
.app-screenshot-placeholder small { margin-top: 14px; max-width: 150px; font-size: .63rem; color: #867b8a; }
.app-screenshot-placeholder:has(> img) { display: block; padding: 0; border-style: solid; background: white; overflow: hidden; }
.app-screenshot-placeholder > img { display: block; width: 100%; height: auto; }
.placeholder-glyph { display: grid; place-items: center; width: 60px; height: 60px; margin-bottom: 2px; border: 1px solid #f1dce6; border-radius: 20px; background: rgb(255 255 255 / 75%); }
.placeholder-glyph .line-icon { width: 27px; height: 27px; }
.lavender .app-screenshot-placeholder { background: linear-gradient(155deg, #fcfbff, #f0edff); border-color: #dcd5ef; color: #8973a9; }
.lavender .placeholder-glyph { border-color: #e5def4; }

.section { padding-block: 98px 0; }
.section-heading { margin-bottom: 46px; }
.centered { text-align: center; }
#apps { padding-top: 72px; }
.feature-section { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 50px; padding: 52px 65px; border-radius: 36px; margin-top: 28px; overflow: hidden; }
#apps .feature-section:first-child { margin-top: 0; }
.feature-section > * { min-width: 0; }
.blush { background: #ffedf3; }.lilac { background: #eeeaff; }
.app-name { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 12px; color: #765c68 !important; font-size: .88rem; font-weight: 800; }
.lilac .app-name { color: #7669aa !important; }
.app-name img { width: 30px; height: 30px; border-radius: 9px; box-shadow: 0 4px 10px rgb(71 47 83 / 8%); }
.feature-copy h3 { font-size: clamp(1.8rem, 3vw, 2.35rem); }
.feature-copy > p:not(.app-name) { max-width: 440px; margin: 20px 0; color: #625d6e; font-size: 1rem; line-height: 1.85; }
.feature-list { padding: 0; margin: 22px 0; list-style: none; }
.feature-list li { display: flex; align-items: flex-start; gap: 10px; margin: 12px 0; color: #5f586a; font-size: .92rem; line-height: 1.75; }
.feature-list .line-icon { margin-top: 4px; width: 18px; height: 18px; color: #927bb0; stroke-width: 2.2; }
.feature-copy .quiet-link { font-size: .92rem; }
.feature-media { display: flex; flex-direction: column; align-items: center; gap: 22px; min-width: 0; }
.feature-device { width: 208px; }
.reverse .feature-copy { grid-column: 2; grid-row: 1; }.reverse .feature-media { grid-column: 1; grid-row: 1; }
.reverse .feature-device { transform: none; }
.choose-section { padding-top: 110px; }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 22px; }
.choice-card { display: flex; min-height: 250px; flex-direction: column; padding: 34px 36px; border-radius: 32px; }
.choice-love { background: #fff0f5; }
.choice-pocket { background: #efecff; }
.choice-icon { width: 52px; height: 52px; margin-bottom: 18px; border-radius: 16px; object-fit: cover; box-shadow: 0 8px 18px rgb(71 47 83 / 10%); }
.choice-card h3 { font-size: 1.45rem; }
.choice-card > p { margin: 12px 0 24px; font-size: .82rem; line-height: 1.8; }
.choice-link { margin-top: auto; color: #6d5f75; font-size: .8rem; font-weight: 750; text-decoration: none; }
.privacy-panel { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 26px; margin-top: 24px; padding: 30px 34px; border-radius: 30px; background: #f7f4fb; }
.privacy-icon { display: grid; place-items: center; width: 54px; height: 54px; align-self: center; color: #8e7ca2; }
.privacy-icon .line-icon { width: 38px; height: 38px; stroke-width: 1.8; }
.privacy-body { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 26px; }
.privacy-copy h3 { font-size: 1.18rem; }
.privacy-copy > p:last-child { margin: 6px 0 0; max-width: 620px; font-size: .85rem; line-height: 1.8; }
.privacy-links { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.privacy-links a { padding: 10px 15px; border-radius: 999px; background: #fff; color: #655d70; font-size: .75rem; font-weight: 700; text-decoration: none; }
.faq-section { display: block; max-width: 900px; }
.faq-section .section-heading { margin-bottom: 32px; text-align: center; }
.faq-list { width: min(760px, 100%); margin-inline: auto; }
.faq-list details { margin-bottom: 12px; border-radius: 20px; background: #f7f3fb; }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 70px; padding: 17px 24px; font-size: .93rem; font-weight: 650; list-style: none; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-plus { color: #ab92ba; font-size: 1.3rem; font-weight: 400; }.faq-list details[open]:not([style*="overflow"]) .faq-plus, .faq-list details.is-expanded .faq-plus { transform: rotate(45deg); }
.faq-list p { margin: 0; padding: 0 24px 24px; font-size: .9rem; }
.download-section { position: relative; display: grid; grid-template-columns: .65fr 1.35fr; align-items: center; gap: 28px 42px; margin-top: 98px; padding: 48px 52px; overflow: hidden; border: 1px solid rgb(97 77 124 / 6%); border-radius: 40px; background: #efecff; box-shadow: 0 20px 45px rgb(71 47 83 / 7%); }
.download-heading { display: flex; align-self: center; flex-direction: column; justify-content: center; text-align: left; }
.download-heading h2 { font-size: clamp(2rem, 3.6vw, 3rem); }
.download-heading p { margin: 6px 0 0; color: #83788b; font-size: .85rem; font-weight: 650; }
.download-section .button-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; }
.store-button { display: flex; align-items: center; justify-content: flex-start; gap: 14px; min-width: 0; min-height: 82px; padding: 14px 16px; border: 1px solid rgb(88 69 99 / 7%); border-radius: 24px; background: rgb(255 255 255 / 84%); color: var(--text); box-shadow: 0 10px 24px rgb(65 43 82 / 8%); text-decoration: none; text-align: left; backdrop-filter: blur(8px); }
.store-app-icon { flex: 0 0 auto; border-radius: 12px; object-fit: cover; }
.store-button > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; line-height: 1.35; flex: 1; }.store-button small { font-size: .73rem; color: #8f7d96; }.store-button b { font-size: 1.08rem; font-weight: 700; }.store-button .line-icon { color: #9884ac; }
.download-section .download-note { grid-column: 2; width: 100%; margin: -14px 0 0; color: #776e80; font-size: .72rem; text-align: center; }
.landing-footer { display: grid; grid-template-columns: minmax(230px, 1fr) auto; gap: 48px; align-items: start; padding-block: 65px 30px; }
.landing-footer .landing-brand { font-size: .97rem; }
.footer-icon-pair { display: inline-flex; align-items: center; padding-right: 7px; }
.footer-icon-pair img + img { margin-left: -8px; }
.landing-footer p { max-width: 290px; margin: 8px 0 0; font-size: .72rem; color: #9d91a1; }
.footer-products { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 42px; }
.footer-product { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.footer-product strong { margin-bottom: 4px; color: #4f4857; font-size: .73rem; }
.footer-product a { color: #817589; font-size: .68rem; line-height: 1.5; text-decoration: none; }
.copyright { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--border); color: #aaa0ae; font-size: .64rem; }

@media (max-width: 1050px) {
  .nav-sections { gap: 16px; }.landing-nav { gap: 15px; padding-inline: 18px; }
  .landing-hero { gap: 26px; }
  .feature-section { padding: 40px; gap: 30px; }
  .privacy-body { gap: 18px; }.privacy-links { flex-wrap: wrap; justify-content: flex-end; }
  .landing-footer { grid-template-columns: 1fr; }.footer-products { width: 100%; }
}
@media (max-width: 760px) {
  .wrap { width: calc(100% - 40px); }.landing-header { top: 10px; width: calc(100% - 24px); margin-top: 10px; }
  .landing-nav { grid-template-columns: 1fr auto; gap: 12px; min-height: 64px; padding: 8px 14px; border-radius: 20px; }.nav-cta { padding: 9px 13px; font-size: .69rem; }.landing .lang-select { max-width: 110px; padding-right: 21px; font-size: .7rem; }
  .landing-brand { gap: 6px; font-size: 1.15rem; }.landing-brand img { width: 29px; height: 29px; }
  .landing-hero { grid-template-columns: 1fr; padding-block: 52px 35px; gap: 38px; }.hero-content { text-align: center; }.landing h1 { font-size: clamp(1.8rem, 6.6vw, 3rem); letter-spacing: -.055em; line-height: 1.5; }.lead { max-width: 460px; margin: 20px auto 0; font-size: .84rem; }.hero-content .button-row { justify-content: center; gap: 16px; }.micro-copy { justify-content: center; font-size: .6rem; }.pill-button { padding: 11px 19px; font-size: .78rem; }.quiet-link { font-size: .75rem; }

  .section { padding-top: 68px; }.section-heading { margin-bottom: 28px; }.landing h2 { font-size: clamp(1.6rem, 6vw, 2.1rem); }
  #apps { padding-top: 58px; }.feature-section { grid-template-columns: 1fr; padding: 32px 25px; gap: 32px; border-radius: 26px; }.feature-copy h3 { font-size: 1.75rem; }.feature-copy > p:not(.app-name) { font-size: 1rem; }.feature-list li { font-size: .92rem; }.reverse .feature-copy, .reverse .feature-media { grid-column: auto; grid-row: auto; }.feature-device { width: 190px; }
  .choose-section { padding-top: 76px; }.choice-grid { grid-template-columns: 1fr; gap: 14px; }.choice-card { min-height: 0; padding: 29px 25px; border-radius: 26px; }.privacy-panel { grid-template-columns: auto minmax(0, 1fr); gap: 18px; padding: 26px 22px; }.privacy-icon { width: 42px; height: 42px; }.privacy-body { flex-direction: column; align-items: flex-start; gap: 16px; }.privacy-links { flex-direction: column; align-items: stretch; justify-content: flex-start; width: 100%; }.privacy-links a { width: 100%; }
  .faq-list summary { padding: 16px 18px; font-size: .9rem; }
  .download-section { grid-template-columns: 1fr; gap: 24px; margin-top: 60px; padding: 40px 20px; border-radius: 28px; background: #efecff; }.download-heading { align-items: center; text-align: center; }.download-heading h2 { font-size: 1.9rem; }.download-section .button-row { grid-template-columns: 1fr; width: min(340px, 100%); margin-inline: auto; }.store-button { min-width: 0; }.download-section .download-note { grid-column: 1; margin: -8px auto 0; text-align: center; }
  .landing-footer { padding-top: 40px; gap: 30px; }.footer-products { grid-template-columns: repeat(2, 1fr); gap: 28px 22px; }
}
@media (max-width: 360px) {
  .nav-cta { gap: 5px; padding-inline: 10px; }
}
@media (min-width: 0px) {
  .device { backface-visibility: hidden; transform: translateZ(0); transition: scale .46s var(--motion-ease); }
  .device:hover { z-index: 5; scale: 1.065; box-shadow: 0 26px 54px rgb(71 47 83 / 16%); }
  .pill-button, .store-button, .landing-brand img { transition: transform .42s var(--motion-ease), box-shadow .42s var(--motion-ease); }
  .choice-card, .privacy-panel, .feature-section, .getting-started article, .faq-list details { backface-visibility: hidden; transition: scale .46s var(--motion-ease), translate .46s var(--motion-ease), box-shadow .46s var(--motion-ease); }
  .pill-button:hover, .store-button:hover { transform: translateY(-4px) scale(1.05); box-shadow: var(--soft-shadow); }
  .choice-card:hover { translate: none; scale: 1; }
  .privacy-links a { transition: transform .38s var(--motion-ease), box-shadow .38s var(--motion-ease); }
  .privacy-links a:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px rgb(65 43 82 / 7%); }
  .feature-section:hover, .getting-started article:hover, .faq-list details:hover { scale: 1; translate: none; }
  .landing-brand:hover img { transform: rotate(-7deg) scale(1.08); }
  .hero-content { animation: soft-entrance .95s var(--motion-ease) both; }
  .hero-product { animation: soft-card-entrance .9s var(--motion-ease) .12s both; }
  .hero-product-pocket { animation-delay: .22s; }
  @keyframes soft-entrance { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
  @keyframes soft-card-entrance { from { opacity: 0; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
}

html.reveal-ready .reveal-on-scroll { opacity: 0; transform: translate3d(0, 12px, 0); transform-origin: center 60%; backface-visibility: hidden; transition: opacity .6s ease, transform .6s var(--motion-ease); }
html.reveal-ready .reveal-on-scroll.is-visible { opacity: 1; transform: translate3d(0, 0, 0) scale(1); transition-delay: var(--reveal-delay, 0ms); }

/* The shared legal-page stylesheet disables motion globally. The landing page
   keeps the product motion explicitly requested for this site. */
@media (prefers-reduced-motion: reduce) {
  .landing .hero-content, .landing .hero-product { animation: gentle-fade .24s ease-out both !important; }
  .landing .device,
  .landing .choice-card,
  .landing .privacy-panel,
  .landing .feature-section,
  .landing .getting-started article,
  .landing .faq-list details { transition: none !important; transform: none !important; scale: 1 !important; translate: none !important; }
  .landing .pill-button,
  .landing .store-button,
  .landing .landing-brand img,
  .landing .privacy-links a { transition: none !important; transform: none !important; }
  html.reveal-ready .landing .reveal-on-scroll { opacity: 0; transform: none !important; transition: opacity .24s ease-out !important; }
  html.reveal-ready .landing .reveal-on-scroll.is-visible { opacity: 1; transition-delay: 0ms !important; }
}

@keyframes gentle-fade { from { opacity: 0; } to { opacity: 1; } }

/* Full, uncropped app screens maintain the phone metaphor. */
.hero-product .app-screenshot-placeholder { aspect-ratio: auto; }
.feature-copy h2 { font-size: clamp(1.8rem, 3vw, 2.35rem); }
.choice-link, .feature-copy .quiet-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 1rem; }
.nav-sections a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }
@media (max-width: 760px) {
  .landing-nav { padding: 14px 18px 12px; row-gap: 10px; }
  .nav-controls { gap: 18px; padding-right: 0; }
  .landing .lang-select { padding-left: 8px; padding-right: 26px; }
  .nav-sections { display: flex; grid-column: 1 / -1; grid-row: 2; justify-content: space-around; gap: 8px; padding: 10px 0 0; border-top: 1px solid var(--border); }
  .nav-sections a { font-size: .875rem; }
  .nav-controls { grid-column: 2; grid-row: 1; }
  .landing section[id] { scroll-margin-top: 140px; }
  .landing-hero { padding-top: 36px; gap: 28px; }
  .hero-stage { width: min(520px, 100%); gap: 12px; }
  .hero-product { padding: 20px 10px; border-radius: 26px; }
  .hero-product strong { gap: 6px; font-size: .875rem; }
  .hero-product-purpose { margin: 8px 0 18px; font-size: .8125rem; }
  .hero-product .device { width: 100%; padding: 5px; border-radius: 28px; }
  .hero-product .app-screenshot-placeholder { border-radius: 23px; }
  .feature-copy h2 { font-size: 1.75rem; }
}
@media (max-width: 360px) {
  .hero-stage { gap: 8px; }
  .hero-product { padding-inline: 8px; }
  .hero-product strong { font-size: .8rem; }
  .hero-product-purpose { font-size: .75rem; }
}

/* Readable supporting text and immediate feedback across input methods. */
.landing .lead, .landing .choice-card > p, .landing .getting-started li { font-size: 1rem; }
.landing .micro-copy, .landing .download-note, .landing .footer-product a,
.landing .footer-product strong, .landing .copyright, .landing .store-button small { font-size: .875rem; }
.landing .pill-button:active, .landing .store-button:active,
.landing .consent-button:active, .landing .privacy-links a:active { transform: scale(.98); transition: transform .1s ease-out; }
.landing .faq-plus { transition: transform .2s ease-out; }
.faq-list details[open] > p { animation: gentle-fade .2s ease-out; }
@media (max-width: 400px) {
  .landing-nav { padding-inline: 12px; }
  .nav-controls { gap: 10px; }
  .landing .lang-select { max-width: 98px; padding-left: 0; }
}
html[lang="ja"] .landing h1, html[lang="ja"] .landing h2, html[lang="ja"] .landing h3,
html[lang="zh-Hant"] .landing h1, html[lang="zh-Hant"] .landing h2, html[lang="zh-Hant"] .landing h3 { letter-spacing: -.015em; }
@media (hover: none), (pointer: coarse) {
  .landing .device:hover { scale: 1; }
  .landing .pill-button:hover, .landing .store-button:hover, .landing .privacy-links a:hover,
  .landing .landing-brand:hover img { transform: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .landing .hero-product strong, .landing .store-button, .analytics-consent { background: #fff; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  .landing { --subtext: #1a1a1a; }
  .landing p, .landing .footer-product a { color: #1a1a1a; }
  .landing a:focus-visible, .landing button:focus-visible, .landing summary:focus-visible { outline: 3px solid #1a1a1a; }
  .landing .pill-button, .landing .store-button, .landing .faq-list details { border: 1px solid #1a1a1a; }
}


/* Purposeful detail: brand-coloured surfaces, not looping decoration. */
.comparison-intro, .comparison-note { max-width: 720px; margin: 0 auto 26px; text-align: center; font-size: 1rem; }
.comparison-note { margin-top: 24px; font-size: .875rem; }
.comparison-points { padding-left: 1.2em; margin: 0 0 24px; color: #5f586a; font-size: .95rem; }
.comparison-points li + li { margin-top: 12px; }
.getting-started { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.getting-started article { padding: 32px; background: #fff0f5; border-radius: 28px; }
.getting-started article + article { background: #efecff; }
.getting-started h3 { font-size: 1.4rem; }
.getting-started ol { padding-left: 1.5em; margin-bottom: 0; }
.getting-started li { padding-left: .5em; color: #5f586a; }
.getting-started li + li { margin-top: 16px; }
.faq-group + .faq-group { margin-top: 36px; }
.faq-group h3 { font-size: 1.15rem; margin: 0 0 16px; }
.nav-sections a { border-radius: 12px; padding-inline: 12px; }
.nav-sections a.is-current { color: #62518c; background: #eee9ff; }
.footer-product a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 10px; }
.footer-product { gap: 0; }
.analytics-settings { min-height: 44px; font-size: .875rem; }
.analytics-consent-copy p { font-size: .875rem; }
.consent-button { min-height: 44px; font-size: .875rem; }
.landing a:focus-visible, .landing button:focus-visible, .landing select:focus-visible, .landing summary:focus-visible { outline: 3px solid #62518c; outline-offset: 4px; }
@media (max-width: 760px) {
  .getting-started { grid-template-columns: 1fr; }
  .getting-started article { padding: 26px; }
  .nav-sections a { flex: 1; }
  .landing-header.is-compact .nav-sections { display: none; }
  .landing-header.is-compact .landing-nav { row-gap: 0; }
  .landing.compact-header section[id] { scroll-margin-top: 96px; }
}


.oshi-definition { margin: 16px 0 0; font-size: .875rem; }
.back-to-top { position: fixed; z-index: 30; right: max(20px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom)); display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 1px solid #ddd5ef; border-radius: 18px; background: #eee9ff; color: #62518c; box-shadow: 0 6px 20px rgb(65 43 82 / 12%); cursor: pointer; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .2s ease, transform .25s var(--motion-ease), background-color .15s ease; }
.back-to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.back-to-top:active { transform: scale(.96); background: #e0d7fa; transition: transform .1s ease-out; }
body:has([data-analytics-consent]) .back-to-top { visibility: hidden; }
@media (hover: hover) { .back-to-top:hover { background: #e5defa; } }
@media (prefers-reduced-motion: reduce) { .back-to-top, .back-to-top:active { transform: none; transition: opacity .15s ease !important; } }
@media (prefers-contrast: more) { .back-to-top { border-color: #1a1a1a; color: #1a1a1a; background: #fff; } }
