:root {
  color-scheme: light;
  --bg: #f2f6f4;
  --surface: #ffffff;
  --surface-2: #eaf2ee;
  --surface-3: #f8faf9;
  --text: #17342c;
  --muted: #657a73;
  --primary: #0b6b50;
  --primary-strong: #074b39;
  --primary-soft: #dcefe7;
  --border: #d7e2dd;
  --code-bg: #102a23;
  --code-text: #ddfff1;
  --shadow: 0 18px 55px rgba(16, 64, 49, .09);
  --low: #1d7242;
  --low-bg: #e2f5e9;
  --medium: #916400;
  --medium-bg: #fff2c7;
  --high: #a64a16;
  --high-bg: #ffe8d7;
  --critical: #ae241b;
  --critical-bg: #fee5e2;
  --task: #0b6b50;
  --command: #245ea8;
  --concept: #7751b7;
  --trouble: #b04b1e;
  --path: #987000;
  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1714;
  --surface: #14231e;
  --surface-2: #1a2f28;
  --surface-3: #10201a;
  --text: #e8f5ef;
  --muted: #9bb1a8;
  --primary: #55c99e;
  --primary-strong: #8de0c0;
  --primary-soft: #1b4033;
  --border: #29443a;
  --code-bg: #07120f;
  --code-text: #d8fff0;
  --shadow: 0 18px 55px rgba(0, 0, 0, .28);
  --low: #73d296;
  --low-bg: #183a27;
  --medium: #f1cb62;
  --medium-bg: #3d3318;
  --high: #f2a16e;
  --high-bg: #402719;
  --critical: #ff9189;
  --critical-bg: #401e1d;
  --task: #55c99e;
  --command: #7db5ff;
  --concept: #b69aef;
  --trouble: #f2a16e;
  --path: #f1cb62;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 90% 0, color-mix(in srgb, var(--primary) 15%, transparent), transparent 28%),
    var(--bg);
  color: var(--text);
  font-family: Tahoma, Arial, "Segoe UI", sans-serif;
  line-height: 1.7;
  transition: background-color .2s ease, color .2s ease;
}
button, input, select { font: inherit; }
button, select { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 35%, transparent);
  outline-offset: 2px;
}
code, kbd { direction: ltr; unicode-bidi: embed; font-family: Consolas, "Courier New", monospace; }
mark { padding: 0 .12em; border-radius: 4px; background: #ffe58a; color: #302600; }
html[data-theme="dark"] mark { background: #685711; color: #fff4b5; }
[hidden] { display: none !important; }

.skip-link { position: fixed; top: 10px; right: 10px; z-index: 10000; padding: 8px 14px; border-radius: 8px; background: var(--primary); color: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.app-shell { width: min(1500px, calc(100% - 32px)); margin: 0 auto; }

.topbar { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: flex; align-items: center; gap: 12px; color: var(--text); text-decoration: none; }
.brand__terminal { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: var(--primary); color: #fff; direction: ltr; font-family: Consolas, monospace; font-weight: 800; box-shadow: 0 10px 25px color-mix(in srgb, var(--primary) 25%, transparent); }
.brand strong, .brand small { display: block; }
.brand small { margin-top: 1px; color: var(--muted); font-size: .76rem; }
.topbar__actions { display: flex; align-items: center; gap: 9px; }
.toolbar-button, .icon-button, .dialog-action, .reset-button, .primary-button, .load-more-button, .open-entity-button, .quick-action-button, .text-button {
  border: 1px solid var(--border); background: var(--surface); color: var(--text);
}
.toolbar-button { min-height: 43px; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 12px; }
.toolbar-button b { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 999px; background: var(--primary-soft); color: var(--primary-strong); font-size: .74rem; }
.icon-button { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; font-size: 1.15rem; }
.toolbar-button:hover, .icon-button:hover, .dialog-action:hover, .text-button:hover { border-color: var(--primary); background: var(--primary-soft); }
.icon-button.is-active { border-color: var(--primary); color: var(--primary-strong); background: var(--primary-soft); }

.hero {
  min-height: 390px;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .55fr);
  align-items: center;
  gap: 36px;
  padding: 48px;
  position: relative;
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, rgba(5, 57, 42, .99), rgba(10, 112, 82, .95)), var(--primary);
  color: #fff;
  box-shadow: var(--shadow);
  overflow: visible;
}
.hero::before { content: ""; position: absolute; inset: auto auto -130px -120px; width: 330px; height: 330px; border: 55px solid rgba(255,255,255,.05); border-radius: 50%; pointer-events: none; }
.hero__content, .hero__stats { position: relative; z-index: 2; }
.hero__eyebrow { display: inline-block; color: #b9edd9; font-size: .78rem; font-weight: 800; letter-spacing: .03em; }
.hero h1 { max-width: 900px; margin: 7px 0 10px; font-size: clamp(2.25rem, 5vw, 4.35rem); line-height: 1.18; }
.hero p { max-width: 830px; margin: 0; color: rgba(255,255,255,.8); font-size: 1.02rem; }
.search-wrapper { position: relative; max-width: 940px; margin-top: 26px; }
.search-box { min-height: 70px; display: flex; align-items: center; gap: 12px; padding: 0 14px 0 11px; border: 3px solid transparent; border-radius: 18px; background: #fff; color: #17342c; box-shadow: 0 18px 35px rgba(0,0,0,.16); transition: .18s ease; }
.search-box:focus-within { border-color: #8de0c0; box-shadow: 0 18px 40px rgba(0,0,0,.22); }
.search-box__icon { font-size: 1.7rem; color: #0b6b50; transform: rotate(-15deg); }
.search-box input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: #17342c; font-size: 1.05rem; }
.search-box input::placeholder { color: #758a82; }
.search-box kbd { padding: 4px 8px; border: 1px solid #d6e1dd; border-bottom-width: 2px; border-radius: 7px; background: #f2f5f4; color: #64766f; font-size: .72rem; white-space: nowrap; }
.clear-button { width: 35px; height: 35px; border: 0; border-radius: 50%; background: #e7efec; color: #26483e; font-size: 1.45rem; line-height: 1; }
.suggestions { position: absolute; z-index: 100; top: calc(100% + 8px); right: 0; left: 0; max-height: 390px; overflow-y: auto; padding: 8px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); color: var(--text); box-shadow: 0 22px 55px rgba(0,0,0,.2); }
.suggestion { width: 100%; display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 11px 12px; border: 0; border-radius: 11px; background: transparent; color: var(--text); text-align: right; }
.suggestion:hover, .suggestion.is-active { background: var(--primary-soft); }
.suggestion strong { display: block; }
.suggestion small { color: var(--muted); }
.suggestion .suggestion-type { align-self: center; padding: 4px 8px; border-radius: 999px; background: var(--surface-2); color: var(--primary-strong); font-size: .72rem; }
.quick-searches { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.quick-searches > span { color: rgba(255,255,255,.67); font-size: .82rem; }
.quick-searches button { padding: 6px 11px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; }
.quick-searches button:hover { background: rgba(255,255,255,.16); }
.hero__stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.hero__stats article { min-height: 97px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: rgba(255,255,255,.08); backdrop-filter: blur(8px); text-align: center; }
.hero__stats article:first-child { grid-column: span 2; }
.hero__stats strong { font-size: 1.6rem; }
.hero__stats span { color: rgba(255,255,255,.72); font-size: .82rem; }

.type-explorer, .control-panel, .results-section { margin-top: 24px; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.section-heading--compact { margin-bottom: 15px; }
.section-heading h2 { margin: 2px 0 0; line-height: 1.35; }
.section-heading p { margin: 5px 0 0; color: var(--muted); font-size: .9rem; }
.eyebrow { display: inline-block; color: var(--primary); font-size: .78rem; font-weight: 800; letter-spacing: .03em; }
.type-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.type-tile { min-width: 0; position: relative; display: grid; justify-items: start; gap: 3px; padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-3); color: var(--text); text-align: right; transition: .18s ease; }
.type-tile:hover { transform: translateY(-3px); border-color: var(--primary); box-shadow: 0 13px 25px rgba(14,62,47,.08); }
.type-tile__icon { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 8px; border-radius: 12px; background: var(--primary-soft); color: var(--primary-strong); direction: ltr; font-weight: 800; }
.type-tile strong { font-size: .98rem; }
.type-tile small { color: var(--muted); line-height: 1.55; }
.type-tile b { position: absolute; top: 14px; left: 14px; min-width: 27px; height: 27px; display: grid; place-items: center; border-radius: 999px; background: var(--surface-2); color: var(--primary-strong); font-size: .72rem; }

.view-tabs { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.view-tab { min-height: 42px; padding: 0 15px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--muted); font-weight: 700; }
.view-tab:hover { background: var(--surface-2); }
.view-tab.is-active { border-color: color-mix(in srgb, var(--primary) 35%, var(--border)); background: var(--primary-soft); color: var(--primary-strong); }
.filters { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)) auto; align-items: end; gap: 12px; margin-top: 18px; }
.filters label { display: grid; gap: 6px; }
.filters label > span { color: var(--muted); font-size: .76rem; font-weight: 700; }
select { width: 100%; min-height: 44px; padding: 0 11px; border: 1px solid var(--border); border-radius: 11px; outline: 0; background: var(--surface-3); color: var(--text); }
select:focus { border-color: var(--primary); }
.reset-button { min-height: 44px; padding: 0 17px; border-radius: 11px; color: var(--primary-strong); font-weight: 700; }
.reset-button:hover { background: var(--primary-soft); border-color: var(--primary); }
.layout-buttons { display: flex; gap: 7px; }
.active-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: -5px 0 20px; }
.filter-chip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border-radius: 999px; background: var(--surface-2); color: var(--text); font-size: .78rem; }
.filter-chip button { width: 19px; height: 19px; padding: 0; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--text) 9%, transparent); color: var(--text); line-height: 1; }

.results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.results-grid.list-view { grid-template-columns: 1fr; }
.results-grid.list-view .entity-card { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(0,1.4fr); column-gap: 24px; }
.results-grid.list-view .entity-card__header, .results-grid.list-view .entity-title, .results-grid.list-view .entity-summary { grid-column: 1; }
.results-grid.list-view .entity-meta, .results-grid.list-view .entity-preview, .results-grid.list-view .entity-card__footer { grid-column: 2; }
.results-grid.list-view .entity-preview { grid-row: 1 / span 3; align-self: center; }
.entity-card { min-width: 0; display: flex; flex-direction: column; padding: 19px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-3); transition: .18s ease; }
.entity-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--primary) 45%, var(--border)); box-shadow: 0 15px 28px rgba(14,62,47,.08); }
.entity-card[data-type="command"] { border-top: 4px solid var(--command); }
.entity-card[data-type="concept"] { border-top: 4px solid var(--concept); }
.entity-card[data-type="troubleshooting"] { border-top: 4px solid var(--trouble); }
.entity-card[data-type="learning_path"] { border-top: 4px solid var(--path); }
.entity-card[data-type="task"] { border-top: 4px solid var(--task); }
.entity-card__header { min-width: 0; display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.entity-card__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.type-badge, .category-badge, .meta-badge, .status-badge, .risk-badge { display: inline-flex; align-items: center; width: fit-content; padding: 4px 8px; border-radius: 999px; font-size: .71rem; font-weight: 800; }
.type-badge { background: var(--primary-soft); color: var(--primary-strong); }
.category-badge, .meta-badge { background: var(--surface-2); color: var(--muted); }
.type-badge.type-command { background: color-mix(in srgb, var(--command) 14%, transparent); color: var(--command); }
.type-badge.type-concept { background: color-mix(in srgb, var(--concept) 14%, transparent); color: var(--concept); }
.type-badge.type-troubleshooting { background: color-mix(in srgb, var(--trouble) 14%, transparent); color: var(--trouble); }
.type-badge.type-learning_path { background: color-mix(in srgb, var(--path) 14%, transparent); color: var(--path); }
.favorite-button { flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); color: var(--muted); font-size: 1.4rem; line-height: 1; }
.favorite-button:hover, .favorite-button.is-favorite { border-color: #d1a200; background: #fff5c9; color: #9a7200; }
html[data-theme="dark"] .favorite-button.is-favorite { background: #453a12; color: #ffe27c; }
.entity-title { margin: 13px 0 4px; font-size: 1.12rem; line-height: 1.45; }
.entity-summary { margin: 0 0 13px; color: var(--muted); font-size: .9rem; }
.entity-meta { display: flex; flex-wrap: wrap; gap: 7px; }
.entity-preview { min-width: 0; margin-top: 14px; padding: 13px; border: 1px dashed var(--border); border-radius: 12px; background: var(--surface); }
.entity-preview code { display: block; overflow-x: auto; color: var(--primary-strong); white-space: nowrap; font-size: .82rem; }
.entity-preview p, .entity-preview ul { margin: 0; color: var(--muted); font-size: .83rem; }
.entity-preview ul { padding-right: 18px; }
.entity-card__footer { display: flex; gap: 8px; margin-top: auto; padding-top: 14px; }
.open-entity-button, .quick-action-button { flex: 1; min-height: 40px; border-radius: 10px; font-size: .8rem; font-weight: 700; }
.open-entity-button { border-color: var(--primary); background: var(--primary); color: #fff; }
.quick-action-button:hover { border-color: var(--primary); background: var(--primary-soft); }

.state-card { min-height: 270px; display: grid; place-items: center; align-content: center; padding: 30px; border: 1px dashed var(--border); border-radius: var(--radius-lg); background: var(--surface-3); text-align: center; }
.state-card h3, .state-card p { margin: 3px 0; }
.state-card p { max-width: 650px; color: var(--muted); }
.state-card--error { border-color: color-mix(in srgb, var(--critical) 45%, var(--border)); background: var(--critical-bg); color: var(--critical); }
.state-card__icon { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 8px; border-radius: 50%; background: var(--surface-2); color: var(--primary); font-size: 1.6rem; font-weight: 900; }
.loader { width: 42px; height: 42px; margin-bottom: 12px; border: 4px solid var(--surface-2); border-top-color: var(--primary); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.primary-button { min-height: 42px; margin-top: 14px; padding: 0 17px; border-color: var(--primary); border-radius: 11px; background: var(--primary); color: #fff; font-weight: 700; }
.load-more-button { min-height: 46px; display: block; margin: 22px auto 0; padding: 0 24px; border-radius: 12px; color: var(--primary-strong); font-weight: 700; }
.load-more-button:hover { border-color: var(--primary); background: var(--primary-soft); }

.toast { position: fixed; z-index: 3000; left: 22px; bottom: 22px; max-width: min(360px, calc(100% - 44px)); padding: 11px 17px; border-radius: 11px; background: var(--code-bg); color: var(--code-text); box-shadow: var(--shadow); opacity: 0; transform: translateY(18px); pointer-events: none; transition: .2s ease; }
.toast.is-visible { opacity: 1; transform: translateY(0); }

.entity-dialog { width: min(1020px, calc(100% - 28px)); max-height: min(900px, calc(100vh - 30px)); overflow-y: auto; padding: 0; border: 1px solid var(--border); border-radius: 24px; background: var(--surface); color: var(--text); box-shadow: 0 30px 90px rgba(0,0,0,.38); }
.entity-dialog::backdrop { background: rgba(4,17,13,.69); backdrop-filter: blur(4px); }
.dialog-topbar { position: sticky; top: 0; z-index: 20; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(12px); }
.dialog-close { width: 40px; height: 40px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); color: var(--text); font-size: 1.45rem; }
.dialog-topbar__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.dialog-action { min-height: 40px; padding: 0 13px; border-radius: 10px; font-size: .8rem; font-weight: 700; }
.dialog-body { padding: 30px; }
.entity-hero { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: start; padding-bottom: 22px; border-bottom: 1px solid var(--border); }
.entity-hero h2 { margin: 8px 0 7px; font-size: clamp(1.7rem, 4vw, 2.6rem); line-height: 1.3; }
.entity-hero p { margin: 0; color: var(--muted); }
.entity-hero__meta { min-width: 210px; display: grid; gap: 8px; }
.info-pill { display: flex; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-3); font-size: .8rem; }
.info-pill span { color: var(--muted); }
.dialog-section { margin-top: 24px; }
.dialog-section__heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.dialog-section h3 { margin: 0; font-size: 1.12rem; }
.section-note { color: var(--muted); font-size: .8rem; }
.callout { padding: 14px 16px; border-right: 4px solid var(--primary); border-radius: 12px; background: var(--primary-soft); color: var(--text); }
.callout--warning { border-color: var(--high); background: var(--high-bg); color: var(--high); }
.callout--danger { border-color: var(--critical); background: var(--critical-bg); color: var(--critical); }
.variables-grid, .detail-grid, .resource-grid, .examples-grid, .concept-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 11px; }
.variable-field { display: grid; gap: 6px; }
.variable-field span { color: var(--muted); font-size: .78rem; font-weight: 700; }
.variable-field input { min-height: 43px; padding: 0 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-3); color: var(--text); outline: 0; direction: ltr; }
.variable-field input:focus { border-color: var(--primary); }
.progress-panel { padding: 13px 15px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-3); }
.progress-panel__header { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: .8rem; }
.progress-track { height: 9px; margin-top: 9px; overflow: hidden; border-radius: 999px; background: var(--surface-2); }
.progress-bar { height: 100%; border-radius: inherit; background: var(--primary); transition: width .2s ease; }
.steps-list { display: grid; gap: 12px; }
.step-card { display: grid; grid-template-columns: auto 1fr; gap: 12px; padding: 16px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface-3); }
.step-card.is-complete { border-color: color-mix(in srgb, var(--low) 55%, var(--border)); background: var(--low-bg); }
.step-check { width: 28px; height: 28px; margin-top: 2px; accent-color: var(--primary); }
.step-card h4 { margin: 0 0 4px; }
.step-card p { margin: 0 0 10px; color: var(--muted); font-size: .87rem; }
.command-box { min-width: 0; display: flex; align-items: stretch; overflow: hidden; border-radius: 11px; background: var(--code-bg); direction: ltr; }
.command-box code { flex: 1; min-width: 0; overflow-x: auto; padding: 13px; color: var(--code-text); white-space: nowrap; font-size: .84rem; }
.command-copy { flex: 0 0 auto; padding: 0 13px; border: 0; border-left: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.08); color: #fff; font-weight: 700; }
.expected-result { margin-top: 9px; padding: 9px 11px; border-radius: 9px; background: var(--surface); color: var(--muted); font-size: .8rem; }
.verification-list, .error-list, .option-list, .module-list { display: grid; gap: 10px; }
.verification-item, .error-item, .option-item, .module-item, .resource-card, .concept-card, .example-card { padding: 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-3); }
.verification-item h4, .error-item h4, .example-card h4, .concept-card h4 { margin: 0 0 6px; }
.verification-item code, .error-check code, .syntax-box { display: block; overflow-x: auto; margin: 7px 0; padding: 11px; border-radius: 9px; background: var(--code-bg); color: var(--code-text); white-space: nowrap; }
.error-item { border-right: 4px solid var(--high); }
.error-item p, .option-item p, .concept-card p, .example-card p { margin: 4px 0; color: var(--muted); font-size: .85rem; }
.error-item ul, .bullet-list, .rollback-list { margin: 7px 0 0; padding-right: 21px; }
.error-check { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--border); }
.resource-card code { display: block; overflow-x: auto; margin-top: 4px; color: var(--primary-strong); }
.option-item { display: grid; grid-template-columns: minmax(120px,.35fr) 1fr; gap: 12px; align-items: start; }
.option-item code { color: var(--command); font-weight: 700; }
.example-card .command-box { margin-top: 10px; }
.mental-model { padding: 20px; border: 1px dashed color-mix(in srgb, var(--concept) 50%, var(--border)); border-radius: 15px; background: color-mix(in srgb, var(--concept) 7%, var(--surface)); text-align: center; font-size: 1.02rem; }
.module-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
.module-number { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary-strong); font-size: .78rem; font-weight: 800; }
.module-item.is-complete { border-color: var(--low); background: var(--low-bg); }
.module-item h4 { margin: 0; }
.module-item p { margin: 2px 0 0; color: var(--muted); font-size: .82rem; }
.module-actions { display: flex; gap: 7px; }
.module-actions button { min-height: 36px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: var(--text); font-size: .76rem; }

.graph-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 16px; background: radial-gradient(circle at center, var(--surface), var(--surface-3)); }
.knowledge-graph { width: 100%; min-width: 700px; height: 390px; display: block; }
.graph-line { stroke: color-mix(in srgb, var(--primary) 38%, var(--border)); stroke-width: 2; }
.graph-node circle { fill: var(--surface); stroke: var(--border); stroke-width: 2; transition: .15s ease; }
.graph-node text { fill: var(--text); font-family: Tahoma, Arial, sans-serif; font-size: 12px; pointer-events: none; }
.graph-node[data-current="true"] circle { fill: var(--primary); stroke: var(--primary); }
.graph-node[data-current="true"] text { fill: #fff; font-weight: 800; }
.graph-node:not([data-current="true"]) { cursor: pointer; }
.graph-node:not([data-current="true"]):hover circle { stroke: var(--primary); fill: var(--primary-soft); }
.related-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 11px; }
.related-button { padding: 7px 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-3); color: var(--text); }
.related-button:hover { border-color: var(--primary); background: var(--primary-soft); }

.risk-low { background: var(--low-bg); color: var(--low); }
.risk-medium { background: var(--medium-bg); color: var(--medium); }
.risk-high { background: var(--high-bg); color: var(--high); }
.risk-critical { background: var(--critical-bg); color: var(--critical); }
.footer { display: flex; justify-content: space-between; gap: 20px; padding: 23px 10px 32px; color: var(--muted); font-size: .8rem; }
.footer p { margin: 0; }

@media (max-width: 1200px) {
  .hero { grid-template-columns: 1fr; }
  .hero__stats { grid-template-columns: repeat(5,1fr); }
  .hero__stats article:first-child { grid-column: auto; }
  .type-grid { grid-template-columns: repeat(3,1fr); }
  .results-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 820px) {
  .app-shell { width: min(100% - 18px,1500px); }
  .topbar { min-height: 70px; }
  .brand small, .toolbar-button > span:not(:first-child) { display: none; }
  .hero { min-height: auto; padding: 29px 20px; border-radius: 20px; }
  .hero h1 { font-size: 2.25rem; }
  .search-box { min-height: 62px; }
  .search-box kbd { display: none; }
  .hero__stats { grid-template-columns: repeat(2,1fr); }
  .hero__stats article:first-child { grid-column: span 2; }
  .type-explorer, .control-panel, .results-section { padding: 15px; border-radius: 19px; }
  .type-grid { grid-template-columns: 1fr 1fr; }
  .filters { grid-template-columns: 1fr 1fr; }
  .reset-button { grid-column: span 2; }
  .results-grid, .results-grid.list-view { grid-template-columns: 1fr; }
  .results-grid.list-view .entity-card { display: flex; }
  .results-grid.list-view .entity-card > * { grid-column: auto; grid-row: auto; }
  .entity-hero { grid-template-columns: 1fr; }
  .entity-hero__meta { min-width: 0; grid-template-columns: repeat(2,1fr); }
  .variables-grid, .detail-grid, .resource-grid, .examples-grid, .concept-grid { grid-template-columns: 1fr; }
  .dialog-body { padding: 20px 16px 28px; }
  .dialog-topbar { align-items: start; }
  .dialog-topbar__actions { justify-content: flex-end; }
  .option-item { grid-template-columns: 1fr; }
  .module-item { grid-template-columns: auto 1fr; }
  .module-actions { grid-column: 2; }
  .footer { flex-direction: column; }
}
@media (max-width: 500px) {
  .type-grid, .filters { grid-template-columns: 1fr; }
  .reset-button { grid-column: auto; }
  .quick-searches button:nth-of-type(n+4) { display: none; }
  .entity-card__footer { flex-direction: column; }
  .dialog-action { padding: 0 9px; }
  .entity-hero__meta { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}