/* kiara-base.css — Design tokens y reset */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --k-blue-900:#0f2454;--k-blue-800:#1a3a6b;--k-blue-700:#1e4489;
  --k-blue-600:#2352a8;--k-blue-500:#2d5be3;--k-blue-400:#5479ea;
  --k-blue-100:#dce8ff;--k-blue-50:#f0f5ff;
  --k-green:#10b981;--k-amber:#f59e0b;--k-red:#ef4444;--k-info:#3b82f6;
  --k-gray-900:#111827;--k-gray-800:#1f2937;--k-gray-700:#374151;
  --k-gray-600:#4b5563;--k-gray-500:#6b7280;--k-gray-400:#9ca3af;
  --k-gray-300:#d1d5db;--k-gray-200:#e5e7eb;--k-gray-100:#f3f4f6;
  --k-gray-50:#f9fafb;
  --k-bg:#f8fafc;--k-surface:#fff;--k-border:#e2e8f0;
  --k-sidebar-bg:#0f2454;--k-sidebar-text:#c8d8f8;
  --k-sidebar-active:#2d5be3;--k-sidebar-hover:rgba(255,255,255,.08);
  --k-sidebar-w:232px;--k-topbar-h:58px;
  --k-font:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --k-mono:'JetBrains Mono','Courier New',monospace;
  --k-r-sm:.375rem;--k-r:.5rem;--k-r-md:.75rem;--k-r-lg:1rem;--k-r-xl:1.5rem;--k-r-full:9999px;
  --k-sh-sm:0 1px 2px rgba(0,0,0,.05);
  --k-sh:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06);
  --k-sh-md:0 4px 6px rgba(0,0,0,.07),0 2px 4px rgba(0,0,0,.06);
  --k-sh-lg:0 10px 15px rgba(0,0,0,.1),0 4px 6px rgba(0,0,0,.05);
  --k-sh-xl:0 20px 25px rgba(0,0,0,.1),0 10px 10px rgba(0,0,0,.04);
  --k-t:150ms cubic-bezier(.4,0,.2,1);--k-t-slow:300ms cubic-bezier(.4,0,.2,1);
  --k-z-drop:100;--k-z-sticky:200;--k-z-modal:500;--k-z-toast:900;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--k-font);font-size:1rem;color:var(--k-gray-800);background:var(--k-bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font-family:inherit;font-size:inherit}
a{color:var(--k-blue-500);text-decoration:none}
a:hover{color:var(--k-blue-700)}
ul,ol{list-style:none}

::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--k-gray-300);border-radius:var(--k-r-full)}
::-webkit-scrollbar-thumb:hover{background:var(--k-gray-400)}

/* Markdown */
.md{line-height:1.75}
.md h1,.md h2,.md h3{font-weight:600;margin:1.2em 0 .5em;color:var(--k-gray-900)}
.md h1{font-size:1.5rem}.md h2{font-size:1.25rem}.md h3{font-size:1.125rem}
.md p{margin-bottom:.8em}
.md ul,.md ol{padding-left:1.5em;margin-bottom:.8em}
.md li{list-style:disc;margin-bottom:.25em}.md ol li{list-style:decimal}
.md code{font-family:var(--k-mono);background:var(--k-gray-100);padding:.15em .4em;border-radius:var(--k-r-sm);font-size:.9em;color:var(--k-blue-700)}
.md pre{background:var(--k-gray-900);color:#e2e8f0;border-radius:var(--k-r-md);padding:1em;overflow-x:auto;margin-bottom:1em}
.md pre code{background:none;color:inherit;padding:0}
.md table{border-collapse:collapse;width:100%;margin-bottom:1em}
.md th{background:var(--k-blue-50);font-weight:600}
.md th,.md td{border:1px solid var(--k-border);padding:.5em .75em;text-align:left}
.md tr:hover{background:var(--k-gray-50)}
.md blockquote{border-left:3px solid var(--k-blue-500);padding-left:1em;color:var(--k-gray-600);margin-bottom:.8em}
.md strong{font-weight:600;color:var(--k-gray-900)}
.md hr{border:none;border-top:1px solid var(--k-border);margin:1.5em 0}

/* Utils */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hidden{display:none!important}
.flex{display:flex}.flex-1{flex:1}.items-center{align-items:center}
.justify-between{justify-content:space-between}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}
.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}
.text-muted{color:var(--k-gray-500)}.w-full{width:100%}
.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}

/* Animations */
@keyframes k-spin{to{transform:rotate(360deg)}}
@keyframes k-pulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes k-slide-in{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes k-fade-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.k-fade-in{animation:k-fade-in .2s ease both}
