:root {
  --brand: #092f67;
  --brand-2: #104e98;
  --brand-soft: #eaf2fc;
  --accent: #ef3b2d;
  --accent-dark: #ca2f23;
  --accent-soft: #fff0ee;
  --ink: #172033;
  --muted: #68758a;
  --line: #dfe6ef;
  --panel: #ffffff;
  --bg: #f4f7fb;
  --success: #11865b;
  --warning: #c37800;
  --danger: #c92a2a;
  --shadow: 0 18px 50px rgba(20, 44, 82, .08);
  --shadow-soft: 0 8px 25px rgba(20, 44, 82, .06);
  --radius: 18px;
  --radius-sm: 12px;
  --sidebar: 270px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body { margin: 0; min-height: 100vh; color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
svg { fill: currentColor; }

/* Login */
.login-body { background: #f7f9fc; }
.login-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(480px, 1.1fr) minmax(440px, .9fr); }
.login-brand-panel { position: relative; overflow: hidden; display: flex; align-items: center; padding: 70px clamp(45px, 7vw, 120px); color: white; background: linear-gradient(138deg, #061d42 0%, #092f67 48%, #1258a8 100%); }
.login-brand-panel::before { content: ""; position: absolute; width: 560px; height: 560px; border: 90px solid rgba(255,255,255,.045); border-radius: 50%; top: -230px; right: -180px; }
.login-brand-panel::after { content: ""; position: absolute; width: 320px; height: 320px; background: rgba(239,59,45,.19); border-radius: 45% 55% 68% 32%; bottom: -160px; left: -70px; transform: rotate(27deg); }
.brand-panel-inner { position: relative; z-index: 1; max-width: 690px; }
.login-logo { width: min(430px, 100%); margin-bottom: 86px; }
.brand-kicker { margin: 0 0 14px; color: #ff938b; font-size: 13px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.login-brand-panel h1 { margin: 0; max-width: 660px; font-size: clamp(38px, 4vw, 64px); line-height: 1.06; letter-spacing: -.045em; }
.brand-copy { max-width: 600px; margin: 26px 0 40px; color: rgba(255,255,255,.75); font-size: 18px; line-height: 1.7; }
.login-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.login-feature-grid div { padding: 18px 20px; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; background: rgba(255,255,255,.07); backdrop-filter: blur(8px); }
.login-feature-grid strong, .login-feature-grid span { display: block; }
.login-feature-grid strong { margin-bottom: 6px; font-size: 17px; }
.login-feature-grid span { color: rgba(255,255,255,.68); font-size: 13px; line-height: 1.45; }
.login-form-panel { display: flex; align-items: center; justify-content: center; padding: 50px; }
.login-card { width: min(440px, 100%); }
.mobile-login-brand { display: none; }
.login-card h2 { margin: 16px 0 8px; font-size: 34px; letter-spacing: -.035em; }
.login-card > p { margin: 0 0 28px; color: var(--muted); }
.login-note { margin-top: 22px !important; text-align: center; font-size: 13px; }
.pill { display: inline-flex; padding: 7px 11px; color: var(--brand); background: var(--brand-soft); border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

/* Application shell */
.app-body { background: var(--bg); }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) 1fr; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 50; width: var(--sidebar); display: flex; flex-direction: column; padding: 26px 18px 20px; color: white; background: linear-gradient(180deg, color-mix(in srgb, var(--user-theme) 62%, black) 0%, var(--user-theme) 60%, color-mix(in srgb, var(--user-theme) 75%, black) 100%); box-shadow: 10px 0 40px rgba(8, 31, 66, .13); }
.brand { display: block; padding: 0 7px 30px; }
.brand img { display: block; width: 218px; filter: brightness(0) invert(1); }
.nav-list { display: grid; gap: 7px; }
.nav-item { display: flex; align-items: center; gap: 13px; padding: 13px 14px; color: rgba(255,255,255,.72); border-radius: 12px; font-size: 14px; font-weight: 650; transition: .18s ease; }
.nav-item:hover { color: white; background: rgba(255,255,255,.08); }
.nav-item.active { color: white; background: linear-gradient(90deg, rgba(239,59,45,.96), rgba(226,54,40,.82)); box-shadow: 0 9px 25px rgba(239,59,45,.2); }
.nav-icon { width: 22px; height: 22px; display: grid; place-items: center; }
.nav-icon svg { width: 20px; height: 20px; }
.sidebar-footer { margin-top: auto; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.mini-profile { display: flex; align-items: center; gap: 11px; min-width: 0; }
.mini-profile-text { min-width: 0; }
.mini-profile-text strong, .mini-profile-text span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-profile-text strong { font-size: 13px; }
.mini-profile-text span { margin-top: 3px; color: rgba(255,255,255,.56); font-size: 11px; text-transform: capitalize; }
.logout-button { width: 100%; margin-top: 13px; padding: 9px; border: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.74); background: transparent; border-radius: 9px; font-size: 12px; }
.logout-button:hover { color: white; background: rgba(255,255,255,.07); }
.main-content { grid-column: 2; min-width: 0; }
.topbar { min-height: 116px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 26px clamp(28px, 4vw, 58px); background: rgba(255,255,255,.92); border-bottom: 1px solid rgba(217,226,239,.75); backdrop-filter: blur(12px); }
.eyebrow { margin: 0 0 5px; color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.topbar h1 { margin: 0; font-size: 29px; letter-spacing: -.035em; }
.page-description { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.page-content { padding: 34px clamp(28px, 4vw, 58px) 60px; }
.mobile-menu { display: none; width: 42px; height: 42px; border: 1px solid var(--line); color: var(--brand); background: white; border-radius: 10px; }
.mobile-menu svg { width: 22px; }

/* Shared UI */
.panel { background: var(--panel); border: 1px solid rgba(217,226,239,.9); border-radius: var(--radius); box-shadow: var(--shadow-soft); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 25px 26px 17px; }
.panel-heading h2, .section-heading h2 { margin: 3px 0 0; font-size: 19px; letter-spacing: -.025em; }
.panel-kicker { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 15px; border: 1px solid transparent; border-radius: 10px; font-size: 13px; font-weight: 750; transition: .16s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: white; background: linear-gradient(135deg, var(--accent), #ff5547); box-shadow: 0 8px 19px rgba(239,59,45,.19); }
.button-primary:hover { background: var(--accent-dark); }
.button-secondary { color: var(--brand); background: var(--brand-soft); border-color: #d2e2f5; }
.button-ghost { color: var(--muted); background: white; border-color: var(--line); }
.button-danger-ghost { color: var(--danger); background: #fff5f5; border-color: #ffd8d8; }
.button-large { min-height: 48px; padding-inline: 22px; }
.button-full { width: 100%; }
.button-with-icon svg { width: 17px; height: 17px; flex: 0 0 auto; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.text-link { color: var(--brand-2); font-size: 13px; font-weight: 750; }
.tag { display: inline-flex; align-items: center; padding: 6px 9px; color: #57657b; background: #f1f4f8; border-radius: 7px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.tag-accent { color: var(--brand); background: var(--brand-soft); }
.tag-row { display: flex; flex-wrap: wrap; gap: 7px; }
.avatar { flex: 0 0 auto; width: 38px; height: 38px; display: grid; place-items: center; color: white; background: linear-gradient(145deg, #2f6fb8, var(--brand)); border-radius: 11px; font-size: 12px; font-weight: 850; }
.avatar-small { width: 34px; height: 34px; border-radius: 10px; font-size: 11px; }
.avatar-tiny { width: 29px; height: 29px; border-radius: 8px; font-size: 9px; }
.alert { margin-bottom: 22px; padding: 14px 17px; border-radius: 12px; font-size: 13px; line-height: 1.55; }
.alert ul { margin: 7px 0 0 18px; padding: 0; }
.alert-error { color: #8a2525; background: #fff1f1; border: 1px solid #ffd4d4; }
.alert-success { color: #0b704c; background: #edfbf5; border: 1px solid #c5f1df; }
.empty-state { min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; padding: 45px; color: var(--muted); text-align: center; background: white; border: 1px dashed #ccd7e5; border-radius: var(--radius); }
.empty-state strong { color: var(--ink); font-size: 18px; }
.empty-state .button { margin-top: 12px; }
.empty-icon { width: 55px; height: 55px; display: grid; place-items: center; color: var(--accent); background: var(--accent-soft); border-radius: 17px; font-size: 27px; }
.empty-state.compact { min-height: 190px; background: transparent; border: 0; }
.muted { color: var(--muted); font-size: 13px; line-height: 1.6; }
.toast { position: fixed; right: 28px; bottom: 28px; z-index: 100; max-width: 330px; padding: 13px 17px; color: white; background: #17385e; border-radius: 11px; box-shadow: var(--shadow); opacity: 0; transform: translateY(15px); pointer-events: none; transition: .2s ease; font-size: 13px; font-weight: 700; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: var(--danger); }

/* Forms */
.stack-form, .field { display: grid; gap: 8px; }
.stack-form { gap: 19px; }
.field > span { color: #344157; font-size: 12px; font-weight: 750; }
.field input, .field textarea, .field select, .filter-panel input, .filter-panel select { width: 100%; color: var(--ink); background: white; border: 1px solid #d6dfeb; border-radius: 10px; outline: none; transition: .16s ease; }
.field input, .field select { min-height: 44px; padding: 10px 12px; }
.field textarea { min-height: 170px; padding: 14px; line-height: 1.65; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus, .filter-panel input:focus, .filter-panel select:focus { border-color: #6e9fd5; box-shadow: 0 0 0 4px rgba(34,100,173,.1); }
.field small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.form-grid { display: grid; gap: 20px; }
.two-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
.account-form { max-width: 960px; padding: 28px; }
.switch-field { display: flex; align-items: center; gap: 13px; align-self: end; min-height: 64px; padding: 11px 13px; background: #f8fafc; border: 1px solid var(--line); border-radius: 11px; }
.switch-field input { position: absolute; opacity: 0; }
.switch { position: relative; width: 42px; height: 24px; flex: 0 0 auto; background: #bbc6d3; border-radius: 999px; transition: .2s; }
.switch::after { content: ""; position: absolute; width: 18px; height: 18px; top: 3px; left: 3px; background: white; border-radius: 50%; box-shadow: 0 2px 5px rgba(0,0,0,.15); transition: .2s; }
.switch-field input:checked + .switch { background: var(--success); }
.switch-field input:checked + .switch::after { transform: translateX(18px); }
.switch-field strong, .switch-field small { display: block; }
.switch-field strong { font-size: 13px; }
.switch-field small { margin-top: 3px; color: var(--muted); font-size: 11px; }

/* Dashboard */
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 22px; }
.metric-card { min-height: 133px; display: flex; align-items: center; gap: 16px; padding: 22px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-soft); }
.metric-card-featured { color: white; background: linear-gradient(140deg, #08285a, #0f4e97); border: 0; }
.metric-icon { width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; color: var(--brand); background: var(--brand-soft); border-radius: 13px; }
.metric-icon svg { width: 24px; height: 24px; }
.metric-card-featured .metric-icon { color: white; background: rgba(255,255,255,.13); }
.metric-card span, .metric-card small, .metric-card strong { display: block; }
.metric-card span { color: var(--muted); font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.metric-card-featured span, .metric-card-featured small { color: rgba(255,255,255,.66); }
.metric-card strong { margin: 4px 0 3px; font-size: 30px; letter-spacing: -.04em; }
.metric-card strong.metric-text { max-width: 145px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 19px; }
.metric-card small { color: #8a95a7; font-size: 10px; }
.dashboard-grid { display: grid; gap: 22px; margin-bottom: 22px; }
.dashboard-grid-main { grid-template-columns: minmax(0, 1.55fr) minmax(320px, .75fr); }
.dashboard-grid-bottom { grid-template-columns: minmax(0, 1.45fr) minmax(320px, .85fr); }
.chart-panel { min-height: 390px; }
.bar-chart { height: 285px; display: flex; align-items: end; gap: clamp(12px, 3vw, 32px); padding: 25px 32px 23px; }
.bar-column { flex: 1; height: 100%; display: grid; grid-template-rows: 21px 1fr 20px; gap: 6px; align-items: end; text-align: center; }
.bar-track { width: min(44px, 75%); height: 100%; justify-self: center; display: flex; align-items: end; overflow: hidden; background: #edf2f8; border-radius: 10px 10px 4px 4px; }
.bar-fill { width: 100%; min-height: 9px; background: linear-gradient(180deg, #ef3b2d, #ff776c); border-radius: 10px 10px 4px 4px; box-shadow: 0 -7px 16px rgba(239,59,45,.12); }
.bar-value { color: var(--brand); font-size: 11px; font-weight: 800; }
.bar-label { color: var(--muted); font-size: 11px; font-weight: 700; }
.leaderboard { padding: 1px 20px 21px; }
.leader-row { display: grid; grid-template-columns: 24px 34px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 13px 5px; border-bottom: 1px solid #edf1f5; }
.leader-row:last-child { border: 0; }
.rank { color: #98a3b1; font-size: 12px; font-weight: 850; text-align: center; }
.leader-info { min-width: 0; }
.leader-info strong, .leader-info span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.leader-info strong { font-size: 13px; }
.leader-info span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.score { min-width: 31px; padding: 6px 8px; color: var(--accent); background: var(--accent-soft); border-radius: 8px; text-align: center; font-size: 12px; }
.prompt-feed { padding: 0 22px 20px; }
.prompt-feed-item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 14px 5px; border-bottom: 1px solid #edf1f5; }
.prompt-feed-item:last-child { border: 0; }
.prompt-feed-item:hover strong { color: var(--brand-2); }
.prompt-feed-icon { width: 40px; height: 40px; display: grid; place-items: center; color: var(--brand); background: var(--brand-soft); border-radius: 11px; }
.prompt-feed-icon svg { width: 20px; }
.prompt-feed-copy { min-width: 0; }
.prompt-feed-copy strong, .prompt-feed-copy span, .prompt-feed-meta strong, .prompt-feed-meta span { display: block; }
.prompt-feed-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.prompt-feed-copy span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.prompt-feed-meta { text-align: right; }
.prompt-feed-meta strong { color: var(--brand); font-size: 15px; }
.prompt-feed-meta span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.distribution-list { display: grid; gap: 22px; padding: 5px 26px 26px; }
.distribution-row > div:first-child { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.distribution-row strong { font-size: 12px; }
.distribution-row span { color: var(--muted); font-size: 10px; }
.progress { height: 7px; overflow: hidden; background: #edf2f7; border-radius: 999px; }
.progress span { height: 100%; display: block; background: linear-gradient(90deg, var(--brand-2), #4c87c8); border-radius: inherit; }

/* Prompt library */
.filter-panel { display: grid; grid-template-columns: minmax(260px, 1.7fr) repeat(4, minmax(125px, .65fr)) auto auto; gap: 10px; padding: 16px; background: white; border: 1px solid var(--line); border-radius: 15px; box-shadow: var(--shadow-soft); }
.filter-panel input, .filter-panel select { min-height: 40px; padding: 8px 10px; font-size: 12px; }
.search-field { position: relative; }
.search-field svg { position: absolute; left: 12px; top: 50%; width: 17px; color: #8290a3; transform: translateY(-50%); }
.search-field input { padding-left: 38px; }
.library-summary { margin: 20px 2px 13px; color: var(--muted); font-size: 12px; }
.library-summary strong { color: var(--ink); }
.prompt-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.prompt-card { min-height: 320px; display: flex; flex-direction: column; gap: 17px; padding: 21px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-soft); transition: .17s ease; }
.prompt-card:hover { transform: translateY(-3px); border-color: #c8d7e8; box-shadow: var(--shadow); }
.prompt-card-top { display: flex; justify-content: space-between; align-items: center; }
.status-dot { display: inline-flex; align-items: center; gap: 6px; color: #596678; font-size: 9px; font-weight: 850; letter-spacing: .07em; }
.status-dot::before { content: ""; width: 7px; height: 7px; background: #aab4c0; border-radius: 50%; }
.status-published::before { background: #18a66d; box-shadow: 0 0 0 4px #e6f8f0; }
.status-draft::before { background: #d68c13; box-shadow: 0 0 0 4px #fff5df; }
.status-archived::before { background: #9ca6b3; box-shadow: 0 0 0 4px #f0f2f4; }
.visibility { color: #8b96a6; font-size: 9px; font-weight: 800; letter-spacing: .06em; }
.prompt-model { display: inline-block; margin-bottom: 8px; color: var(--accent); font-size: 10px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.prompt-card h2 { margin: 0; font-size: 18px; line-height: 1.3; letter-spacing: -.025em; }
.prompt-card h2 a:hover { color: var(--brand-2); }
.prompt-card p { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.prompt-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 15px; border-top: 1px solid #edf1f5; }
.owner-chip { display: flex; align-items: center; gap: 9px; min-width: 0; }
.owner-chip > div { min-width: 0; }
.owner-chip strong, .owner-chip span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.owner-chip strong { font-size: 11px; }
.owner-chip span { margin-top: 2px; color: var(--muted); font-size: 9px; }
.usage-count { flex: 0 0 auto; text-align: right; }
.usage-count strong, .usage-count span { display: block; }
.usage-count strong { color: var(--brand); font-size: 15px; }
.usage-count span { color: var(--muted); font-size: 8px; text-transform: uppercase; }

/* Editor */
.editor-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .68fr); align-items: start; gap: 22px; }
.editor-main { padding: 27px; }
.editor-sidebar { display: grid; gap: 18px; }
.editor-sidebar .panel { padding: 23px; }
.section-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 25px; }
.section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.compact-heading { margin-bottom: 20px; }
.step-number { width: 29px; height: 29px; flex: 0 0 auto; display: grid; place-items: center; color: white; background: var(--brand); border-radius: 9px; font-size: 11px; font-weight: 850; }
.editor-main .field + .field, .editor-sidebar .field + .field { margin-top: 18px; }
.info-box { margin: 18px 0; padding: 12px; color: #4b5b70; background: #f3f7fb; border-left: 3px solid var(--brand-2); border-radius: 8px; font-size: 11px; line-height: 1.55; }

/* Prompt details */
.detail-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .68fr); align-items: start; gap: 22px; }
.prompt-detail-main { padding: 29px; }
.prompt-detail-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.prompt-detail-heading h2 { max-width: 750px; margin: 0; font-size: 27px; line-height: 1.2; letter-spacing: -.035em; }
.prompt-content-box { margin-top: 25px; padding: 24px; color: #28364a; background: #f7f9fc; border: 1px solid #e2e8f0; border-radius: 13px; white-space: pre-wrap; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 13px; line-height: 1.75; }
.prompt-content-frame { position: relative; margin-top: 25px; overflow: visible; background: #f7f9fc; border: 1px solid #e2e8f0; border-radius: 13px; }
.prompt-content-toolbar { position: sticky; top: 12px; z-index: 12; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 14px; background: rgba(255,255,255,.96); border-bottom: 1px solid #e2e8f0; border-radius: 12px 12px 0 0; box-shadow: 0 7px 20px rgba(20,44,82,.06); backdrop-filter: blur(12px); }
.prompt-content-toolbar strong,.prompt-content-toolbar small { display: block; }
.prompt-content-toolbar strong { color: #24344c; font-size: 11px; letter-spacing: .02em; }
.prompt-content-toolbar small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.prompt-content-box-main { min-height: 220px; margin-top: 0; border: 0; border-radius: 0 0 13px 13px; }
.prompt-copy-icon { position: relative; width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; color: var(--brand); background: var(--brand-soft); border: 1px solid #cfdef0; border-radius: 10px; transition: .16s ease; }
.prompt-copy-icon:hover { color: white; background: var(--brand); border-color: var(--brand); transform: translateY(-1px); box-shadow: 0 8px 18px rgba(15,65,125,.18); }
.prompt-copy-icon svg { width: 18px; height: 18px; }
.prompt-copy-icon.is-copied { color: white; background: var(--success); border-color: var(--success); }
.button.is-copied { color: white; background: var(--success); border-color: var(--success); box-shadow: 0 8px 19px rgba(17,134,91,.18); }
.detail-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

.detail-sidebar { display: grid; gap: 18px; }
.detail-sidebar .panel { padding: 22px; }
.detail-sidebar h3 { margin: 0 0 17px; font-size: 15px; }
.meta-list { margin: 0; }
.meta-list > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid #edf1f5; }
.meta-list > div:last-child { border: 0; }
.meta-list dt { color: var(--muted); font-size: 10px; font-weight: 700; }
.meta-list dd { margin: 0; font-size: 11px; font-weight: 700; text-align: right; }
.meta-list dd small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; font-weight: 500; }
.big-inline { color: var(--brand); font-size: 18px; }
.activity-list { display: grid; gap: 11px; }
.activity-item { display: flex; align-items: center; gap: 9px; }
.activity-item strong, .activity-item span { display: block; }
.activity-item strong { font-size: 11px; }
.activity-item span { margin-top: 2px; color: var(--muted); font-size: 9px; }

/* Tables */
.table-panel { overflow: hidden; }
.table-responsive { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table th { padding: 15px 17px; color: #788497; background: #f8fafc; border-bottom: 1px solid var(--line); text-align: left; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.data-table td { padding: 15px 17px; border-bottom: 1px solid #edf1f5; vertical-align: middle; white-space: nowrap; }
.data-table tr:last-child td { border: 0; }
.data-table tbody tr:hover { background: #fbfcfe; }
.table-subtext { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.icon-button { display: inline-flex; padding: 7px 10px; color: var(--brand); background: var(--brand-soft); border-radius: 8px; font-size: 10px; font-weight: 800; }

/* Error */
.error-body { display: grid; place-items: center; padding: 30px; background: var(--bg); }
.error-card { width: min(500px, 100%); padding: 45px; background: white; border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); text-align: center; }
.error-card img { width: 250px; margin-bottom: 30px; }
.error-code { display: block; color: var(--accent); font-size: 54px; font-weight: 900; letter-spacing: -.05em; }
.error-card h1 { margin: 3px 0 8px; }
.error-card p { margin: 0 0 23px; color: var(--muted); line-height: 1.6; }

@media (max-width: 1250px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prompt-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-panel { grid-template-columns: minmax(240px, 1.5fr) repeat(3, minmax(130px, .7fr)); }
  .filter-panel select[name="user"] { display: none; }
}

@media (max-width: 1050px) {
  .login-layout { grid-template-columns: 1fr; }
  .login-brand-panel { display: none; }
  .login-form-panel { min-height: 100vh; }
  .mobile-login-brand { display: block; margin-bottom: 35px; }
  .mobile-login-brand img { width: 270px; }
  .dashboard-grid-main, .dashboard-grid-bottom, .detail-layout, .editor-layout { grid-template-columns: 1fr; }
  .detail-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
  .app-shell { display: block; }
  .sidebar { transform: translateX(-105%); transition: transform .22s ease; }
  .sidebar.open { transform: translateX(0); }
  .main-content { width: 100%; }
  .mobile-menu { display: grid; place-items: center; flex: 0 0 auto; }
  .topbar { justify-content: flex-start; padding: 20px 22px; }
  .topbar-actions { margin-left: auto; }
  .page-content { padding: 25px 22px 45px; }
  .filter-panel { grid-template-columns: 1fr 1fr; }
  .search-field { grid-column: 1 / -1; }
  .filter-panel select[name="user"] { display: block; }
}

@media (max-width: 650px) {
  .login-form-panel { padding: 28px; }
  .topbar { flex-wrap: wrap; }
  .topbar > div:nth-child(2) { flex: 1; }
  .topbar-actions { width: 100%; margin: 0; padding-left: 52px; }
  .topbar-actions .button { width: 100%; }
  .metric-grid, .prompt-card-grid, .two-column, .detail-sidebar { grid-template-columns: 1fr; }
  .filter-panel { grid-template-columns: 1fr; }
  .search-field { grid-column: auto; }
  .metric-card { min-height: 116px; }
  .bar-chart { gap: 9px; padding-inline: 18px; }
  .bar-track { width: 25px; }
  .prompt-detail-heading { display: block; }
  .prompt-detail-heading .tag-row { margin-top: 16px; }
  .prompt-detail-main, .editor-main { padding: 21px; }
  .meta-list > div { grid-template-columns: 95px minmax(0, 1fr); }
  .form-actions { flex-direction: column-reverse; }
  .form-actions .button { width: 100%; }
}

/* Phase 2 Knowledge Sharing */
.favorite-button { border: 0; background: transparent; color: #9aa5b3; font-size: 22px; cursor: pointer; line-height: 1; }
.favorite-button.active { color: #f4a31f; }
.knowledge-stats { display: flex; flex-wrap: wrap; gap: 12px; padding: 10px 0; color: var(--muted); font-size: 10px; font-weight: 700; border-top: 1px solid #edf1f5; }
.knowledge-heading { margin-top: 30px; padding-top: 25px; border-top: 1px solid var(--line); }
.prompt-detail-stack { display: grid; gap: 18px; min-width: 0; }
.knowledge-panel { padding: 24px; }
.knowledge-content { white-space: pre-wrap; line-height: 1.7; color: #344054; font-size: 13px; }
.rating-form { display: grid; grid-template-columns: 130px minmax(200px,1fr) auto; align-items: end; gap: 12px; }
.rating-comment { margin: 0; }
.rating-list { display: grid; gap: 9px; margin-top: 18px; }
.rating-list > div { padding: 12px 14px; background: #f8fafc; border-radius: 10px; }
.rating-list strong, .rating-list span { display: block; }
.rating-list strong { font-size: 11px; }
.rating-list span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.version-list { display: grid; gap: 9px; }
.version-list details { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.version-list summary { padding: 13px 15px; cursor: pointer; font-size: 11px; font-weight: 800; background: #f8fafc; }
.version-list summary small { display: block; margin-top: 4px; color: var(--muted); font-weight: 500; }
.version-content { padding: 15px; }
.version-content pre { margin: 10px 0 0; white-space: pre-wrap; font-family: inherit; color: #465467; font-size: 11px; line-height: 1.6; }
@media (max-width: 650px) { .rating-form { grid-template-columns: 1fr; } }

/* Phase 3: Training & company branding */
.alert-success { color: #0b6b47; background: #e8f8f1; border: 1px solid #bdebd7; }
.form-grid.two-columns { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.logo-preview { min-height:130px; display:grid; place-items:center; margin-bottom:18px; padding:20px; background:#f5f8fc; border:1px dashed #c8d4e3; border-radius:14px; }
.logo-preview img { max-width:240px; max-height:100px; object-fit:contain; }
.check-field { display:flex; align-items:center; gap:9px; margin:16px 0; font-size:12px; }
.check-field input { width:16px; height:16px; }
.field small { display:block; margin-top:6px; color:var(--muted); font-size:10px; }
.training-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.training-card { display:flex; flex-direction:column; min-height:280px; padding:22px; }
.training-card-top,.training-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.training-card h2 { margin:22px 0 10px; font-size:19px; }
.training-card p { color:var(--muted); font-size:12px; line-height:1.65; }
.training-meta { margin-top:auto; padding:18px 0 14px; border-top:1px solid var(--line); color:var(--muted); font-size:10px; }
.training-content { white-space:pre-wrap; font-size:14px; line-height:1.85; color:#26364a; }
@media (max-width: 1050px) { .training-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) { .training-grid,.form-grid.two-columns { grid-template-columns:1fr; } }
.featured-prompt { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; padding:24px 27px; background:linear-gradient(135deg,#eef5ff,#fff); border-color:#cdddf0; }
.featured-prompt h2 { margin:5px 0 6px; font-size:21px; }
.featured-prompt p { margin:0; color:var(--muted); font-size:11px; }
@media (max-width:700px){.featured-prompt{align-items:flex-start;flex-direction:column}}

/* Phase 4: personal profiles and themes */
.avatar-image{object-fit:cover;display:block;padding:0;border:2px solid rgba(255,255,255,.22)}
.profile-layout{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:22px;align-items:start}
.profile-card{text-align:center}.profile-avatar-large{width:128px;height:128px;object-fit:cover;border-radius:32px;margin:0 auto 18px;box-shadow:0 18px 40px rgba(18,32,54,.18);border:5px solid white}.profile-card h2{margin:0 0 5px}.profile-card p{color:var(--muted);margin:0 0 14px}
.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:8px}.theme-option{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}.theme-option input{width:auto}.theme-swatch{width:28px;height:28px;border-radius:9px;background:var(--swatch);box-shadow:inset 0 0 0 2px rgba(255,255,255,.45)}.theme-option:has(input:checked){border-color:var(--swatch);box-shadow:0 0 0 3px color-mix(in srgb,var(--swatch) 16%,transparent)}
.person-inline,.person-line{display:flex;align-items:center;gap:9px}.person-line>div{min-width:0}.check-row{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}.check-row input{width:auto}
.app-body .button-primary{background:linear-gradient(135deg,var(--user-theme),color-mix(in srgb,var(--user-theme) 75%,white))}.app-body .nav-item.active{background:color-mix(in srgb,var(--user-theme) 68%,white)}.app-body .metric-card-featured{background:linear-gradient(140deg,color-mix(in srgb,var(--user-theme) 70%,black),var(--user-theme))}
@media(max-width:760px){.profile-layout{grid-template-columns:1fr}.theme-grid{grid-template-columns:1fr}}

/* Phase 5 — AI Knowledge Builder */
.knowledge-hero { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.7fr); gap:28px; align-items:center; padding:28px; margin-bottom:22px; overflow:hidden; background:linear-gradient(135deg,#fff 0%,color-mix(in srgb,var(--user-theme) 7%,white) 100%); }
.knowledge-hero h2 { margin:12px 0 8px; font-size:25px; letter-spacing:-.035em; }
.knowledge-hero p { max-width:760px; margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.knowledge-service-account { display:grid; gap:8px; padding:18px; background:rgba(255,255,255,.8); border:1px solid var(--line); border-radius:14px; }
.knowledge-service-account small { color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.knowledge-service-account strong { overflow-wrap:anywhere; font-size:12px; line-height:1.55; }
.knowledge-service-account .button { justify-self:start; }
.knowledge-project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.knowledge-project-card { min-height:275px; display:flex; flex-direction:column; gap:20px; padding:22px; transition:.18s ease; }
.knowledge-project-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
.knowledge-project-card h2 { margin:5px 0 9px; font-size:19px; letter-spacing:-.03em; }
.knowledge-project-card h2 a:hover { color:var(--brand); }
.knowledge-project-card p:not(.eyebrow) { margin:0; color:var(--muted); font-size:12px; line-height:1.65; }
.knowledge-card-top,.knowledge-card-footer,.panel-heading-row,.knowledge-source-title,.knowledge-source-meta,.form-actions,.download-row { display:flex; align-items:center; gap:10px; }
.knowledge-card-top,.knowledge-card-footer,.panel-heading-row { justify-content:space-between; }
.knowledge-card-top > span:last-child { color:var(--muted); font-size:10px; }
.knowledge-card-footer { margin-top:auto; padding-top:16px; border-top:1px solid #edf1f5; }
.knowledge-status { display:inline-flex; align-items:center; gap:6px; width:max-content; padding:6px 9px; color:#5c6878; background:#f1f4f7; border-radius:999px; font-size:9px; font-weight:850; letter-spacing:.06em; }
.knowledge-status::before { content:""; width:7px; height:7px; background:#9ba6b3; border-radius:50%; }
.knowledge-status-ready::before,.knowledge-status-connected::before { background:#2f7fd3; }
.knowledge-status-analyzing::before { background:#c78308; box-shadow:0 0 0 4px #fff4dc; animation:knowledgePulse 1.1s infinite; }
.knowledge-status-analyzed::before,.knowledge-status-generated::before { background:#16a06a; box-shadow:0 0 0 4px #e8f8f1; }
.knowledge-status-error::before,.knowledge-status-required::before { background:#c92a2a; box-shadow:0 0 0 4px #fff0f0; }
.knowledge-status-pending::before,.knowledge-status-draft::before,.knowledge-status-unknown::before { background:#9ba6b3; }
@keyframes knowledgePulse { 50% { opacity:.35; } }
.knowledge-empty { min-height:260px; gap:12px; }
.knowledge-empty .button { margin-top:8px; }
.knowledge-form-layout .editor-main { max-width:900px; }
.form-actions { flex-wrap:wrap; margin-top:22px; }
.connection-test-box { display:grid; gap:4px; margin-top:4px; padding:14px 16px; color:#536176; background:#f6f8fb; border:1px solid var(--line); border-radius:11px; }
.connection-test-box strong { font-size:12px; }
.connection-test-box span { font-size:11px; line-height:1.55; }
.connection-test-box.success { color:#0b704c; background:#edfbf5; border-color:#c5f1df; }
.connection-test-box.error { color:#8a2525; background:#fff1f1; border-color:#ffd4d4; }
.copy-code { display:flex; align-items:center; gap:8px; padding:10px; background:#f4f7fb; border:1px solid var(--line); border-radius:10px; }
.copy-code code { min-width:0; flex:1; overflow-wrap:anywhere; font-size:11px; }
.copy-code button,.permission-warning button { padding:7px 9px; color:var(--brand); background:white; border:1px solid #cfdaea; border-radius:8px; font-size:10px; font-weight:800; }
.knowledge-help-text { color:var(--muted); font-size:12px; line-height:1.65; }
.knowledge-summary-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(310px,.65fr); gap:20px; margin-bottom:20px; }
.knowledge-project-info,.knowledge-action-panel,.knowledge-datasource-panel,.knowledge-analysis-grid > .panel { padding:24px; }
.panel-heading-row { align-items:flex-start; margin-bottom:20px; }
.panel-heading-row h2 { margin:4px 0 0; font-size:21px; letter-spacing:-.03em; }
.knowledge-info-list { margin:0; }
.knowledge-info-list > div { display:grid; grid-template-columns:125px minmax(0,1fr); gap:18px; padding:12px 0; border-bottom:1px solid #edf1f5; }
.knowledge-info-list > div:last-child { border:0; }
.knowledge-info-list dt { color:var(--muted); font-size:10px; font-weight:750; }
.knowledge-info-list dd { margin:0; font-size:12px; font-weight:650; line-height:1.55; }
.inline-user { display:inline-flex; align-items:center; gap:8px; }
.knowledge-action-panel h3 { margin:5px 0 9px; font-size:19px; }
.knowledge-action-panel > p:not(.eyebrow) { margin:0 0 17px; color:var(--muted); font-size:12px; line-height:1.6; }
.knowledge-action-panel form + form { margin-top:9px; }
.download-row { flex-wrap:wrap; margin-top:14px; }
.button.disabled,.button:disabled { opacity:.48; pointer-events:none; cursor:not-allowed; }
.knowledge-datasource-panel { margin-bottom:20px; }
.knowledge-datasource-list { display:grid; gap:12px; }
.knowledge-datasource-item { display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:start; gap:14px; padding:17px; background:#f9fbfd; border:1px solid #e2e8f0; border-radius:13px; }
.knowledge-source-icon { width:46px; height:46px; display:grid; place-items:center; color:white; background:linear-gradient(135deg,#168c5c,#34b77d); border-radius:12px; font-size:12px; font-weight:900; }
.knowledge-source-main { min-width:0; }
.knowledge-source-title { flex-wrap:wrap; margin-bottom:5px; }
.knowledge-source-title strong { font-size:14px; }
.knowledge-source-main > a { display:block; max-width:650px; overflow:hidden; color:var(--brand); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.knowledge-source-meta { flex-wrap:wrap; margin-top:11px; color:var(--muted); font-size:9px; }
.knowledge-source-meta span { padding-right:10px; border-right:1px solid #dce4ee; }
.knowledge-source-meta span:last-child { border:0; }
.knowledge-source-actions { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.permission-warning { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:12px; padding:10px; color:#8a2525; background:#fff1f1; border:1px solid #ffd4d4; border-radius:9px; font-size:10px; }
.permission-warning span { flex:1; min-width:220px; }
.permission-warning code { overflow-wrap:anywhere; }
.knowledge-analysis-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:20px; }
.module-confidence-list { display:grid; gap:14px; }
.module-confidence-list > div { display:grid; grid-template-columns:145px minmax(0,1fr); align-items:center; gap:13px; }
.module-confidence-list span strong,.module-confidence-list span small { display:block; }
.module-confidence-list span strong { font-size:11px; }
.module-confidence-list span small { margin-top:2px; color:var(--muted); font-size:9px; }
.relationship-list { display:grid; gap:10px; }
.relationship-item { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:8px; padding:11px; background:#f7f9fc; border:1px solid #e6ebf2; border-radius:10px; }
.relationship-item strong { overflow-wrap:anywhere; font-size:10px; }
.relationship-item span { color:var(--brand); font-size:9px; font-weight:800; }
.relationship-item small { grid-column:1/-1; color:var(--muted); font-size:9px; }
.danger-zone { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 22px; border-color:#ffd9d9; }
.danger-zone strong,.danger-zone span { display:block; }
.danger-zone strong { font-size:12px; }
.danger-zone span { margin-top:4px; color:var(--muted); font-size:10px; }

@media (max-width:1100px) {
  .knowledge-project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .knowledge-summary-grid,.knowledge-analysis-grid { grid-template-columns:1fr; }
  .knowledge-datasource-item { grid-template-columns:46px minmax(0,1fr); }
  .knowledge-source-actions { grid-column:2; justify-content:flex-start; }
}
@media (max-width:760px) {
  .knowledge-hero,.knowledge-project-grid { grid-template-columns:1fr; }
  .knowledge-hero { padding:20px; }
  .knowledge-project-info,.knowledge-action-panel,.knowledge-datasource-panel,.knowledge-analysis-grid > .panel { padding:18px; }
  .knowledge-datasource-item { grid-template-columns:38px minmax(0,1fr); padding:13px; }
  .knowledge-source-icon { width:38px; height:38px; }
  .knowledge-info-list > div { grid-template-columns:95px minmax(0,1fr); }
  .module-confidence-list > div { grid-template-columns:110px minmax(0,1fr); }
  .relationship-item { grid-template-columns:1fr; }
  .relationship-item small { grid-column:auto; }
  .danger-zone { align-items:flex-start; flex-direction:column; }
}

/* ==========================================================
   Phase 6 — Microsoft 365 Connector + Knowledge UI refinement
   ========================================================== */
.phase6-hero { align-items:stretch; }
.supported-connectors { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.supported-connectors span { display:inline-flex; align-items:center; gap:8px; padding:8px 11px; color:#334155; background:#fff; border:1px solid #e2e8f0; border-radius:999px; font-size:10px; font-weight:750; }
.supported-connectors b { display:grid; place-items:center; min-width:29px; height:24px; padding:0 5px; color:#fff; background:#14835a; border-radius:7px; font-size:8px; }
.supported-connectors span:last-child b { background:#167b4f; }
.knowledge-service-account p { margin:10px 0 0; color:var(--muted); font-size:9px; line-height:1.5; }

.knowledge-command-center { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:26px; align-items:center; margin-bottom:18px; padding:24px 26px; overflow:hidden; position:relative; }
.knowledge-command-center::after { content:""; position:absolute; width:210px; height:210px; right:-95px; top:-115px; background:radial-gradient(circle,color-mix(in srgb,var(--brand) 13%,transparent),transparent 70%); pointer-events:none; }
.knowledge-command-copy { min-width:0; }
.knowledge-heading-line,.source-mix-row,.knowledge-command-actions,.download-row { display:flex; align-items:center; gap:9px; }
.knowledge-heading-line { flex-wrap:wrap; }
.source-mix-pill { color:var(--muted); font-size:10px; }
.knowledge-command-copy h2 { margin:12px 0 6px; font-size:25px; line-height:1.18; }
.knowledge-command-copy > p { max-width:720px; margin:0; color:var(--muted); font-size:12px; line-height:1.65; }
.source-mix-row { flex-wrap:wrap; margin-top:17px; }
.source-count { display:inline-flex; align-items:center; gap:7px; padding:7px 10px; color:#334155; background:#f8fafc; border:1px solid #e2e8f0; border-radius:999px; font-size:9px; font-weight:700; }
.source-count b { display:grid; place-items:center; min-width:27px; height:22px; padding:0 4px; color:white; border-radius:6px; font-size:8px; }
.source-count.google b { background:#168c5c; }
.source-count.microsoft b { background:#177a50; }
.knowledge-command-actions { min-width:260px; flex-direction:column; align-items:stretch; position:relative; z-index:1; }
.knowledge-command-actions form,.knowledge-command-actions .button { width:100%; }
.knowledge-command-actions .download-row .button { width:auto; flex:1; }
.knowledge-command-actions small { max-width:280px; color:var(--muted); font-size:8px; line-height:1.45; text-align:center; }

.knowledge-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-bottom:18px; }
.knowledge-kpi { padding:16px 18px; background:#fff; border:1px solid #e2e8f0; border-radius:13px; box-shadow:0 7px 20px rgba(15,23,42,.035); }
.knowledge-kpi span,.knowledge-kpi small { display:block; color:var(--muted); font-size:9px; }
.knowledge-kpi strong { display:block; margin:5px 0 3px; color:#0f172a; font-size:23px; line-height:1; }
.knowledge-state-card h2 { margin:8px 0; font-size:19px; }
.knowledge-state-card > p:not(.eyebrow) { color:var(--muted); font-size:11px; line-height:1.6; }
.knowledge-state-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:18px; }
.knowledge-state-steps span { padding:9px 7px; color:#64748b; background:#f8fafc; border:1px solid #e2e8f0; border-radius:9px; font-size:9px; font-weight:750; text-align:center; }
.knowledge-state-steps span.done { color:var(--brand); background:color-mix(in srgb,var(--brand) 8%,white); border-color:color-mix(in srgb,var(--brand) 22%,white); }

.knowledge-datasource-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.knowledge-source-card { min-width:0; padding:17px; background:#fbfdff; border:1px solid #e2e8f0; border-radius:14px; }
.knowledge-source-card.microsoft { border-top:3px solid #16805a; }
.knowledge-source-card.google { border-top:3px solid #168c5c; }
.knowledge-source-card-head { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:start; gap:11px; }
.knowledge-source-icon { width:42px; height:42px; display:grid; place-items:center; color:white; border-radius:11px; font-size:10px; font-weight:900; letter-spacing:.02em; }
.knowledge-source-icon.google { background:linear-gradient(135deg,#11834f,#39b979); }
.knowledge-source-icon.microsoft { background:linear-gradient(135deg,#126f4a,#20a36e); }
.knowledge-source-title-block { min-width:0; }
.knowledge-source-title-block small,.knowledge-source-title-block span { display:block; color:var(--muted); font-size:8px; }
.knowledge-source-title-block strong { display:block; margin:3px 0; overflow-wrap:anywhere; color:#172033; font-size:13px; }
.knowledge-source-title-block span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.source-id-box { margin:13px 0; padding:9px 10px; background:#f1f5f9; border-radius:9px; }
.source-id-box span { display:block; margin-bottom:4px; color:#64748b; font-size:8px; font-weight:700; text-transform:uppercase; }
.source-id-box code { display:block; overflow-wrap:anywhere; color:#334155; font-size:8px; line-height:1.45; }
.source-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid #e6ebf2; border-radius:10px; overflow:hidden; }
.source-stat-grid > div { min-width:0; padding:9px; border-right:1px solid #e6ebf2; }
.source-stat-grid > div:last-child { border-right:0; }
.source-stat-grid span,.source-stat-grid strong { display:block; }
.source-stat-grid span { color:#64748b; font-size:7.5px; }
.source-stat-grid strong { margin-top:3px; overflow-wrap:anywhere; color:#1e293b; font-size:9px; }
.permission-granted { color:#08784c !important; }
.permission-required,.permission-error { color:#b42318 !important; }
.source-secondary-meta { display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; color:#64748b; font-size:8px; }
.source-secondary-meta strong { color:#334155; }
.knowledge-source-card-actions { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-top:14px; padding-top:12px; border-top:1px solid #e9eef4; }
.knowledge-source-card-actions form { display:inline-flex; }
.permission-warning { justify-content:space-between; }
.permission-warning > div { flex:1; min-width:0; }
.permission-warning > div strong,.permission-warning > div span { display:block; }
.permission-warning > div span { margin-top:3px; }
.permission-warning.microsoft { color:#754c00; background:#fff9e8; border-color:#f7e3a7; }

.knowledge-error-summary { margin-bottom:18px; border-color:#ffd1d1; }
.knowledge-error-summary h2 { margin:5px 0 13px; font-size:18px; }
.knowledge-error-list { display:grid; gap:8px; }
.knowledge-error-list > div { padding:10px 12px; background:#fff6f6; border:1px solid #ffe0e0; border-radius:9px; }
.knowledge-error-list strong,.knowledge-error-list span { display:block; }
.knowledge-error-list strong { font-size:10px; }
.knowledge-error-list span { margin-top:3px; color:#7a3030; font-size:9px; }
.relationship-panel { min-width:0; }
.relationship-list { max-height:660px; overflow:auto; padding-right:3px; }
.relationship-card { display:grid; grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr); align-items:center; gap:10px; padding:12px; background:#f8fafc; border:1px solid #e3e9f0; border-radius:11px; }
.relationship-endpoint { min-width:0; }
.relationship-endpoint small,.relationship-endpoint strong,.relationship-endpoint code { display:block; overflow-wrap:anywhere; }
.relationship-endpoint small { color:#64748b; font-size:7.5px; }
.relationship-endpoint strong { margin:3px 0; color:#172033; font-size:9px; }
.relationship-endpoint code { color:#334155; font-size:8px; }
.relationship-link { text-align:center; }
.relationship-link span,.relationship-link small { display:block; color:var(--muted); font-size:7px; }
.relationship-link b { display:block; margin:2px 0; color:var(--brand); font-size:16px; }
.relationship-card p { grid-column:1/-1; margin:0; padding-top:8px; color:#64748b; border-top:1px dashed #dce4ec; font-size:7.5px; }

.connector-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.connector-choice-card { display:flex; align-items:flex-start; gap:15px; padding:20px; color:inherit; background:#fff; border:1px solid #dfe7ef; border-radius:15px; transition:.18s ease; }
.connector-choice-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--brand) 38%,#dfe7ef); box-shadow:0 12px 30px rgba(15,23,42,.08); }
.connector-choice-icon { flex:0 0 48px; height:48px; display:grid; place-items:center; color:#fff; border-radius:13px; font-size:11px; font-weight:900; }
.connector-choice-icon.google { background:linear-gradient(135deg,#168c5c,#39b979); }
.connector-choice-icon.microsoft { background:linear-gradient(135deg,#126f4a,#22a873); }
.connector-choice-card h3 { margin:2px 0 6px; font-size:15px; }
.connector-choice-card p { margin:0; color:var(--muted); font-size:10px; line-height:1.55; }
.connector-choice-card .tag { margin-top:10px; }

.microsoft-connect-panel { display:grid; grid-template-columns:76px minmax(0,1fr); gap:20px; align-items:center; }
.microsoft-logo-tile { width:72px; height:72px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#0f6f4b,#23a874); border-radius:18px; font-size:15px; font-weight:900; }
.microsoft-connect-panel h2 { margin:5px 0 8px; font-size:21px; }
.microsoft-connect-panel p { color:var(--muted); font-size:11px; line-height:1.6; }
.copy-code { display:flex; align-items:center; gap:8px; margin-top:12px; padding:8px 10px; background:#f1f5f9; border-radius:9px; }
.copy-code code { flex:1; overflow-wrap:anywhere; font-size:9px; }
.copy-code button { border:0; color:var(--brand); background:transparent; font-size:9px; font-weight:750; cursor:pointer; }
.microsoft-account-bar { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:14px; padding:14px 18px; }
.person-line { display:flex; align-items:center; gap:10px; }
.person-line strong,.person-line span { display:block; }
.person-line strong { font-size:11px; }
.person-line span { margin-top:2px; color:var(--muted); font-size:9px; }
.microsoft-logo-small { width:36px; height:36px; display:grid; place-items:center; color:#fff; background:#187c55; border-radius:10px; font-weight:900; }
.microsoft-account-actions { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.microsoft-tabs { display:flex; gap:5px; margin:0 0 14px; padding:5px; width:max-content; max-width:100%; background:#eaf0f5; border-radius:11px; }
.microsoft-tabs a { padding:9px 16px; color:#64748b; border-radius:8px; font-size:10px; font-weight:750; }
.microsoft-tabs a.active { color:var(--brand); background:#fff; box-shadow:0 3px 10px rgba(15,23,42,.07); }
.sharepoint-site-search { display:grid; grid-template-columns:minmax(0,.85fr) minmax(300px,1.15fr); gap:22px; align-items:end; margin-bottom:14px; }
.sharepoint-site-search h3 { margin:5px 0; font-size:17px; }
.sharepoint-site-search p { margin:0; color:var(--muted); font-size:10px; }
.sharepoint-site-search form { display:flex; align-items:end; gap:9px; }
.sharepoint-site-search .field { flex:1; }
.microsoft-file-panel { margin-bottom:15px; }
.drive-library-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.drive-library-card { display:flex; align-items:center; gap:10px; padding:13px; color:inherit; background:#f8fafc; border:1px solid #e2e8f0; border-radius:11px; }
.drive-library-card:hover { border-color:color-mix(in srgb,var(--brand) 35%,#e2e8f0); }
.drive-library-card strong,.drive-library-card small { display:block; }
.drive-library-card strong { overflow-wrap:anywhere; font-size:10px; }
.drive-library-card small { margin-top:2px; color:var(--muted); font-size:8px; }
.folder-icon,.excel-icon { display:grid; place-items:center; flex:0 0 38px; height:34px; color:#fff; border-radius:8px; font-size:8px; font-weight:900; }
.folder-icon { background:#8a6a18; }
.excel-icon { background:#16805a; }
.microsoft-browser-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; }
.microsoft-browser-heading h2 { margin:4px 0; font-size:19px; }
.folder-current-name { margin:0; color:var(--muted); font-size:9px; }
.microsoft-browser-actions { display:flex; flex-wrap:wrap; gap:7px; }
.microsoft-file-list { border:1px solid #e1e8ef; border-radius:12px; overflow:hidden; }
.microsoft-file-row { display:grid; grid-template-columns:26px 42px minmax(0,1fr) auto; align-items:center; gap:9px; min-height:57px; padding:9px 12px; color:inherit; background:#fff; border-bottom:1px solid #edf1f5; }
.microsoft-file-row:last-child { border-bottom:0; }
.microsoft-file-row:hover { background:#f8fbfd; }
.microsoft-file-row input { width:16px; height:16px; accent-color:var(--brand); }
.file-select-space { width:16px; }
.file-main { min-width:0; }
.file-main strong,.file-main small { display:block; }
.file-main strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.file-main small { margin-top:3px; overflow:hidden; color:var(--muted); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.file-open,.file-size { color:var(--muted); font-size:8px; }
.microsoft-selection-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:13px; padding:12px 14px; background:#f5f8fb; border-radius:11px; font-size:9px; }

@media (max-width:1180px) {
  .knowledge-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .knowledge-datasource-grid { grid-template-columns:1fr; }
  .drive-library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .knowledge-command-center { grid-template-columns:1fr; }
  .knowledge-command-actions { min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .knowledge-command-actions small { grid-column:1/-1; max-width:none; }
  .connector-choice-grid,.sharepoint-site-search { grid-template-columns:1fr; }
  .sharepoint-site-search form { align-items:stretch; flex-direction:column; }
}
@media (max-width:680px) {
  .knowledge-command-center { padding:18px; }
  .knowledge-command-actions { grid-template-columns:1fr; }
  .knowledge-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .knowledge-kpi { padding:13px; }
  .knowledge-kpi strong { font-size:19px; }
  .source-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .source-stat-grid > div { border-bottom:1px solid #e6ebf2; }
  .source-stat-grid > div:nth-child(2) { border-right:0; }
  .source-stat-grid > div:nth-child(3),.source-stat-grid > div:nth-child(4) { border-bottom:0; }
  .knowledge-source-card-head { grid-template-columns:38px minmax(0,1fr); }
  .knowledge-source-card-head > .knowledge-status { grid-column:2; justify-self:start; }
  .relationship-card { grid-template-columns:1fr; }
  .relationship-link { display:flex; align-items:center; gap:6px; text-align:left; }
  .relationship-link b { transform:rotate(90deg); }
  .microsoft-connect-panel { grid-template-columns:1fr; }
  .microsoft-account-bar,.microsoft-browser-heading,.microsoft-selection-footer { align-items:flex-start; flex-direction:column; }
  .drive-library-grid { grid-template-columns:1fr; }
  .microsoft-file-row { grid-template-columns:22px 36px minmax(0,1fr); }
  .file-size,.file-open { grid-column:3; }
  .microsoft-selection-footer .button { width:100%; }
  .copy-code { align-items:flex-start; flex-direction:column; }
}
.connector-choice-card h2 { margin:2px 0 7px; font-size:16px; }
.connector-choice-card .button,.connector-choice-card .knowledge-status { display:inline-flex; margin-top:12px; }
.connector-choice-card.connector-disabled { opacity:.58; pointer-events:none; }
.connector-architecture-note { margin-top:16px; }
.connector-architecture-note h3 { margin:5px 0 7px; font-size:16px; }
.connector-architecture-note > p:not(.eyebrow) { color:var(--muted); font-size:10px; line-height:1.6; }


@media (max-width:680px) {
  .topbar-copy-prompt span { display:none; }
  .topbar-copy-prompt { width:42px; min-width:42px; padding:9px; }
  .prompt-content-toolbar { top:8px; }
  .prompt-content-toolbar small { display:none; }
  .prompt-content-box-main { padding:18px; font-size:12px; }
}

/* ======================================================================
   V13 — AI Knowledge Builder premium interface + responsive information UI
   ====================================================================== */
html { scroll-behavior:smooth; }

/* Index hero */
.kb-index-hero {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(320px,.65fr);
  gap:32px;
  align-items:stretch;
  margin-bottom:20px;
  padding:32px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 86% 10%,rgba(239,59,45,.28),transparent 28%),
    radial-gradient(circle at 20% 110%,rgba(57,139,232,.2),transparent 35%),
    linear-gradient(135deg,#071d43 0%,#0a326d 55%,#124d91 100%);
  border:0;
  box-shadow:0 22px 55px rgba(7,29,67,.2);
}
.kb-index-hero::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to right,black,transparent 78%);
}
.kb-index-hero-copy,.kb-access-card { position:relative; z-index:1; }
.kb-section-label { display:inline-flex; align-items:center; gap:7px; padding:7px 10px; color:#dcecff; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.13); border-radius:999px; font-size:10px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.kb-section-label::before { content:""; width:7px; height:7px; background:#ff6257; border-radius:50%; box-shadow:0 0 0 5px rgba(255,98,87,.13); }
.kb-index-hero h2 { max-width:800px; margin:19px 0 12px; font-size:clamp(28px,2.5vw,39px); line-height:1.12; letter-spacing:-.045em; }
.kb-index-hero h2 span { color:#a9cef8; }
.kb-index-hero-copy > p { max-width:810px; margin:0; color:rgba(255,255,255,.72); font-size:14px; line-height:1.72; }
.kb-architecture-flow { display:flex; align-items:center; gap:11px; margin-top:25px; }
.kb-flow-node { min-width:150px; display:grid; grid-template-columns:auto 1fr; column-gap:9px; padding:12px 13px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:13px; backdrop-filter:blur(8px); }
.kb-flow-node strong,.kb-flow-node small { grid-column:2; }
.kb-flow-node strong { align-self:end; font-size:12px; }
.kb-flow-node small { margin-top:2px; color:rgba(255,255,255,.56); font-size:9px; }
.kb-flow-number { grid-row:1/3; align-self:center; color:#7fb3ef; font-size:10px; font-weight:850; }
.kb-flow-node-knowledge { background:rgba(239,59,45,.16); border-color:rgba(255,118,108,.3); }
.kb-flow-node-knowledge .kb-flow-number { color:#ff9289; }
.kb-flow-arrow { color:rgba(255,255,255,.36); font-size:18px; }
.kb-access-card { padding:19px; color:#172033; background:rgba(255,255,255,.97); border:1px solid rgba(255,255,255,.5); border-radius:16px; box-shadow:0 20px 45px rgba(5,20,47,.2); }
.kb-access-card-head { display:flex; align-items:center; gap:11px; margin-bottom:13px; padding-bottom:13px; border-bottom:1px solid #e8edf4; }
.kb-access-card-head strong,.kb-access-card-head small { display:block; }
.kb-access-card-head strong { font-size:13px; }
.kb-access-card-head small { margin-top:2px; color:#7a8798; font-size:9px; }
.kb-access-icon { width:35px; height:35px; display:grid; place-items:center; color:white; background:linear-gradient(135deg,#0b3a7e,#2c78c9); border-radius:10px; font-weight:900; }
.kb-connector-row { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px 0; }
.kb-provider-icon { width:38px; height:38px; display:grid; place-items:center; flex:0 0 auto; color:white; border-radius:10px; font-size:9px; font-weight:900; letter-spacing:.03em; }
.kb-provider-icon.google { background:linear-gradient(135deg,#118450,#3bb87b); }
.kb-provider-icon.microsoft { background:linear-gradient(135deg,#0d6e4a,#20a36e); }
.kb-connector-row strong,.kb-connector-row small { display:block; }
.kb-connector-row strong { font-size:11px; }
.kb-connector-row small { margin-top:2px; color:#7a8798; font-size:8px; }
.kb-provider-state { padding:5px 7px; color:#0d754d; background:#e9f9f2; border-radius:999px; font-size:8px; font-weight:800; }
.kb-service-account-box { display:flex; align-items:center; gap:7px; padding:8px 9px; background:#f4f7fb; border:1px solid #e1e7ef; border-radius:9px; }
.kb-service-account-box code { min-width:0; flex:1; overflow:hidden; color:#334155; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.kb-service-account-box button { padding:5px 7px; color:#0b4b91; background:#fff; border:1px solid #d7e1ed; border-radius:7px; font-size:8px; font-weight:800; }
.kb-access-note { margin:11px 0 0; padding-top:10px; color:#788599; border-top:1px solid #e8edf4; font-size:8px; line-height:1.5; }

/* Index summary metrics */
.kb-index-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-bottom:28px; }
.kb-index-metric { min-width:0; display:flex; align-items:center; gap:13px; padding:16px 17px; background:#fff; border:1px solid #dfe6ef; border-radius:14px; box-shadow:0 8px 25px rgba(20,44,82,.045); }
.kb-metric-icon { width:42px; height:42px; display:grid; place-items:center; flex:0 0 auto; color:#0b4b91; background:#eaf2fc; border-radius:12px; font-size:17px; font-weight:900; }
.kb-metric-icon.generated { color:#0d7c52; background:#e9f9f2; }
.kb-metric-icon.review { color:#8a6510; background:#fff7df; }
.kb-index-metric.needs-attention .kb-metric-icon { color:#b42318; background:#fff0ef; }
.kb-index-metric div { min-width:0; }
.kb-index-metric small,.kb-index-metric span { display:block; overflow:hidden; color:#7a8798; text-overflow:ellipsis; white-space:nowrap; }
.kb-index-metric small { font-size:9px; font-weight:750; }
.kb-index-metric strong { display:block; margin:3px 0 2px; color:#142033; font-size:23px; line-height:1; }
.kb-index-metric div span { font-size:8px; }

/* Project section and cards */
.kb-project-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:25px; margin-bottom:17px; }
.kb-project-section-head h2 { margin:4px 0 4px; font-size:22px; letter-spacing:-.03em; }
.kb-project-section-head > div > p:last-child { margin:0; color:#748196; font-size:11px; }
.kb-project-tools { display:flex; align-items:center; gap:9px; }
.kb-search-box { min-width:260px; display:flex; align-items:center; gap:8px; padding:0 12px; background:#fff; border:1px solid #dce4ed; border-radius:10px; }
.kb-search-box span { color:#8491a3; font-size:17px; }
.kb-search-box input { width:100%; height:40px; padding:0; border:0; outline:0; color:#172033; background:transparent; font-size:11px; }
.kb-status-filter { height:42px; min-width:145px; padding:0 31px 0 11px; color:#445064; background:#fff; border:1px solid #dce4ed; border-radius:10px; font-size:11px; }
.kb-project-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:16px; }
.kb-project-card { position:relative; min-width:0; min-height:0; display:flex; flex-direction:column; gap:0; padding:0; overflow:hidden; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.kb-project-card:hover { transform:translateY(-3px); border-color:#c9d6e5; box-shadow:0 18px 40px rgba(15,38,74,.1); }
.kb-project-card-accent { height:4px; background:#93a1b4; }
.kb-status-accent-generated { background:linear-gradient(90deg,#0e8a5b,#45c08c); }
.kb-status-accent-analyzed { background:linear-gradient(90deg,#186fbe,#55a2e4); }
.kb-status-accent-ready { background:linear-gradient(90deg,#7d8da2,#b4c0cd); }
.kb-status-accent-error { background:linear-gradient(90deg,#c92a2a,#f07068); }
.kb-project-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:17px 18px 0; }
.kb-project-identity { display:flex; align-items:center; gap:10px; min-width:0; }
.kb-company-mark { width:39px; height:39px; display:grid; place-items:center; flex:0 0 auto; color:white; background:linear-gradient(145deg,#123f78,#2b78c4); border-radius:11px; box-shadow:0 8px 18px rgba(15,67,126,.16); font-size:10px; font-weight:900; }
.kb-company-mark.large { width:52px; height:52px; border-radius:14px; font-size:13px; }
.kb-project-identity > div { min-width:0; }
.kb-company-name { display:block; max-width:210px; margin-bottom:5px; overflow:hidden; color:#677489; font-size:9px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.kb-card-open-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; color:#607086; background:#f4f7fa; border:1px solid #e4e9ef; border-radius:10px; font-weight:900; transition:.15s ease; }
.kb-card-open-icon:hover { color:#fff; background:#0d437f; border-color:#0d437f; }
.kb-project-card-body { padding:14px 18px 15px; }
.kb-project-card-body h3 { margin:0 0 7px; color:#142033; font-size:18px; line-height:1.25; letter-spacing:-.025em; }
.kb-project-card-body h3 a:hover { color:#0d4f97; }
.kb-project-card-body p { min-height:39px; display:-webkit-box; margin:0; overflow:hidden; color:#6d7a8e; font-size:10px; line-height:1.55; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.kb-project-source-summary { display:grid; grid-template-columns:repeat(3,1fr); margin:0 18px; background:#f7f9fc; border:1px solid #e7ebf1; border-radius:11px; overflow:hidden; }
.kb-project-source-summary div { min-width:0; padding:9px 7px; text-align:center; border-right:1px solid #e4e9ef; }
.kb-project-source-summary div:last-child { border:0; }
.kb-project-source-summary strong,.kb-project-source-summary span { display:block; }
.kb-project-source-summary strong { color:#223047; font-size:12px; }
.kb-project-source-summary span { margin-top:2px; color:#8591a2; font-size:7.5px; }
.kb-project-progress { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin:15px 18px 0; }
.kb-project-progress div { position:relative; display:flex; align-items:center; gap:6px; color:#9aa5b3; font-size:7.5px; }
.kb-project-progress div::after { content:""; position:absolute; z-index:0; left:9px; right:-3px; top:4px; height:1px; background:#dce3eb; }
.kb-project-progress div:last-child::after { display:none; }
.kb-project-progress span { position:relative; z-index:1; width:9px; height:9px; flex:0 0 auto; background:#d2d9e2; border:2px solid #fff; border-radius:50%; box-shadow:0 0 0 1px #d2d9e2; }
.kb-project-progress div.done { color:#347457; }
.kb-project-progress div.done span { background:#159164; box-shadow:0 0 0 1px #159164; }
.kb-project-progress div.done::after { background:#78c4a7; }
.kb-project-card-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; padding:14px 18px; background:#fbfcfe; border-top:1px solid #edf1f5; }
.kb-project-card-footer .owner-chip { min-width:0; }
.kb-project-card-footer .owner-chip strong,.kb-project-card-footer .owner-chip span { display:block; }
.kb-project-card-footer .owner-chip strong { max-width:125px; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.kb-project-card-footer .owner-chip span { margin-top:2px; color:#8b96a5; font-size:7px; }
.kb-project-card-footer .avatar { width:31px; height:31px; border-radius:9px; }
.kb-project-card-footer .button { min-height:34px; padding:7px 11px; font-size:9px; }
.kb-filter-empty { display:flex; flex-direction:column; align-items:center; gap:5px; padding:40px; color:#748196; text-align:center; }
.kb-filter-empty strong { color:#172033; font-size:16px; }
.kb-filter-empty span { font-size:10px; }

/* Detail page */
.kb-detail-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:28px; align-items:stretch; margin-bottom:13px; padding:26px; overflow:hidden; background:linear-gradient(135deg,#fff 0%,#f7faff 100%); }
.kb-detail-hero::after { content:""; position:absolute; width:250px; height:250px; right:-100px; top:-125px; background:radial-gradient(circle,color-mix(in srgb,var(--brand) 12%,transparent),transparent 70%); pointer-events:none; }
.kb-detail-hero-main,.kb-detail-action-card { position:relative; z-index:1; }
.kb-detail-breadcrumb { display:flex; align-items:center; gap:7px; margin-bottom:16px; color:#7b8798; font-size:9px; }
.kb-detail-breadcrumb a { color:#0b4b91; font-weight:750; }
.kb-detail-title-line { display:flex; align-items:flex-start; gap:15px; }
.kb-detail-title-line > div { min-width:0; }
.kb-detail-status-line { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.kb-detail-title-line h2 { margin:9px 0 6px; font-size:27px; line-height:1.18; letter-spacing:-.04em; }
.kb-detail-title-line p { max-width:720px; margin:0; color:#69768a; font-size:11px; line-height:1.65; }
.kb-source-pills { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:18px; padding-left:67px; }
.kb-source-pill { display:inline-flex; align-items:center; gap:6px; padding:7px 9px; color:#4b586b; background:#fff; border:1px solid #dfe6ee; border-radius:999px; font-size:8px; }
.kb-source-pill b { width:23px; height:20px; display:grid; place-items:center; color:white; background:#168c5c; border-radius:6px; font-size:7px; }
.kb-source-pill.microsoft b { background:#187b53; }
.kb-source-pill.neutral b { color:#0d4b8d; background:#e8f1fc; }
.kb-source-pill strong { color:#1c293d; }
.kb-detail-action-card { display:flex; flex-direction:column; gap:8px; padding:15px; background:#fff; border:1px solid #dfe6ef; border-radius:14px; box-shadow:0 10px 28px rgba(19,51,94,.07); }
.kb-action-card-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 2px 5px; }
.kb-action-card-heading span { font-size:10px; font-weight:850; }
.kb-action-card-heading small { color:#8a96a6; font-size:7.5px; }
.kb-detail-action-card form,.kb-detail-action-card form .button { width:100%; }
.kb-detail-action-card .button { min-height:43px; font-size:10px; }
.kb-download-row { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.kb-detail-action-card > p { margin:2px 0 0; color:#8994a3; font-size:7.5px; line-height:1.4; text-align:center; }
.kb-section-nav { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:5px; margin-bottom:14px; padding:5px; width:max-content; max-width:100%; background:rgba(234,240,247,.94); border:1px solid #dce4ee; border-radius:11px; backdrop-filter:blur(10px); }
.kb-section-nav a { display:flex; align-items:center; gap:6px; padding:8px 13px; color:#6c788b; border-radius:8px; font-size:9px; font-weight:750; }
.kb-section-nav a:hover,.kb-section-nav a.active { color:#0c427e; background:#fff; box-shadow:0 3px 10px rgba(15,23,42,.06); }
.kb-section-nav a span { min-width:18px; padding:2px 5px; color:#5e6c80; background:#eef2f6; border-radius:999px; font-size:7px; text-align:center; }
.kb-detail-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.kb-detail-metrics article { min-width:0; display:flex; align-items:center; gap:12px; padding:14px 15px; background:#fff; border:1px solid #dfe6ef; border-radius:13px; box-shadow:0 7px 20px rgba(20,44,82,.035); }
.kb-detail-metrics article.has-issue { border-color:#f0c5c1; background:#fffafa; }
.kb-detail-metric-icon { width:38px; height:38px; display:grid; place-items:center; flex:0 0 auto; color:#0c4a8b; background:#eaf2fc; border-radius:10px; font-size:15px; font-weight:900; }
.kb-detail-metric-icon.links { color:#7c5b07; background:#fff6d8; }
.kb-detail-metrics article.has-issue .kb-detail-metric-icon { color:#b42318; background:#fff0ef; }
.kb-detail-metrics small,.kb-detail-metrics span { display:block; color:#8290a2; }
.kb-detail-metrics small { font-size:8px; font-weight:750; }
.kb-detail-metrics strong { display:block; margin:3px 0 2px; color:#172033; font-size:20px; line-height:1; }
.kb-detail-metrics div span { max-width:140px; overflow:hidden; font-size:7.5px; text-overflow:ellipsis; white-space:nowrap; }
.kb-overview-grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(350px,.92fr); gap:16px; margin-bottom:16px; }
.kb-project-overview-card,.kb-workflow-card,.kb-datasource-section,.kb-module-panel,.kb-relationship-panel { padding:21px; }
.kb-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:17px; }
.kb-panel-heading h2 { margin:4px 0 0; font-size:19px; letter-spacing:-.03em; }
.kb-panel-heading > div > p:last-child { margin:4px 0 0; color:#7a8798; font-size:9px; }
.kb-project-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; margin:0; }
.kb-project-details > div { display:grid; grid-template-columns:94px minmax(0,1fr); gap:11px; align-items:center; padding:10px 0; border-bottom:1px solid #edf1f5; }
.kb-project-details > div:nth-last-child(-n+2) { border-bottom:0; }
.kb-project-details dt { color:#7f8b9d; font-size:8px; font-weight:700; }
.kb-project-details dd { min-width:0; margin:0; overflow-wrap:anywhere; color:#253248; font-size:10px; font-weight:650; }
.kb-project-details .avatar { width:27px; height:27px; border-radius:8px; }
.kb-workflow-card > p { margin:-4px 0 20px; color:#707e91; font-size:10px; line-height:1.6; }
.kb-workflow-track { display:grid; grid-template-columns:auto minmax(20px,1fr) auto minmax(20px,1fr) auto; align-items:start; }
.kb-workflow-track > div { min-width:72px; text-align:center; }
.kb-workflow-track > div span { width:31px; height:31px; display:grid; place-items:center; margin:0 auto 7px; color:#8793a4; background:#f1f4f7; border:1px solid #dce3eb; border-radius:50%; font-size:9px; font-weight:850; }
.kb-workflow-track > div strong,.kb-workflow-track > div small { display:block; }
.kb-workflow-track > div strong { color:#4d5a6d; font-size:8.5px; }
.kb-workflow-track > div small { margin-top:2px; color:#98a2b0; font-size:7px; }
.kb-workflow-track > div.done span { color:white; background:#12875b; border-color:#12875b; box-shadow:0 0 0 5px #e9f8f2; }
.kb-workflow-track > div.done strong { color:#166b4d; }
.kb-workflow-track i { height:1px; margin-top:15px; background:#dce3eb; }
.kb-workflow-track > div.done + i { background:#69bea0; }

/* Compact datasource rows */
.kb-datasource-section { margin-bottom:16px; scroll-margin-top:70px; }
.kb-datasource-heading { align-items:center; }
.kb-datasource-heading > div > p:last-child { margin:4px 0 0; color:#7a8798; font-size:9px; }
.kb-source-list { display:grid; gap:9px; }
.kb-source-row { display:grid; grid-template-columns:minmax(230px,1.2fr) minmax(280px,1.05fr) minmax(180px,.75fr) auto; gap:14px; align-items:center; padding:13px 14px; background:#fbfcfe; border:1px solid #e2e8ef; border-radius:12px; transition:.15s ease; }
.kb-source-row:hover { background:#fff; border-color:#cdd9e7; box-shadow:0 8px 22px rgba(20,44,82,.055); }
.kb-source-row.needs-attention { border-left:4px solid #d7483f; }
.kb-source-row-main { min-width:0; display:flex; align-items:center; gap:10px; }
.kb-source-row-title { min-width:0; }
.kb-source-row-title > div { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.kb-source-row-title > div > span:first-child { color:#7c899a; font-size:7.5px; font-weight:700; }
.kb-source-row-title .knowledge-status { padding:4px 6px; font-size:6.5px; }
.kb-source-row-title .knowledge-status::before { width:5px; height:5px; }
.kb-source-row-title > strong,.kb-source-row-title > small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-source-row-title > strong { margin-top:3px; color:#18253a; font-size:11px; }
.kb-source-row-title > small { margin-top:2px; color:#8994a4; font-size:7.5px; }
.kb-source-row-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:#fff; border:1px solid #e6ebf1; border-radius:9px; overflow:hidden; }
.kb-source-row-stats > div { min-width:0; padding:8px 7px; border-right:1px solid #e8edf2; }
.kb-source-row-stats > div:last-child { border:0; }
.kb-source-row-stats span,.kb-source-row-stats strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-source-row-stats span { color:#8a96a6; font-size:6.5px; }
.kb-source-row-stats strong { margin-top:3px; color:#29364a; font-size:7.5px; }
.kb-source-row-id { min-width:0; }
.kb-source-row-id > span,.kb-source-row-id code,.kb-source-row-id small { display:block; }
.kb-source-row-id > span { color:#8a96a6; font-size:6.5px; font-weight:700; text-transform:uppercase; }
.kb-source-row-id code { max-width:230px; margin-top:4px; overflow:hidden; color:#49566a; font-size:7px; text-overflow:ellipsis; white-space:nowrap; }
.kb-source-row-id small { margin-top:3px; color:#8994a4; font-size:6.5px; }
.kb-source-row-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:5px; }
.kb-source-row-actions form { display:inline-flex; }
.kb-source-row-actions .button { min-height:31px; padding:5px 8px; font-size:7.5px; border-radius:8px; }
.kb-more-action { width:30px; height:30px; display:grid; place-items:center; color:#69768a; background:#fff; border:1px solid #dfe5ec; border-radius:8px; font-size:15px; }
.kb-more-action.danger { color:#b42318; background:#fff6f5; border-color:#f3d4d1; }
.kb-source-alert { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 11px; color:#8a2525; background:#fff2f1; border:1px solid #ffd8d5; border-radius:9px; }
.kb-source-alert > div { min-width:0; }
.kb-source-alert strong,.kb-source-alert span { display:block; }
.kb-source-alert strong { font-size:8px; }
.kb-source-alert span { margin-top:3px; font-size:7.5px; }
.kb-source-alert code { overflow-wrap:anywhere; }
.kb-source-alert button { flex:0 0 auto; padding:6px 8px; color:#9d2c25; background:#fff; border:1px solid #efc5c1; border-radius:7px; font-size:7.5px; font-weight:750; }
.kb-source-alert.warning { color:#79560a; background:#fff9e8; border-color:#f1dfa8; }

/* Analysis presentation */
.kb-analysis-section { scroll-margin-top:70px; }
.kb-analysis-alert { display:grid; grid-template-columns:42px minmax(0,1fr); gap:13px; margin-bottom:16px; padding:17px; border-color:#f1cbc8; }
.kb-analysis-alert-icon { width:42px; height:42px; display:grid; place-items:center; color:#b42318; background:#fff0ef; border-radius:12px; font-size:18px; font-weight:900; }
.kb-analysis-alert h2 { margin:3px 0 10px; font-size:16px; }
.kb-analysis-grid { display:grid; grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr); gap:16px; margin-bottom:16px; }
.kb-module-list { display:grid; gap:8px; }
.kb-module-row { display:grid; grid-template-columns:29px 105px minmax(0,1fr); align-items:center; gap:9px; padding:8px 9px; background:#f8fafc; border:1px solid #e7ecf2; border-radius:9px; }
.kb-module-rank { width:27px; height:27px; display:grid; place-items:center; color:#5f6e82; background:#fff; border:1px solid #e0e6ed; border-radius:8px; font-size:7px; font-weight:800; }
.kb-module-row strong,.kb-module-row small { display:block; }
.kb-module-row strong { font-size:8.5px; }
.kb-module-row small { margin-top:2px; color:#8692a3; font-size:6.5px; }
.kb-module-row .progress { height:6px; }
.kb-relationship-list { display:grid; gap:8px; max-height:545px; overflow:auto; padding-right:3px; }
.kb-relationship-row { display:grid; grid-template-columns:minmax(0,1fr) 67px minmax(0,1fr); align-items:center; gap:9px; padding:10px 11px; background:#f8fafc; border:1px solid #e4eaf0; border-radius:10px; }
.kb-relationship-endpoint { min-width:0; }
.kb-relationship-endpoint small,.kb-relationship-endpoint strong,.kb-relationship-endpoint code { display:block; overflow-wrap:anywhere; }
.kb-relationship-endpoint small { color:#7d899a; font-size:6.5px; }
.kb-relationship-endpoint strong { margin:3px 0; color:#1d2a3f; font-size:8.5px; }
.kb-relationship-endpoint code { color:#526075; font-size:6.7px; }
.kb-relationship-connector { text-align:center; }
.kb-relationship-connector span,.kb-relationship-connector small { display:block; color:#8b96a5; font-size:6px; }
.kb-relationship-connector b { display:block; margin:1px 0; color:#0d4d90; font-size:15px; }
.kb-analysis-footnote { margin:10px 0 0; color:#8490a1; font-size:7.5px; line-height:1.5; }
.kb-danger-zone { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 19px; border-color:#f0d4d1; }
.kb-danger-zone > div { display:flex; align-items:center; gap:11px; }
.kb-danger-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; color:#b42318; background:#fff1f0; border-radius:10px; font-weight:900; }
.kb-danger-zone strong { display:block; font-size:10px; }
.kb-danger-zone p { margin:3px 0 0; color:#7f8a99; font-size:8px; }

/* Responsive Knowledge Builder */
@media (max-width:1320px) {
  .kb-index-hero { grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); }
  .kb-architecture-flow { flex-wrap:wrap; }
  .kb-flow-node { min-width:135px; }
  .kb-source-row { grid-template-columns:minmax(230px,1fr) minmax(260px,1fr) auto; }
  .kb-source-row-id { grid-column:1/3; padding-left:48px; }
  .kb-source-row-actions { grid-column:3; grid-row:1/3; }
}
@media (max-width:1120px) {
  .kb-index-hero { grid-template-columns:1fr; }
  .kb-access-card { display:grid; grid-template-columns:1fr 1fr; gap:8px 18px; }
  .kb-access-card-head,.kb-access-note { grid-column:1/-1; }
  .kb-index-metrics,.kb-detail-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kb-detail-hero { grid-template-columns:1fr; }
  .kb-detail-action-card { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kb-action-card-heading,.kb-detail-action-card > p { grid-column:1/-1; }
  .kb-overview-grid,.kb-analysis-grid { grid-template-columns:1fr; }
  .kb-source-row { grid-template-columns:minmax(230px,1fr) minmax(260px,1fr); }
  .kb-source-row-id { grid-column:1; padding-left:48px; }
  .kb-source-row-actions { grid-column:2; grid-row:2; }
}
@media (max-width:820px) {
  .kb-index-hero { padding:23px; }
  .kb-architecture-flow { display:grid; grid-template-columns:1fr; }
  .kb-flow-arrow { transform:rotate(90deg); justify-self:center; }
  .kb-flow-node { width:100%; }
  .kb-access-card { display:block; }
  .kb-connector-row { margin-top:5px; }
  .kb-project-section-head { align-items:stretch; flex-direction:column; }
  .kb-project-tools { align-items:stretch; flex-direction:column; }
  .kb-search-box,.kb-status-filter { width:100%; min-width:0; }
  .kb-project-grid { grid-template-columns:1fr; }
  .kb-detail-title-line { flex-direction:column; }
  .kb-source-pills { padding-left:0; }
  .kb-project-details { grid-template-columns:1fr; }
  .kb-project-details > div:nth-last-child(-n+2) { border-bottom:1px solid #edf1f5; }
  .kb-project-details > div:last-child { border-bottom:0; }
  .kb-source-row { grid-template-columns:1fr; }
  .kb-source-row-id,.kb-source-row-actions { grid-column:1; grid-row:auto; padding-left:0; justify-content:flex-start; }
  .kb-source-row-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kb-source-row-stats > div:nth-child(2) { border-right:0; }
  .kb-source-row-stats > div:nth-child(-n+2) { border-bottom:1px solid #e8edf2; }
  .kb-source-row-id code { max-width:none; }
}
@media (max-width:560px) {
  .kb-index-metrics,.kb-detail-metrics { grid-template-columns:1fr; }
  .kb-index-hero h2 { font-size:27px; }
  .kb-project-card-footer { align-items:flex-start; flex-direction:column; }
  .kb-project-card-footer .button { width:100%; }
  .kb-detail-hero,.kb-project-overview-card,.kb-workflow-card,.kb-datasource-section,.kb-module-panel,.kb-relationship-panel { padding:17px; }
  .kb-detail-action-card { grid-template-columns:1fr; }
  .kb-action-card-heading,.kb-detail-action-card > p { grid-column:1; }
  .kb-download-row { grid-template-columns:1fr; }
  .kb-section-nav { width:100%; overflow:auto; }
  .kb-section-nav a { flex:1; justify-content:center; white-space:nowrap; }
  .kb-project-details > div { grid-template-columns:85px minmax(0,1fr); }
  .kb-workflow-track { grid-template-columns:1fr; gap:8px; }
  .kb-workflow-track i { width:1px; height:17px; margin:0 auto; }
  .kb-relationship-row { grid-template-columns:1fr; }
  .kb-relationship-connector { display:flex; align-items:center; gap:5px; text-align:left; }
  .kb-relationship-connector b { transform:rotate(90deg); }
  .kb-danger-zone { align-items:flex-start; flex-direction:column; }
  .kb-danger-zone .button { width:100%; }
}