.hero{--ease: cubic-bezier(.3, .6, .3, 1);position:relative;display:grid;gap:clamp(3rem,6vw,6rem);align-items:center;padding:clamp(104px,15vh,140px) var(--gutter) clamp(48px,8vh,80px);@media(width>=60rem){grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}.atoms{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.pitch,.desk{position:relative}h1{font-family:var(--serif);font-size:clamp(3.4rem,7.6vw,8rem);font-weight:400;line-height:.95;letter-spacing:-.02em;em{font-family:Libre Caslon Text,Libre Caslon Text Fallback,serif;font-size:.9em;background:linear-gradient(var(--accent),var(--accent)) 0 92% / 100% .07em no-repeat}}.lead{max-width:36rem;margin-top:clamp(1.6rem,4vh,2.6rem);font-size:clamp(1.15rem,1.5vw,1.35rem);font-weight:500;line-height:1.35;span{display:block;text-wrap:balance}}.promise{max-width:36rem;margin-top:.6rem;color:var(--ink-soft);font-size:clamp(1rem,1.2vw,1.1rem);line-height:1.5;text-wrap:balance}.actions{display:flex;flex-wrap:wrap;gap:1rem 1.8rem;align-items:center;margin-top:1.8rem}.cta{padding:.8rem 1.6rem;border-radius:999px;background:var(--accent);color:var(--on-accent);font-weight:600;text-decoration:none;transition:background .4s var(--ease);&:hover{background:var(--ink);color:var(--paper)}}.free{max-width:30rem;margin-top:1.2rem;color:var(--ink-soft);font-size:.95rem;line-height:1.5;strong{color:var(--ink);font-weight:600}mark{background:linear-gradient(var(--accent),var(--accent)) 0 95% / 100% .12em no-repeat;color:inherit}a{color:inherit}}.desk{display:grid;gap:2rem;justify-items:center}.app{width:min(100%,34rem);border:1px solid var(--rule);border-radius:var(--radius);background:var(--sheet);box-shadow:0 30px 60px -30px rgb(0 0 0 / var(--shadow)),0 2px 6px #00000014;animation:breathe 7s ease-in-out infinite;figcaption{display:flex;gap:.6rem;align-items:center;padding:.75rem 1.1rem;border-bottom:1px solid var(--rule);font-size:.9rem;font-weight:500;img{width:1.3rem;padding:.15rem;border-radius:5px;background:#fff}span{margin-left:auto;color:var(--ink-soft);font-family:var(--mono);font-size:.75rem;font-weight:400}}}.bars{display:grid;gap:.55rem;padding:1.3rem 1.3rem .4rem;list-style:none;li{display:grid;grid-template-columns:5.5rem 1fr 3.4rem;gap:.8rem;align-items:center;font-size:.85rem}.track{height:.7rem;border-radius:999px;background:var(--well)}.fill{display:block;height:100%;border-radius:inherit;background:var(--ink);transform-origin:left;animation:grow .9s var(--ease) both;animation-delay:calc(.2s + var(--i) * .08s)}li:first-child .fill{background:var(--accent)}.total{color:var(--ink-soft);font-variant-numeric:tabular-nums;text-align:right}}.sort{padding:1.1rem 1.3rem .5rem;color:var(--ink-soft);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;padding:0 1.3rem 1.3rem;list-style:none;li{display:grid;gap:.15rem;padding:.7rem .8rem;border:1px solid var(--rule);border-radius:12px;background:var(--paper);font-size:.85rem}small,span{color:var(--ink-soft);font-size:.75rem;font-variant-numeric:tabular-nums}@media(width<30rem){grid-template-columns:minmax(0,1fr);gap:.4rem;li{grid-template-columns:3.4rem minmax(0,1fr) auto;gap:.6rem;align-items:baseline;padding:.55rem .8rem}}}.shelf{display:grid;grid-template-columns:repeat(4,auto);justify-content:center;gap:.5rem clamp(.5rem,2.5vw,2rem);list-style:none;a{display:grid;justify-items:center;gap:.2rem;text-decoration:none;&:hover{.icon{translate:0 -4px}code{color:var(--ink)}}}code{color:var(--ink-soft);font-size:clamp(.6rem,2.4vw,.75rem)}}.icon{position:relative;width:4.6rem;aspect-ratio:1;transition:translate .4s var(--ease);&:before{content:"";position:absolute;inset:9.77%;border:1px solid var(--rule);border-radius:22.8%;background:#fff;box-shadow:0 6px 14px -8px rgb(0 0 0 / var(--shadow))}img{position:absolute;top:20.7%;left:20.7%;width:58.6%}.badge{top:3.9%;left:62.9%;width:33.2%}}@media(prefers-reduced-motion:reduce){.app,.fill{animation:none}}}@keyframes breathe{50%{translate:0 -6px}}@keyframes grow{0%{scale:0 1}}.why{display:grid;align-content:center;padding:18vh var(--gutter) 16vh;.headline span{color:var(--ink-soft)}.nos{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin-top:2rem;color:var(--ink-soft);font-size:clamp(1.1rem,1.8vw,1.5rem);font-weight:500;letter-spacing:-.01em;list-style:none}}#how{.desk{display:grid;grid-template-columns:minmax(0,1fr);width:min(42rem,100%);height:min(28rem,100%);>*{min-width:0;grid-area:1 / 1;align-self:center;animation-name:show}>:first-child{animation-name:leave}>:last-child{animation-name:show-stay}@media(width<64rem){>*{align-self:start}}}.tile{display:block;width:100%;height:auto;aspect-ratio:4 / 3}.sheet{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem .75rem;padding:1rem;list-style:none;font-family:var(--mono);font-size:clamp(.5rem,.7vw,.65rem);overflow-wrap:anywhere;.tile{margin-bottom:.35rem}}.screen{position:relative;display:grid;place-items:center;aspect-ratio:16 / 9;overflow:hidden;background:#111;.tile{grid-area:1 / 1;width:auto;height:76%;margin-bottom:1.6rem}.keep{animation-name:how-keep}.reject{animation-name:how-reject}}.status{position:absolute;bottom:.8rem;left:1rem;display:grid;color:#eee;font:.8rem system-ui,sans-serif;span{grid-area:1 / 1;animation-name:show}}.files{list-style:none;font-family:var(--mono);font-size:clamp(.75rem,1.1vw,.9rem);li{display:flex;justify-content:space-between;padding:.5rem 1rem;border-bottom:1px solid var(--rule);&:last-child{border-bottom:0}}.note{color:var(--ink-soft)}.tile,.folder span:first-child:before{display:inline-block;width:.9em;height:.7em;margin-right:.6em;vertical-align:-.05em}.folder span:first-child:before{content:"";background:var(--accent)}}.code{display:grid;padding:1rem;overflow:hidden;font-family:var(--mono);font-size:clamp(.55rem,.85vw,.78rem);line-height:1.7;animation-name:how-write;animation-timing-function:steps(17,end);.line{white-space:pre}.ask{margin:0 -.4rem;padding:0 .4rem;background:var(--accent);color:var(--on-accent)}}.popup{justify-self:center;width:min(460px,100%);overflow:hidden;border-radius:12px;background:#fff;box-shadow:0 0 0 1px #00000014,0 24px 60px -20px #00000059;color:#1d1d1f;font:13px/1.45 system-ui,sans-serif;.body{padding:20px 22px 14px}.name{font-size:17px;font-weight:650;line-height:1.25;letter-spacing:-.015em}.folder,.note,.tags,.source{color:#6e6e73;font-size:11.5px}.folder{margin-top:3px}ol{margin-top:12px;list-style:none}li{display:flex;gap:10px;padding:5px 0}svg{flex:none;margin-top:1px;fill:none;stroke:#6e6e73;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.note{margin-top:8px}.tags{margin-top:10px;&:before{content:"▸ "}}footer{display:flex;align-items:center;gap:8px;padding:12px 22px;border-top:1px solid #e5e5ea;background:#f5f5f7;.source{flex:1}span{min-width:96px;padding:0 14px;border-radius:7px;background:#ebebef;font-weight:500;line-height:30px;text-align:center}.allow{background:#1d1d1f;color:#fff}}}}@keyframes how-write{0%{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}@keyframes how-keep{to{opacity:0;translate:70% 0;rotate:6deg}}@keyframes how-reject{to{opacity:0;translate:-70% 0;rotate:-6deg}}.start{display:grid;align-content:center;padding:18vh var(--gutter) 14vh;border-top:1px solid var(--rule);.prompt{margin-top:1rem;padding:.9rem 1rem;background:var(--well);border-left:3px solid var(--accent);font-family:var(--mono);font-size:.8rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}}#safe{.caption a{display:block;width:fit-content;margin-top:1.2rem;font-size:1rem;font-weight:400;text-underline-offset:4px}.plan{width:min(46rem,100%);max-height:100%;overflow:visible;font-family:var(--sans);font-size:14px;text{fill:var(--on-panel)}.small{font-size:11px;opacity:.8}.wall{fill:none;stroke:var(--on-panel);stroke-width:4}.room rect{fill:none;stroke:#ffffff73;stroke-dasharray:4 4}.room text{opacity:.6}.page path{fill:var(--on-panel)}.seen{fill:#ffffff24;stroke:var(--on-panel);stroke-width:1.5}.badge,.slot{fill:var(--on-panel)}.on-white{fill:var(--panel);opacity:1}.route{fill:none;stroke:var(--on-panel);stroke-width:1.5;stroke-dasharray:1;animation-name:draw}.cross{stroke:var(--on-panel);stroke-width:4}.check{fill:none;stroke:var(--accent);stroke-width:2}.step{animation-name:show-stay}@media(width<48rem){font-size:19px;.small{font-size:16px}.on-white{font-size:14px}}}}.poke{display:grid;gap:clamp(3rem,6vw,6rem);align-items:center;padding:18vh var(--gutter) 16vh;@media(width>=60rem){grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}.intro{max-width:30rem;margin-top:1.2rem;color:var(--ink-soft);font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.5}.window{width:min(100%,34rem);justify-self:center;box-shadow:0 30px 60px -30px rgb(0 0 0 / var(--shadow)),0 2px 6px #00000014}.tries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;padding:1.3rem;@media(width>=30rem){grid-template-columns:repeat(3,minmax(0,1fr))}button{padding:.75rem .6rem;border:1px solid var(--rule);border-radius:10px;background:linear-gradient(var(--accent),var(--accent)) left bottom / 0 2px no-repeat var(--paper);color:var(--ink);font:inherit;font-size:.85rem;font-weight:500;cursor:pointer;transition:border-color .3s;&:hover{border-color:var(--ink-soft)}}}.log{display:grid;gap:.35rem;min-height:7.6rem;padding:.9rem 1.3rem;border-top:1px solid var(--rule);background:var(--well);font-family:var(--mono);font-size:.75rem;list-style:none;&:empty:before{content:"Nothing has left this window.";color:var(--ink-soft)}li{display:grid;grid-template-columns:1fr auto auto;gap:.8rem;align-items:baseline}code{overflow:hidden;font-size:inherit;text-overflow:ellipsis;white-space:nowrap}span{font-weight:700}small{color:var(--ink-soft);font-size:inherit}}.tally{padding:.7rem 1.3rem;border-top:1px solid var(--rule);color:var(--ink-soft);font-size:.8rem;font-variant-numeric:tabular-nums;b{color:var(--ink)}}}.faq{display:grid;align-content:center;padding:10vh var(--gutter) 6vh;.label{margin-bottom:1.2rem}details{max-width:52rem;border-top:1px solid var(--rule);&:first-of-type{border-top-color:var(--ink)}&:last-child{border-bottom:1px solid var(--rule)}&[open] summary:after{rotate:45deg}}summary{display:flex;gap:1.5rem;justify-content:space-between;align-items:baseline;padding:1.2rem 0;font-size:clamp(1.1rem,1.8vw,1.35rem);font-weight:500;line-height:1.3;cursor:pointer;list-style:none;&::-webkit-details-marker{display:none}&:after{content:"+";color:var(--ink);font-size:1.4em;font-weight:300;line-height:0;transition:rotate .2s}}p{max-width:40rem;padding-bottom:1.4rem;color:var(--ink-soft);font-size:1.05rem;line-height:1.6}}