:root{
  --accent:#0091FF; --accent-ink:#fff; --accent-soft:rgba(0,145,255,.10); --accent-line:rgba(0,145,255,.28);
  --paper:#F6F3EE; --paper-2:#EFEAE2; --card:#FFFFFF; --ink:#1C1C1C; --ink-2:#55524D; --ink-3:#8B8780;
  --line:rgba(28,28,28,.09); --line-2:rgba(28,28,28,.14);
  --ok:#2E9E6A; --warn:#D98A1E; --danger:#E5484D;
  --bubble-me:#0091FF; --bubble-house:#E9E5DE; --bubble-house-ink:#1C1C1C;
  --shadow-1:0 1px 2px rgba(28,28,28,.06),0 2px 8px rgba(28,28,28,.05);
  --shadow-2:0 2px 6px rgba(28,28,28,.06),0 16px 40px rgba(28,28,28,.10);
  --r-1:12px; --r-2:18px; --r-3:26px;
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-d:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --accent-soft:rgba(0,145,255,.16); --accent-line:rgba(0,145,255,.40);
  --paper:#121212; --paper-2:#1A1A1A; --card:#1E1E1E; --ink:#F3F0EA; --ink-2:#B9B4AC; --ink-3:#85807A;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --bubble-house:#2A2A2A; --bubble-house-ink:#F3F0EA;
  --shadow-1:0 1px 2px rgba(0,0,0,.4); --shadow-2:0 2px 6px rgba(0,0,0,.3),0 18px 44px rgba(0,0,0,.45);
  color-scheme:dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;transition:background .35s var(--ease),color .35s var(--ease)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
a{color:inherit}
.mark{display:inline-block;flex:none}
.wordmark{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-d);font-weight:650;letter-spacing:-.02em;text-decoration:none}
.tap{transition:transform .18s var(--spring),background-color .2s,opacity .2s,box-shadow .2s}
.tap:active{transform:scale(.96)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:999px;font-weight:600;font-size:15.5px;text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 6px 18px rgba(0,145,255,.28)}
.btn-primary:hover{box-shadow:0 8px 24px rgba(0,145,255,.36)}
.btn-ghost{background:transparent;border:1px solid var(--line-2)}
.btn-ghost:hover{background:var(--line)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* the chirp: a tiny hop and two sound arcs when the house speaks */
.mark .mk-a1,.mark .mk-a2{transform-box:fill-box;transform-origin:left center}
.chirp .mark{animation:hop .5s var(--spring)}
.chirp .mark .mk-a1{animation:arc .7s var(--ease) both}
.chirp .mark .mk-a2{animation:arc .7s var(--ease) .12s both}
@keyframes hop{0%{transform:none}35%{transform:translateY(-3px) rotate(-4deg)}70%{transform:translateY(0) rotate(2deg)}100%{transform:none}}
@keyframes arc{0%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.15)}100%{opacity:1;transform:none}}
/* install hint (iPhone Safari) */
.install{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:80;display:flex;align-items:center;gap:12px;padding:12px 12px 12px 14px;border-radius:20px;background:var(--card);color:var(--ink);box-shadow:var(--shadow-2);border:1px solid var(--line);animation:pop .5s var(--spring) both;max-width:460px;margin:0 auto}
.install b{display:block;font-size:14.5px}.install span{font-size:13px;color:var(--ink-2)}
.install .x{margin-left:auto;width:30px;height:30px;border-radius:50%;background:var(--line);flex:none;font-size:13px}
.install svg.share{vertical-align:-3px}
.install.top{top:calc(60px + env(safe-area-inset-top));bottom:auto}
@keyframes pop{0%{opacity:0;transform:scale(.9) translateY(8px)}100%{opacity:1;transform:none}}