.how-section{padding-top:35px;padding-bottom:95px;scroll-margin-top:35px}.how-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:40px}.how-heading h2{font-size:clamp(32px,4vw,50px);font-weight:550;line-height:1.06;letter-spacing:-2px;margin:0}.how-heading>p{font-size:13px;line-height:1.7;color:#72877b;max-width:300px}.beta-tag{border:1px solid #b7cbbb;padding:4px 7px;border-radius:20px}.how-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:35px}.how-chapters{display:flex;flex-direction:column;gap:8px}.how-chapters button{border:0;background:transparent;color:#145c46;text-align:left;padding:18px;border-radius:12px;cursor:pointer;font:inherit;display:grid;grid-template-columns:24px 1fr;gap:6px}.how-chapters button[aria-pressed=true]{background:#eae3f4}.how-chapters button>span{font-size:10px;padding-top:4px;color:#829481}.how-chapters strong{font-size:17px;font-weight:550}.how-chapters small{grid-column:2;font-size:12px;line-height:1.6;color:#72877b}.mac-preview{height:455px;position:relative;overflow:hidden;border:1px solid #dce3da;border-radius:15px;background:radial-gradient(ellipse at 85% 90%,#f5dce6,transparent 65%),#f5f5f0;color:#292d32;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;box-shadow:0 18px 45px #154c3b08;--panel-colour:#d1cff5}.mac-menu{height:29px;display:flex;align-items:center;gap:22px;background:#ffffffb8;border-bottom:1px solid #e4e7df;padding:0 16px;font-size:10px}.mac-menu strong{font-size:11px}.mac-clock{margin-left:auto}.preview-work{position:absolute;inset:105px 22px 24px 115px;background:#fff;border:1px solid #dedfd9;border-radius:10px;box-shadow:0 12px 30px #293d3010;transition:transform .6s}.work-tabs{display:flex;gap:15px;border-bottom:1px solid #ecece6;padding:11px 15px}.work-tabs button{border:0;background:none;font:inherit;font-size:11px;color:#718778;cursor:pointer}.work-tabs button[aria-pressed=true]{color:#145c46;font-weight:600}#work-content{padding:30px}#work-content small{font-size:8px;letter-spacing:2px;color:#8c968b}#work-content h3{font-size:30px;line-height:1.1;letter-spacing:-1px;margin:20px 0}.mock-lines{height:45px;background:repeating-linear-gradient(transparent 0 9px,#eceee8 9px 13px);max-width:230px}.native-list{position:absolute;top:98px;left:28px;width:335px;background:#fff;border:1px solid #d9dcd5;border-radius:11px;box-shadow:0 16px 35px #2b34231a;transition:opacity .35s,transform .35s}.native-list.is-hidden{opacity:0;transform:translateY(25px);pointer-events:none}.native-chrome{display:flex;align-items:center;justify-content:space-between;height:32px;border-bottom:1px solid #eeeee8;padding:0 12px;font-size:10px}.native-chrome>span:first-child{color:#d0d3ca;letter-spacing:3px}.native-chrome button{border:0;background:none;cursor:pointer}.native-body{padding:20px 22px 12px}.native-body h3{font-size:32px;letter-spacing:-1.2px;margin:0 0 18px;font-weight:700}.native-body h3>span{float:right;color:#b1a0dc}.native-row{display:flex;align-items:center;gap:10px;min-height:42px;font-size:12px;border-radius:6px;padding:5px 8px}.native-row.is-active{background:var(--panel-colour)}.native-row>span{flex:1}.native-row button{border:0;background:none;cursor:pointer;color:inherit;font-size:17px}.native-row button:first-child{font-size:19px;color:#a9afa7}.native-row.done>span{text-decoration:line-through;color:#90988c}#native-add{display:flex;gap:9px;border-top:1px solid #eeeee8;margin-top:10px;padding:14px 0;align-items:center}#native-add input{width:100%;min-width:0;border:0;outline:0;font:inherit;font-size:12px;background:transparent}#native-add button{font:inherit;font-size:11px;border:0;background:none;color:#145c46;cursor:pointer}.native-bottom{display:flex;justify-content:space-between;font-size:9px;color:#949a90;border-top:1px solid #eeeee8;padding-top:12px}.native-panel{position:absolute;z-index:5;top:45px;left:4%;width:92%;height:40px;display:flex;align-items:center;gap:10px;background:var(--panel-colour);border:1px solid #00000012;border-radius:10px;padding:0 11px;box-shadow:0 7px 18px #293d3015;box-sizing:border-box;color:#292d32}.native-panel[hidden],#panel-entry[hidden],.voice-preview[hidden],.demo-pointer[hidden]{display:none}.native-panel button{font:inherit;border:0;background:none;color:inherit;cursor:pointer;padding:0;font-size:14px}#panel-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:12px}#panel-time{font-size:13px;font-variant-numeric:tabular-nums}#panel-drag{cursor:grab;touch-action:none;color:#686a73}#panel-entry{position:absolute;inset:0;display:flex;align-items:center;gap:12px;background:var(--panel-colour);border-radius:10px;padding:0 13px}#panel-entry input{flex:1;width:0;border:0;outline:0;background:transparent;font:inherit;font-size:12px}.voice-preview{position:absolute;z-index:6;left:50%;top:130px;transform:translateX(-50%);width:240px;padding:23px;background:white;border:1px solid #dfe2da;border-radius:14px;box-shadow:0 18px 40px #1e3a2420}.voice-preview strong{font-size:15px}.voice-preview p{font-size:16px;min-height:40px;line-height:1.5}.voice-preview small{font-size:10px;color:#8b958c}.voice-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#145c46;margin-right:7px;animation:voicepulse 1s infinite}.preview-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}.preview-tools>button{border:1px solid #e2e7de;background:#fff;border-radius:20px;padding:8px 12px;color:#527560;font:inherit;font-size:10px;cursor:pointer}.preview-colours{display:flex;gap:7px}.preview-colours button{width:19px;height:19px;background:var(--swatch);border:2px solid white;border-radius:50%;outline:1px solid transparent;cursor:pointer}.preview-colours button[aria-pressed=true]{outline-color:#145c46}#how-caption{font-size:13px;line-height:1.5;color:#145c46;margin:17px 0 9px;min-height:39px}.how-note{font-size:10px;line-height:1.7;color:#8a9b8e;margin:0;max-width:540px}.demo-pointer{position:absolute;z-index:10;font-size:25px;color:#145c46;text-shadow:1px 1px white;pointer-events:none;transition:left .65s,top .65s}.how-section button:focus-visible,.how-section input:focus-visible{outline:2px solid #145c46;outline-offset:3px}@keyframes voicepulse{50%{opacity:.3}}@media(max-width:900px){.how-layout{grid-template-columns:1fr}.how-chapters{display:grid;grid-template-columns:1fr 1fr}.how-heading{align-items:start}.how-heading>p{max-width:220px}.mac-preview{height:450px}}@media(max-width:560px){.how-section{padding-bottom:55px}.how-heading{display:block}.how-heading h2{letter-spacing:-1px}.how-chapters button{padding:12px}.how-chapters strong{font-size:14px}.how-chapters small{font-size:11px}.native-list{left:12px;width:calc(100% - 26px);max-width:335px}.preview-work{left:35px;right:10px}.native-panel{gap:7px;padding:0 7px}#panel-title{font-size:10px}#panel-time{font-size:11px}.preview-tools{flex-wrap:wrap}#demo-shortcut span{display:none}}@media(prefers-reduced-motion:reduce){.how-section *{animation:none!important;transition:none!important}}
#native-tasks{max-height:170px;overflow-y:auto;scrollbar-width:thin}.native-panel{transition:background .3s}.how-chapters button:hover{background:#f6f2f8}
.native-body h3{display:flex;align-items:center;gap:8px;position:relative;height:44px}.app-companion{width:78px;height:52px;object-fit:contain;margin-left:auto}.native-body h3>button{border:0;background:none;color:#6a7367;font-size:22px;cursor:pointer;padding:5px}.preview-work{touch-action:none;cursor:default}.work-tabs{cursor:grab;touch-action:none}.quick-settings{position:absolute;z-index:7;left:50%;top:93px;transform:translateX(-50%);width:345px;max-width:94%;max-height:345px;border:1px solid #d9dcd5;border-radius:11px;background:white;box-shadow:0 18px 40px #23332322;overflow:hidden}.quick-settings[hidden]{display:none}.settings-body{padding:17px 23px;max-height:290px;overflow-y:auto;scrollbar-width:thin}.settings-body h3{font-size:27px;letter-spacing:-1px;margin:0 0 21px}.settings-body h4{font-size:13px;font-weight:550;margin:15px 0 5px}.settings-body p{font-size:10px;line-height:1.6;color:#7b8378;margin:5px 0 12px}.settings-body hr{border:0;border-top:1px solid #e9ece4;margin:18px 0}.settings-body .preview-colours{gap:17px;margin:14px 0}.settings-body .preview-colours button{width:28px;height:28px}.shortcut-line,.duration-row{display:flex;gap:8px;align-items:center;font-size:11px;margin:12px 0}.shortcut-line span,.duration-row>span{flex:1}.shortcut-line button,.duration-row button{border:1px solid #e0e4db;border-radius:5px;background:#fafbf8;color:#384e3e;padding:5px 9px;font:inherit;cursor:pointer}.duration-row output{width:48px;text-align:center;font-size:11px}.quick-settings .native-chrome button{font-size:17px}.settings-body .recording{outline:2px solid #b1a0dc}.preview-tools{flex-wrap:wrap}.demo-pointer{transition:left .65s,top .65s}.preview-work{transition:transform .7s}.how-chapters button:last-child{margin-bottom:0}
.spring-hint{animation:shortcut-spring .7s 2}@keyframes shortcut-spring{35%{transform:scale(1.12)}65%{transform:scale(.97)}100%{transform:scale(1)}}
.ambient-window{position:absolute;left:25px;right:85px;top:132px;height:260px;background:#fdfcf7;border:1px solid #dedfd9;border-radius:10px;box-shadow:0 10px 25px #23332312;transform:translate(-8px,10px) rotate(-3deg);transition:transform 1s}.ambient-window>div{border-bottom:1px solid #e6e7df;padding:12px 18px;font-size:10px;color:#7d877c}.ambient-window strong{display:block;padding:20px;font-size:22px;letter-spacing:-.7px}.ambient-window>span{display:block;margin:10px 20px;height:26px;background:#eee6f5;border-left:2px solid #bcacd5;border-radius:3px}.ambient-window>span:nth-last-child(2){background:#f6dfe9;width:65%}.mac-preview[data-window=messages] .ambient-window{transform:translate(30px,-15px) rotate(3deg)}.native-panel{z-index:8}.quick-settings{z-index:9}.voice-preview{z-index:10}.demo-pointer{z-index:11}
.mac-preview[data-window=messages] .ambient-window{transform:translate(30px,-85px) rotate(3deg)}

.how-chapters button{transition:background .45s ease,color .45s ease}.demo-pointer{transition:left 1s cubic-bezier(.25,.1,.25,1),top 1s cubic-bezier(.25,.1,.25,1)}
/* A quicker story with softer movement between each beat. */
.how-section{padding-top:30px;padding-bottom:65px}.native-list{transition:opacity .45s ease,transform .6s cubic-bezier(.22,1,.36,1)}.preview-work,.ambient-window{transition:transform .85s cubic-bezier(.22,1,.36,1)}.native-panel{transition:background .45s ease}.demo-pointer{transition:left .75s cubic-bezier(.22,1,.36,1),top .75s cubic-bezier(.22,1,.36,1)}.how-chapters button{transition:background .4s ease,color .4s ease}.quick-settings:not([hidden]),.voice-preview:not([hidden]){animation:popup-arrive .35s ease both}.native-panel:not([hidden]){animation:panel-arrive .3s ease both}.native-row{animation:row-arrive .25s ease both}@keyframes popup-arrive{from{opacity:0;translate:0 7px}to{opacity:1;translate:0 0}}@keyframes panel-arrive{from{opacity:0;translate:0 -4px}to{opacity:1;translate:0 0}}@keyframes row-arrive{from{opacity:0;translate:0 3px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.how-section *{animation:none!important;transition:none!important}}
/* Keep the walkthrough presentation focused on the app and step labels. */
.how-product>.preview-tools,.how-product>.how-note{display:none}
.preview-work,.ambient-window{transition:transform 1.1s cubic-bezier(.4,0,.2,1)}.demo-pointer{transition:left .9s cubic-bezier(.4,0,.2,1),top .9s cubic-bezier(.4,0,.2,1)}.native-list{transition:opacity .5s ease,transform .7s cubic-bezier(.4,0,.2,1)}.quick-settings:not([hidden]),.voice-preview:not([hidden]){animation:popup-arrive .5s cubic-bezier(.22,1,.36,1) both}.content-enter{animation:content-soften .45s ease both}.how-chapters button{cursor:default}@keyframes content-soften{from{opacity:.25;translate:0 4px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.how-section *{animation:none!important;transition:none!important}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.how-chapters button[data-scene="list"]{transition:transform .3s cubic-bezier(.22,1,.36,1),background .4s ease;transform-origin:center}.how-chapters button[data-scene="list"]:hover{transform:scale(1.035)}}
/* Illustrated MacBook: pale screen and a quiet lilac aluminium base. */
.illustrated-laptop{position:relative;margin:0 7px 24px;padding:9px 9px 0;border:2px solid #326b57;border-radius:21px 21px 8px 8px;background:#f8faf7;box-shadow:0 12px 35px #145c4607}.illustrated-laptop:before{content:"";position:absolute;top:8px;left:44%;width:12%;height:9px;border-radius:0 0 7px 7px;background:#326b57;z-index:20;pointer-events:none}.illustrated-laptop .mac-preview{border:1px solid #c6d4ca;border-radius:12px 12px 3px 3px;background:radial-gradient(ellipse at 80% 90%,#eeedf5,transparent 70%),#fcfdfa;box-shadow:none}.laptop-base{position:relative;height:16px;margin:0 -23px -17px;background:linear-gradient(#f3eff8,#e9e5f1);border:2px solid #326b57;border-top-width:1px;border-radius:2px 2px 40% 40%/2px 2px 100% 100%}.laptop-base:after{content:"";position:absolute;left:40%;top:0;width:20%;height:4px;border:1px solid #bccabb;border-top:0;border-radius:0 0 6px 6px;background:#f8f7fa}.how-product #how-caption{margin-top:28px}.research-highlight{background:#f5eaf0;gap:35px;padding:28px 35px}.research-stat>strong{font-size:90px}.research-summary h3{margin-bottom:12px}.research-summary>p{margin-bottom:10px}.pomodoro-rhythm{grid-template-columns:1.25fr 1fr;position:relative;align-items:stretch}.rhythm-focus{background:#eeebf6;justify-content:center;gap:25px}.rhythm-focus strong #rhythm-countdown{font-size:clamp(35px,4.5vw,60px);letter-spacing:-2px;margin:0;font-variant-numeric:tabular-nums;white-space:nowrap}.rhythm-break{background:#f6f0f3;position:relative;justify-content:center;gap:10px;transition:opacity .65s ease,transform .8s cubic-bezier(.22,1,.36,1);opacity:.3;transform:translateY(10px) scale(.95)}.rhythm-break strong{font-size:42px;letter-spacing:-2px}.break-cat{width:85px;height:65px;color:#145c46}.rhythm-break>span{font-size:14px!important;color:#145c46!important}.pomodoro-rhythm.is-break .rhythm-break{opacity:1;transform:translateY(-5px) scale(1.035);box-shadow:0 12px 25px #145c4608}.pomodoro-rhythm.is-break .rhythm-focus{opacity:.55;transition:opacity .6s}.pomodoro-rhythm.is-break .cat-tail{transform-origin:87px 65px;animation:tail-swish 2s ease-in-out infinite}.pomodoro-rhythm.is-break .cat-heart{animation:cat-love 2s ease-in-out infinite}@keyframes tail-swish{50%{transform:rotate(-10deg)}}@keyframes cat-love{50%{opacity:.4;transform:translateY(-3px)}}.steps article{transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease;position:relative}@media(hover:hover) and (prefers-reduced-motion:no-preference){.steps article:hover{transform:translateY(-7px) scale(1.035);box-shadow:0 15px 35px #145c4610;z-index:1}.how-chapters button:hover{transform:translateY(-3px) scale(1.035);box-shadow:0 9px 20px #145c4609}.how-chapters button{transition:transform .35s cubic-bezier(.22,1,.36,1),background .4s,box-shadow .35s}}@media(max-width:560px){.illustrated-laptop{margin-left:5px;margin-right:5px;padding:6px 6px 0;border-radius:17px 17px 5px 5px}.laptop-base{margin-left:-16px;margin-right:-16px}.research-highlight{padding:27px 25px}.rhythm-focus strong #rhythm-countdown{font-size:42px}}@media(prefers-reduced-motion:reduce){.steps article,.rhythm-break,.cat-tail,.cat-heart{animation:none!important;transition:none!important;transform:none!important}.rhythm-break{opacity:1}}

.how-chapters button{cursor:pointer}

/* More breathing room before the research strip; a small illustrated companion. */
.pomodoro-section .research-highlight{margin-top:55px}.break-cat{width:125px;height:85px;overflow:visible}.rhythm-break{min-height:210px}.cat-stretch{transform-origin:90px 105px}.pomodoro-rhythm.is-break .cat-stretch{animation:cat-stretch 3.5s ease-in-out infinite}.pomodoro-rhythm.is-break .cat-tail{transform-origin:126px 83px;animation:cat-tail-wave 2.5s ease-in-out infinite}.pomodoro-rhythm.is-break .cat-pet-lines{animation:cat-pet 2.5s ease-in-out infinite}@keyframes cat-stretch{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(2px) scale(1.04,.96)}70%{transform:translateY(-1px) scale(.99,1.01)}}@keyframes cat-tail-wave{0%,100%{transform:rotate(0)}50%{transform:rotate(-17deg)}}@keyframes cat-pet{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}@media(max-width:560px){.pomodoro-section .research-highlight{margin-top:30px}.break-cat{width:110px;height:78px}}@media(prefers-reduced-motion:reduce){.cat-stretch,.cat-pet-lines,.cat-tail{animation:none!important}}

/* A calmer, more spacious focus-and-break section. */
.pomodoro-section{padding-top:55px;padding-bottom:110px;column-gap:85px;row-gap:70px;align-items:center}.pomodoro-intro h2{margin-bottom:32px}.pomodoro-intro>p:last-child{line-height:1.95;max-width:380px}.pomodoro-rhythm{gap:20px;align-items:stretch}.rhythm-focus,.rhythm-break{min-height:240px;padding:28px;opacity:1!important;transform:none!important;box-shadow:none!important;gap:24px;justify-content:center}.rhythm-focus strong #rhythm-countdown{font-size:68px;letter-spacing:-3px}.static-min{font-size:13px;letter-spacing:0;margin-left:8px;font-weight:400}.rhythm-break{gap:14px}.rhythm-break .break-cat{width:112px;height:82px;animation:none}.pomodoro-section .research-highlight{margin-top:65px;padding:42px 48px;gap:65px}.research-summary h3{line-height:1.25;margin-bottom:20px}.research-summary>p{line-height:1.9;margin-bottom:20px}.research-stat-label{margin-top:16px}.research-source{display:inline-block;margin-top:3px}@media(max-width:900px){.pomodoro-section{column-gap:40px}.rhythm-focus,.rhythm-break{padding:22px}.pomodoro-rhythm{gap:14px}}@media(max-width:650px){.pomodoro-section{grid-template-columns:1fr;gap:38px;padding-top:35px;padding-bottom:70px}.pomodoro-rhythm{gap:16px}.rhythm-focus,.rhythm-break{min-height:230px;padding:26px}.pomodoro-section .research-highlight{margin-top:45px;padding:32px 28px;gap:30px}.research-summary>p{line-height:1.8}}

.demo-pointer{display:none!important}.demo-control-highlight{animation:demo-control-glow .85s ease-out!important;border-radius:5px}@keyframes demo-control-glow{0%,100%{box-shadow:0 0 0 0 #b1a0dc00}35%{box-shadow:0 0 0 5px #b1a0dc45}}@media(prefers-reduced-motion:reduce){.demo-control-highlight{animation:none!important}}

/* Matching illustration, duration and caption rows across both cards. */
.pomodoro-rhythm{grid-template-columns:1fr 1fr;align-items:stretch}.rhythm-focus,.rhythm-break{display:grid;grid-template-rows:90px 72px minmax(36px,auto);align-content:center;align-items:center;justify-items:start;gap:18px;min-height:285px;padding:28px}.work-companion,.rhythm-break .break-cat{display:block;width:125px;height:90px;object-fit:contain;object-position:left center;margin:0}.rhythm-focus>strong,.rhythm-break>strong{display:flex;align-items:baseline;font-size:60px;line-height:1;letter-spacing:-2px;margin:0}.rhythm-focus strong #rhythm-countdown{font-size:60px;line-height:1;letter-spacing:-2px}.rhythm-focus .static-min,.rhythm-break strong>span{font-size:13px;line-height:1;letter-spacing:0;margin-left:8px}.rhythm-focus>span,.rhythm-break>span{font-size:13px!important;line-height:1.6;align-self:start;color:#547562!important}@media(max-width:800px){.rhythm-focus,.rhythm-break{padding:22px;gap:16px;grid-template-rows:80px 64px minmax(38px,auto)}.work-companion,.rhythm-break .break-cat{width:110px;height:80px}.rhythm-focus strong #rhythm-countdown,.rhythm-break>strong{font-size:54px}}

.native-row.captured-task{animation:captured-task 1.8s ease-out!important}@keyframes captured-task{0%,35%{background:#e8e0f2;box-shadow:inset 3px 0 #b1a0dc}100%{background:transparent;box-shadow:inset 0 0 transparent}}