/* Persevera - one stylesheet for the whole site. Mirrors the palette the
   Sówka app uses (app/src/theme.ts) so the pages read as the same product. */
:root{
  --paper:#FBF4E9; --ink:#1F2933; --muted:#7B8794; --rule:#E7DCCB;
  --accent:#D4213D; --surface:#FFFFFF;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#14161A; --ink:#F2F4F7; --muted:#98A2B3; --rule:#2C313C;
    --accent:#FF6B7E; --surface:#1E212A;
  }
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:46rem;margin:0 auto;padding:2.5rem 1.25rem 4rem}

/* Header, shared by the landing page and the policies. */
header{border-bottom:1px solid var(--rule);padding-bottom:1.5rem;margin-bottom:2rem}
.brand{font-size:1.35rem;font-weight:700;letter-spacing:-.01em;text-decoration:none;color:inherit;display:inline-block}
.brand span{color:var(--accent)}
h1{font-size:1.9rem;line-height:1.2;margin:.75rem 0 .35rem;letter-spacing:-.02em;text-wrap:balance}
.updated{color:var(--muted);font-size:.875rem;margin:0}
.lang{margin-top:1rem;font-size:.875rem}

h2{font-size:1.15rem;margin:2.25rem 0 .6rem;letter-spacing:-.01em}
p,li{margin:.6rem 0}
ul{padding-left:1.25rem}
strong{font-weight:650}
a{color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.card{
  background:var(--surface);border:1px solid var(--rule);border-radius:12px;
  padding:1rem 1.25rem;margin:1.25rem 0;
}
.card p:first-child{margin-top:0}
.card p:last-child{margin-bottom:0}

.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;margin:1rem 0;font-size:.925rem}
th,td{text-align:left;padding:.5rem .6rem;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-weight:650;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}

code{
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;
  background:var(--surface);border:1px solid var(--rule);border-radius:4px;padding:.1em .35em;
  overflow-wrap:anywhere;
}
footer{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--rule);color:var(--muted);font-size:.875rem}

/* Landing page only: the list of apps. */
.lede{font-size:1.1rem;color:var(--muted);max-width:34rem}
.apps{list-style:none;padding:0;margin:2rem 0 0}
.app{
  display:flex;gap:1rem;align-items:flex-start;
  background:var(--surface);border:1px solid var(--rule);border-radius:14px;
  padding:1.1rem 1.25rem;margin-bottom:1rem;
}
.app-mark{font-size:1.75rem;line-height:1.2}
.app-body{flex:1;min-width:0}
.app-name{font-size:1.05rem;font-weight:650;margin:0 0 .15rem}
.app-desc{margin:0 0 .5rem;color:var(--muted);font-size:.95rem}
.app-links{font-size:.875rem;display:flex;flex-wrap:wrap;gap:.25rem 1rem}
.tag{
  display:inline-block;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;
  font-weight:700;color:var(--muted);border:1px solid var(--rule);border-radius:99px;
  padding:.1rem .5rem;vertical-align:.15em;margin-left:.4rem;
}