/* Shared styles for the app page and the build guide. The home page keeps its own inline copy. */
:root{--paper:#FFF;--ink:#000;--grey:#74767C;--rule:#E6E6E3;--surface:#F3F3F1;--cobalt:#2B2BFF;--cobalt-soft:#E9E9FF;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Funnel Sans",system-ui,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px;border-radius:6px}
.page{max-width:1320px;margin:0 auto;padding:0 40px}
header.top{display:flex;align-items:center;gap:32px;height:76px}
.wordmark{font-family:"Funnel Display",sans-serif;font-weight:700;font-size:27.5px;letter-spacing:-.02em;-webkit-text-stroke:.6px currentColor;text-decoration:none;display:flex;align-items:center;gap:4px}
.wordmark i{width:11px;height:11px;border-radius:50%;background:var(--cobalt);display:inline-block}
header.top nav{display:flex;gap:26px;font-size:15px}
header.top nav a{text-decoration:none;color:var(--grey);transition:color .2s}
header.top nav a:hover,header.top nav a[aria-current]{color:var(--ink)}
.grow{flex:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;font:500 15px "Funnel Sans",sans-serif;text-decoration:none;cursor:pointer;border:1px solid var(--ink);transition:background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn.solid{background:var(--ink);color:#fff}
.btn.solid:hover{background:var(--cobalt);border-color:var(--cobalt)}
.btn.line{background:#fff;color:var(--ink);border-color:var(--rule)}
.btn.line:hover{border-color:var(--ink)}
.btn.big{min-height:52px;padding:0 28px;font-size:16px}
.display{font-family:"Funnel Display",sans-serif;font-weight:600;letter-spacing:-.045em;line-height:.95}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:28px 0 36px;border-top:1px solid var(--rule);margin-top:96px;color:var(--grey);font-size:15px}
footer a{text-decoration:none}
footer a:hover{color:var(--ink)}
@media (max-width:640px){.page{padding:0 20px}header.top nav{display:none}header.top .btn.line{display:none}}
