/* Shared styles for RackMon content sub-pages (privacy, security, license, docs, changelog).
   Matches the store (index.html): same tokens, fonts, dark/light theming. */
@font-face{font-family:"Manrope";src:url("manrope.woff2") format("woff2");font-weight:200 800;font-display:swap;font-style:normal}
@font-face{font-family:"Bricolage";src:url("bricolage.woff2") format("woff2");font-weight:200 800;font-display:swap;font-style:normal}

:root{
  --bg:#070A0F; --surface:#0F1620; --surface-2:#161F2B; --border:#212D3B; --border-2:#2C3B4D;
  --ink:#EDF3F9; --muted:#8493A6; --accent:#22D3EE; --accent-ink:#04222a; --accent-text:#22D3EE;
  --cool:#38BDF8; --nominal:#34D399; --warn:#FBBF24; --crit:#F87171;
  --display:"Bricolage","Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --radius:14px; --maxw:820px;
}
@media (prefers-color-scheme: light){
  :root{ --bg:#F6F8FC; --surface:#FFFFFF; --surface-2:#EEF3F9; --border:#DCE4EE; --border-2:#C9D5E2;
    --ink:#0B1522; --muted:#495663; --accent-ink:#04343b; --accent-text:#0E7490; }
}
:root[data-theme="dark"]{ --bg:#070A0F; --surface:#0F1620; --surface-2:#161F2B; --border:#212D3B; --border-2:#2C3B4D;
  --ink:#EDF3F9; --muted:#8493A6; --accent-ink:#04222a; --accent-text:#22D3EE; }
:root[data-theme="light"]{ --bg:#F6F8FC; --surface:#FFFFFF; --surface-2:#EEF3F9; --border:#DCE4EE; --border-2:#C9D5E2;
  --ink:#0B1522; --muted:#495663; --accent-ink:#04343b; --accent-text:#0E7490; }

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.62;font-weight:450;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-.005em}
a{color:var(--accent-text);text-decoration:none}
a:hover{text-decoration:underline}

/* top bar */
header.bar{position:sticky;top:0;z-index:30;backdrop-filter:blur(16px);
  background:color-mix(in srgb,var(--bg) 78%,transparent);border-bottom:1px solid var(--border)}
.bar-in{max-width:var(--maxw);margin:0 auto;padding:0 24px;height:62px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:9px;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand svg{width:24px;height:24px;flex:0 0 auto}
.brand .wm{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.02em}
.brand .wm b{color:var(--accent-text)}
.bar .right{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:14px;color:var(--muted)}
.bar .right a{color:var(--muted)}
.bar .right a:hover{color:var(--ink);text-decoration:none}
.tbtn{background:transparent;border:1px solid var(--border-2);color:var(--muted);width:34px;height:34px;border-radius:9px;
  cursor:pointer;font-size:14px;display:grid;place-items:center}
.tbtn:hover{color:var(--accent-text);border-color:var(--accent-text)}

/* content */
main{max-width:var(--maxw);margin:0 auto;padding:44px 24px 90px}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text)}
h1{font-family:var(--display);font-size:clamp(30px,5vw,44px);font-weight:750;letter-spacing:-.02em;line-height:1.08;margin:.35em 0 .1em}
h2{font-family:var(--display);font-size:clamp(20px,3vw,26px);font-weight:720;letter-spacing:-.01em;margin:1.9em 0 .5em;padding-top:.2em}
h3{font-family:var(--display);font-size:17px;font-weight:700;margin:1.5em 0 .4em}
p,li{color:var(--ink);font-size:16px}
.lead{color:var(--muted);font-size:18px;margin:.2em 0 0}
.updated{color:var(--muted);font-size:13px;font-family:var(--mono);margin-top:6px}
main ul,main ol{padding-left:1.25em;display:flex;flex-direction:column;gap:8px;margin:.6em 0}
strong{font-weight:700}
hr{border:none;border-top:1px solid var(--border);margin:2.4em 0}
code{font-family:var(--mono);font-size:.88em;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:1px 6px}
pre{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius);padding:18px;overflow-x:auto;
  font-family:var(--mono);font-size:13px;line-height:1.7}
pre code{background:none;border:none;padding:0}
.card{background:color-mix(in srgb,var(--surface) 88%,transparent);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;margin:1.2em 0}
.card.warn{border-color:color-mix(in srgb,var(--warn) 45%,var(--border))}
.card.ok{border-color:color-mix(in srgb,var(--nominal) 45%,var(--border))}
table{width:100%;border-collapse:collapse;margin:1em 0;font-size:14.5px;display:block;overflow-x:auto}
th,td{border:1px solid var(--border);padding:9px 12px;text-align:left;vertical-align:top}
th{background:var(--surface-2);font-weight:650}
.btn{display:inline-flex;align-items:center;gap:.4em;padding:.7em 1.2em;border-radius:11px;font-weight:650;font-size:15px;
  border:1px solid var(--border-2);background:transparent;color:var(--ink);cursor:pointer}
.btn:hover{border-color:var(--accent-text);color:var(--accent-text);text-decoration:none}
.btn-primary{background:linear-gradient(180deg,#5ee8f8,var(--accent));color:var(--accent-ink);border-color:var(--accent)}
.btn-primary:hover{color:var(--accent-ink)}

/* footer */
footer{border-top:1px solid var(--border);color:var(--muted);font-size:13.5px}
.foot-in{max-width:var(--maxw);margin:0 auto;padding:26px 24px;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center}
.foot-in a{color:var(--muted)}
.foot-in a:hover{color:var(--ink)}
.foot-links{display:flex;flex-wrap:wrap;gap:16px}
@media(max-width:560px){.bar .right span.hide{display:none}}