/* B only: hide scrollbar chrome without disabling any scroll surface. */
:root,body[data-design=b],body[data-design=b] *{scrollbar-width:none;-ms-overflow-style:none}
:root::-webkit-scrollbar,body[data-design=b]::-webkit-scrollbar,body[data-design=b] *::-webkit-scrollbar{display:none;width:0;height:0}
/* The A bento contracts use the B palette and the same shared interactions. */
.b-day .experience-grid{margin-top:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.b-day .experience-grid>*,.b-day .details-grid>*{min-width:0}
.b-day .signals-feature,.b-day .app-feature{background:#1b1e1f;border:1px solid var(--b-line)}
.b-day .sleep-feature{color:#f5f4ef}
.b-day .sleep-feature .feature-number,.b-day .sleep-feature .feature-copy p{color:#d8ddd9}
.b-day .feature-copy h3{font-weight:600;letter-spacing:-.04em}
/* Keep the reflection inside its surface while allowing the tooltip to extend out. */
.b-day .signals-feature.bento-reflection::after{transform:none;background-size:240% 100%;background-position:100% 0}
.b-day .signals-feature.bento-reflection[data-revealed=true]::after{animation:bento-reflex-contained 900ms ease-out 1}
@keyframes bento-reflex-contained{0%{opacity:0;background-position:100% 0}30%{opacity:.65}100%{opacity:0;background-position:0 0}}
.b-bento-platform{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.b-bento-platform img{position:static;width:16px;height:16px;max-width:16px;object-fit:contain;transform:none}
.b-bento-app-links{display:flex;gap:8px;margin-top:12px}
.b-bento-app-links a{display:grid;place-items:center;width:44px;height:44px;border-radius:12px}
.b-bento-app-links img{position:static;inset:auto;width:32px;height:32px;max-width:32px;border-radius:8px;transform:none}
.b-details{padding-top:var(--b-chapter-space);background:transparent}
.b-details .section-top{align-items:end}
.b-details .section-top .eyebrow{color:var(--b-muted);font-size:.6875rem}
.b-details h2{font-size:clamp(2.4rem,4.7vw,4.5rem)}
.b-details .detail-card{--spotlight-tint:#d5fb490a;background:#1b1e1f}
.b-details .detail-sleep{background:#101015}
.b-details .detail-water{background:#101a17}
.b-details .detail-copy h3{font-weight:600;letter-spacing:-.04em}
/* Restore the photographic A cards, omitting the already explained sizing kit. */
.b-easy .easy-grid{margin-top:64px;padding-top:40px;border-top:1px solid var(--b-line);grid-template-columns:repeat(3,minmax(0,1fr))}
.b-easy .easy-card{
  color-scheme:light;color:#202023;--text-primary:#202023;--text-secondary:#64646b;
  --easy-ink:#202023;--easy-muted:#64646b;--life-accent:#3d641b;
}
.b-easy .easy-copy h3{font-weight:600;letter-spacing:-.04em}
.b-easy .easy-copy .easy-benefit{color:#3d641b}
.b-easy .easy-footnote{color:var(--b-muted)}
@media(max-width:1100px){.b-easy .easy-photo{height:210px}}
@media(max-width:767px){
  .b-day .experience-grid{grid-template-columns:minmax(0,1fr)}
  .b-day .signals-feature,.b-day .app-feature{padding:24px}
  .b-day .app-feature{min-height:320px}
  .b-day .app-feature .feature-copy{max-width:60%}
  .b-details .section-top{gap:20px}
  .b-details .section-note{max-width:19ch}
  .b-details .section-top .eyebrow{font-size:.625rem}
  .b-details h2{font-size:2.4rem}
  .b-easy .easy-grid{margin-top:40px;padding-top:32px}
  .b-easy .easy-grid{grid-template-columns:minmax(0,1fr)}
  .b-easy .easy-photo{height:260px}
}
@media(max-width:374px){
  .b-day .app-feature .feature-copy h3{font-size:1.4rem}
  .b-easy .easy-grid{grid-template-columns:minmax(0,1fr)}
  .b-easy .easy-photo{height:240px}
}
@media(prefers-reduced-motion:reduce){.b-day .signals-feature.bento-reflection[data-revealed=true]::after{animation:none!important}}
