/* oddly working: app support and privacy pages. Same tokens and fonts as home.css. */
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-latin-400.woff2") format("woff2"); font-weight:400; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-cyrillic-400.woff2") format("woff2"); font-weight:400; font-display:swap; unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-latin-600.woff2") format("woff2"); font-weight:600; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-cyrillic-600.woff2") format("woff2"); font-weight:600; font-display:swap; unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-latin-700.woff2") format("woff2"); font-weight:700; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Geologica"; src:url("fonts/Geologica-cyrillic-700.woff2") format("woff2"); font-weight:700; font-display:swap; unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family:"Martian Mono"; src:url("fonts/MartianMono-latin-400.woff2") format("woff2"); font-weight:400; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Martian Mono"; src:url("fonts/MartianMono-cyrillic-400.woff2") format("woff2"); font-weight:400; font-display:swap; unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }

:root {
  color-scheme:dark;
  --bg:#0a0a0a; --step:#141414; --ink:#ececea; --soft:#a3a3a0; --faint:#7d7d7a; --ember:#c8414f;
  --text:"Geologica", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --label:"Martian Mono", ui-monospace, Menlo, monospace;
}
* { box-sizing:border-box; }
html { background:var(--bg); -webkit-text-size-adjust:100%; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--bg); font:17px/1.6 var(--text); }
a { color:var(--ink); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.2em; text-decoration-color:var(--faint); transition:text-decoration-color .2s, color .2s; }
a:hover { text-decoration-color:var(--ember); }
a:focus-visible { outline:2px solid var(--ember); outline-offset:3px; border-radius:2px; }
p, li, a { overflow-wrap:anywhere; }

.shell { max-width:44rem; margin:0 auto; padding-top:clamp(2rem, 7vh, 4.5rem); padding-bottom:3rem; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); }
header { display:flex; flex-direction:column; gap:1rem; }
.brand { display:inline-flex; align-items:baseline; gap:.4rem 1rem; flex-wrap:wrap; text-decoration:none; }
.wordmark { font-weight:700; font-size:clamp(2.6rem, 11vw, 4rem); line-height:.9; letter-spacing:-.05em; font-family:var(--text); }
.cursor { display:inline-block; width:.14em; height:.62em; margin-left:.06em; background:var(--ember); color:transparent; overflow:hidden; vertical-align:baseline; animation:blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
.appname { color:var(--soft); font-size:15px; }

nav { display:flex; flex-wrap:wrap; gap:0 1.4rem; font-size:15px; }
nav a { display:inline-block; padding:8px 0; color:var(--soft); text-decoration-color:transparent; }
nav a:hover { color:var(--ink); text-decoration-color:var(--ember); }
.languages { margin-top:-.6rem; }
.languages a { font:12px/1.6 var(--label); }
nav [aria-current=page] { color:var(--ink); text-decoration-color:var(--ember); }

main { margin:3rem 0 4.5rem; }
h1 { font-size:clamp(1.9rem, 6vw, 2.6rem); font-weight:700; line-height:1.05; letter-spacing:-.035em; margin:0 0 .5rem; text-wrap:balance; }
h2 { font-size:1.3rem; font-weight:600; line-height:1.25; letter-spacing:-.02em; margin:3rem 0 .6rem; text-wrap:balance; }
p { margin:.7rem 0; color:var(--ink); }
p strong, li strong { font-weight:600; }
.intro { font-size:1.2rem; line-height:1.45; }
.date { color:var(--soft); font:12px/1.6 var(--label); margin-top:0; }
ol, ul { padding-left:1.4rem; }
li { padding-left:.3rem; margin:.55rem 0; }
li::marker { color:var(--faint); }
.notice { background:var(--step); color:var(--ink); padding:1rem 1.2rem; margin:1.6rem 0; }

footer { background:var(--step); padding:1rem 1.2rem; font-size:14px; color:var(--soft); display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.5rem; }
footer p { margin:0; color:var(--soft); }
footer a { color:var(--soft); }
.providers { display:flex; gap:.4rem 1.3rem; flex-wrap:wrap; margin-top:1.4rem; padding:1rem 1.2rem; background:var(--step); font-size:14px; }

@media (prefers-reduced-motion:reduce) { .cursor { animation:none; } a { transition:none; } }