html{scroll-padding-top:5rem}@layer components{.display{font-family:var(--font-sans-face), sans-serif;letter-spacing:-.04em;text-wrap:balance;font-weight:650;line-height:1.02}.eyebrow{font-family:var(--font-mono-face), monospace;letter-spacing:.16em;color:var(--ink-3);font-size:.6875rem}.tag{font-family:var(--font-mono-face), monospace;letter-spacing:.14em;color:var(--emerald);font-size:.75rem}.tag:before{content:"[ "}.tag:after{content:" ]"}.tnum{font-variant-numeric:tabular-nums;font-family:var(--font-mono-face), monospace}.lede{color:var(--ink-2);text-wrap:pretty;font-size:1.0625rem;line-height:1.6}.gridpaper{background-image:linear-gradient(to right, var(--grid) 1px, transparent 1px), linear-gradient(to bottom, var(--grid) 1px, transparent 1px);background-size:28px 28px}.card{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px}.night{background-color:var(--night);color:var(--night-ink);isolation:isolate}.glow{position:relative}.glow:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(60% 55% at 50% 0%, color-mix(in srgb, var(--glow) 26%, transparent), transparent 70%), radial-gradient(40% 40% at 85% 20%, color-mix(in srgb, var(--glow) 8%, transparent), transparent 70%);position:absolute;inset:0}.hero-stage{--night-ink-2:#f2f7f4d1;--night-ink-3:#f2f7f499;background:radial-gradient(60% 55% at 72% 38%,#2fbf8e33,#0000 70%),linear-gradient(#04241e 0%,#03190f 60%,#02120d 100%)}.hour-lines{background-image:repeating-linear-gradient(#ffffff0e 0 1px,#0000 1px 88px);-webkit-mask-image:linear-gradient(90deg,#0000,#000 22% 78%,#0000);mask-image:linear-gradient(90deg,#0000,#000 22% 78%,#0000)}.hour-label{font:500 11px/1 var(--font-mono-face), monospace;color:#ffffff4d;position:absolute;left:1.5rem;translate:0 -50%}.night-grid{background-image:linear-gradient(to right, var(--night-line) 1px, transparent 1px), linear-gradient(to bottom, var(--night-line) 1px, transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 60% at 50% 0,#000 30%,#0000 75%);mask-image:radial-gradient(70% 60% at 50% 0,#000 30%,#0000 75%)}.sheet{background:var(--paper);color:var(--ink);border-radius:var(--radius-sheet);position:relative}.bento{background:var(--surface);color:var(--ink);border:1px solid var(--line-soft);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden}.bento-stage{background:radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--emerald-bright) 10%, var(--surface)), var(--surface-2) 70%);border-bottom:1px solid var(--line-soft)}.chip-night{border:1px solid var(--night-line);color:var(--night-ink-2);-webkit-backdrop-filter:blur(6px);background:#ffffff0a;border-radius:999px;align-items:center;gap:.5rem;display:inline-flex}.showcase{border:1px solid color-mix(in srgb, var(--glow) 30%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--glow) 16%, var(--night-2)), var(--night-2) 55%);box-shadow:0 0 0 6px #ffffff06, 0 40px 120px -30px color-mix(in srgb, var(--glow) 45%, transparent);border-radius:2rem}.btn-cta{color:#03140f;background:linear-gradient(#4fd3a5,#2fbf8e 55%,#1d9e75);border-radius:999px;align-items:center;gap:.75rem;padding:.375rem .375rem .375rem 1.25rem;font-weight:600;transition:transform .15s,filter .15s,box-shadow .2s;display:inline-flex;box-shadow:inset 0 1px #ffffff59,0 8px 24px -8px #2fbf8e99}.btn-cta:hover{filter:brightness(1.05);box-shadow:inset 0 1px #ffffff59,0 12px 30px -8px #2fbf8ebf}.btn-cta:active{transform:translateY(1px)}.btn-cta .disc{color:#0f6e56;background:#fff;border-radius:999px;place-items:center;width:2rem;height:2rem;transition:transform .2s;display:grid}.btn-cta:hover .disc{transform:translate(2px)}.btn-quiet{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;transition:border-color .15s}.btn-quiet:hover{border-color:var(--ink-3)}.btn-night{border:1px solid var(--night-line);color:var(--night-ink);background:#ffffff0a;border-radius:999px;transition:border-color .15s,background .15s}.btn-night:hover{background:#ffffff14;border-color:#ffffff47}.store-btn{color:#fff;background:#000;border:1px solid #ffffff2e;border-radius:.875rem;align-items:center;gap:.625rem;height:3.25rem;padding:0 1.125rem 0 .875rem;transition:transform .15s,border-color .15s;display:inline-flex}.store-btn:hover{border-color:#ffffff73;transform:translateY(-1px)}.store-btn-soon{opacity:.55;cursor:default}.store-btn-soon:hover{border-color:#ffffff2e;transform:none}}:root[data-theme=dark] .icon-light,:root:not([data-theme=dark]) .icon-dark{display:none}.marker{background:linear-gradient(to bottom, transparent 68%, color-mix(in srgb, var(--amber) 45%, transparent) 68%);padding-inline:.1em}.glow-text{background:linear-gradient(#7ff0c4,#2fbf8e 60%,#1d9e75);color:#0000;-webkit-background-clip:text;background-clip:text}.price-yearly{display:none}.pricing:has(#bill-yearly:checked) .price-yearly{display:block}.pricing:has(#bill-yearly:checked) .price-monthly{display:none}.bill-switch label{cursor:pointer;color:var(--ink-2);border-radius:999px;padding:.5rem 1rem;transition:background .2s,color .2s}:is(.pricing:has(#bill-monthly:checked) label[for=bill-monthly],.pricing:has(#bill-yearly:checked) label[for=bill-yearly]){background:var(--ink);color:var(--paper)}:is(.pricing:has(#bill-monthly:focus-visible) label[for=bill-monthly],.pricing:has(#bill-yearly:focus-visible) label[for=bill-yearly]){outline:2px solid var(--emerald);outline-offset:2px}.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 6% 94%,#0000);mask-image:linear-gradient(90deg,#0000,#000 6% 94%,#0000)}.marquee-track{width:max-content;animation:marquee var(--marquee-dur,40s) linear infinite;display:flex}.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}.marquee-track[data-clone]:not([data-cloned]){animation:none}@keyframes marquee{to{transform:translate(-50%)}}.hourgrid{background-image:repeating-linear-gradient(to bottom, var(--line-soft) 0px, var(--line-soft) 1px, transparent 1px, transparent var(--hour-h,76px))}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.pulse{animation:2.4s ease-in-out infinite pulse-dot}.phone{--loop:9s;width:var(--pw,260px);aspect-ratio:9/19.5;padding:calc(var(--pw,260px) * .032);border-radius:calc(var(--pw,260px) * .17);background:linear-gradient(160deg,#2a2f2d,#0a0c0b 40%,#1b1f1d);flex:none;box-shadow:inset 0 0 0 1px #ffffff14,0 30px 60px -20px #0000008c,0 12px 24px -12px #0006}.screen{--a-bg:#0b100e;--a-surface:#18211e;--a-surface-2:#202b27;--a-ink:#eaf0ed;--a-ink-2:#93a29c;--a-ink-3:#66756f;--a-line:#26322e;--a-tint:#2fbf8e;--a-tint-wash:#173b31;--a-amber:#ef9f27;--a-amber-wash:#3d2c10;--a-amber-ink:#f2c97e;--a-red:#e06767;border-radius:calc(var(--pw,260px) * .14);background:var(--a-bg);height:100%;color:var(--a-ink);font-size:calc(var(--pw,260px) / 23);line-height:1.25;font-family:var(--font-sans-face), system-ui, sans-serif;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.screen .island{z-index:5;background:#000;border-radius:1em;width:5.6em;height:1.55em;position:absolute;top:.55em;left:50%;translate:-50%}.screen .statusbar{justify-content:space-between;align-items:center;height:2.6em;padding:.75em 1.6em 0;font-size:.8em;font-weight:600;display:flex}.screen .a-card{background:var(--a-surface);border-radius:.9em}.screen .tabbar{-webkit-backdrop-filter:blur(10px);height:3em;color:var(--a-ink-2);background:#202b27d1;border:1px solid #ffffff0f;border-radius:1.6em;justify-content:space-around;align-items:center;padding:0 .4em;display:flex;position:absolute;bottom:.9em;left:.8em;right:.8em}.screen .tabbar .on{color:var(--a-tint);background:#ffffff12;border-radius:1.2em;align-items:center;gap:.35em;padding:.45em .8em;font-size:.78em;font-weight:650;display:inline-flex}.screen .fab{background:var(--a-amber);color:#3a2400;border-radius:999px;place-items:center;width:1.9em;height:1.9em;display:grid}.screen .finger{pointer-events:none;z-index:6;opacity:0;background:#ffffff47;border:1px solid #ffffff80;border-radius:999px;width:2.2em;height:2.2em;position:absolute;box-shadow:0 0 0 .5em #ffffff12}@keyframes s-drag{0%,22%{box-shadow:none;transform:translateY(0)}30%{transform:translateY(0)scale(1.03);box-shadow:0 .8em 1.6em #00000080}58%{transform:translateY(var(--drag)) scale(1.03);box-shadow:0 .8em 1.6em #00000080}66%,to{transform:translateY(var(--drag));box-shadow:none}}@keyframes s-finger{0%,18%{opacity:0;transform:translateY(0)scale(1.3)}26%{opacity:1;transform:translateY(0)scale(1)}58%{opacity:1;transform:translateY(var(--drag)) scale(1)}66%,to{opacity:0;transform:translateY(var(--drag)) scale(1.3)}}@keyframes s-time-old{0%,56%{opacity:1}60%,to{opacity:0}}@keyframes s-time-new{0%,56%{opacity:0}60%,to{opacity:1}}.anim-drag{animation:s-drag var(--loop) cubic-bezier(.5, 0, .3, 1) infinite both}.anim-finger-drag{animation:s-finger var(--loop) cubic-bezier(.5, 0, .3, 1) infinite both}.anim-old{animation:s-time-old var(--loop) step-end infinite both}.anim-new{animation:s-time-new var(--loop) step-end infinite both}@keyframes fill-x{0%,15%{transform:scaleX(var(--from,0))}55%,to{transform:scaleX(var(--to,1))}}.anim-fill{transform-origin:0;animation:fill-x var(--loop) cubic-bezier(.6, 0, .2, 1) infinite both}@keyframes grow-y{0%,8%{transform:scaleY(.04)}40%,to{transform:scaleY(1)}}.anim-grow{transform-origin:bottom;animation:grow-y var(--loop) cubic-bezier(.3, .7, .2, 1) infinite both}@keyframes show-15{0%,15%{opacity:0;transform:translateY(.35em)scale(.97)}19%,to{opacity:1;transform:none}}@keyframes hide-15{0%,15%{opacity:1}19%,to{opacity:0}}@keyframes tap-15{0%,14%{opacity:0;transform:scale(1.5)}18%{opacity:1;transform:scale(1)}22%{opacity:1;transform:scale(.85)}26%,to{opacity:0;transform:scale(1.3)}}.show-15{animation:show-15 var(--loop) ease-out infinite both}.hide-15{animation:hide-15 var(--loop) ease infinite both}.tap-15{animation:tap-15 var(--loop) ease-out infinite both}@keyframes show-25{0%,25%{opacity:0;transform:translateY(.35em)scale(.97)}29%,to{opacity:1;transform:none}}@keyframes toast-25{0%,25%{opacity:0;transform:translateY(-140%)}31%,55%{opacity:1;transform:none}61%,to{opacity:0;transform:translateY(-140%)}}.show-25{animation:show-25 var(--loop) ease-out infinite both}.toast-25{animation:toast-25 var(--loop) cubic-bezier(.2, .9, .3, 1.2) infinite both}@keyframes show-35{0%,35%{opacity:0;transform:translateY(.35em)scale(.97)}39%,to{opacity:1;transform:none}}@keyframes hide-35{0%,35%{opacity:1}39%,to{opacity:0}}@keyframes toast-35{0%,35%{opacity:0;transform:translateY(-140%)}41%,65%{opacity:1;transform:none}71%,to{opacity:0;transform:translateY(-140%)}}.show-35{animation:show-35 var(--loop) ease-out infinite both}.hide-35{animation:hide-35 var(--loop) ease infinite both}.toast-35{animation:toast-35 var(--loop) cubic-bezier(.2, .9, .3, 1.2) infinite both}@keyframes show-45{0%,45%{opacity:0;transform:translateY(.35em)scale(.97)}49%,to{opacity:1;transform:none}}@keyframes hide-45{0%,45%{opacity:1}49%,to{opacity:0}}@keyframes tap-45{0%,44%{opacity:0;transform:scale(1.5)}48%{opacity:1;transform:scale(1)}52%{opacity:1;transform:scale(.85)}56%,to{opacity:0;transform:scale(1.3)}}.show-45{animation:show-45 var(--loop) ease-out infinite both}.hide-45{animation:hide-45 var(--loop) ease infinite both}.tap-45{animation:tap-45 var(--loop) ease-out infinite both}@keyframes show-55{0%,55%{opacity:0;transform:translateY(.35em)scale(.97)}59%,to{opacity:1;transform:none}}@keyframes hide-55{0%,55%{opacity:1}59%,to{opacity:0}}.show-55{animation:show-55 var(--loop) ease-out infinite both}.hide-55{animation:hide-55 var(--loop) ease infinite both}@keyframes show-65{0%,65%{opacity:0;transform:translateY(.35em)scale(.97)}69%,to{opacity:1;transform:none}}.show-65{animation:show-65 var(--loop) ease-out infinite both}@keyframes type{0%,12%{max-width:0}40%,to{max-width:var(--chars)}}.anim-type{white-space:nowrap;vertical-align:bottom;animation:type var(--loop) steps(var(--steps,4), end) infinite both;display:inline-block;overflow:hidden}@keyframes caret{50%{opacity:0}}.caret{vertical-align:-.12em;background:var(--a-tint);width:1px;height:1em;margin-left:1px;animation:1s step-end infinite caret;display:inline-block}@keyframes fade-out-row{0%,38%{opacity:1;max-height:4em}46%,to{opacity:0;max-height:0;margin-top:0;padding-block:0}}.anim-filter{animation:fade-out-row var(--loop) ease infinite both;overflow:hidden}@property --num{syntax:"<integer>";inherits:false;initial-value:0}@keyframes count{0%,10%{--num:var(--from,0)}55%,to{--num:var(--to)}}.anim-count{animation:count var(--loop) cubic-bezier(.3, .7, .2, 1) infinite both;counter-reset:num var(--num)}.anim-count:after{content:counter(num)}[data-offscreen] *,[data-offscreen] :before,[data-offscreen] :after{animation-play-state:paused!important}@keyframes tab-slide{0%,15%{transform:translate(0)}20%,to{transform:translate(calc(200% + .25em))}}.tab-slide{animation:tab-slide var(--loop) cubic-bezier(.5, 0, .2, 1) infinite both}@keyframes p-count{0%,35%{--num:40}39%,55%{--num:60}59%,to{--num:80}}.count-steps{animation:p-count var(--loop) ease infinite both;counter-reset:num var(--num)}.count-steps:after{content:counter(num)}@keyframes p-bar{0%,35%{transform:scaleX(.4)}39%,55%{transform:scaleX(.6)}59%,to{transform:scaleX(.8)}}.bar-steps{transform-origin:0;animation:p-bar var(--loop) cubic-bezier(.5, 0, .2, 1) infinite both}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}.bob{animation:5.2s ease-in-out infinite bob}
