/* Ombud shared design system — canonical values live in .interface-design/system.md.
   Pages set --page-w / --gutter / --header-z in their own :root to size the frame. */

:root {
  --paper:#fcfbf7;
  --line:#e9dfcf;
  --line-strong:#d8cab2;
  --ink:#181511;
  --muted:#6c655d;
  --link:#0b46ff;
  --danger:#c3312f;
  --success:#326b2c;
  --mono:"JetBrains Mono","IBM Plex Mono","SFMono-Regular",monospace;
  --sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --page-w:1280px;
  --gutter:32px;
  --header-z:10;
}

*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);min-height:100vh}

/* ── Site header ── */
.site-header{
  border-bottom:1px solid var(--line);
  background:rgba(252,251,247,.92);
  backdrop-filter:blur(10px);
  position:sticky;top:0;z-index:var(--header-z);
}
.header-inner{
  width:min(var(--page-w),calc(100% - var(--gutter)));margin:0 auto;
  min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.brand{display:flex;align-items:center;gap:10px;font-size:.9rem;font-weight:500}
.mark{
  width:16px;height:16px;border-radius:999px;flex-shrink:0;
  border:1px solid var(--line-strong);
  background:radial-gradient(circle at 30% 30%,#f8f3ea 0,#d7c7ac 45%,#9b8d76 100%);
}

/* ── Buttons ── */
.btn{
  padding:8px 16px;
  border:1px solid var(--line-strong);
  background:transparent;color:var(--ink);
  font-family:var(--sans);font-size:.75rem;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;
}
.btn:hover{background:#f7f2e8}
.btn-dark,.btn-primary{
  padding:8px 16px;
  border:1px solid var(--ink);
  background:var(--ink);color:var(--paper);
  font-family:var(--sans);font-size:.75rem;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;
}
.btn-dark:hover,.btn-primary:hover{background:#333;border-color:#333}
.btn:disabled,.btn-dark:disabled,.btn-primary:disabled{opacity:.45;cursor:not-allowed}

/* ── Feedback messages ── */
.msg{font-size:.8rem;color:var(--muted);min-height:1.2rem}
.msg.error{color:var(--danger)}
.msg.success{color:var(--success)}