:root {
  color-scheme: light;
  --ink: #202438;
  --muted: #777e92;
  --faint: #a7adbd;
  --line: #e8eaf0;
  --paper: #ffffff;
  --canvas: #f6f7fb;
  --purple: #6154d9;
  --purple-dark: #5145c3;
  --green: #2fb18b;
  font-family: 'Avenir Next', Avenir, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; color: var(--ink); background: var(--canvas); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.login-page { min-height: 100vh; padding: 22px; background: #f4f5fa; }
.login-layout { display: grid; grid-template-columns: minmax(480px, 0.92fr) minmax(480px, 1.08fr); min-height: calc(100vh - 44px); max-width: 1500px; margin: 0 auto; overflow: hidden; border: 1px solid rgba(34, 39, 61, .06); border-radius: 18px; background: var(--paper); box-shadow: 0 20px 80px rgba(38, 43, 74, .08); }
.login-main { display: flex; flex-direction: column; padding: 38px clamp(34px, 6vw, 92px) 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; width: fit-content; color: #22263b; }
.brand-mark { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 11px; color: white; background: linear-gradient(145deg, #776ce7, #5549c9); box-shadow: 0 5px 14px rgba(92, 80, 207, .22); }
.brand-mark svg { width: 26px; height: 26px; stroke: currentColor; stroke-width: 1.4; }
.brand-name { font-family: 'Avenir Next', Avenir, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: -.35px; }
.brand-name strong { font-weight: 800; }
.login-content { width: min(100%, 390px); margin: auto; padding: 46px 0 54px; }
.eyebrow { margin: 0 0 13px; color: var(--purple); font-size: 10px; font-weight: 700; letter-spacing: 1.55px; }
.login-content h1 { margin: 0; font-family: 'Avenir Next', Avenir, sans-serif; font-size: clamp(34px, 3.7vw, 48px); font-weight: 700; letter-spacing: -2.15px; line-height: 1.15; }
.login-intro { margin: 17px 0 34px; color: var(--muted); font-size: 14px; line-height: 1.65; }
.login-form { display: flex; flex-direction: column; gap: 10px; }
.login-form label { margin: 0 0 1px; color: #34394d; font-size: 12px; font-weight: 600; }
.input-wrap { position: relative; display: flex; align-items: center; height: 49px; margin-bottom: 11px; border: 1px solid #e1e4ec; border-radius: 8px; background: #fff; transition: border-color .16s, box-shadow .16s; }
.input-wrap:focus-within { border-color: #8a81e8; box-shadow: 0 0 0 3px rgba(97, 84, 217, .10); }
.input-wrap svg { flex: none; width: 18px; height: 18px; margin-left: 14px; color: #9ca2b2; }
.input-wrap input { width: 100%; height: 100%; padding: 0 14px 0 11px; border: 0; outline: 0; border-radius: inherit; color: var(--ink); background: transparent; font-size: 13px; }
.input-wrap input::placeholder { color: #aab0bf; }
.password-label-row { display: flex; align-items: center; justify-content: space-between; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; border: 0; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 600; transition: transform .16s, background .16s, box-shadow .16s; }
.button-primary { color: white; background: linear-gradient(100deg, #6257d7, #5549c6); box-shadow: 0 8px 16px rgba(84, 72, 193, .17); }
.button-primary:hover { transform: translateY(-1px); background: var(--purple-dark); box-shadow: 0 10px 20px rgba(84, 72, 193, .23); }
.login-submit { width: 100%; height: 49px; margin-top: 11px; }
.login-submit svg { width: 17px; height: 17px; }
.login-footnote { display: flex; align-items: center; gap: 8px; margin: 23px 0 0; color: #8e95a7; font-size: 10px; }
.secure-dot, .live-indicator i, .status-badge i, .state-dot, .chip-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(47, 177, 139, .1); }
.form-alert { margin: -14px 0 20px; padding: 11px 13px; border: 1px solid #f0d2d0; border-radius: 7px; color: #9d4947; background: #fff6f5; font-size: 12px; }
.form-alert p { margin: 0; }
.login-footer { color: #a1a6b4; font-size: 10px; }
.login-footer span { padding: 0 5px; color: #c0c4cf; }

.login-aside { position: relative; display: flex; align-items: center; overflow: hidden; padding: 54px clamp(38px, 6vw, 95px); color: white; background: radial-gradient(ellipse at 80% 18%, rgba(131, 116, 245, .52), transparent 42%), linear-gradient(145deg, #29284a 0%, #302d5f 54%, #4b438d 100%); }
.login-aside::before { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 40px 40px; content: ''; mask-image: linear-gradient(135deg, transparent, black 70%); }
.aside-orb { position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; pointer-events: none; }
.orb-one { width: 440px; height: 440px; top: -150px; right: -170px; box-shadow: 0 0 0 42px rgba(255,255,255,.018), 0 0 0 84px rgba(255,255,255,.014); }
.orb-two { width: 310px; height: 310px; bottom: -190px; left: -130px; box-shadow: 0 0 0 38px rgba(255,255,255,.025); }
.aside-content { position: relative; z-index: 1; width: min(100%, 460px); margin: auto; }
.aside-kicker { display: flex; align-items: center; gap: 9px; color: #c1bbf7; font-size: 9px; font-weight: 700; letter-spacing: 1.65px; }
.aside-kicker span { width: 20px; height: 1px; background: #9b91fa; }
.aside-content h2 { margin: 22px 0 13px; font-family: 'Avenir Next', Avenir, sans-serif; font-size: clamp(29px, 3vw, 40px); font-weight: 600; letter-spacing: -1.2px; line-height: 1.2; }
.aside-content > p { max-width: 350px; margin: 0; color: #c4c4db; font-size: 13px; line-height: 1.75; }
.feature-stack { display: flex; flex-direction: column; gap: 11px; margin-top: 38px; }
.feature-item { display: flex; align-items: center; gap: 13px; min-height: 66px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.11); border-radius: 10px; background: rgba(255,255,255,.055); backdrop-filter: blur(8px); }
.feature-icon { display: grid; flex: none; width: 35px; height: 35px; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 9px; color: #d4d0ff; background: rgba(255,255,255,.075); }
.feature-icon svg { width: 18px; height: 18px; }
.feature-item > span:nth-child(2) { display: flex; flex: 1; flex-direction: column; gap: 4px; }
.feature-item strong { color: #fff; font-size: 11px; font-weight: 600; }
.feature-item small { color: #c4c3dd; font-size: 10px; }
.feature-check { color: #8fdfc6; font-size: 13px; }
.aside-bottom { position: absolute; z-index: 1; right: clamp(38px, 6vw, 95px); bottom: 33px; left: clamp(38px, 6vw, 95px); display: flex; align-items: center; gap: 12px; color: #aaa7d0; font-size: 8px; letter-spacing: 1.5px; }
.aside-line { width: 23px; height: 1px; background: #8178d2; }

.dashboard-page { min-height: 100vh; background: #f7f8fb; }
.app-shell { display: flex; min-height: 100vh; }
.sidebar { position: fixed; z-index: 2; display: flex; flex-direction: column; width: 248px; height: 100vh; padding: 25px 17px 17px; border-right: 1px solid #ebedf3; background: #fff; }
.sidebar-brand { gap: 9px; margin: 0 0 50px 6px; }
.sidebar-brand .brand-mark { width: 33px; height: 33px; border-radius: 10px; }
.sidebar-brand .brand-mark svg { width: 24px; height: 24px; }
.sidebar-brand .brand-name { font-size: 12px; }
.nav-section-label { margin: 0 0 11px 12px; color: #a0a6b5; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; }
.side-nav { display: flex; flex-direction: column; gap: 5px; }
.nav-link { position: relative; display: flex; align-items: center; gap: 12px; height: 42px; padding: 0 12px; border-radius: 7px; color: #71788b; font-size: 12px; }
.nav-link svg { width: 17px; height: 17px; color: #969daf; }
.nav-link.active { color: #5146bd; background: #f0efff; font-weight: 600; }
.nav-link.active svg { color: #6154d9; }
.nav-disabled { cursor: default; opacity: .68; }
.nav-disabled small { margin-left: auto; color: #a5a9b6; font-size: 7px; font-weight: 700; letter-spacing: .7px; }
.sidebar-bottom { margin-top: auto; }
.sidebar-help { display: flex; align-items: flex-start; gap: 10px; margin: 0 2px 17px; padding: 13px 10px; border: 1px solid #ebeaf7; border-radius: 8px; background: #fafaff; }
.help-mark { display: grid; flex: none; width: 19px; height: 19px; place-items: center; border-radius: 50%; color: #6154d9; background: #eeedff; font-size: 11px; font-weight: 700; }
.sidebar-help > span:last-child { display: flex; flex-direction: column; gap: 4px; }
.sidebar-help strong { color: #4b5063; font-size: 9px; }
.sidebar-help small { color: #8e94a6; font-size: 8px; line-height: 1.4; }
.sidebar-profile { display: flex; align-items: center; gap: 9px; padding: 13px 4px 1px; border-top: 1px solid #eff0f4; }
.avatar { display: grid; flex: none; width: 31px; height: 31px; place-items: center; border-radius: 50%; color: #5c52c9; background: #ecebff; font-size: 11px; font-weight: 700; }
.profile-copy { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.profile-copy strong { color: #35394d; font-size: 10px; }
.profile-copy small { color: #979cad; font-size: 9px; }
.sidebar-profile form { margin: 0; }
.icon-button { display: grid; width: 29px; height: 29px; place-items: center; border: 0; border-radius: 6px; color: #8b91a3; background: transparent; cursor: pointer; }
.icon-button:hover { color: #5146bd; background: #f2f1ff; }
.icon-button svg { width: 16px; height: 16px; }
.main-content { width: calc(100% - 248px); min-height: 100vh; margin-left: 248px; }
.topbar { display: flex; align-items: center; justify-content: space-between; height: 57px; padding: 0 42px; border-bottom: 1px solid #ebedf3; background: rgba(255,255,255,.88); }
.breadcrumb { color: #969bad; font-size: 10px; }
.breadcrumb span { margin: 0 9px; color: #c6c9d2; }
.breadcrumb strong { color: #4a4f62; font-weight: 600; }
.topbar-meta { display: flex; align-items: center; gap: 20px; }
.live-indicator { display: inline-flex; align-items: center; gap: 8px; color: #478f78; font-size: 8px; font-weight: 700; letter-spacing: .9px; }
.live-indicator i { width: 6px; height: 6px; }
.topbar-date { color: #a0a5b3; font-size: 9px; }
.page-content { max-width: 1220px; margin: 0 auto; padding: 38px 42px 26px; }
.welcome-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.welcome-row .eyebrow { margin-bottom: 8px; font-size: 9px; }
.welcome-row h1 { margin: 0; font-family: 'Avenir Next', Avenir, sans-serif; font-size: clamp(25px, 2.4vw, 31px); font-weight: 700; letter-spacing: -1px; }
.wave { color: #e8ae53; font-size: 23px; vertical-align: 2px; }
.welcome-copy { margin: 8px 0 0; color: #82899b; font-size: 11px; }
.welcome-chip { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 3px; padding: 8px 12px; border: 1px solid #e4e5f3; border-radius: 20px; color: #6059bd; background: white; font-size: 9px; font-weight: 600; white-space: nowrap; }
.chip-dot { width: 6px; height: 6px; background: #6d64dc; box-shadow: 0 0 0 3px rgba(97,84,217,.1); }
.stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.stat-card { min-height: 119px; padding: 16px 18px 13px; border: 1px solid #eaecf2; border-radius: 9px; background: white; box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.stat-heading { display: flex; align-items: center; justify-content: space-between; color: #858b9d; font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.stat-icon { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 8px; }
.stat-icon svg { width: 15px; height: 15px; }
.stat-icon.violet { color: #6a5fe0; background: #f0efff; }
.stat-icon.blue { color: #4e8ac8; background: #edf6ff; }
.stat-icon.green { color: #269c79; background: #eaf8f3; }
.stat-value { margin-top: 5px; color: #2e3347; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 24px; font-weight: 700; letter-spacing: -.7px; }
.stat-value-small { font-size: 20px; }
.stat-note { margin: 2px 0 0; color: #a0a5b2; font-size: 9px; }
.mcp-endpoint-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 15px; padding: 17px 19px; border: 1px solid #e7e5f7; border-radius: 9px; background: linear-gradient(110deg,#fff 0%,#faf9ff 100%); box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.mcp-endpoint-copy .eyebrow { margin: 0 0 5px; color: #8279d0; font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.mcp-endpoint-copy h2 { margin: 0; color: #3a3f52; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 14px; }
.mcp-endpoint-copy p:last-child { margin: 5px 0 0; color: #858b9d; font-size: 9px; line-height: 1.5; }
.mcp-endpoint-control { display: flex; align-items: center; gap: 9px; min-width: min(520px, 54%); }
.mcp-endpoint-control input { flex: 1; min-width: 0; height: 39px; padding: 0 11px; border: 1px solid #e2e5ed; border-radius: 7px; outline: 0; color: #3e4357; background: #fff; font: 11px ui-monospace, SFMono-Regular, Menlo, monospace; }
.mcp-endpoint-control .button { min-height: 39px; padding: 0 13px; white-space: nowrap; font-size: 10px; }
.mcp-endpoint-control span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.mcp-catalog-page > .welcome-row { margin-bottom: 22px; }
.catalog-summary { display: flex; align-items: center; gap: 9px; margin-bottom: 20px; padding: 13px 16px; border: 1px solid #e8eaf1; border-radius: 8px; background: #fff; }
.catalog-summary span { padding: 6px 9px; border-radius: 5px; color: #5f55c9; background: #f2f0ff; font-size: 10px; font-weight: 700; }
.catalog-summary span:nth-child(2) { color: #347d70; background: #edf8f4; }
.catalog-summary small { margin-left: auto; color: #9298a9; font-size: 9px; }
.catalog-section { margin: 19px 0 24px; }
.catalog-section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 10px; }
.catalog-section-heading .eyebrow { margin: 0 0 5px; color: #888e9f; font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.catalog-section-heading h2 { margin: 0; color: #383d51; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 17px; }
.catalog-section-heading h2 span, .catalog-item-body h3 span { margin-left: 5px; color: #8e93a3; font-family: inherit; font-size: 10px; font-weight: 500; }
.catalog-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.catalog-item { min-width: 0; border: 1px solid #e7e9f0; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.catalog-item > summary { display: flex; align-items: center; gap: 10px; min-height: 69px; padding: 12px 14px; list-style: none; cursor: pointer; }
.catalog-item > summary::-webkit-details-marker { display: none; }
.catalog-item > summary::marker { content: ''; }
.catalog-symbol { display: grid; flex: none; width: 31px; height: 31px; place-items: center; border-radius: 8px; font-size: 11px; font-weight: 750; }
.tool-symbol { color: #6154c7; background: #f0efff; }
.prompt-symbol { color: #35816d; background: #edf8f3; }
.catalog-title { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.catalog-title strong { overflow: hidden; color: #404559; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.catalog-title code, .catalog-arguments code { color: #787e91; font: 9px ui-monospace, SFMono-Regular, Menlo, monospace; }
.catalog-expand { display: flex; flex: none; align-items: center; gap: 7px; color: #777d90; font-size: 8px; }
.catalog-expand b { color: #675ccc; font-size: 13px; font-weight: 500; }
.catalog-item[open] > summary { border-bottom: 1px solid #eff0f4; }
.catalog-item[open] .catalog-expand b { transform: rotate(45deg); }
.catalog-item-body { padding: 12px 15px 15px; }
.catalog-description { margin: 0 0 14px; color: #747b8f; font-size: 10px; line-height: 1.55; white-space: pre-line; }
.catalog-item-body h3 { margin: 0 0 8px; color: #5c6275; font-size: 9px; font-weight: 700; }
.catalog-arguments { margin: 0; }
.catalog-arguments > div { padding: 8px 0; border-top: 1px solid #f0f1f5; }
.catalog-arguments dt { display: flex; align-items: center; gap: 8px; }
.catalog-arguments dt span { color: #969bad; font-size: 8px; }
.catalog-arguments dd { margin: 4px 0 0; color: #7f8596; font-size: 9px; line-height: 1.45; }
.catalog-no-arguments, .catalog-empty { color: #8b91a2; font-size: 10px; }
.catalog-schema { margin-top: 10px; border-top: 1px solid #eff0f4; padding-top: 9px; }
.catalog-schema summary { color: #675ccc; cursor: pointer; font-size: 9px; }
.catalog-schema pre { max-height: 240px; overflow: auto; padding: 10px; border-radius: 6px; color: #545b70; background: #f7f8fb; font-size: 8px; white-space: pre-wrap; }
.catalog-unavailable { padding: 21px; border: 1px solid #efdada; border-radius: 9px; color: #9e4c53; background: #fffafa; }
.catalog-unavailable p { margin: 6px 0 0; color: #8e7580; font-size: 10px; }
.content-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); gap: 15px; margin-top: 16px; }
.setup-card, .service-card, .next-card { border: 1px solid #eaecf2; border-radius: 9px; background: white; box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.setup-card { position: relative; overflow: hidden; min-height: 330px; padding: 19px 21px 18px; }
.card-topline { display: flex; align-items: center; justify-content: space-between; }
.card-kicker { color: #9298a9; font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.card-step { color: #6154d9; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 10px; font-weight: 700; }
.card-step span { color: #babdc9; }
.setup-illustration { position: relative; display: grid; width: 100%; height: 128px; place-items: center; }
.illuminated-ring { position: absolute; width: 142px; height: 72px; border: 1px solid #e6e4fb; border-radius: 50%; transform: rotate(-13deg); }
.ring-b { width: 167px; height: 84px; border-color: #f0effa; transform: rotate(17deg); }
.book-illustration { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 9px; width: 69px; height: 83px; padding: 15px; border: 1px solid #ccc8f5; border-radius: 5px 10px 10px 5px; background: linear-gradient(145deg,#f5f4ff,#e8e6fc); box-shadow: 0 12px 24px rgba(82,73,178,.15), inset 4px 0 #d3cff6; transform: rotate(-7deg); }
.book-illustration span { width: 5px; height: 42px; border-radius: 3px; background: #b0a9ea; }
.book-illustration span:nth-child(2) { height: 52px; background: #847add; }
.book-illustration span:nth-child(3) { height: 34px; background: #cbc7f3; }
.spark { position: absolute; z-index: 1; color: #a59ce8; }
.spark-a { top: 28px; left: calc(50% - 77px); font-size: 14px; }
.spark-b { right: calc(50% - 88px); bottom: 27px; color: #e7bc73; font-size: 18px; }
.setup-card h2 { max-width: 400px; margin: 0 0 8px; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 17px; font-weight: 700; letter-spacing: -.35px; line-height: 1.35; }
.setup-card > p { max-width: 450px; margin: 0; color: #848b9d; font-size: 10px; line-height: 1.65; }
.progress-track { height: 4px; margin-top: 19px; overflow: hidden; border-radius: 5px; background: #efeff5; }
.progress-track span { display: block; width: 25%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#7770e2,#5b50cf); }
.progress-caption { display: flex; justify-content: space-between; margin-top: 7px; color: #9b9faf; font-size: 8px; }
.progress-caption strong { color: #6258c8; font-weight: 700; }
.right-column { display: flex; flex-direction: column; gap: 15px; }
.service-card { padding: 18px 19px 0; }
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.section-heading .eyebrow { margin-bottom: 6px; font-size: 8px; }
.section-heading h2 { margin: 0; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 15px; font-weight: 700; letter-spacing: -.4px; }
.status-badge { display: inline-flex; align-items: center; gap: 7px; padding: 6px 8px; border-radius: 5px; color: #388a72; background: #eff9f5; font-size: 7px; font-weight: 700; letter-spacing: .65px; }
.status-badge i { width: 5px; height: 5px; box-shadow: none; }
.service-row { display: flex; align-items: center; min-height: 49px; border-top: 1px solid #f0f1f5; }
.service-logo { display: grid; width: 28px; height: 28px; margin-right: 10px; place-items: center; border-radius: 7px; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 14px; font-weight: 800; }
.postgres-logo { color: #477bb2; background: #eff5fb; }
.chroma-logo { color: #845ed0; background: #f5f0ff; }
.service-copy { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.service-copy strong { color: #464b5e; font-size: 10px; font-weight: 600; }
.service-copy small { color: #a0a5b3; font-size: 8px; }
.service-state { display: flex; align-items: center; gap: 6px; color: #7d8496; font-size: 8px; }
.state-dot { width: 6px; height: 6px; box-shadow: none; }
.state-dot.is-offline { background: #d76668; }
.service-foot { display: flex; justify-content: space-between; margin: 2px -19px 0; padding: 10px 19px; border-top: 1px solid #f0f1f5; color: #a2a7b4; font-size: 8px; }
.next-card { display: flex; align-items: center; gap: 12px; min-height: 103px; padding: 15px; background: linear-gradient(110deg,#fff 0%,#fcfbff 100%); }
.next-icon { display: grid; flex: none; width: 37px; height: 37px; place-items: center; border: 1px solid #e8e6fb; border-radius: 9px; color: #685ddd; background: #f3f1ff; }
.next-icon svg { width: 17px; height: 17px; }
.next-copy { flex: 1; }
.next-copy .eyebrow { margin-bottom: 5px; font-size: 7px; }
.next-copy h3 { margin: 0; color: #3a3f52; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 12px; font-weight: 700; }
.next-copy p:last-child { margin: 4px 0 0; color: #9096a7; font-size: 8px; }
.coming-soon { align-self: flex-start; margin-top: 1px; padding: 5px 6px; border-radius: 4px; color: #7d74c8; background: #f2f0ff; font-size: 6px; font-weight: 700; letter-spacing: .5px; white-space: nowrap; }
.dashboard-footer { display: flex; justify-content: space-between; margin-top: 23px; color: #a0a5b3; font-size: 8px; }
.dashboard-footer b { padding: 0 4px; color: #c4c7d0; }
.dashboard-footer span:last-child { display: inline-flex; align-items: center; gap: 7px; }
.dashboard-footer i { width: 5px; height: 5px; border-radius: 50%; background: #45b38e; }

/* Biblioteca documental */
.library-content { max-width: 1240px; }
.library-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.library-heading h1 { margin: 0; color: #30354a; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 27px; letter-spacing: -.8px; }
.library-heading .welcome-copy { margin: 7px 0 0; }
.library-count { display: flex; flex-direction: column; align-items: flex-end; color: #8d93a4; font-size: 10px; }
.library-count strong { color: #3b4055; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 24px; }
.library-flashes { display: grid; gap: 8px; margin-bottom: 14px; }
.library-flash { padding: 11px 14px; border: 1px solid #e4e7ef; border-radius: 7px; color: #555c70; background: #fff; font-size: 11px; }
.library-flash.success { border-color: #cce9dd; color: #367b65; background: #f2fbf7; }
.library-flash.error { border-color: #f0d3d4; color: #9e5054; background: #fff7f7; }
.upload-card, .documents-card { border: 1px solid #eaecf2; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.upload-card { padding: 20px 22px 16px; }
.upload-copy { display: flex; align-items: center; gap: 12px; }
.upload-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #e8e6fb; border-radius: 9px; color: #685ddd; background: #f5f3ff; }
.upload-icon svg, .file-picker svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.upload-copy h2, .documents-card-heading h2 { margin: 0; color: #3b4054; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 15px; }
.upload-copy p { margin: 4px 0 0; color: #989eae; font-size: 10px; }
.upload-form { display: flex; align-items: flex-end; gap: 12px; margin-top: 18px; }
.file-picker { display: flex; flex: 1; align-items: center; gap: 9px; min-width: 140px; height: 39px; padding: 0 12px; border: 1px dashed #d6d9e4; border-radius: 6px; color: #666d80; background: #fbfbfd; cursor: pointer; font-size: 10px; }
.file-picker input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.collection-field { display: flex; flex-direction: column; gap: 5px; width: 170px; color: #858b9c; font-size: 9px; }
.collection-field input { height: 39px; padding: 0 10px; border: 1px solid #e2e4ec; border-radius: 6px; outline: none; color: #4c5265; background: #fff; font: inherit; font-size: 10px; }
.collection-field input:focus { border-color: #8a81df; box-shadow: 0 0 0 3px rgba(104,93,221,.1); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 39px; padding: 0 14px; border: 0; border-radius: 6px; text-decoration: none; cursor: pointer; font: inherit; font-size: 10px; font-weight: 650; }
.button-primary { color: #fff; background: linear-gradient(135deg,#7569dc,#5a4fc9); box-shadow: 0 4px 10px rgba(92,80,201,.18); }
.button-primary:hover { background: #5549c1; }
.upload-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.upload-privacy { display: flex; align-items: center; gap: 6px; margin: 13px 0 0; color: #9b9faf; font-size: 9px; }
.upload-privacy svg { width: 13px; height: 13px; fill: none; stroke: #8c86ce; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.documents-card { margin-top: 16px; overflow: hidden; }
.documents-card-heading { display: flex; align-items: flex-end; justify-content: space-between; padding: 18px 20px 13px; }
.documents-card-heading .eyebrow { margin-bottom: 5px; font-size: 8px; }
.document-total { color: #969cac; font-size: 9px; }
.document-table-wrap { overflow-x: auto; }
.document-table { width: 100%; border-collapse: collapse; text-align: left; }
.document-table th { padding: 10px 14px; border-top: 1px solid #f0f1f5; border-bottom: 1px solid #f0f1f5; color: #9a9faf; background: #fbfbfd; font-size: 8px; font-weight: 700; letter-spacing: .55px; white-space: nowrap; }
.document-table th:first-child, .document-table td:first-child { padding-left: 20px; }
.document-table td { padding: 12px 14px; border-bottom: 1px solid #f1f2f6; color: #636a7c; font-size: 10px; vertical-align: middle; }
.document-table tr:last-child td { border-bottom: 0; }
.document-name-cell { display: flex; align-items: center; gap: 10px; min-width: 190px; }
.pdf-file-icon { display: grid; flex: none; width: 30px; height: 34px; place-items: center; border: 1px solid #f2d8d9; border-radius: 5px; color: #c15e62; background: #fff7f7; font-size: 7px; font-weight: 800; }
.document-name-copy { display: flex; flex-direction: column; gap: 4px; max-width: 260px; }
.document-name-copy strong { overflow: hidden; color: #4a5063; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.document-name-copy small, .status-detail { color: #9ca1af; font-size: 8px; }
.collection-pill { padding: 5px 7px; border-radius: 5px; color: #7168bd; background: #f4f2ff; font-size: 8px; }
.pages-cell { text-align: center; }
.document-status { display: inline-flex; align-items: center; gap: 5px; color: #7e8494; font-size: 9px; white-space: nowrap; }
.document-status i { width: 6px; height: 6px; border-radius: 50%; background: #d1a449; }
.document-status.status-processing i { background: #6a83db; animation: pulse 1.2s infinite; }
.document-status.status-indexed i { background: #43ad88; }
.document-status.status-failed i { background: #ce6668; }
.status-detail { display: block; margin-top: 5px; white-space: nowrap; }
.document-error { max-width: 320px; margin: 6px 0 0; color: #ac5559; font-size: 8px; line-height: 1.4; }
.document-actions { display: flex; align-items: center; gap: 4px; }
.document-actions form { margin: 0; }
.table-action { display: grid; width: 30px; height: 30px; padding: 0; place-items: center; border: 0; border-radius: 5px; color: #7770c9; background: transparent; cursor: pointer; }
.table-action:hover { background: #f4f2ff; }
.table-action svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.empty-library { display: flex; flex-direction: column; align-items: center; padding: 30px 15px 36px; border-top: 1px solid #f0f1f5; text-align: center; }
.empty-file { display: grid; width: 42px; height: 46px; margin-bottom: 12px; place-items: center; border: 1px solid #e8e7f4; border-radius: 8px; color: #8c83d5; background: #f8f7ff; }
.empty-file svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }
.empty-library strong { color: #4b5062; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 12px; }
.empty-library p { max-width: 340px; margin: 5px 0 0; color: #969cac; font-size: 9px; line-height: 1.5; }
.redis-logo { color: #b45442; background: #fff2ef; }
.mcp-logo { color: #468a72; background: #eef8f3; }

.users-page > .welcome-row { margin-bottom: 22px; }
.user-create-card, .users-card, .token-reveal { margin-bottom: 16px; padding: 22px 24px; border: 1px solid #eaecf2; border-radius: 10px; background: #fff; box-shadow: 0 2px 8px rgba(27,32,58,.018); }
.user-create-card { display: grid; grid-template-columns: minmax(230px,.9fr) minmax(300px,1.1fr); align-items: center; gap: 24px; }
.user-create-card h2, .users-card h2, .token-reveal h2 { margin: 0; color: #373c50; font-family: 'Avenir Next', Avenir, sans-serif; font-size: 16px; letter-spacing: -.3px; }
.user-create-card p:not(.eyebrow), .token-reveal p { margin: 7px 0 0; color: #858b9d; font-size: 11px; line-height: 1.55; }
.user-create-form { display: flex; flex-direction: column; gap: 7px; }
.user-create-form label { color: #555b6e; font-size: 10px; font-weight: 600; }
.user-create-row { display: flex; gap: 9px; }
.user-create-row input, .token-copy-row input { min-width: 0; height: 41px; padding: 0 12px; border: 1px solid #e2e5ed; border-radius: 7px; color: #30354a; background: #fff; font-size: 11px; }
.user-create-row input { flex: 1; }
.user-create-row .button, .token-copy-row .button { min-height: 41px; padding: 0 14px; white-space: nowrap; font-size: 11px; }
.user-create-form > small { color: #989eae; font-size: 9px; }
.users-card { padding: 0; overflow: hidden; }
.users-card-heading { padding: 20px 22px 15px; }
.users-card-heading .eyebrow { margin-bottom: 7px; }
.users-table-wrap { overflow-x: auto; }
.users-table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; }
.users-table th { padding: 10px 14px; border-top: 1px solid #eff0f4; border-bottom: 1px solid #eff0f4; color: #989eae; background: #fafbfc; font-size: 8px; font-weight: 700; letter-spacing: .75px; }
.users-table th:first-child, .users-table td:first-child { padding-left: 22px; }
.users-table td { padding: 13px 14px; border-bottom: 1px solid #f0f1f5; color: #747b8e; font-size: 10px; }
.users-table tbody tr:last-child td { border-bottom: 0; }
.users-table td strong { color: #41465a; font-weight: 600; }
.users-table code { color: #777d90; font-size: 10px; }
.user-state { display: inline-flex; align-items: center; gap: 7px; }
.user-state i { width: 7px; height: 7px; border-radius: 50%; background: #32aa82; }
.user-inactive i { background: #a5a9b5; }
.user-active { color: #3c9879; }
.user-inactive { color: #878d9e; }
.user-actions { display: flex; align-items: center; gap: 12px; }
.user-actions form { margin: 0; }
.table-action-text { padding: 4px 0; border: 0; color: #5e55cf; background: transparent; cursor: pointer; font-size: 9px; font-weight: 600; }
.table-action-text:hover { color: #3f37a5; text-decoration: underline; }
.user-actions form:first-child button { color: #a65252; }
.user-actions .table-action-delete { color: #bd3e4d; }
.user-actions .table-action-delete:hover { color: #922638; }
.user-empty { padding: 35px 20px; }
.users-empty { padding: 36px 22px; border-top: 1px solid #eff0f4; text-align: center; }
.users-empty strong { color: #4b5062; font-size: 12px; }
.users-empty p { margin: 7px 0 0; color: #969cac; font-size: 10px; }
.token-reveal { border-color: #e9dcae; background: #fffcf1; }
.token-reveal-heading { display: flex; align-items: flex-start; gap: 11px; }
.token-alert-icon { display: grid; flex: none; width: 24px; height: 24px; place-items: center; border-radius: 50%; color: #8c6922; background: #f4e9bf; font-size: 13px; font-weight: 700; }
.token-copy-row { display: flex; gap: 9px; margin-top: 16px; }
.token-copy-row input { flex: 1; color: #36394a; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.token-instructions { overflow-wrap: anywhere; }
.token-instructions code { color: #5149b6; font-size: 10px; }
.user-flashes { margin-bottom: 14px; }
.user-flashes .form-alert { margin: 0 0 8px; }
.user-flashes .form-alert.success { border-color: #d6eee4; color: #317d65; background: #f1fbf6; }

@keyframes pulse { 50% { opacity: .35; } }

@media (max-width: 1050px) {
  .login-layout { grid-template-columns: minmax(410px,.95fr) minmax(390px,1.05fr); }
  .login-main { padding-right: 42px; padding-left: 42px; }
  .login-aside { padding-right: 42px; padding-left: 42px; }
  .aside-bottom { right: 42px; left: 42px; }
  .sidebar { width: 220px; }
  .main-content { width: calc(100% - 220px); margin-left: 220px; }
  .topbar { padding: 0 28px; }
  .page-content { padding: 32px 28px 24px; }
  .content-grid { grid-template-columns: minmax(0,1fr) minmax(285px,.95fr); }
}
@media (max-width: 800px) {
  .login-page { padding: 0; background: white; }
  .login-layout { display: block; min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
  .login-main { min-height: 100vh; padding: 25px 28px 22px; }
  .login-content { margin: auto; padding: 55px 0; }
  .login-aside { display: none; }
  .main-content { width: calc(100% - 70px); margin-left: 70px; }
  .sidebar { width: 70px; align-items: center; padding: 19px 8px 13px; }
  .sidebar-brand { margin: 0 0 44px; }
  .sidebar-brand .brand-name, .nav-section-label, .nav-link span, .nav-link small, .sidebar-help, .profile-copy, .sidebar-profile form { display: none; }
  .side-nav { width: 100%; align-items: center; }
  .nav-link { justify-content: center; width: 42px; padding: 0; }
  .sidebar-bottom { width: 100%; }
  .sidebar-profile { justify-content: center; padding-top: 12px; }
  .topbar { height: 53px; padding: 0 18px; }
  .topbar-date { display: none; }
  .page-content { padding: 26px 18px 20px; }
  .content-grid { grid-template-columns: 1fr; }
  .setup-card { min-height: 320px; }
  .user-create-card { grid-template-columns: 1fr; gap: 17px; }
}
@media (max-width: 560px) {
  .stat-grid { grid-template-columns: 1fr; gap: 9px; }
  .stat-card { min-height: 99px; }
  .welcome-row { align-items: flex-start; flex-direction: column; }
  .welcome-chip { margin: 0; }
  .welcome-row h1 { font-size: 24px; }
  .welcome-copy { max-width: 290px; line-height: 1.55; }
  .mcp-endpoint-card { align-items: stretch; flex-direction: column; gap: 12px; padding: 16px; }
  .mcp-endpoint-control { min-width: 0; }
  .mcp-endpoint-control .button { padding: 0 10px; }
  .catalog-grid { grid-template-columns: 1fr; }
  .catalog-summary { flex-wrap: wrap; }
  .catalog-summary small { flex-basis: 100%; margin-left: 0; }
  .topbar-meta { gap: 0; }
  .live-indicator { font-size: 7px; }
  .dashboard-footer { flex-direction: column; gap: 8px; }
  .setup-card { padding-right: 16px; padding-left: 16px; }
  .library-heading { align-items: flex-start; }
  .library-heading h1 { font-size: 22px; }
  .library-count { display: none; }
  .upload-card { padding: 16px; }
  .upload-form { align-items: stretch; flex-direction: column; }
  .collection-field { width: 100%; }
  .upload-button { width: 100%; }
  .document-table th, .document-table td { padding-right: 10px; padding-left: 10px; }
  .user-create-card, .token-reveal { padding: 17px; }
  .user-create-row { align-items: stretch; flex-direction: column; }
  .token-copy-row { align-items: stretch; flex-direction: column; }
  .token-copy-row .button { width: 100%; }
}