/* Кейс «Коммерсантъ» (28.10.2026): интерактивные блоки вместо обычной галереи — partials/case-kommersant.html, case-kom.js.
   Цвета и шрифты — токены нового стиля (v10.css): чернила, приглушённый, один акцент #3d12fc, заголовки Unbounded. */
.kom-pages,.kom-bp,.kom-rel,.kom-team{--k-line:rgba(14,13,22,.12)}

/* ---------- ключевые страницы: вкладки слева, окно браузера справа ---------- */
.kom-pages{display:grid;gap:28px}
.kom-pages__tabs{display:flex;gap:10px;overflow-x:auto;margin:0 calc(-1 * var(--gut,20px));padding:0 var(--gut,20px) 4px;scrollbar-width:none}
.kom-pages__tabs::-webkit-scrollbar{display:none}
.kom-pages__tabs button{flex:none;display:grid;gap:6px;width:min(240px,70vw);padding:16px 0 0;border:0;border-top:1px solid var(--k-line);background:none;color:var(--r-ink);text-align:left;cursor:pointer;
  font:inherit;position:relative;transition:color .25s}
.kom-pages__tabs b{font:600 clamp(17px,1.4vw,21px)/1.15 var(--r-d);letter-spacing:-.03em}
.kom-pages__tabs span{color:var(--r-mute);font-size:14px;line-height:1.45}
.kom-pages__tabs button::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--r-acc);transform:scaleX(0);transform-origin:0 50%}
.kom-pages__tabs button[aria-selected="true"] b{color:var(--r-acc)}
.kom-pages__tabs button[aria-selected="true"]::before{transform:scaleX(max(var(--p,0),.12))}
.kom-pages__tabs button:hover b{color:var(--r-acc)}
.kom-browser{position:relative;border:1px solid var(--k-line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 40px 80px -48px rgba(14,13,22,.45)}
.kom-browser__bar{display:flex;align-items:center;gap:7px;height:42px;padding:0 16px;border-bottom:1px solid var(--k-line);background:#f4f4f6}
.kom-browser__bar i{width:10px;height:10px;border-radius:50%;background:#d9d8df}
.kom-browser__url{margin-left:12px;padding:5px 14px;border-radius:99px;background:#fff;color:var(--r-mute);font-size:13px;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kom-browser__view{position:relative;height:clamp(360px,48vw,640px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;outline:0}
.kom-shot{display:none;width:100%;height:auto}
.kom-shot.is-on{display:block;animation:komfade .45s ease both}
.kom-browser__prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(14,13,22,.06)}
.kom-browser__prog i{display:block;height:100%;background:var(--r-acc);transform:scaleX(var(--p,0));transform-origin:0 50%}
@keyframes komfade{from{opacity:0}to{opacity:1}}
@media (min-width:1024px){
  .kom-pages{grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:48px;align-items:start}
  .kom-pages__tabs{flex-direction:column;gap:0;overflow:visible;margin:0;padding:0}
  .kom-pages__tabs button{width:auto;padding:18px 0 20px}
}

/* ---------- пять разрешений: ползунок ширины и рамка, которая сужается ---------- */
.kom-bp{display:grid;gap:28px}
.kom-bp__now{display:flex;align-items:baseline;gap:14px;margin:0 0 14px}
.kom-bp__now b{font:600 clamp(34px,4vw,56px)/1 var(--r-d);letter-spacing:-.04em;color:var(--r-ink);font-variant-numeric:tabular-nums}
.kom-bp__now span{color:var(--r-mute);font-size:16px}
.kom-bp__range{-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;background:none;cursor:pointer}
.kom-bp__range::-webkit-slider-runnable-track{height:2px;background:linear-gradient(var(--r-acc),var(--r-acc)) 0/var(--pct,70%) 100% no-repeat,rgba(14,13,22,.18)}
.kom-bp__range::-moz-range-track{height:2px;background:rgba(14,13,22,.18)}
.kom-bp__range::-moz-range-progress{height:2px;background:var(--r-acc)}
.kom-bp__range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-10px;border-radius:50%;border:2px solid var(--r-acc);background:#fafafa;box-shadow:0 0 0 6px rgba(61,18,252,.1)}
.kom-bp__range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;border:2px solid var(--r-acc);background:#fafafa}
.kom-bp__range:focus-visible{outline:2px solid var(--r-acc);outline-offset:4px}
.kom-bp__marks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px}
.kom-bp__marks button{display:grid;gap:2px;padding:10px 0 0;border:0;border-top:1px solid var(--k-line);background:none;color:var(--r-ink);font:600 14px/1.2 inherit;text-align:left;cursor:pointer}
.kom-bp__marks button span{color:var(--r-mute);font-weight:400;font-size:12.5px}
.kom-bp__marks button.is-on{color:var(--r-acc);border-top-color:var(--r-acc)}
.kom-bp__stage{display:flex;justify-content:center;align-items:flex-start;height:clamp(300px,40vw,560px);padding:24px 16px 0;border-radius:14px;overflow:hidden;
  background:linear-gradient(rgba(14,13,22,.05) 1px,transparent 1px) 0 0/100% 32px,linear-gradient(90deg,rgba(14,13,22,.05) 1px,transparent 1px) 0 0/32px 100%,#f3f3f6}
/* ширина рамки меняется намеренно: на ней видно, как вёрстка перестраивается (анимация одного элемента, без соседей) */
.kom-bp__frame{position:relative;width:var(--fw,75%);border:1px solid var(--k-line);border-bottom:0;border-radius:12px 12px 0 0;overflow:hidden;background:#fff;
  box-shadow:0 30px 60px -36px rgba(14,13,22,.5);transition:width .55s cubic-bezier(.16,1,.3,1)}
.kom-bp__bar{display:flex;gap:6px;height:24px;align-items:center;padding:0 10px;background:#f4f4f6;border-bottom:1px solid var(--k-line)}
.kom-bp__bar i{width:7px;height:7px;border-radius:50%;background:#d9d8df}
.kom-bp__img{display:none;width:100%;height:auto}
.kom-bp__img.is-on{display:block;animation:komfade .35s ease both}
@media (max-width:599px){.kom-bp__marks button{font-size:12px}.kom-bp__marks button span{font-size:11px}}

/* ---------- надёжность: тёмный раздел, схема «читатель — кэш — бэкенд» и нагрузка ---------- */
.kom-dark{background:var(--r-dk,#0e0d16);color:#fafafa;padding-bottom:clamp(80px,10vw,150px)!important}   /* тёмному блоку — воздух снизу (Фёдор, 28.10) */
.kom-dark .rlbl,.kom-dark .rhead h2,.kom-dark h2{color:#fafafa}
.kom-dark .sec-lead{color:var(--r-dk-mute,#a3a2ad)}
.kom-rel{display:grid;gap:56px;--k-line:rgba(250,250,250,.16)}
.kom-cache__flow{display:grid;grid-template-columns:1fr;gap:0;justify-items:stretch}
.kom-node{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 14px;padding:18px;border:1px solid var(--k-line);border-radius:14px;transition:border-color .3s,background .3s,box-shadow .3s}
.kom-node b{font:600 18px/1.2 var(--r-d);letter-spacing:-.02em}
.kom-node span:not(.kom-node__ic):not(.kom-page){grid-column:2;color:var(--r-dk-mute,#a3a2ad);font-size:14px}
.kom-node__ic{grid-row:span 2;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--k-line);border-radius:10px}
.kom-node__ic svg{width:22px;height:22px;fill:none;stroke:#fafafa;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kom-page{grid-column:1/-1;position:relative;display:block;margin-top:12px;border-radius:8px;overflow:hidden;border:1px solid var(--k-line)}
.kom-page img{display:block;width:100%;height:auto}
.kom-page em{position:absolute;right:8px;bottom:8px;padding:3px 8px;border-radius:6px;background:#12b76a;color:#fff;font:600 12px/1.2 inherit;font-style:normal}
.kom-node--cache{background:rgba(61,18,252,.14);border-color:rgba(143,123,255,.5)}
/* линия с бегущими точками между узлами (на телефоне — вертикальная) */
.kom-link{position:relative;display:block;justify-self:center;width:2px;height:48px;background:rgba(143,123,255,.35);overflow:hidden}
.kom-link i{position:absolute;left:-2px;top:-8px;width:6px;height:6px;border-radius:50%;background:#b4a8ff;animation:komdown 1.4s linear infinite}
.kom-link i:nth-child(2){animation-delay:.47s}.kom-link i:nth-child(3){animation-delay:.93s}
@keyframes komdown{to{transform:translateY(64px)}}
@keyframes komright{to{transform:translateX(var(--len,120px))}}
.kom-cache__ctrl{display:grid;gap:14px;margin-top:28px}
.kom-switch{display:inline-flex;align-items:center;gap:14px;justify-self:start;padding:0;border:0;background:none;color:#fafafa;font:600 16px/1.2 inherit;cursor:pointer}
.kom-switch__t{position:relative;width:52px;height:30px;border-radius:99px;background:rgba(250,250,250,.2);transition:background .25s}
.kom-switch__t::after{content:"";position:absolute;left:4px;top:4px;width:22px;height:22px;border-radius:50%;background:#fafafa;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.kom-switch[aria-checked="true"] .kom-switch__t{background:#e5484d}
.kom-switch[aria-checked="true"] .kom-switch__t::after{transform:translateX(22px)}
.kom-switch:focus-visible{outline:2px solid #b4a8ff;outline-offset:6px;border-radius:8px}
.kom-cache__msg{margin:0;max-width:34em;color:var(--r-dk-mute,#a3a2ad);font-size:15px;line-height:1.55}
/* бэкенд упал: его линия гаснет и рвётся, сам он красный; кэш подсвечен — страница у читателя на месте */
.kom-cache.is-down .kom-node--back{border-color:rgba(229,72,77,.7);background:rgba(229,72,77,.1)}
.kom-cache.is-down .kom-node--back .kom-node__st{color:#ff8a8f}
.kom-cache.is-down .kom-node--back .kom-node__ic svg{stroke:#ff8a8f}
.kom-cache.is-down .kom-link--b{background:repeating-linear-gradient(transparent 0 6px,rgba(229,72,77,.6) 6px 12px)}
.kom-cache.is-down .kom-link--b i{display:none}
.kom-cache.is-down .kom-node--cache{box-shadow:0 0 0 1px rgba(143,123,255,.8),0 0 40px -6px rgba(143,123,255,.6)}
.kom-cache.is-down .kom-cache__msg{color:#fafafa}
.kom-rps{display:grid;align-content:start;gap:18px;padding-top:24px;border-top:1px solid var(--k-line)}
.kom-rps__v{display:grid;gap:6px;margin:0}
.kom-rps__v b{font:600 clamp(72px,9vw,132px)/.95 var(--r-d);letter-spacing:-.05em;color:#fafafa;font-variant-numeric:tabular-nums}
.kom-rps__v span{color:var(--r-dk-mute,#a3a2ad);font-size:16px}
.kom-rps__bar{display:block;height:6px;border-radius:99px;background:rgba(250,250,250,.12);overflow:hidden}
.kom-rps__bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3d12fc,#b4a8ff);transform:scaleX(var(--p,0));transform-origin:0 50%}
.kom-rps__t{margin:0;color:var(--r-dk-mute,#a3a2ad);font-size:15px;line-height:1.55}
@media (min-width:900px){
  /* схема — на всю ширину, нагрузка — строкой ниже: цифра слева, пояснение справа */
  .kom-rel{grid-template-columns:1fr;gap:56px}
  .kom-cache__flow{grid-template-columns:minmax(0,1.25fr) minmax(56px,.55fr) minmax(0,1fr) minmax(56px,.55fr) minmax(0,1fr);align-items:center}
  .kom-node--user{max-width:420px}
  .kom-link{justify-self:stretch;width:auto;height:2px;--len:140px}
  .kom-link i{left:-8px;top:-2px;animation-name:komright}
  .kom-cache.is-down .kom-link--b{background:repeating-linear-gradient(90deg,transparent 0 6px,rgba(229,72,77,.6) 6px 12px)}
  .kom-node{grid-template-columns:1fr;justify-items:start;gap:10px}
  .kom-node span:not(.kom-node__ic):not(.kom-page){grid-column:auto}
  .kom-node__ic{grid-row:auto}
  .kom-rps{grid-template-columns:auto minmax(0,1fr);column-gap:64px;row-gap:18px;align-items:end;padding-top:40px}
  .kom-rps__v{grid-row:span 2}
  .kom-rps__t{max-width:40em}
}

/* ---------- путь главной и общая команда ---------- */
.kom-path{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;margin:0 0 56px;padding:0;list-style:none}
.kom-path li{display:grid;gap:8px;align-content:start;padding-top:18px;border-top:1px solid var(--k-line,rgba(14,13,22,.12));position:relative}
.kom-path li::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--r-acc)}
.kom-path b{font:600 clamp(30px,3.2vw,48px)/1 var(--r-d);letter-spacing:-.04em;color:var(--r-ink)}
.kom-path li:last-child b{color:var(--r-acc)}
.kom-path span{color:var(--r-mute);font-size:14.5px;line-height:1.45}
@media (min-width:900px){
  .kom-path{grid-template-columns:repeat(6,minmax(0,1fr));gap:24px}
  .kom-path::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--r-acc);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s cubic-bezier(.16,1,.3,1) .2s}
  .kom-path.in::after{transform:none}
}
/* команда: две стороны и «мост» между ними; фигурки людей прорисовываются линиями при появлении (pathLength=1 в символе kom-man) */
.kom-sym{position:absolute;width:0;height:0;overflow:hidden}
.kom-team{position:relative;display:grid;gap:36px;--k-line:rgba(14,13,22,.12)}
.kom-side{display:grid;gap:18px;align-content:start}
.kom-side__h{display:flex;align-items:baseline;gap:14px;margin:0;padding-bottom:16px;border-bottom:1px solid var(--k-line)}
.kom-side__h b{font:600 clamp(56px,6vw,96px)/.9 var(--r-d);letter-spacing:-.05em;color:var(--r-acc)}
.kom-side--client .kom-side__h b{color:var(--r-ink)}
.kom-side__h{flex-wrap:wrap}
.kom-side__h span{max-width:13em;color:var(--r-ink);font-weight:600;font-size:16px;line-height:1.3}
.kom-side__f{margin:0;color:var(--r-mute);font-size:14.5px;line-height:1.5}
.kom-roles{display:grid;margin:0;padding:0;list-style:none}
.kom-roles li{display:grid;grid-template-columns:36px minmax(0,1fr) auto 24px;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--k-line)}
.kom-roles__ic{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--k-line);border-radius:8px;transition:border-color .2s,background .2s}
.kom-roles__ic svg{width:18px;height:18px;fill:none;stroke:var(--r-acc);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kom-roles b{font:600 16px/1.2 var(--r-d);letter-spacing:-.02em;color:var(--r-ink)}
.kom-roles__p{display:flex;gap:4px}
.kom-roles em{font:600 18px/1 var(--r-d);font-style:normal;color:var(--r-acc);text-align:right}
.kom-roles li:hover .kom-roles__ic{border-color:var(--r-acc);background:rgba(61,18,252,.06)}
.kom-roles__p svg,.kom-crowd svg{display:block;width:24px;height:33px;fill:none;stroke:var(--r-acc);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s cubic-bezier(.16,1,.3,1) calc(var(--n,0) * 90ms)}
.kom-roles li .kom-roles__p svg+svg{transition-delay:calc(var(--n,0) * 90ms + 90ms)}
.kom-roles li .kom-roles__p svg+svg+svg{transition-delay:calc(var(--n,0) * 90ms + 180ms)}
.kom-crowd{display:grid;grid-template-columns:repeat(auto-fill,24px);gap:12px 14px;align-items:end;max-width:260px}
.kom-crowd svg{stroke:var(--r-ink)}
.kom-crowd__more{display:grid;place-items:center;width:24px;height:33px;color:var(--r-ink);font:600 26px/1 var(--r-d)}
.kom-team.in .kom-roles__p svg,.kom-team.in .kom-crowd svg{stroke-dashoffset:0}
.kom-bridge{position:relative;display:grid;gap:10px;justify-items:center;align-content:center;text-align:center}
.kom-bridge p{position:relative;z-index:1;margin:0;padding:8px 14px;border:1px dashed rgba(61,18,252,.5);border-radius:99px;background:#fafafa;color:var(--r-acc);font-size:13.5px;line-height:1.3}
.kom-bridge__line{width:1px;height:26px;background:repeating-linear-gradient(var(--r-acc) 0 4px,transparent 4px 8px);opacity:.6}
@media (min-width:1200px){
  .kom-team{grid-template-columns:minmax(0,1.15fr) minmax(170px,.5fr) minmax(0,1fr);gap:40px;align-items:center}
  .kom-bridge::before{content:"";position:absolute;left:-40px;right:-40px;top:50%;border-top:1px dashed rgba(61,18,252,.35)}
  .kom-bridge__line{height:40px}
}

@media (prefers-reduced-motion:reduce){
  .kom-link i{animation:none;display:none}
  .kom-bp__frame,.kom-path::after{transition:none}
  .kom-roles__p svg,.kom-crowd svg{stroke-dashoffset:0;transition:none}
  .kom-shot.is-on,.kom-bp__img.is-on{animation:none}
}

/* ---------- вторая правка 28.10.2026 ---------- */
/* стык «адаптивность» → тёмный блок: сцена с рамкой заканчивается мягко, до тёмного блока — воздух (Фёдор: «плашка заходит на предыдущий блок») */
#adaptive{padding-bottom:clamp(64px,8vw,120px)!important}
.kom-bp__stage{-webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent)}
.kom-dark{padding-top:clamp(80px,10vw,150px)!important}

/* нагрузочный тест: крупная цифра, график нагрузки, 11 сценариев полоской, статус */
.kom-load{display:grid;gap:20px;padding-top:32px;border-top:1px solid rgba(250,250,250,.16)}
.kom-load__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.kom-load__v{display:grid;gap:6px;margin:0}
.kom-load__v b{font:600 clamp(72px,9vw,132px)/.92 var(--r-d);letter-spacing:-.05em;color:#fafafa;font-variant-numeric:tabular-nums}
.kom-load__v span{color:var(--r-dk-mute,#a3a2ad);font-size:16px}
.kom-load__run{padding:0 0 8px;border:0;background:linear-gradient(#8f7bff,#8f7bff) 0 100%/100% 2px no-repeat;color:#fafafa;font:500 clamp(17px,1.4vw,21px)/1.2 var(--r-d);letter-spacing:-.03em;cursor:pointer;transition:background-size .45s cubic-bezier(.16,1,.3,1),color .2s}
.kom-load__run:hover{color:#b4a8ff;background-size:40% 2px}
.kom-load__run:disabled{opacity:.45;cursor:default}
.kom-load__run:focus-visible{outline:2px solid #b4a8ff;outline-offset:6px}
.kom-load__chart{position:relative;height:clamp(160px,18vw,240px);border-bottom:1px solid rgba(250,250,250,.2)}
.kom-load__chart svg{display:block;width:100%;height:100%;overflow:visible}
.kom-load__grid path{stroke:rgba(250,250,250,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.kom-load__cap{stroke:#b4a8ff;stroke-width:1;stroke-dasharray:6 6;vector-effect:non-scaling-stroke;opacity:.7}
.kom-load__cap-l{position:absolute;right:0;top:calc(20 / 220 * 100% - 22px);color:#b4a8ff;font:600 12.5px/1 inherit}
.kom-load__area{fill:url(#komfill)}
.kom-load__line{fill:none;stroke:#b4a8ff;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.kom-load__sc{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:4px;margin:0;padding:0;list-style:none}
.kom-load__sc li{padding-top:10px;border-top:3px solid rgba(250,250,250,.14);color:var(--r-dk-mute,#a3a2ad);font:600 12px/1 inherit;text-align:center;transition:border-color .3s,color .3s}
.kom-load__sc li.is-on{border-top-color:#b4a8ff;color:#fafafa}
.kom-load__sc li.is-done{border-top-color:#12b76a;color:#fafafa}
.kom-load__st{display:flex;align-items:flex-start;gap:12px;margin:0;color:var(--r-dk-mute,#a3a2ad);font-size:15px;line-height:1.5}
.kom-load__st i{flex:none;width:10px;height:10px;margin-top:6px;border-radius:50%;background:rgba(250,250,250,.3)}
.kom-load.is-run .kom-load__st i,.kom-load.is-done .kom-load__st i{background:#12b76a;box-shadow:0 0 0 4px rgba(18,183,106,.18)}
.kom-load.is-done .kom-load__st{color:#fafafa}


/* ---------- третья правка 28.10.2026: дизайн-система и умный поиск ---------- */
/* умный поиск: интерфейс поиска «Коммерсанта» в нашей вёрстке, ответы — настоящие */
.kom-ai{display:grid;gap:24px}
.kom-ai__chips{display:flex;flex-wrap:wrap;gap:10px}
.kom-ai__chips button{padding:10px 18px;border:1px solid rgba(14,13,22,.16);border-radius:99px;background:#fff;color:var(--r-ink);font:500 15px/1.2 inherit;cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.kom-ai__chips button:hover{border-color:var(--r-acc);color:var(--r-acc)}
.kom-ai__chips button[aria-pressed="true"]{background:var(--r-ink);border-color:var(--r-ink);color:#fafafa}
.kom-ai__ui{--k-blue:#2f47a8;--k-lav:#dfe5fb;max-width:720px;width:100%;padding:clamp(20px,3vw,36px);border:1px solid rgba(14,13,22,.1);border-radius:16px;background:#fff;
  box-shadow:0 40px 80px -50px rgba(14,13,22,.45);color:#1c2025}
.kom-ai__h{margin:0 0 16px;font:700 clamp(24px,2.6vw,34px)/1.1 Arial,sans-serif;letter-spacing:-.02em}
.kom-ai__field{display:flex;align-items:center;min-height:48px;padding:0 16px;border-radius:12px;background:#f0f2f5;font-size:16px}
.kom-ai__caret{width:2px;height:20px;margin-left:2px;background:#1c2025;animation:kblink 1s steps(1) infinite}
.kom-ai__x{margin-left:auto;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#1c2025;color:#fff;font-size:12px;line-height:1}
@keyframes kblink{50%{opacity:0}}
.kom-ai__panel{margin-top:10px;padding:4px;border:2px solid var(--k-lav);border-radius:14px;background:var(--k-lav);transition:opacity .3s}
.kom-ai__head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px}
.kom-ai__label{display:inline-flex;align-items:center;gap:8px;color:var(--k-blue);font:700 12px/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.kom-ai__label svg{width:16px;height:16px;fill:var(--k-blue)}
.kom-ai__toggle{position:relative;width:44px;height:26px;padding:0;border:0;border-radius:99px;background:var(--k-blue);cursor:pointer;transition:background .25s}
.kom-ai__toggle span{position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;transform:translateX(18px);transition:transform .3s cubic-bezier(.16,1,.3,1)}
.kom-ai__toggle[aria-checked="false"]{background:#b9bfcc}
.kom-ai__toggle[aria-checked="false"] span{transform:none}
.kom-ai__toggle:focus-visible{outline:2px solid var(--k-blue);outline-offset:3px}
.kom-ai__body{min-height:120px;padding:16px;border-radius:10px;background:#fff;font-size:15.5px;line-height:1.55}
.kom-ai.is-off .kom-ai__body{display:none}
.kom-ai__think{display:none;align-items:center;gap:6px;color:#6b7280;font-size:14px}
.kom-ai__think i{width:7px;height:7px;border-radius:50%;background:var(--k-blue);animation:kdot 1s ease-in-out infinite}
.kom-ai__think i:nth-child(2){animation-delay:.15s}.kom-ai__think i:nth-child(3){animation-delay:.3s}
.kom-ai__think span{margin-left:6px}
.kom-ai.is-think .kom-ai__think{display:flex}
.kom-ai.is-think .kom-ai__ans{display:none}
@keyframes kdot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
.kom-ai__ans p{margin:0 0 8px}
.kom-ai__ans p:last-child{margin:0}
.kom-ai__found{margin:22px 0 12px;font:700 20px/1.2 Arial,sans-serif}
.kom-ai__res{display:grid;gap:10px}
.kom-ai__res span{display:block;height:14px;border-radius:6px;background:linear-gradient(90deg,#eef0f4 0,#f6f7f9 40%,#eef0f4 80%) 0 0/200% 100%;animation:kshim 1.6s linear infinite}
.kom-ai__res span:nth-child(2){width:86%}.kom-ai__res span:nth-child(3){width:62%}
@keyframes kshim{to{background-position:-200% 0}}
@media (min-width:1024px){.kom-ai{grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:start}.kom-ai__chips{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.kom-ai__caret,.kom-ai__think i,.kom-ai__res span{animation:none}}
