/* VolleySync site styles, carried over from the original site. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --bg:#07090C; --surface:#11161D; --surface-2:#171E27;
  --ink:#E9EEF5; --muted:#94A3B4; --line:#1F2833;
  --blue:#3B8DFF; --orange:#FF8A1E;
}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Public Sans",ui-sans-serif,system-ui,-apple-system,sans-serif;
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:44rem;margin:0 auto;padding:3rem 1.4rem 5rem}
h1,h2,h3,.brand{font-family:Archivo,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.02em}
h1{font-size:clamp(2rem,6vw,2.8rem);font-weight:800;line-height:1.08;margin:0 0 .5rem;text-wrap:balance}
h2{font-size:1.3rem;font-weight:700;margin:2.6rem 0 .7rem}
h3{font-size:1.02rem;font-weight:700;margin:1.6rem 0 .4rem}
p,li{color:#C3CEDB}
a{color:var(--blue)}
.lede{font-size:1.13rem;color:var(--muted);margin-top:0}
header.site{display:flex;align-items:center;gap:.85rem;margin-bottom:2.5rem}
header.site img{width:52px;height:52px;border-radius:12px;display:block}
.brand{font-size:1.28rem;font-weight:800}
.brand span{color:var(--orange)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:1.3rem 1.5rem;margin:1.1rem 0}
.muted{color:var(--muted);font-size:.93rem}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:var(--surface-2);padding:.12em .4em;border-radius:5px}
ul{padding-left:1.15rem}
li{margin:.4rem 0}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
footer{color:var(--muted);font-size:.88rem;border-top:1px solid var(--line);padding-top:1.3rem;margin-top:3rem}
footer a{color:var(--muted)}
.btn{display:inline-block;background:var(--blue);color:#fff;text-decoration:none;font-weight:700;
     padding:.85rem 1.5rem;border-radius:11px;font-family:Archivo,sans-serif}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.code-hero{font-family:Archivo,sans-serif;font-weight:800;font-size:3.6rem;letter-spacing:.22em;
     text-align:center;margin:.4rem 0 .2rem;font-variant-numeric:tabular-nums}
.center{text-align:center}
.stack{display:flex;flex-direction:column;gap:.8rem;align-items:center}
@media (max-width:32rem){ .wrap{padding-top:2rem} }

/* Added for the multi-app site */
.byline{color:var(--muted);font-size:.9rem;margin-top:-.2rem}
.byline a{color:var(--muted)}
.apps{display:grid;gap:1rem;margin:1.5rem 0}
.app{display:flex;gap:1rem;align-items:flex-start}
.app img{width:64px;height:64px;border-radius:15px;flex:none}
.app h3{margin:0 0 .25rem}
.app p{margin:.2rem 0 .6rem}
.links a{margin-right:1rem}