/* ============================================================
   VOICEDESK — BASE
   Reset, typography, primitives shared by every screen.
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0 }
html{ scroll-behavior:smooth }
body{
    background:var(--bg); color:var(--text);
    font-family:var(--font-body); font-size:15px; line-height:1.6;
    -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    overflow-x:hidden;
}
::selection{ background:var(--text); color:var(--bg) }
a{ color:inherit; text-decoration:none }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit }
input,select,textarea{ font-family:inherit; color:inherit }
img,svg{ display:block; max-width:100% }
:focus-visible{ outline:2px solid var(--primary); outline-offset:3px; border-radius:4px }

::-webkit-scrollbar{ width:5px; height:5px }
::-webkit-scrollbar-track{ background:transparent }
::-webkit-scrollbar-thumb{ background:rgba(9,9,11,.14); border-radius:6px }

/* ---- headings ---- */
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; line-height:1.15 }
.h-page{ font-size:26px }
.h-section{ font-size:18px }

/* ---- mono label (signature) ---- */
.label{
    font-family:var(--font-mono); font-size:10.5px; font-weight:500;
    letter-spacing:.22em; text-transform:uppercase; color:var(--muted);
    display:flex; align-items:center; gap:12px;
}
.label--rule::before{ content:""; width:20px; height:1px; background:var(--border-strong) }
.serif{ font-family:var(--font-serif); font-style:italic; font-weight:400 }

/* ---- utility ---- */
.row{ display:flex; align-items:center; gap:12px }
.row-between{ display:flex; align-items:center; justify-content:space-between; gap:16px }
.stack{ display:flex; flex-direction:column; gap:16px }
.grow{ flex:1; min-width:0 }
.truncate{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.tnum{ font-variant-numeric:tabular-nums }
.muted{ color:var(--muted) }
.small{ font-size:13px }
.mono{ font-family:var(--font-mono) }
.hide{ display:none !important }
.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}
.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}