/* НаркоЗав Zero-Build: оболочка (сайдбар/шапка/поиск) + контент + движок тестов.
 * Дизайн-система живого сайта: классы Tailwind/alko берутся из _next/static/chunks/live*.css.
 * Здесь — только то, чего там нет: каркас, сайдбар-статика, контент zb-*, тесты, виджеты.
 */
:root {
  --font-geist-sans: "Geist", "Geist Fallback", sans-serif;
  --font-geist-mono: "Geist Mono", "Geist Mono Fallback", monospace;
  --font-montserrat: "Montserrat", "Montserrat Fallback", sans-serif;
  --font-unbounded: "Unbounded", "Unbounded Fallback", sans-serif;
  --ink: #1a2b3c; --muted: #5b6b7c;
  --deep: #1e3a5f; --dark: #0f2440; --warm: #faf6ef; --accent: #0d910d;
  --danger: #b3261e; --warn: #8a5a00; --line: #dfe7ef;
  --radius: 12px; --max: 960px;
}
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: clip; }
img { max-width: 100%; height: auto; }

/* framer-motion SSR-стили (initial opacity:0): без JS показываем всё */
[style*="opacity:0;"], [style$="opacity:0"] { opacity: 1 !important; transform: none !important; }

/* каркас: сайдбар + правая колонка */
.nk-app { display: flex; min-height: 100vh; align-items: stretch; }
.nk-inset { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.nk-inset > main { flex: 1; }

/* сайдбар (статика поверх живых utility-классов) */
.nk-sb-gap { width: var(--sidebar-width, 16rem); flex-shrink: 0; }
.nk-sb { position: fixed; top: 0; bottom: 0; left: 0; width: var(--sidebar-width, 16rem); z-index: 60;
  background: linear-gradient(178deg, #0f2440 0%, #14315a 55%, #1e3a5f 100%); color: #f3ecdd; display: flex; }
.nk-sb::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: radial-gradient(120% 40% at 80% 0%, rgba(46,139,87,.25), transparent 60%),
             radial-gradient(100% 35% at 10% 100%, rgba(72,209,204,.12), transparent 60%); }
.nk-sb-inner { position: relative; display: flex; flex-direction: column; width: 100%; min-height: 0; }
.nk-sb-head { padding: 16px 12px 10px; }
.nk-sb-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.nk-sb-logoic { display: inline-flex; height: 40px; width: 40px; align-items: center; justify-content: center;
  border-radius: 12px; background: linear-gradient(135deg, #0d910d, #0a6e0a); box-shadow: 0 4px 14px rgba(13,145,13,.35); }
.nk-sb-logoic img { height: 28px; width: 28px; }
.nk-sb-logotx { display: flex; flex-direction: column; line-height: 1.1; }
.nk-sb-logotx b { font-family: var(--font-unbounded), sans-serif; font-size: 14px; letter-spacing: 1px; color: #faf6ef; }
.nk-sb-logotx small { font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: rgba(250,246,239,.45); }
.nk-sb-nav { flex: 1; overflow-y: auto; padding: 4px 8px 12px; display: flex; flex-direction: column; gap: 2px; }
.nk-sb-label { font-size: 11px; text-transform: uppercase; letter-spacing: .14em; color: rgba(250,246,239,.4); padding: 12px 8px 4px; margin: 0; }
.nk-sb-cat summary { list-style: none; cursor: pointer; }
.nk-sb-cat summary::-webkit-details-marker { display: none; }
.nk-sb-chip { display: inline-flex; height: 20px; width: 20px; flex-shrink: 0; align-items: center; justify-content: center;
  border-radius: 6px; box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.nk-sb-chip svg { height: 12px; width: 12px; color: #fff; }
.nk-sb-sub { padding: 2px 4px 6px 30px; display: flex; flex-direction: column; gap: 1px; }
.nk-sb-all { font-size: 12px; font-weight: 700; color: #7fd67f; padding: 3px 0; text-decoration: none; }
.nk-sb-sublink { font-size: 13px; font-weight: 600; color: rgba(250,246,239,.85); padding: 3px 0; text-decoration: none; }
.nk-sb-addlink { font-size: 13px; color: rgba(250,246,239,.6); padding: 2px 0 2px 10px; text-decoration: none; }
.nk-sb-sublink:hover, .nk-sb-addlink:hover, .nk-sb-all:hover { color: #fff; text-decoration: underline; }
a[data-sb-link].active { background: rgba(255,255,255,.1); color: #fff; border-radius: 6px; }
.nk-sb-foot { padding: 12px; border-top: 1px solid rgba(255,255,255,.12); }
.nk-sb-sos { display: flex; gap: 10px; align-items: center; background: rgba(179,38,30,.25);
  border: 1px solid rgba(255,120,110,.4); border-radius: 12px; padding: 10px 12px; color: #fff; text-decoration: none; }
.nk-sb-sos b { display: block; font-size: 14px; }
.nk-sb-sos small { color: rgba(255,255,255,.7); font-size: 11px; }

/* шапка: кнопки поверх живых классов */
.nk-iconbtn { display: inline-flex; height: 36px; width: 36px; align-items: center; justify-content: center;
  border-radius: 8px; border: 0; background: transparent; color: var(--deep); cursor: pointer; }
.nk-iconbtn:hover { background: rgba(30,58,95,.08); }
.nk-iconbtn svg { height: 20px; width: 20px; }
.nk-headcall { margin-left: auto; font-weight: 800; color: var(--deep); text-decoration: none; white-space: nowrap; font-size: 15px; }
.nk-headcall:hover { color: var(--accent); }
.nk-searchdrop { position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: #fff;
  border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 32px rgba(15,36,64,.18);
  max-height: 320px; overflow-y: auto; z-index: 80; }
.nk-searchdrop a { display: block; padding: 8px 12px; font-size: 14px; color: var(--ink); text-decoration: none; }
.nk-searchdrop a:hover, .nk-searchdrop a.hot { background: #f2f6fa; }
.nk-searchdrop .none { padding: 10px 12px; font-size: 13px; color: var(--muted); }

/* футерные ссылки */
.nk-flink { display: block; width: 100%; text-align: left; font-size: 14px; color: rgba(250,246,239,.7); text-decoration: none; padding: 2px 0; }
.nk-flink:hover { color: #2eab5e; }

/* контент */
.nk-inset > main { background: #fff; }
.zb-wrap { max-width: var(--max); margin: 0 auto; padding: 28px 20px 60px; }
.zb-wrap h1 { font-size: clamp(24px, 4vw, 32px); line-height: 1.25; color: var(--deep); font-weight: 800; }
.zb-wrap h2 { font-size: clamp(19px, 3vw, 24px); color: var(--deep); margin-top: 1.8em; font-weight: 700; }
.zb-wrap h3 { font-size: 18px; color: var(--deep); }
.zb-lead { font-size: 18px; color: var(--muted); }
.zb-crumb { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.zb-list { padding-left: 20px; }
.zb-list li { margin: 6px 0; }
.zb-toc { background: #f2f6fa; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 18px; margin: 18px 0; }
.zb-toc ul { margin: 8px 0; padding-left: 20px; }
.zb-badge { display: inline-block; background: #f2f6fa; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; padding: 1px 10px; margin-right: 6px; }
.zb-table { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 15px; display: block; overflow-x: auto; }
.zb-table th, .zb-table td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }
.zb-table th { background: #f2f6fa; }
.zb-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin: 12px 0; }
.zb-stats > div { background: #f2f6fa; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; }
.zb-stats dt { font-weight: 700; color: var(--deep); }
.zb-stats dd { margin: 0; }
.zb-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.zb-faq details { border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; margin: 8px 0; }
.zb-faq summary { cursor: pointer; font-weight: 600; }
.zb-stories blockquote { border-left: 4px solid var(--accent); margin: 12px 0; padding: 8px 16px; background: #f2f6fa; border-radius: 0 var(--radius) var(--radius) 0; }
.zb-stories cite { font-style: normal; color: var(--muted); font-size: 14px; }
.zb-hotline { background: #fff7e6; border: 1px solid #f0d48a; border-radius: var(--radius); padding: 14px 18px; margin: 24px 0; font-size: 17px; }
.zb-warn { background: #fdecea; border: 1px solid #f5b5b0; border-radius: var(--radius); padding: 14px 18px; margin: 16px 0; }
.zb-callout { border: 1px solid var(--line); border-left-width: 5px; border-radius: var(--radius); padding: 12px 16px; margin: 14px 0; background: #f2f6fa; }
.zb-callout--warning, .zb-callout--danger { background: #fdecea; border-color: #f5b5b0; }
.zb-callout--tip, .zb-callout--stat { background: #ecf7ec; border-color: #9ccc9c; }
.zb-illust { border: 1px dashed var(--line); border-radius: var(--radius); padding: 12px 16px; margin: 14px 0; background: #f2f6fa; }
.zb-btn, .zb-test-nav button, .zb-test-nav .zb-btn, #zbSend, #zbRetry, #zbSave {
  display: inline-block; background: var(--deep); color: #fff; border: 0; border-radius: 10px;
  padding: 12px 20px; font-size: 16px; font-weight: 700; cursor: pointer; text-decoration: none; margin: 4px 6px 4px 0;
}
.zb-btn:hover, #zbSend:hover { filter: brightness(1.15); }
.zb-test-nav button:disabled { opacity: .45; cursor: default; }

/* движок тестов */
.zb-test-head small { color: var(--muted); font-weight: 400; }
.zb-test-meta { color: var(--muted); font-size: 14px; }
.zb-test-scale { background: #f2f6fa; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; font-size: 14px; }
.zb-test-prog { display: flex; justify-content: space-between; font-size: 14px; color: var(--muted); }
.zb-test-bar { height: 8px; background: #e6ebf1; border-radius: 999px; overflow: hidden; margin: 6px 0 18px; }
.zb-test-bar span { display: block; height: 100%; background: var(--deep); }
.zb-test-q { border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; background: #fff; box-shadow: 0 2px 12px rgba(15,36,64,.06); }
.zb-test-qtext { font-size: 18px; margin-top: 0; }
.zb-test-opts { display: grid; gap: 10px; }
.zb-test-opt { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; cursor: pointer; }
.zb-test-opt.sel { border-color: var(--deep); background: #f2f6fa; }
.zb-test-opt input { width: 18px; height: 18px; }
.zb-test-dots { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0; }
.zb-test-dots span { width: 26px; height: 26px; border-radius: 50%; background: #e6ebf1; color: var(--muted); font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.zb-test-dots .on { background: var(--deep); color: #fff; }
.zb-test-dots .done { background: var(--accent); color: #fff; }
.zb-test-nav { display: flex; justify-content: space-between; margin-top: 12px; }
.zb-gate { border: 2px solid var(--line); border-radius: var(--radius); padding: 22px; margin: 18px 0; text-align: center; }
.zb-gate input[type="tel"] { width: 100%; max-width: 320px; font-size: 18px; padding: 12px; border-radius: 10px; border: 1px solid var(--line); text-align: center; margin: 8px 0; }
.zb-consent { display: flex; gap: 8px; font-size: 13px; color: var(--muted); text-align: left; max-width: 480px; margin: 8px auto; }
.zb-err { color: var(--danger); }
.zb-note { font-size: 13px; color: var(--muted); }
.zb-res { border: 2px solid var(--line); border-radius: var(--radius); padding: 22px; margin: 18px 0; }
.zb-res-score { font-size: 48px; font-weight: 800; color: var(--deep); margin: 0; }
.zb-res-score small { font-size: 16px; color: var(--muted); }
.zb-res-level { font-size: 22px; font-weight: 700; }
.zb-risk-low { border-color: #9ccc9c; } .zb-risk-low .zb-res-level { color: var(--accent); }
.zb-risk-mid { border-color: #f0d48a; } .zb-risk-mid .zb-res-level { color: var(--warn); }
.zb-risk-high { border-color: #f5b5b0; } .zb-risk-high .zb-res-level { color: var(--danger); }

/* виджеты (подняты над нижней панелью поиска) */
.nk-fab { position: fixed; right: 16px; bottom: 64px; background: var(--danger); color: #fff; font-weight: 800; padding: 14px 20px; border-radius: 999px; text-decoration: none; box-shadow: 0 4px 16px rgba(0,0,0,.25); z-index: 60; }
.nk-top { position: fixed; right: 16px; bottom: 124px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: #fff; font-size: 20px; cursor: pointer; z-index: 60; }
.nk-cookie { position: fixed; left: 12px; right: 12px; bottom: 62px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 6px 24px rgba(0,0,0,.18); padding: 12px 16px; display: flex; gap: 12px; align-items: center; z-index: 70; font-size: 14px; }
.nk-cookie button { background: var(--deep); color: #fff; border: 0; border-radius: 8px; padding: 10px 18px; font-weight: 700; cursor: pointer; white-space: nowrap; }

/* мобильный сайдбар */
.nk-sb-veil { display: none; }
@media (max-width: 1023px) {
  .nk-sb-gap { display: none; }
  .nk-sb { transform: translateX(-105%); transition: transform .25s ease; }
  .nk-app.sb-open .nk-sb { transform: none; }
  .nk-app.sb-open .nk-sb-veil { display: block; position: fixed; inset: 0; background: rgba(10,20,35,.5); z-index: 55; }
  .nk-headcall { font-size: 13px; }
  .zb-cols { grid-template-columns: 1fr; }
  .zb-wrap { padding: 20px 14px 48px; }
}
@media (min-width: 1024px) {
  .nk-app.sb-collapsed .nk-sb { width: 4.5rem; }
  .nk-app.sb-collapsed .nk-sb-gap { width: 4.5rem; }
  /* фолбэк скрытия (помимо живых group-data-правил): без текстового мусора */
  .nk-app.sb-collapsed [data-sidebar="group-label"],
  .nk-app.sb-collapsed [data-sidebar="menu-sub"] { display: none !important; }
  .nk-app.sb-collapsed .nk-sb-logotx,
  .nk-app.sb-collapsed .nk-sb-sos span { display: none; }
  /* логотип целиком влезает в 32px-кнопку */
  .nk-app.sb-collapsed [data-sb-logo] { height: 32px !important; width: 32px !important; min-width: 32px; padding: 4px !important; justify-content: center; }
  .nk-app.sb-collapsed [data-sb-logo] > span:first-child { height: 24px !important; width: 24px !important; }
  .nk-app.sb-collapsed [data-sb-logo] img { height: 18px !important; width: 18px !important; }
}

/* === sidebar polish iz globals.css (1:1) === */


/* ═══════════════════════════════════════════════════════
   SIDEBAR — modern polish
   ═══════════════════════════════════════════════════════ */

/* Deep navy gradient + soft green aurora glow + edge light */
[data-slot="sidebar-inner"] {
  background:
    radial-gradient(900px 420px at -25% -12%, rgba(46, 139, 87, 0.16), transparent 62%),
    radial-gradient(600px 380px at 130% 108%, rgba(52, 152, 219, 0.08), transparent 60%),
    linear-gradient(180deg, #16304F 0%, #1E3A5F 48%, #182F4E 100%);
  box-shadow:
    inset -1px 0 0 rgba(244, 241, 225, 0.07),
    24px 0 48px -32px rgba(0, 0, 0, 0.55);
}
======

.dark [data-slot="sidebar-inner"] {
  background:
    radial-gradient(900px 420px at -25% -12%, rgba(46, 139, 87, 0.14), transparent 62%),
    radial-gradient(600px 380px at 130% 108%, rgba(52, 152, 219, 0.07), transparent 60%),
    linear-gradient(180deg, #071426 0%, #0A1B30 48%, #081728 100%);
}
======


/* ── Menu buttons ── */
[data-slot="sidebar"] [data-sidebar="menu-button"] {
  position: relative;
  border-radius: 0.625rem;
  transition-property: width, height, padding, background-color, color, box-shadow, transform;
  transition-duration: 200ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
======

[data-slot="sidebar"] [data-sidebar="menu-button"]:hover {
  transform: translateX(2px);
}
======

[data-slot="sidebar"] [data-sidebar="menu-button"]:active {
  transform: translateX(2px) scale(0.99);
}
======

[data-slot="sidebar"] [data-sidebar="menu-button"][data-active="true"] {
  background: linear-gradient(
    90deg,
    var(--sb-active-from, rgba(46, 139, 87, 0.28)) 0%,
    var(--sb-active-mid, rgba(46, 139, 87, 0.12)) 60%,
    transparent 100%
  );
  box-shadow: inset 0 0 0 1px var(--sb-active-ring, rgba(46, 139, 87, 0.28));
}
======

[data-slot="sidebar"] [data-sidebar="menu-button"][data-active="true"]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22%;
  bottom: 22%;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #48D1CC, var(--sb-indicator, #2E8B57));
  box-shadow: 0 0 10px var(--sb-indicator, rgba(46, 139, 87, 0.85));
}
======


/* ── Group labels: green marker dot ── */
[data-slot="sidebar"] [data-sidebar="group-label"] {
  letter-spacing: 0.14em;
}
======

[data-slot="sidebar"] [data-sidebar="group-label"]::before {
  content: "";
  order: -1;
  width: 4px;
  height: 4px;
  margin-right: 7px;
  border-radius: 999px;
  background: #3CB371;
  box-shadow: 0 0 8px rgba(46, 139, 87, 0.9);
}
======


/* ── Separators: soft fading line ── */
[data-slot="sidebar"] [data-sidebar="separator"] {
  height: 1px;
  border: 0;
  background: linear-gradient(90deg, transparent, rgba(244, 241, 225, 0.16), transparent);
}
======


/* ── Sub menus: guide rail + pill buttons ── */
[data-slot="sidebar"] [data-sidebar="menu-sub"] {
  position: relative;
  border-left: 0;
}
======

[data-slot="sidebar"] [data-sidebar="menu-sub"]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(244, 241, 225, 0.16), rgba(244, 241, 225, 0.03));
}
======

[data-slot="sidebar"] [data-sidebar="menu-sub-button"] {
  border-radius: 0.5rem;
  transition: background-color 0.2s ease, color 0.2s ease;
}
======

[data-slot="sidebar"] [data-sidebar="menu-sub-button"]:hover {
  background: rgba(244, 241, 225, 0.07);
}
======

[data-slot="sidebar"] [data-sidebar="menu-sub-button"][data-active="true"] {
  background: rgba(46, 139, 87, 0.18);
  color: #EAF7F0;
}
======

[data-slot="sidebar"] [data-slot="collapsible-content"][data-state="open"] {
  animation: sb-content-in 0.22s ease-out;
}
======


/* ── Sidebar scrollbar: whisper-thin, shows on hover ── */
[data-slot="sidebar-content"] {
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
======

[data-slot="sidebar-content"]:hover {
  scrollbar-color: rgba(244, 241, 225, 0.22) transparent;
}
======

[data-slot="sidebar-content"]::-webkit-scrollbar {
  width: 6px;
}
======

[data-slot="sidebar-content"]::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 999px;
  border: none;
  background-clip: border-box;
}
======

[data-slot="sidebar-content"]:hover::-webkit-scrollbar-thumb {
  background: rgba(244, 241, 225, 0.22);
}
@keyframes sb-content-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* нижняя панель поиска: закреплена внизу, в цвет сайдбара/футера */
.nk-searchbar { position: sticky; bottom: 0; z-index: 50;
  background: linear-gradient(180deg, var(--deep), var(--dark));
  border-top: 1px solid rgba(255,255,255,.14); box-shadow: 0 -10px 26px rgba(15,36,64,.22); }
.nk-searchbar-form { position: relative; display: flex; align-items: center;
  max-width: 860px; margin: 0 auto; padding: 7px 14px; }
.nk-searchbar-form > svg { position: absolute; left: 27px; top: 50%; transform: translateY(-50%);
  width: 15px; height: 15px; color: rgba(255,255,255,.45); pointer-events: none; }
.nk-searchbar-form input { flex: 1; width: 100%; box-sizing: border-box;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 999px;
  padding: 8px 78px 8px 32px; font-size: 14px; font-family: inherit; color: #fff; outline: none;
  transition: border-color .25s, background .25s, box-shadow .25s; }
.nk-searchbar-form input::placeholder { color: rgba(255,255,255,.45); }
.nk-searchbar-form input::-webkit-search-cancel-button { -webkit-appearance: none; }
.nk-searchbar-form input:focus { border-color: rgba(127,214,127,.65); background: rgba(255,255,255,.14);
  box-shadow: 0 0 0 3px rgba(46,139,87,.25); }
.nk-searchbar-kbd { position: absolute; right: 26px; top: 50%; transform: translateY(-50%);
  display: inline-flex; gap: 2px; pointer-events: none; }
.nk-searchbar-kbd span { padding: 2px 6px; font-size: 11px; font-weight: 600; line-height: 1;
  color: rgba(255,255,255,.55); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14);
  border-radius: 5px; }
@media (max-width: 767px) {
  .nk-searchbar-kbd { display: none; }
  .nk-searchbar-form input { padding-right: 32px; }
  .nk-searchbar-form { padding: 6px 12px; }
}

/* выпадашка нижней панели раскрывается вверх */
.nk-searchdrop--up { top: auto; bottom: calc(100% + 10px); max-height: min(430px, 55vh); }
.nk-searchdrop mark { background: rgba(46,139,87,.18); color: inherit; border-radius: 2px; padding: 0 1px; }
.nk-searchdrop .all { display: block; padding: 9px 12px; font-size: 13px; font-weight: 700;
  color: var(--deep); text-decoration: none; border-top: 1px solid var(--line); }
.nk-searchdrop .all:hover { background: #f2f6fa; }
.nk-searchdrop .foot { display: flex; gap: 14px; flex-wrap: wrap; padding: 7px 12px;
  border-top: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.nk-searchdrop .foot kbd { font-family: inherit; font-size: 10px; margin-right: 3px;
  border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; background: #f7fafc; }

/* страница выдачи /search/ */
.zb-search { padding-top: 44px; }
.zb-search-form { display: flex; gap: 10px; flex-wrap: wrap; margin: 18px 0 22px; }
.zb-search-form input { flex: 1 1 260px; min-width: 220px; padding: 12px 18px;
  border: 1px solid var(--line); border-radius: 999px; background: #fff; font: inherit;
  color: var(--ink); outline: none; transition: border-color .2s, box-shadow .2s; }
.zb-search-form input:focus { border-color: var(--deep); box-shadow: 0 0 0 3px rgba(30,58,95,.12); }
.zb-search-form button { padding: 12px 28px; border: 0; border-radius: 999px;
  background: var(--deep); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.zb-search-form button:hover { filter: brightness(1.15); }
.zb-search-note { color: var(--muted); font-size: 16px; }
.zb-search-count { color: var(--muted); font-size: 15px; margin: 0 0 14px; }
.zb-search-list { display: flex; flex-direction: column; gap: 10px; }
.zb-search-item { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.zb-search-item:hover { border-color: var(--deep); box-shadow: 0 4px 14px rgba(15,36,64,.08); }
.zb-search-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.zb-search-cat { align-self: flex-start; background: #f2f6fa; border: 1px solid var(--line);
  border-radius: 999px; font-size: 11px; font-weight: 600; color: var(--muted); padding: 1px 10px; }
.zb-search-title { font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--deep); }
.zb-search-item:hover .zb-search-title { text-decoration: underline; }
.zb-search-desc { font-size: 14px; line-height: 1.45; color: var(--muted); }
.zb-search-arrow { flex-shrink: 0; margin-top: 4px; color: var(--deep); opacity: .45; }
.zb-search mark, .zb-search-item mark { background: rgba(13,145,13,.16); color: inherit; border-radius: 2px; padding: 0 1px; }