@import url("../tokens/happy-longevity/boring.css");
:root{--paper:var(--boring-color-surface-page);--ink:var(--boring-color-text-primary);--muted:var(--boring-color-text-secondary);--butter:var(--boring-color-brand-character);--sky:var(--boring-color-surface-welcome);--wash:var(--boring-color-surface-warm);--line:var(--boring-color-border-subtle);--white:var(--boring-color-surface-card);--calm:var(--boring-color-status-success-background);--calm-ink:var(--boring-color-status-success-foreground);--display:var(--boring-font-family-display),ui-rounded,sans-serif;--body:var(--boring-font-family-body),Arial,sans-serif;--face:var(--ink)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.6 var(--body)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--ink);outline-offset:5px}svg{display:block}p,h1,h2,h3,h4{margin:0}button{border:0}a{text-decoration:none}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-80px;left:20px;background:var(--ink);color:var(--paper);padding:12px 20px;z-index:20}.skip-link:focus{top:12px}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.mark{color:var(--face);overflow:visible;flex:none}.b-body{fill:var(--butter)}
.topbar{max-width:1440px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;font:800 34px/1 var(--display);letter-spacing:-1.7px}.brand .mark{width:34px;height:38px}.edition{font-size:13px;color:var(--muted)}.edition-dot{padding:0 10px}.toplink{display:flex;align-items:center;gap:12px;font-size:13px;min-height:48px}.toplink .icon{width:18px}main{max-width:1440px;margin:auto;padding:0 5%}.intro{display:grid;grid-template-columns:1.1fr 1fr;gap:6%;padding:65px 0 55px;align-items:center}.eyebrow{font-size:11px;line-height:1.6;letter-spacing:1.55px;text-transform:uppercase;font-weight:700;display:flex;align-items:center;gap:9px}.tiny-sun{width:10px;height:10px;border-radius:50%;background:var(--butter)}h1{font:700 clamp(46px,5.4vw,78px)/1.08 var(--display);letter-spacing:-3.2px;margin:24px 0 26px}h1 .living{position:relative;white-space:nowrap}h1 .living svg{position:absolute;width:100%;height:18px;left:0;bottom:-9px;fill:none;stroke:var(--butter);stroke-width:6;stroke-linecap:round}.lead{font-size:19px;line-height:1.65;color:var(--muted)}.intro-foot{display:flex;gap:18px;margin-top:53px;font-size:13px;color:var(--muted);line-height:1.5}.index{font-size:11px;padding-top:3px;color:var(--ink)}.character-stage{background:var(--sky);border-radius:var(--boring-radius-hero);min-height:480px;display:flex;flex-direction:column;overflow:hidden}.stage-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:24px 26px;font-size:13px}.outline-tag{font-size:10px;border:1px solid color-mix(in srgb,var(--ink),transparent 72%);padding:5px 10px;border-radius:30px}.character-scene{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-height:335px}.sun-disc{position:absolute;width:250px;height:250px;border-radius:50%;background:color-mix(in srgb,var(--paper),transparent 35%);top:10px}.ground{position:absolute;bottom:23px;width:160px;height:13px;background:var(--ink);opacity:.07;border-radius:50%}.hero-character{width:218px;height:232px;transform:rotate(-8deg);margin-top:-12px;z-index:1}.scene-note{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:12px}.stage-bottom{padding:26px;display:flex;justify-content:space-between;align-items:center;font-size:11px;line-height:1.5}.mini-character{width:25px;height:30px;--butter:var(--ink);--face:var(--sky)}
.palette-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0 30px;border-bottom:1px solid var(--line)}.palette-bar p{font-size:13px;color:var(--muted);margin-top:3px}.palette-controls{display:flex;gap:8px;flex-wrap:wrap}.palette-button{border:1px solid var(--line);background:transparent;border-radius:50px;padding:9px 15px;display:flex;align-items:center;gap:8px;min-height:48px;font-size:12px}.palette-button[aria-pressed=true]{background:var(--white);border-color:var(--ink)}.choice-note{font-size:9px;letter-spacing:.2px;color:var(--muted)}.pair{width:22px;height:22px;border-radius:50%;background:linear-gradient(90deg,#f2ca66 50%,#294968 50%)}.pair.garden{background:linear-gradient(90deg,#efb38d 50%,#315449 50%)}.pair.soft{background:linear-gradient(90deg,#cdc2e8 50%,#554261 50%)}
.identity-section{padding:70px 0}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:55px;margin-bottom:28px}h2{font:700 36px/1.18 var(--display);letter-spacing:-1.2px;margin-top:12px}.section-heading>p{max-width:330px;color:var(--muted);font-size:14px;line-height:1.7}.identity-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:16px}.identity-grid article{position:relative;border-radius:var(--boring-radius-panel);min-height:290px;padding:25px;display:flex;flex-direction:column}.card-label{font-size:11px;letter-spacing:.25px}.wordmark-card{background:var(--wash);justify-content:space-between}.large-brand{font-size:74px;letter-spacing:-4px;margin-top:28px;align-self:center;gap:10px}.large-brand .mark{width:65px;height:75px}.wordmark-card>p{text-align:center;font-size:13px;margin:3px 0 32px}.asset-link{display:flex;align-items:center;gap:8px;font-size:11px;min-height:24px}.asset-link .icon{width:15px;height:15px}.mono-card{background:var(--ink);color:var(--paper);align-items:center;justify-content:space-between}.mono-card .card-label{align-self:flex-start}.mono-mark{--butter:var(--paper);--face:var(--ink);width:124px;height:137px;transform:rotate(-8deg);margin:20px 0}.small-caption{font-size:10px}.scale-card{border:1px solid var(--line);background:var(--white)}.scale-line{display:flex;align-items:flex-end;gap:22px;margin:35px 0 24px}.scale-card>p{font-size:12px;color:var(--muted)}.app-icon{position:absolute;width:50px;height:50px;bottom:22px;right:22px;background:var(--sky);border-radius:13px;display:grid;place-items:center;transform:rotate(9deg)}.app-icon .mark{width:32px;height:36px}
.motion-section{display:grid;grid-template-columns:1fr 1.15fr;gap:12%;padding:55px 6%;background:var(--wash);border-radius:var(--boring-radius-hero);align-items:center}.motion-description>p:not(.eyebrow){font-size:14px;color:var(--muted);max-width:310px;margin-top:20px}.text-button{display:flex;gap:16px;align-items:center;background:transparent;font-size:12px;margin-top:22px;min-height:44px;padding:0}.text-button span{font-size:14px}.motion-description .motion-access{font-size:10px!important;margin-top:12px!important;max-width:250px!important}.loader-demo{border-radius:var(--boring-radius-panel);background:var(--paper);padding:23px 24px 10px;min-height:325px;display:flex;flex-direction:column}.loader-center{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:20px 0 25px}.loader-center>.mark{width:87px;height:98px;margin-bottom:20px;transform-origin:50% 85%}.loader-center>p{font-size:15px;font-weight:600}.loader-center>span{font-size:11px;color:var(--muted);margin-top:7px}.replay-button{display:flex;align-items:center;justify-content:space-between;background:transparent;border-top:1px solid var(--line);font-size:11px;min-height:45px}.replay-button .icon{width:16px}.waiting{--eye-animation:b-blink var(--boring-component-loader-blink-duration) var(--boring-component-loader-easing) infinite;animation:b-settle var(--boring-component-loader-duration) var(--boring-component-loader-easing) infinite;animation-play-state:var(--motion-state,running)}.b-eyes{transform-box:fill-box;transform-origin:center;animation:var(--eye-animation,none);animation-play-state:var(--motion-state,running)}.paused{--motion-state:paused}@keyframes b-settle{0%,100%{transform:rotate(calc(var(--boring-motion-loader-rotate-start) * 1deg)) translateY(0)}50%{transform:rotate(calc(var(--boring-motion-loader-rotate-end) * 1deg)) translateY(var(--boring-motion-loader-rise))}}@keyframes b-blink{0%,44%,50%,100%{transform:scaleY(1)}46%,48%{transform:scaleY(var(--boring-motion-loader-blink-scale))}}
.application-section{display:grid;grid-template-columns:1fr 1fr;gap:7%;padding:85px 0 75px;align-items:center}.application-copy>p:not(.eyebrow){font-size:16px;color:var(--muted);line-height:1.7;max-width:390px;margin-top:24px}.application-copy h2{font-size:42px}.principle{display:flex;gap:18px;margin-top:28px;max-width:390px}.principle>span{font-size:11px;border:1px solid var(--line);border-radius:50%;width:30px;height:30px;display:grid;place-items:center;flex:none}.principle h3{font-size:14px;font-weight:600;line-height:1.4}.principle p{color:var(--muted);font-size:13px;margin-top:6px;line-height:1.6}.phone-area{display:flex;flex-direction:column;align-items:center;position:relative}.phone-area:before{content:'';position:absolute;width:100%;height:70%;top:18%;background:var(--sky);border-radius:48% 48% 30% 30%;z-index:-1}.prototype-label{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;margin-bottom:20px;color:var(--muted)}.phone{width:360px;background:var(--white);border:6px solid var(--white);outline:1px solid var(--line);border-radius:37px;overflow:hidden;box-shadow:0 22px 45px -30px #29496855}.phone-top{height:38px;display:flex;justify-content:space-between;align-items:center;padding:5px 24px;background:var(--sky);position:relative;font-size:11px;font-weight:700}.phone-camera{position:absolute;left:calc(50% - 39px);width:78px;height:19px;border-radius:var(--boring-radius-panel);background:var(--ink);top:7px}.app-welcome{background:var(--sky);padding:12px 21px 25px;border-radius:0 0 23px 23px}.app-brand-row{display:flex;justify-content:space-between;align-items:center}.app-wordmark{font-size:26px;letter-spacing:-1.3px}.avatar{border-radius:50%;width:30px;height:30px;background:var(--paper);display:grid;place-items:center;font-size:12px}.greeting-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:20px}.greeting-small{font-size:12px;margin-bottom:8px}.greeting-row h3{font:700 29px/1.12 var(--display);letter-spacing:-1px}.greeting-row>.mark{width:65px;height:76px;transform:rotate(8deg)}.welcome-note{display:block;font-size:11px;margin-top:17px}.app-content{padding:18px 16px 15px}.family-tabs{display:flex;background:var(--wash);border-radius:var(--boring-radius-control);padding:4px;gap:3px;margin-bottom:16px}.family-tabs button{flex:1;background:transparent;border-radius:9px;min-height:44px;font-size:12px}.family-tabs button[aria-pressed=true]{background:var(--white);font-weight:600}.appointment{border:1px solid var(--line);border-radius:17px;padding:16px}.appointment-top{display:flex;gap:9px;align-items:center;font-size:10px;color:var(--muted)}.icon-tile{display:grid;place-items:center;border-radius:8px;width:30px;height:30px;background:var(--wash);color:var(--ink)}.icon-tile .icon{width:16px;height:16px}.appointment h4{font:700 19px/1.3 var(--display);letter-spacing:-.4px;margin-top:13px}.appointment>p{font-size:12px;color:var(--muted);margin-top:5px}.appointment-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px;gap:8px}.confirmed{display:flex;gap:4px;align-items:center;color:var(--calm-ink);background:var(--calm);border-radius:8px;padding:4px 7px;font-size:10px}.confirmed .icon{width:13px;height:13px}.appointment-footer button{display:flex;gap:7px;align-items:center;background:transparent;min-height:44px;font-size:11px}.appointment-footer button .icon{width:15px;height:15px}.visit-note{border-top:1px solid var(--line);padding-top:10px;font-size:11px!important}.care-row{display:flex;align-items:center;gap:10px;margin:20px 0 15px}.doctor-avatar{width:34px;height:34px;background:var(--wash);border-radius:50%;font:700 11px var(--display);display:grid;place-items:center;flex:none}.care-row strong{font-size:11px;display:block}.care-row p{font-size:10px;color:var(--muted);margin-top:2px}.care-button{background:var(--ink);color:var(--paper);border-radius:var(--boring-radius-control);width:100%;min-height:48px;padding:10px 12px;font-size:11px;display:flex;align-items:center;justify-content:space-between}.care-button .icon{width:17px;height:17px}.demo-note{font-size:11px;margin-top:12px;color:var(--muted)}.app-bottom{display:flex;justify-content:space-around;border-top:1px solid var(--line);padding:14px 7px 10px;color:var(--muted)}.app-bottom>span{display:flex;align-items:center;gap:4px;flex-direction:column;font-size:9px}.app-bottom .icon{width:19px;height:19px}.app-bottom .active{color:var(--ink);font-weight:700}.home-indicator{height:4px;background:var(--ink);width:96px;margin:0 auto 5px;border-radius:10px}
.foundations{padding:45px 0 50px;border-top:1px solid var(--line)}.foundation-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px}.type-spec{border-right:1px solid var(--line);padding:10px 30px 10px 0}.type-large{font:700 56px/1.2 var(--display);letter-spacing:-1.5px;margin:15px 0}.type-spec>p:not(.type-large){font-size:16px;color:var(--muted)}.type-sample{font-size:13px;margin-top:22px;letter-spacing:1px}.colours{display:grid;grid-template-columns:1fr 1fr;gap:10px}.colour-swatch{border-radius:16px;min-height:118px;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;font-size:12px}.colour-swatch code{font:10px var(--body);opacity:.85}.colour-swatch[data-swatch=paper]{background:var(--paper);border:1px solid var(--line)}.colour-swatch[data-swatch=ink]{background:var(--ink);color:var(--paper)}.colour-swatch[data-swatch=butter]{background:var(--butter)}.colour-swatch[data-swatch=sky]{background:var(--sky)}.tone-note{display:flex;gap:16px;border-top:1px solid var(--line);padding:30px 0;align-items:flex-start}.tone-note .icon{width:20px;margin-top:2px}.tone-note p{font-size:12px;color:var(--muted);max-width:850px}.tone-note strong{color:var(--ink)}footer{max-width:1440px;margin:auto;padding:28px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line)}.footer-brand{font-size:27px}.footer-brand .mark{width:25px;height:29px}footer p{font-size:13px}footer>span{font-size:10px;color:var(--muted)}[hidden]{display:none!important}
@media(min-width:1500px){.intro{padding-top:80px;padding-bottom:70px}.character-stage{min-height:520px}}
@media(max-width:1050px){.edition{display:none}main{padding:0 4%}.intro{gap:4%}h1{font-size:58px;letter-spacing:-2.5px}.character-stage{min-height:460px}.palette-bar{align-items:flex-start;flex-direction:column;gap:15px}.identity-grid{grid-template-columns:1.35fr 1fr}.scale-card{grid-column:1/-1;min-height:200px!important}.scale-line{margin:20px 0 10px}.scale-card>p{position:absolute;right:110px;bottom:28px}.motion-section{gap:7%;padding:40px 5%}.application-copy h2{font-size:34px}.section-heading{gap:30px}h2{font-size:31px}.phone{width:340px}.greeting-row h3{font-size:27px}}
@media(max-width:720px){.topbar{padding:15px 6%;gap:12px}.brand{font-size:29px}.toplink{font-size:11px;gap:6px}main{padding:0 6%}.intro{grid-template-columns:1fr;padding:40px 0 26px;gap:30px}h1{font-size:clamp(46px,9.5vw,68px);letter-spacing:-2.4px;line-height:1.08;margin:20px 0 24px}.lead{font-size:17px}.intro-foot{margin-top:28px}.character-stage{min-height:420px}.character-scene{min-height:265px}.hero-character{width:180px;height:202px}.sun-disc{width:215px;height:215px}.ground{bottom:28px}.stage-top,.stage-bottom{padding:20px}.outline-tag{font-size:9px}.palette-bar{padding-top:6px}.palette-controls{gap:8px}.palette-button{font-size:11px;padding:9px 12px}.choice-note{display:none}.identity-section{padding:40px 0}.section-heading{display:block;margin-bottom:23px}.section-heading>p{margin-top:18px;max-width:100%}h2,.application-copy h2{font-size:31px}.identity-grid{grid-template-columns:1fr 1fr;gap:12px}.wordmark-card{grid-column:1/-1;min-height:265px!important}.large-brand{font-size:78px}.identity-grid article{padding:20px;min-height:240px}.scale-card{grid-column:auto;min-height:240px!important}.scale-line{gap:6px;margin:35px 0 25px}.scale-line .mark:first-child{width:48px;height:52px}.scale-line .mark:nth-child(2){width:30px;height:33px}.scale-line .mark:nth-child(3){width:20px;height:23px}.scale-card>p{position:static;font-size:10px;max-width:110px}.app-icon{display:none}.mono-mark{width:96px;height:110px}.small-caption{font-size:9px;text-align:center}.card-label{font-size:10px}.motion-section{grid-template-columns:1fr;padding:28px 22px;gap:22px}.motion-description>p:not(.eyebrow){max-width:100%}.motion-description .motion-access{max-width:100%!important}.loader-demo{min-height:310px;padding:20px 17px 8px}.application-section{grid-template-columns:1fr;padding:45px 0;gap:35px}.application-copy>p:not(.eyebrow){font-size:15px}.phone{width:min(360px,100%)}.application-copy>p:not(.eyebrow),.principle{max-width:100%}.foundation-grid{grid-template-columns:1fr;gap:24px}.type-spec{border-right:0;border-bottom:1px solid var(--line);padding-bottom:25px}.foundations{padding:30px 0}.type-large{font-size:48px}.colour-swatch{min-height:115px}.tone-note{gap:12px}.tone-note p{font-size:11px}footer{padding:24px 6%;flex-wrap:wrap;gap:18px}footer p{font-size:11px}footer>span{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Product specimen stays readable at its actual rendered phone width. */
.greeting-small,.welcome-note{font-size:14px}.family-tabs button{font-size:14px;min-height:48px}.appointment-top{font-size:13px}.appointment>p{font-size:15px}.confirmed{font-size:13px}.appointment-footer button{font-size:14px;min-height:48px}.care-row strong{font-size:14px;line-height:1.4}.care-row p{font-size:14px;line-height:1.5}.care-button{font-size:14px;min-height:52px;gap:12px;text-align:left}.app-bottom>span{font-size:12px}.visit-note{font-size:14px!important}.demo-note{font-size:14px}

@media(max-width:720px){.large-brand{font-size:clamp(52px,17vw,78px)}.large-brand .mark{width:clamp(46px,15vw,65px);height:auto;aspect-ratio:128/136}}
