/* Quiet product motion: persistent controls, a stable device, native scrolling. */
:root{--ease-product:cubic-bezier(.22,1,.36,1);--ease-control:cubic-bezier(.2,.75,.25,1)}
@media (min-width: 801px) { .site-header nav { margin-left: auto; } }
.site-header .header-social { display: flex; align-items: center; gap: 0; flex-shrink: 0; }
.site-header .social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  padding: 12px;
  border: 0;
  background: none;
  color: inherit;
  opacity: 1;
}
.site-header .social-icon svg { display: block; width: 20px; height: 20px; }
@media (min-width: 801px) and (max-width: 1050px) {
  .site-header .nav-wrap { gap: 16px; }
  .site-header #main-nav { gap: 12px; font-size: 13px; }
}
@media (max-width: 800px) {
  .site-header .header-social { margin-top: 12px; align-self: flex-start; }
}
body{background:radial-gradient(ellipse at 82% 5%,#9843692b,transparent 32%),radial-gradient(ellipse at 8% 35%,#7d294725,transparent 38%),linear-gradient(160deg,#45112b 0%,#260916 48%,#421029 78%,#240b18 100%)}
.site-header{position:sticky;top:0;height:72px;z-index:50;background:#390f230a;transition:background .4s var(--ease-product),border-color .4s;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}
.site-header.is-scrolled{background:#2d0b1fd9;border-bottom-color:#e6bfd420;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%)}
.nav-wrap{max-width:1260px}.site-header nav{gap:34px;font-size:14px}.brand .datey-wordmark{width:111px}.nav-download{font-size:13px;padding:10px 20px;background:#f7eee810;border-color:#edcdd82e}.nav-download:hover{background:#f7eee81d}
.button{transition:background .25s,color .25s,box-shadow .4s var(--ease-product),transform .4s var(--ease-product)}.button:hover{transform:translateY(-1px);box-shadow:0 8px 25px #1b061926}.button:active{transform:scale(.975)}
dialog[open]{animation:dialog-appear .35s var(--ease-product) both}dialog[open]::backdrop{animation:backdrop-appear .3s ease both}
@keyframes dialog-appear{from{opacity:0;transform:translateY(16px) scale(.975)}to{opacity:1;transform:none}}@keyframes backdrop-appear{from{opacity:0}to{opacity:1}}
.motion-ready [data-reveal]{opacity:0;translate:0 26px;transition:opacity .75s var(--ease-product) var(--reveal-delay,0ms),translate .75s var(--ease-product) var(--reveal-delay,0ms)}.motion-ready [data-reveal].is-revealed{opacity:1;translate:0 0}.motion-ready [data-reveal]:focus-within{opacity:1;translate:0 0}
.home-page .site-header{height:72px}.home-page .product-explorer{grid-template-columns:minmax(0,.94fr) minmax(0,1.1fr);gap:72px;padding-block:45px 45px;min-height:740px;scroll-margin-top:85px}.home-page .explorer-copy{max-width:485px}.home-page .explorer-copy>.eyebrow{font-size:12px;letter-spacing:.075em;font-weight:500;margin-bottom:23px;color:#caa4b8}.home-page .explorer-copy>.eyebrow>span{display:none}.home-page .explorer-copy h1{font-family:var(--sans);font-size:clamp(3.5rem,5.4vw,5.15rem);font-weight:550;letter-spacing:-.06em;line-height:1.04}.home-page .explorer-copy h1 em{font:inherit;letter-spacing:inherit;background:linear-gradient(115deg,#f1c6d7 5%,#d389ae 56%,#bc628f);background-clip:text;-webkit-background-clip:text;color:transparent}.home-page .explorer-intro{font-size:17px;line-height:1.65;letter-spacing:-.015em;margin:25px 0 28px;color:#cbaab9}.home-page .audience-switch{position:relative;isolation:isolate;border-color:#edc2d525;background:#260b1a80;padding:5px;gap:2px}.audience-switch button{position:relative;z-index:1;font-size:14px;min-height:43px;padding:10px 23px}.selection-pill{display:block;position:absolute;top:0;left:0;border-radius:100px;pointer-events:none;z-index:0;background:linear-gradient(145deg,#fcf2ed,#ead8e0);box-shadow:0 2px 10px #13040e1f,inset 0 1px #fff8;transition:transform .44s var(--ease-product),width .44s var(--ease-product),height .3s var(--ease-product);will-change:transform}.pill-snap>.selection-pill{transition:none!important}.has-pill button[aria-selected="true"],.has-pill button[aria-pressed="true"]{background:transparent!important;box-shadow:none!important;color:#522039}.home-page .feature-explanation{min-height:166px;margin-top:30px;padding-top:24px;max-width:440px;border-top-color:#edc2d522}.home-page .feature-explanation h2{font-size:24px;font-weight:500;letter-spacing:-.03em;line-height:1.25;margin-bottom:12px}.home-page .feature-explanation p{font-size:16px;line-height:1.65;color:#ceb0bf}.home-page .explorer-actions{margin-top:8px;gap:23px;flex-wrap:nowrap}.home-page .explorer-actions>.button{font-size:14px;padding:15px 22px;white-space:nowrap;background:#f9eeec}.home-page .explorer-actions .text-link{white-space:nowrap;font-size:14px;color:#e0bbcf}.home-page .explorer-console{padding-top:6px;scroll-margin-top:95px}.home-page .explorer-console:before{inset:64px -65px 30px;background:radial-gradient(ellipse at center,#bc658634 0%,#85355415 46%,transparent 70%)}
.home-page .screen-tabs{isolation:isolate;gap:2px;padding:6px;border-radius:100px;border-color:#f3d0de26;background:linear-gradient(145deg,#1c0b17ef,#311022eb);box-shadow:0 14px 38px #16031036,inset 0 1px #fbe0ea09;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);scrollbar-width:none}.home-page .screen-tabs::-webkit-scrollbar{display:none}.home-page .screen-tabs button{position:relative;z-index:1;font-size:14px;font-weight:500;letter-spacing:-.015em;min-height:46px;padding:10px 13px;gap:7px}.home-page .screen-tabs button>.icon{width:17px;height:17px}.home-page .screen-tabs button:hover:not([aria-selected="true"]){background:#ffffff06;color:#fce8f1}.home-page .screen-stage{height:572px;padding-top:25px;transform:translate3d(0,var(--stage-lift,0px),0) scale(var(--stage-scale,1));transform-origin:center 30%;contain:layout}.home-page .screen-phone{transform:scale(.875);filter:drop-shadow(0 28px 35px #16071470);height:530px}.home-page .screen-panel .phone{border-color:#bda5af;box-shadow:inset 0 0 0 1px #fff9,0 0 0 1px #5f3849,0 2px 8px #d9b2c515;background:#f6f1eb}.home-page .screen-panel .phone-content{transform-origin:center 40%;backface-visibility:hidden;will-change:auto}.home-page .screen-caption{margin-top:3px;font-size:12px;letter-spacing:-.015em;color:#b98a9f}.home-page .game-sample{position:relative;top:auto;min-height:53px;margin-top:8px;padding-top:4px}.home-page .game-sample[hidden]{display:flex!important;visibility:hidden;pointer-events:none}.home-page .game-sample .micro{font-size:12px;line-height:1.4}.home-page .game-sample button{font-size:14px}.home-page #explorer-prompt-status{max-width:400px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-page .home-discover{padding:98px 0 90px;border-top:1px solid #edc2d516}.home-page .discovery-heading{margin-bottom:48px;gap:0 60px}.home-page .discovery-heading h2,.home-page .home-notes h2,.home-page #help h2{font-family:var(--sans);font-size:clamp(2.6rem,4.1vw,3.6rem);line-height:1.08;letter-spacing:-.05em;font-weight:500}.home-page .discovery-heading h2 em,.home-page .home-notes h2 em,.home-page #help h2 em{font:inherit;color:#c58aa6}.home-page .discovery-heading>.eyebrow{font-size:12px}.home-page .discovery-heading>p{color:#b99aaa;font-size:16px}.home-page .feature-grid{gap:18px;border:0;border-radius:0;overflow:visible;align-items:stretch}.home-page .feature-preview-trigger{border:1px solid #edc2d51c;border-radius:28px;padding:30px 28px 28px;background:radial-gradient(ellipse at 85% 0,#b9618220,transparent 60%),linear-gradient(145deg,#7131482c,#34122299);display:flex;flex-direction:column;min-height:320px;position:relative;overflow:hidden;transition:opacity .75s var(--ease-product) var(--reveal-delay,0ms),translate .75s var(--ease-product) var(--reveal-delay,0ms),transform .5s var(--ease-product),border-color .4s,box-shadow .5s,background .4s}.home-page .feature-preview-trigger:nth-child(2n){background:radial-gradient(ellipse at 0 100%,#9c50761a,transparent 70%),linear-gradient(145deg,#69354c20,#2e122480)}.home-page .feature-preview-trigger:hover{transform:translateY(-5px);border-color:#e1abc347;box-shadow:0 22px 55px #18081630}.home-page .feature-preview-trigger:active{transform:translateY(-1px) scale(.995)}.home-page .feature-top{width:100%;margin-bottom:36px}.home-page .feature-top>.icon{width:30px;height:30px;color:#daa3bc;stroke-width:1.35}.home-page .feature-top>span{font-size:12px;letter-spacing:.02em;color:#a87e93}.home-page .feature-card h3{font-size:28px;font-weight:500;margin-bottom:17px;letter-spacing:-.035em}.home-page .feature-card>p{font-size:16px;line-height:1.65;color:#c6a5b5}.home-page .feature-card>.text-link{margin-top:auto;padding-top:14px;font-size:14px;color:#e7c6d5}.home-page .feature-card .text-link .icon{margin-left:0}.home-page .feature-preview-trigger:hover .text-link .icon{transform:translateX(5px)}.home-page .feature-top,.home-page .feature-card h3,.home-page .feature-card>p,.home-page .feature-card>.text-link{position:relative;z-index:1}.home-page .home-notes{padding-top:60px}.home-page .home-notes .section-heading{margin-bottom:48px}.home-page .home-note-grid{gap:45px}.home-page .home-note-grid article{padding-top:30px}.home-page .home-note-grid h3{font-size:26px;line-height:1.2;letter-spacing:-.035em}.home-page .home-note-grid p{font-size:16px;line-height:1.75}.home-page .home-note-grid .eyebrow{font-size:12px;letter-spacing:.06em}.home-page .faq-section{padding-block:90px}.home-page summary{padding-block:26px;font-size:17px;letter-spacing:-.02em}.home-page details>p{font-size:16px}.home-page .footer{margin-top:0}.home-page .footer-links{font-size:14px}.home-page .footer-bottom{font-size:12px}
@media(min-width:1450px){.home-page .product-explorer{gap:90px;min-height:760px}.home-page .screen-phone{transform:scale(.91)}.home-page .screen-stage{height:590px}}
@media(max-width:1150px){.home-page .product-explorer{gap:38px;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}.home-page .screen-tabs button{padding:10px 12px;font-size:14px;gap:6px}.home-page .explorer-copy h1{font-size:clamp(3.1rem,5.6vw,4.6rem)}.home-page .feature-explanation{min-height:193px}.home-page .explorer-actions{gap:18px;flex-wrap:wrap}.home-page .explorer-actions>.button{padding:13px 18px}.home-page .feature-preview-trigger{padding:27px 23px;min-height:340px}.home-page .feature-card h3{font-size:25px}}
@media(max-width:800px){.site-header,.home-page .site-header{height:72px}.site-header nav{top:71px;gap:0}.home-page .product-explorer{gap:26px;padding-top:36px;padding-bottom:35px}.home-page .explorer-copy h1{font-size:clamp(2.8rem,5.7vw,3.8rem)}.home-page .explorer-copy>.eyebrow{font-size:12px;letter-spacing:.025em}.home-page .explorer-intro{font-size:16px}.home-page .audience-switch button{font-size:14px;padding:10px 16px}.home-page .feature-explanation{min-height:220px}.home-page .feature-explanation h2{font-size:22px}.home-page .feature-explanation p{font-size:16px}.home-page .screen-phone{transform:scale(.795)}.home-page .screen-stage{height:519px;padding-top:10px}.home-page .screen-tabs button>.icon{display:none}.home-page .screen-tabs button{padding:11px 14px;min-height:44px}.home-page .screen-caption{gap:10px;font-size:12px}.home-page .screen-caption span+span:before{margin-right:10px}.home-page .feature-grid{gap:16px}.home-page .home-discover{padding-block:75px}.home-page .discovery-heading{gap:20px}.home-page .home-note-grid{gap:24px}.home-page .home-note-grid h3{font-size:24px}}
@media(max-width:650px){.home-page .product-explorer{display:flex;flex-direction:column;gap:28px;align-items:stretch;padding:38px 0 35px;min-height:0}.home-page .explorer-copy{display:contents}.home-page .explorer-copy>.eyebrow{order:0;margin:0;text-align:center;justify-content:center;font-size:12px}.home-page .explorer-copy>h1{order:1;font-size:clamp(3.05rem,11.5vw,4.3rem);text-align:center;margin-top:-10px}.home-page .explorer-intro{order:2;text-align:center;margin:-7px 0 0;font-size:16px}.home-page .audience-switch{order:3;align-self:center;margin-top:-5px}.home-page .audience-switch button{padding:10px 23px}.home-page .explorer-console{order:4;align-self:stretch;max-width:none;margin-top:1px;padding-top:0}.home-page .feature-explanation{order:5;min-height:148px;margin:0;padding:23px 0 0;max-width:none;width:100%;text-align:left}.home-page .feature-explanation h2{font-size:24px}.home-page .feature-explanation p{font-size:16px}.home-page .explorer-actions{order:6;margin-top:-12px;justify-content:space-between;gap:16px;flex-wrap:wrap}.home-page .explorer-actions>.button{font-size:14px;padding:14px 18px}.home-page .explorer-actions .text-link{font-size:14px}.home-page .screen-tabs button>.icon{display:block;width:16px;height:16px}.home-page .screen-tabs button{font-size:14px;padding:10px 15px;gap:7px}.home-page .screen-tabs{overflow:auto;border-radius:29px;padding:5px;scrollbar-width:thin}.home-page .screen-phone{transform:scale(.83);height:520px}.home-page .screen-stage{height:535px;padding-top:15px}.home-page .screen-caption{margin-top:0}.home-page .game-sample{min-height:46px;margin-top:9px}.home-page .game-sample .micro{max-width:300px}.home-page .home-discover{padding-block:56px}.home-page .discovery-heading{margin-bottom:30px}.home-page .discovery-heading>p{margin-top:20px}.home-page .discovery-heading h2,.home-page .home-notes h2,.home-page #help h2{font-size:38px}.home-page .feature-preview-trigger{min-height:286px;padding:28px}.home-page .feature-top{margin-bottom:29px}.home-page .feature-card h3{font-size:28px}.home-page .home-notes{padding-top:30px;padding-bottom:65px}.home-page .home-note-grid{gap:32px}.home-page .home-note-grid h3{font-size:26px}.home-page .faq-section{padding-block:65px}.home-page summary{font-size:16px}.home-page .footer{padding-top:35px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.selection-pill,.motion-ready [data-reveal],.site-header,.button,.home-page .feature-preview-trigger{transition:none!important}.motion-ready [data-reveal]{opacity:1!important;translate:none!important}.home-page .screen-stage{transform:none!important}.home-page .feature-preview-trigger:hover,.button:hover,.button:active{transform:none!important}dialog[open],dialog[open]::backdrop{animation:none!important}}

/* Source order follows the mobile reading and keyboard order. */
.home-page .product-explorer{grid-template-rows:auto auto;row-gap:0;align-content:center}.home-page .explorer-copy{grid-column:1;grid-row:1;align-self:end}.home-page .explorer-console{grid-column:2;grid-row:1/span 2}.home-page .explorer-benefit{grid-column:1;grid-row:2;align-self:start}
@media(max-width:650px){.home-page .product-explorer{gap:28px}.home-page .explorer-benefit{display:contents}}

/* Audience above the device; feature navigation directly below it. */
.home-page .explorer-console>.audience-switch{display:flex;width:max-content;max-width:100%;margin:0 auto}
.home-page .explorer-console>.screen-tabs{margin-top:8px}
/* Only the optional game controls need space below the preview. */
.home-page .explorer-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-top: 10px;
  min-width: 0;
}
.home-page .explorer-meta[hidden] { display: none; }
.home-page .explorer-meta > .game-sample {
  grid-area: 1 / 1;
  min-width: 0;
  min-height: 60px;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: center;
}
.home-page .explorer-meta #explorer-prompt-status {
  width: 100%;
  max-width: min(400px, 100%);
}

/* Match the first screen to its available height, with room below every control. */
@media (min-width: 651px) {
  .home-page .product-explorer {
    --preview-scale: 1.055;
    min-height: calc(100svh - 72px);
    padding-block: 20px;
  }
  .home-page .explorer-console { padding-top: 0; }
  .home-page .screen-stage {
    height: calc(605px * var(--preview-scale) + 20px);
    min-height: 0;
    padding: 10px 0;
  }
  .home-page .screen-panel { min-height: 0; }
  .home-page .screen-phone {
    height: 605px;
    transform: scale(var(--preview-scale));
  }
  .home-page .explorer-copy { padding-bottom: 0; }
  .home-page .explorer-intro { margin: 22px 0 0; }
  .home-page .feature-explanation {
    min-height: 150px;
    margin-top: 24px;
    padding-top: 20px;
  }
  .home-page .explorer-actions { margin-top: 18px; }
}
@media (min-width: 651px) and (max-height: 900px) {
  .home-page .product-explorer { --preview-scale: .965; }
}
@media (min-width: 651px) and (max-height: 820px) {
  .home-page .product-explorer { --preview-scale: .875; }
}
@media (min-width: 651px) and (max-height: 760px) {
  .home-page .product-explorer { --preview-scale: .815; padding-block: 20px; }
}

/* Datey app navigation: outline at rest, solid silhouettes when selected. */
.home-page .screen-tabs button > .app-tab-icon { display: block; width: 20px; height: 20px; }
.app-tab-icon .icon-filled { display: none; }
.screen-tabs button[aria-selected="true"] .app-tab-icon .icon-outline { display: none; }
.screen-tabs button[aria-selected="true"] .app-tab-icon .icon-filled { display: inline; }

/* A more compact profile for both preview controls. */
.home-page .audience-switch,
.home-page .screen-tabs { padding: 3px; }
.home-page .audience-switch button,
.home-page .screen-tabs button { min-height: 34px; padding-block: 6px; line-height: 1.4; }
.home-page .audience-switch button { padding-inline: 16px; }
.home-page .explorer-console > .screen-tabs { width: max-content; max-width: 100%; margin-inline: auto; }
.home-page .screen-tabs button { flex: 0 0 auto; padding-inline: 10px; gap: 6px; }
.home-page .screen-tabs button > .app-tab-icon { width: 18px; height: 18px; }
@media (max-width: 650px) {
  .home-page .screen-phone { height: 605px; transform: scale(.88); }
  .home-page .screen-stage { height: calc(605px * .88 + 20px); padding: 10px 0; }
}

/* Full app captures already include their own status bar and navigation. */
.home-page .screen-panel .phone-screenshot { padding: 0; }
.home-page .screen-panel .phone-screenshot .phone-content { height: 100%; padding: 0; }
.home-page .phone-screenshot .app-screenshot {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

/* iPhone 17 Pro: the unmodified PNG supplies the chassis, buttons and island.
   Its 389 × 800 canvas has a display aperture at (17, 14), size 355 × 772.
   Keep the existing 605px outer-height contract across every preview state. */
.home-page .iphone-17-pro {
  position: relative;
  flex: none;
  width: calc(605px * 389 / 800);
  height: 605px;
  isolation: isolate;
}
.home-page .iphone-display {
  position: absolute;
  left: calc(17 / 389 * 100%);
  top: calc(14 / 800 * 100%);
  width: calc(355 / 389 * 100%);
  height: calc(772 / 800 * 100%);
  border-radius: 15% / 7%;
  overflow: hidden;
  background: #f4efe9;
}
.home-page .screen-panel .iphone-display > .phone {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.home-page .iphone-display .phone-island { display: none; }
.home-page .iphone-bezel {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  user-select: none;
}

/* Keep the reading blocks together; spare device height sits equally above
   and below the complete copy-and-download group. */
.home-page .product-explorer {
  grid-template-rows: minmax(0, 1fr) max-content max-content max-content max-content minmax(0, 1fr);
  align-items: stretch;
  row-gap: 0;
}
.home-page .explorer-copy {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  max-width: none;
  padding: 0;
  container-type: inline-size;
}
.home-page .explorer-copy h1 {
  font-size: clamp(1.75rem, 12.6cqw, 4.25rem);
  font-weight: 450;
  line-height: 1.07;
  letter-spacing: -.025em;
  margin: 0;
}
.home-page .explorer-copy h1 em {
  font-size: clamp(2.5rem, 17.8cqw, 6rem);
  font-weight: 600;
  letter-spacing: -.025em;
}
.home-page .explorer-intro {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 20px 0 0;
  font-size: 1.375rem;
  font-weight: 400;
  line-height: 1.5;
}
.home-page .explorer-intro > p { flex: 1; min-width: 0; color: inherit; }
.home-page .developer-message-button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 174px;
  width: 174px;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #edc2d538;
  border-radius: 16px;
  background: #f7eee808;
  color: #e0bbcf;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
}
.home-page .developer-message-button > span { min-width: 0; overflow-wrap: anywhere; }
.home-page .developer-message-button > .icon { width: 16px; height: 16px; flex-shrink: 0; }
.home-page .developer-message-button::before {
  content: "";
  position: absolute;
  inset: -30% auto -30% -55%;
  width: 45%;
  background: linear-gradient(105deg, transparent, #fce5ee52 35%, #fff5ed99 50%, #fce5ee52 65%, transparent);
  transform: translateX(0) skewX(-16deg);
  opacity: 1;
  pointer-events: none;
  animation: developer-message-shimmer 2.4s linear infinite;
}
@keyframes developer-message-shimmer {
  from { transform: translateX(0) skewX(-16deg); }
  to { transform: translateX(370%) skewX(-16deg); }
}
@media (prefers-reduced-motion: reduce) {
  .home-page .developer-message-button::before { animation: none; opacity: 0; }
}
@media (max-width: 800px) {
  .home-page .explorer-intro { flex-wrap: wrap; }
  .home-page .explorer-intro > p { flex-basis: 100%; }
}
.home-page .explorer-console {
  grid-column: 2;
  grid-row: 1 / span 6;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 0;
}
.home-page .explorer-console > .audience-switch,
.home-page .explorer-console > .screen-tabs { flex-shrink: 0; }
.home-page .explorer-console > .screen-stage {
  flex: 1 0 auto;
  min-height: calc(605px * var(--preview-scale, .88) + 20px);
}
.home-page .explorer-benefit { display: contents; }
.home-page .explorer-story {
  grid-column: 1;
  grid-row: 3;
  align-self: center;
  border-top: 1px solid var(--line);
  margin: 24px 0;
  padding-top: 20px;
}
.home-page .explorer-story h2,
.home-page .feature-explanation h2 {
  font-family: var(--sans);
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: -.03em;
  font-weight: 500;
  margin: 0 0 12px;
}
.home-page .explorer-story h2 { font-size: 1.75rem; font-weight: 600; }
.home-page .feature-explanation h2 { font-size: 1.75rem; font-weight: 500; }
.home-page .explorer-story p,
.home-page .feature-explanation p { font-size: 16px; font-weight: 400; line-height: 1.6; color: #ceb0bf; }
.home-page .feature-explanation {
  grid-column: 1;
  grid-row: 4;
  align-self: start;
  min-height: 0;
  max-width: none;
  border: 0;
  margin: 0;
  padding: 0 0 24px;
}
.home-page .explorer-actions {
  grid-column: 1;
  grid-row: 5;
  align-self: end;
  width: 100%;
  border-top: 0;
  margin: 0;
  padding-top: 0;
  gap: 24px;
}
.home-page .explorer-actions > [data-download] { font-weight: 600; }
.home-page .app-store-badge {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: inline-flex;
  width: 190px;
  max-width: 100%;
  flex-shrink: 0;
  border-radius: 12px;
  transform-origin: center;
  animation: app-store-breathe 4s ease-in-out infinite;
}
@keyframes app-store-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.035); }
}
@media (prefers-reduced-motion: reduce) {
  .home-page .app-store-badge { animation: none; transform: none; }
}
.home-page .app-store-badge img { display: block; width: 100%; height: auto; }
.home-page .app-store-badge:hover { opacity: .9; }
.home-page .app-store-badge:focus-visible { outline: 2px solid #edc2d5; outline-offset: 5px; }
.home-page .explorer-actions > #feature-detail { font-weight: 400; }
.home-page .explorer-meta { grid-column: 2; grid-row: 7; }
/* A personal letter: clear ink, generous paper margins, and three readable chapters. */
/* Fragment navigation uses only the sticky header offset, not two additive offsets. */
html:has(#developer-message:target) { scroll-padding-top: 72px; }
.home-page .developer-message-section {
  padding-block: 20px;
  min-height: calc(100svh - 72px);
  display: grid;
  align-items: center;
  scroll-margin-top: 0;
}
.home-page .developer-message-section:focus { outline: none; }
.home-page .developer-letter {
  width: 100%;
  /* Use the same .wrap edges as the hero, with no second width limit. */
  max-width: none;
  margin-inline: auto;
  padding: 24px 40px;
  min-height: calc(100svh - 112px);
  display: grid;
  grid-template-rows: auto 1fr auto;
  color: #391827;
  background: linear-gradient(125deg, #fffaf5, #f6ece4 80%);
  border: 1px solid #fff8f0;
  border-radius: 8px;
  box-shadow: 0 32px 100px #16081138, 0 3px 0 #e9d9cd;
}
.home-page .developer-message-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding-bottom: 16px;
}
.home-page .developer-message-heading h2 {
  margin: 0;
  font-family: var(--sans);
  font-size: 36px;
  font-weight: 450;
  line-height: 1.06;
  letter-spacing: -.045em;
  color: #391827;
}
.home-page .developer-message-heading h2 em {
  font-family: var(--serif);
  font-weight: 450;
  color: #872b50;
  letter-spacing: -.04em;
}
.home-page .developer-letter-app-icon {
  display: block;
  width: 48px;
  height: 50px;
  flex-shrink: 0;
  object-fit: contain;
  border-radius: 24%;
  mix-blend-mode: multiply;
}
.home-page .developer-message-body { display: grid; grid-template-rows: repeat(3, auto); }
.home-page .developer-letter-chapter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 144px;
  align-items: center;
  gap: 32px;
  padding-block: 16px;
  border-top: 1px solid #6c354424;
}
.home-page .developer-letter-chapter:nth-child(even) { grid-template-columns: 144px minmax(0, 1fr); }
.home-page .developer-chapter-message { min-width: 0; }
.home-page .developer-chapter-heading { margin-bottom: 8px; }
.home-page .developer-letter-chapter:nth-child(even) .developer-chapter-message { grid-column: 2; grid-row: 1; }
.home-page .developer-letter-chapter:nth-child(even) .developer-chapter-art { grid-column: 1; grid-row: 1; }
.home-page .developer-chapter-art {
  display: grid;
  place-items: center;
  width: 144px;
  height: 144px;
  border-radius: 50%;
  background: radial-gradient(circle, #cc84a11c, #dfb2bd0a 58%, transparent 72%);
}
.home-page .developer-chapter-art img {
  display: block;
  width: 128px;
  height: 128px;
  object-fit: contain;
  filter: drop-shadow(0 8px 10px #71314c12);
}
.home-page .developer-message-body h3 {
  margin: 0;
  font-family: var(--sans);
  font-size: 24px;
  line-height: 1.3;
  letter-spacing: -.025em;
  font-weight: 550;
  color: #481d30;
  text-wrap: balance;
}
.home-page .developer-chapter-copy { min-width: 0; }
.home-page .developer-message-body p {
  margin: 0;
  font-size: clamp(18px, 2.3vh, 20px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
  color: #59454b;
}
.home-page .developer-message-body p + p { margin-top: 8px; }
.home-page .developer-letter-signoff {
  display: flex;
  align-items: center;
  gap: 24px;
  padding-top: 4px;
  color: #872b50;
}
.home-page .developer-signature { font: italic 21px/1.3 var(--serif); }
.home-page .developer-signoff-rule { flex: 1; height: 1px; background: #6c354424; }
.home-page .developer-letter-signoff .icon { width: 18px; height: 18px; }
@media (min-width: 1000px) and (max-height: 850px) {
  .home-page .developer-message-section { padding-block: 20px; }
  .home-page .developer-letter { padding: 20px 32px; }
  .home-page .developer-message-heading { padding-bottom: 12px; }
  .home-page .developer-message-heading h2 { font-size: 34px; }
  .home-page .developer-letter-chapter { padding-block: 12px; }
  .home-page .developer-message-body p { font-size: 18px; }
  .home-page .developer-chapter-art { height: 120px; }
}
@media (max-width: 800px) {
  .home-page .developer-message-section { min-height: 0; padding-block: 20px; }
  .home-page .developer-letter { padding: 28px; min-height: 0; display: block; }
  .home-page .developer-message-body { display: block; }
  .home-page .developer-message-body p { font-size: 17px; }
  .home-page .developer-message-heading { padding-bottom: 24px; gap: 20px; }
  .home-page .developer-message-heading h2 { font-size: 28px; }
  .home-page .developer-letter-chapter,
  .home-page .developer-letter-chapter:nth-child(even) { position: relative; grid-template-columns: 1fr; gap: 0; padding-block: 24px; }
  .home-page .developer-letter-chapter:nth-child(even) .developer-chapter-message { grid-column: auto; grid-row: auto; }
  .home-page .developer-chapter-art { position: absolute; top: 24px; right: 0; width: 60px; height: 60px; }
  .home-page .developer-chapter-art img { width: 52px; height: 52px; }
  .home-page .developer-chapter-heading { min-height: 60px; padding-right: 76px; margin-bottom: 12px; }
  .home-page .developer-letter-chapter:nth-child(even) .developer-chapter-art { left: 0; right: auto; }
  .home-page .developer-letter-chapter:nth-child(even) .developer-chapter-heading { padding-left: 76px; padding-right: 0; }
  .home-page .developer-message-body h3 { text-wrap: initial; }
}
@media (max-width: 480px) {
  .home-page .developer-letter { padding: 24px; }
  .home-page .developer-message-heading h2 { font-size: 26px; }
  .home-page .developer-letter-app-icon { width: 36px; height: 38px; }
  .home-page .developer-message-body h3 { font-size: 20px; }
  .home-page .developer-signature { font-size: 20px; }
}
@media (max-width: 650px) {
  .home-page .product-explorer { display: flex; gap: 24px; }
  .home-page .explorer-copy { display: block; order: 0; text-align: center; }
  .home-page .explorer-intro { margin-top: 18px; justify-content: center; }
  .home-page .explorer-console { order: 1; width: 100%; }
  .home-page .explorer-meta { order: 2; margin-top: -18px; }
  .home-page .explorer-story { order: 3; margin: 0; padding-top: 24px; }
  .home-page .feature-explanation { order: 4; padding: 0; text-align: left; }
  .home-page .explorer-actions { order: 5; padding-top: 0; }
}

/* Homepage FAQ: heading above two independent columns of ten questions. */
.home-page #help { display: block; padding-block: 64px; }
.home-page #help .home-faq-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 36px; }
.home-page #help .home-faq-heading > div { min-width: 0; }
.home-page #help .home-faq-title-row { display: flex; align-items: center; gap: 16px; }
.home-page #help .home-faq-icon { width: clamp(40px, 4.2vw, 56px); height: auto; flex-shrink: 0; filter: drop-shadow(0 3px 10px rgb(205 135 170 / 12%)); }
.home-page #help .home-faq-heading .eyebrow { margin-bottom: 16px; }
.home-page #help h2 { font-size: clamp(32px, 3.6vw, 48px); }
.home-page #help .home-faq-heading > p { flex-shrink: 0; margin: 0; }
.home-page #help .home-faq-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; align-items: start; }
.home-page #help .faq-list { min-width: 0; }
.home-page #help summary, .home-page #help .faq-question-pending { min-height: 68px; padding: 20px 0; font-size: 17px; line-height: 1.45; }
.home-page #help summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.home-page #help summary > span { flex-shrink: 0; }
.home-page #help .faq-question-pending { border-bottom: 1px solid var(--line); }
.home-page #help .faq-question-pending h3 { font: inherit; letter-spacing: inherit; }
.home-page #help details > p { font-size: 16px; line-height: 1.65; padding-bottom: 20px; }
.home-page #help details > p a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) {
  .home-page #help .home-faq-heading { display: block; }
  .home-page #help .home-faq-heading > p { margin-top: 20px; }
  .home-page #help .home-faq-columns { grid-template-columns: 1fr; gap: 0; }
  .home-page #help .faq-list + .faq-list { border-top: 0; }
}

/* Local app policies: readable line lengths, including the permissions table. */
.legal-intro { max-width: 900px; padding-block: 72px 36px; }
.legal-intro h1 { font-size: clamp(36px, 5vw, 64px); }
.legal-intro .lead { margin-top: 24px; font-size: 17px; }
.legal-intro .policy-links { gap: 24px; }
.legal-intro .policy-links a { color: var(--muted); padding-bottom: 6px; }
.legal-intro .policy-links a[aria-current="page"] { color: var(--paper); border-bottom: 2px solid #cd87aa; }
.legal-document { font-size: 17px; line-height: 1.75; overflow-wrap: anywhere; }
.legal-document h2 { margin: 48px 0 20px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 28px; line-height: 1.3; }
.legal-document h3 { margin: 32px 0 16px; font-size: 22px; line-height: 1.4; }
.legal-document p, .legal-document ul, .legal-document ol { margin-block: 16px; color: var(--muted); }
.legal-document li { margin-block: 10px; }
.legal-document strong { color: var(--paper); font-weight: 600; }
.legal-document a { text-decoration: underline; text-underline-offset: 3px; }
.legal-document table { display: block; overflow-x: auto; margin-block: 24px; border-collapse: collapse; font-size: 15px; }
.legal-document th, .legal-document td { min-width: 150px; padding: 16px; border: 1px solid var(--line); vertical-align: top; text-align: left; }
.legal-document th { background: #ffffff08; }
.legal-document td { color: var(--muted); }
@media (max-width: 800px) {
  .legal-intro { padding-block: 48px 24px; }
  .legal-document { font-size: 16px; }
  .legal-document h2 { font-size: 24px; }
  .legal-document h3 { font-size: 20px; }
}

/* Feature notes follow their panel's selection state. */
.home-page .screen-panel { flex-direction: column; height: auto; }
.home-page .device-preview {
  width: 100%; height: calc(605px * var(--preview-scale, .88));
  display: flex; align-items: center; justify-content: center;
}
.home-page .preview-callouts { margin: 0; padding: 0; list-style: none; }
.home-page .preview-callout { display: flex; align-items: center; }
.home-page .callout-card {
  width: 164px; flex-shrink: 0; padding: 15px 14px;
  border: 1px solid #edc2d529; border-radius: 16px;
  background: linear-gradient(125deg, #71344c38, #39122570);
}
.home-page .callout-card h3 { font: 550 15px/1.3 var(--sans); letter-spacing: -.02em; color: #f7eee8; margin: 0 0 7px; }
.home-page .callout-card p { font: 400 13px/1.5 var(--sans); color: #d2b9c3; margin: 0; }
.home-page .explorer-console:not(.callouts-below) .device-preview { padding-right: 198px; }
.home-page .explorer-console:not(.callouts-below) .preview-callout {
  position: absolute; top: var(--callout-position); right: 0;
  left: calc(50% - 99px + 147.090625px * var(--preview-scale, .88));
  transform: translateY(-50%);
}
.home-page .callout-connector { position: relative; height: 1px; flex: 1; background: linear-gradient(90deg, #e0a8c0a0, #e0a8c040); }
.home-page .callout-connector::before { content: ''; position: absolute; width: 5px; height: 5px; border-radius: 50%; left: -2px; top: -2px; background: #e8b9cf; }
.home-page .explorer-console.callouts-below .preview-callouts { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding-block: 20px; }
.home-page .explorer-console.callouts-below .callout-card { width: 100%; height: 100%; }
.home-page .explorer-console.callouts-below .callout-connector { display: none; }
.home-page .explorer-console.callouts-below > .screen-stage { height: auto; flex-grow: 0; }
@media (min-width: 1100px) {
  /* Let the side column's measured height reserve space above the tab bar. */
  .home-page .explorer-console:not(.callouts-below) > .screen-stage { height: auto; }
}
@media (max-width: 650px) {
  .home-page .device-preview { height: calc(605px * .88); }
  .home-page .explorer-console.callouts-below .preview-callouts { grid-template-columns: 1fr; }
  .home-page .explorer-console.callouts-below .callout-card { padding: 14px 16px; }
  .home-page .explorer-console.callouts-below .callout-card h3 { margin-bottom: 4px; }
  .home-page .explorer-console.callouts-below .callout-card p { font-size: 14px; }
}
.home-page .explorer-console:not(.callouts-below) > .audience-switch { transform: translateX(-99px); }
@media (max-width: 650px) {
  .home-page .explorer-console::before { inset-inline: 0; }
  .home-page .explorer-console > .audience-switch { order: 0; }
  .home-page .explorer-console > .screen-stage { order: 1; }
  .home-page .explorer-console > .screen-tabs { order: 2; }
}

/* A selectable feature list replaces the connector diagram. */
.home-page .preview-highlights { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; }
.home-page .preview-highlights g { opacity: 0; transition: opacity .2s ease; }
.home-page .preview-highlights g.is-active { opacity: 1; }
.home-page .preview-highlights rect { fill: color-mix(in srgb, currentColor 9%, transparent); stroke: currentColor; stroke-width: 1.5; filter: drop-shadow(0 0 4px currentColor); }
.home-page .feature-callouts .callout-card {
  width: 228px; display: flex; align-items: flex-start; gap: 12px;
  padding: 15px 12px; border: 1px solid transparent; border-radius: 14px;
  background: transparent; text-align: left; cursor: pointer; appearance: none;
  transition: background .2s ease, border-color .2s ease;
}
.home-page .feature-callouts .callout-card.is-active {
  background: color-mix(in srgb, var(--feature-accent) 9%, transparent);
  border-color: color-mix(in srgb, var(--feature-accent) 20%, transparent);
}
.home-page .feature-callouts .callout-card:focus-visible { outline: 2px solid var(--feature-accent); outline-offset: 3px; }
.home-page .feature-icon { width: 22px; height: 22px; flex: 0 0 22px; color: var(--feature-accent); margin-top: 1px; }
/* Preserve the app's actual glyphs, including the two activity symbols. */
.home-page .feature-icon-source { display: block; width: 100%; height: 100%; background: currentColor; mask: var(--icon-source) center / contain no-repeat; }
.home-page .feature-icon-pair { position: relative; height: 27px; }
.home-page .feature-icon-pair .feature-icon-source { position: absolute; top: 0; left: 0; width: 17px; height: 17px; }
.home-page .feature-icon-pair .feature-icon-next { top: 13px; left: 9px; width: 15px; height: 15px; color: var(--secondary-feature-accent, #c39ae9); }
.home-page .feature-icon-event { padding: 4px; border-radius: 6px; background: linear-gradient(#efa226, #bc620a); color: white; }
.home-page .feature-copy { min-width: 0; }
.home-page .feature-title { display: block; font: 550 14px/1.3 var(--sans); letter-spacing: -.02em; color: #f7eee8; }
.home-page .feature-description { display: block; margin-top: 5px; font: 400 13px/1.45 var(--sans); color: #d2b9c3; }
.home-page .explorer-console:not(.callouts-below) .feature-callouts {
  position: absolute; inset: 0 0 0 auto; width: 228px;
  display: flex; flex-direction: column; justify-content: center; gap: 8px; z-index: 3;
}
.home-page .explorer-console:not(.callouts-below) .feature-callouts .preview-callout { position: static; transform: none; }
.home-page .explorer-console.callouts-below .feature-callouts .callout-card { width: 100%; }
@media (prefers-reduced-motion: reduce) {
  .home-page .preview-highlights g, .home-page .feature-callouts .callout-card { transition: none; }
}

.home-page .explorer-console::before { inset-inline: 0; }

/* Let descriptive copy use the full row width beneath its icon and title. */
.home-page .feature-callouts .callout-card { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 5px 12px; padding: 12px; }
.home-page .feature-callouts .feature-copy { display: contents; }
.home-page .feature-callouts .feature-title { align-self: center; }
.home-page .feature-callouts .feature-description { grid-column: 1 / -1; margin-top: 0; }

/* Widen towards the page edge without moving the phone or the labels' left edge. */
.home-page .explorer-console:not(.callouts-below) .feature-callouts { left: calc(100% - 228px); right: auto; width: var(--feature-note-width, 228px); }
.home-page .explorer-console:not(.callouts-below) .feature-callouts .callout-card { width: 100%; }
/* Real single-mode captures use flowing notes, so longer translations never overlap. */
.home-page .explorer-console:not(.callouts-below) .preview-callouts:not(.feature-callouts) {
  position: absolute; inset: 0 auto 0 calc(100% - 228px);
  width: var(--feature-note-width, 228px);
  display: flex; flex-direction: column; justify-content: center; gap: 12px;
}
.home-page .explorer-console:not(.callouts-below) .preview-callouts:not(.feature-callouts) .preview-callout {
  position: static; transform: none;
}
.home-page .explorer-console:not(.callouts-below) .preview-callouts:not(.feature-callouts) .callout-card { width: 100%; }
.home-page .preview-callouts:not(.feature-callouts) .callout-connector { display: none; }

/* Keep all six Together descriptions beside the phone on desktop. */
.home-page [data-panel="couples-together"] .feature-callouts { row-gap: 6px; }
.home-page [data-panel="couples-together"] .callout-card { padding-block: 8px; }
.home-page .feature-callouts .feature-info { cursor: default; }
.home-page .explorer-console:not(.callouts-below) [data-panel="couples-together"] { min-height: 570px; }

/* Keep Singles and Couples notes equally compact, preserving text size and touch targets. */
.home-page .explorer-console:not(.callouts-below) .feature-callouts { gap: 4px; }
.home-page .explorer-console:not(.callouts-below) .feature-callouts .callout-card { padding-block: 8px; }

.home-page .site-copyright { padding-block: 22px 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }

/* Small screens use a full-width reading flow, independent of the desktop grid. */
@media (max-width: 650px) {
  .home-page .site-header,
  .home-page .site-header.is-scrolled { height: 64px; background: #320d21; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .home-page .nav-wrap { gap: 12px; }
  .home-page .brand .datey-wordmark { width: 100px; }
  .home-page .nav-download { min-height: 44px; padding: 9px 14px; font-size: 12px; gap: 8px; }
  .home-page .menu-toggle { min-height: 44px; font-size: 13px; }
  .home-page .product-explorer { padding-block: 32px; gap: 28px; }
  /* inline-size containment plus align-self:start otherwise produces zero width. */
  .home-page .explorer-copy { width: 100%; min-width: 0; align-self: stretch; }
  .home-page .explorer-copy h1 { margin: 0; font-size: clamp(28px, 8.2vw, 42px); line-height: 1.12; }
  .home-page .explorer-copy h1 em { font-size: clamp(36px, 10.6vw, 54px); line-height: 1.12; }
  .home-page .explorer-intro { flex-direction: column; flex-wrap: nowrap; gap: 16px; margin-top: 18px; font-size: 16px; line-height: 1.5; }
  .home-page .explorer-intro > p { flex: none; width: 100%; max-width: 310px; }
  .home-page .developer-message-button { flex: none; width: auto; max-width: 300px; min-height: 44px; padding: 11px 14px; font-size: 13px; }
  .home-page .developer-message-button > span { overflow-wrap: normal; }
  .home-page .explorer-console { gap: 12px; }
  .home-page .explorer-console > .audience-switch { margin: 0 auto; }
  .home-page .audience-switch button { min-height: 44px; padding: 9px 20px; }
  /* Keep every section available before the preview and its descriptions. */
  .home-page .explorer-console > .screen-tabs { order: 1; display: flex; width: 100%; margin: 0; padding: 4px; gap: 0; overflow: hidden; border-radius: 20px; }
  .home-page .screen-tabs button { flex: 1 1 0; min-width: 0; min-height: 54px; padding: 6px 2px; flex-direction: column; justify-content: center; gap: 4px; font-size: 11px; line-height: 1.2; white-space: nowrap; }
  .home-page .screen-tabs .selection-pill { border-radius: 15px; }
  .home-page .screen-tabs button > .icon,
  .home-page .screen-tabs button > .app-tab-icon { display: block; width: 19px; height: 19px; }
  .home-page .explorer-console > .screen-stage { order: 2; min-height: 0; padding: 8px 0 0; transform: none; contain: none; }
  /* Size the chassis directly instead of stacking scaled, filtered clipping layers. */
  .home-page .device-preview { --mobile-phone-height: clamp(480px, 138vw, 580px); height: var(--mobile-phone-height); }
  .home-page .screen-phone { height: var(--mobile-phone-height); width: calc(var(--mobile-phone-height) * 389 / 800); transform: none; filter: none; }
  .home-page .iphone-17-pro { width: 100%; height: 100%; }
  .home-page .explorer-console.callouts-below .preview-callouts { padding-block: 16px 0; gap: 8px; }
  .home-page .explorer-console.callouts-below .callout-card { padding: 14px; }
  .home-page .feature-title { font-size: 15px; }
  .home-page .feature-description { font-size: 14px; line-height: 1.5; }
  .home-page .explorer-story, .home-page .feature-explanation { width: 100%; align-self: stretch; }
  .home-page .explorer-story h2, .home-page .feature-explanation h2 { font-size: 24px; line-height: 1.25; }
  .home-page .explorer-story p, .home-page .feature-explanation p { font-size: 16px; line-height: 1.6; }
  .home-page .explorer-actions { justify-content: center; }
  .home-page .app-store-badge { width: 166px; }
  .home-page .developer-message-section { padding-block: 12px 28px; }
  .home-page .developer-letter { padding: 22px 20px; }
  .home-page .developer-message-heading { gap: 12px; padding-bottom: 20px; }
  .home-page .developer-message-heading h2 { font-size: 25px; line-height: 1.15; }
  .home-page .developer-letter-chapter,
  .home-page .developer-letter-chapter:nth-child(even) { padding-block: 22px; }
  .home-page .developer-chapter-art,
  .home-page .developer-letter-chapter:nth-child(even) .developer-chapter-art { top: 22px; left: auto; right: 0; width: 40px; height: 40px; grid-column: auto; grid-row: auto; }
  .home-page .developer-chapter-art img { width: 40px; height: 40px; }
  .home-page .developer-chapter-heading,
  .home-page .developer-letter-chapter:nth-child(even) .developer-chapter-heading { min-height: 40px; padding: 0 52px 0 0; margin-bottom: 12px; }
  .home-page .developer-message-body h3 { font-size: 19px; line-height: 1.35; }
  .home-page .developer-message-body p { font-size: 16px; line-height: 1.6; }
  .home-page .developer-letter-signoff { gap: 14px; padding-top: 8px; }
  .home-page .developer-signature { font-size: 20px; white-space: nowrap; }
  .home-page #help { padding-block: 36px; }
  .home-page #help .home-faq-heading { margin-bottom: 24px; }
  .home-page #help .home-faq-title-row { align-items: flex-start; gap: 12px; }
  .home-page #help .home-faq-icon { width: 32px; margin-top: 3px; }
  .home-page #help h2 { font-size: 30px; line-height: 1.15; }
  .home-page #help .home-faq-heading > p { font-size: 14px; line-height: 1.6; }
  .home-page #help .home-faq-heading > p .text-link { gap: 10px; }
  .home-page #help summary { min-height: 64px; padding-block: 18px; font-size: 16px; gap: 14px; }
  .home-page #help details > p { font-size: 15px; line-height: 1.6; }
  .home-page .site-copyright { font-size: 12px; padding-block: 20px 24px; }
  html:has(.home-page) { scroll-padding-top: 80px; }
}

/* FAQ fragments land below the sticky header, with enough document height even
   on large displays. Do not add the default 110px anchor gap to this section. */
html:has(#help:target) { scroll-padding-top: 72px; }
.home-page #help { min-height: calc(100svh - 72px); scroll-margin-top: 0; }
@media (max-width: 650px) {
  html:has(#help:target) { scroll-padding-top: 64px; }
  .home-page #help { min-height: calc(100svh - 64px); }
}