/* ═══════════════════════════════════════════════════════════
   ПАЛИТРА ⌘K — ящик картотеки, выдвинутый из строки поиска
   ═══════════════════════════════════════════════════════════
   Не плавающее окно по центру, а лист, привязанный к строке поиска в
   меню: у него тот же левый край и та же верхняя кромка, из которой его
   дёрнули. Бумага та же, что у карточек; никаких новых материалов.
   Строка результата — строка картотеки: знак или значок, имя, справа
   моно-метка; выбранная — заливка и чернильная риска слева, как в
   ящике гостей. Ответ дятла — тот же пузырь речи, что в аналитике.

   Движение: открытие и закрытие мгновенные (клавиатурное действие),
   результаты сменяются без движения; поднимается только ответ. */
.pal{position:fixed;inset:0;z-index:90}
.pal[hidden]{display:none}
.pal-scrim{position:absolute;inset:0;background:rgb(25 24 21 / .16)}
.pal-box{
  position:absolute;left:var(--pal-x,232px);top:var(--pal-y,64px);
  /* Ящик узкий и невысокий: он для одной строки набора и короткого
     ответа, а не для второго экрана. Длинный список прокручивается
     внутри, окно от этого не растёт. */
  width:min(468px, calc(100vw - var(--pal-x,232px) - 20px));
  max-height:min(524px, calc(100dvh - var(--pal-y,64px) - 24px));
  display:flex;flex-direction:column;
  background:var(--card);border:1px solid var(--rule);border-radius:var(--r-lg);
  box-shadow:0 1px 2px rgb(25 24 21 / .06), 0 24px 56px rgb(25 24 21 / .18);
  overflow:hidden;
}

/* ── строка ввода: та же строка поиска, только раскрытая ── */
.pal-head{
  display:flex;align-items:center;gap:10px;flex-shrink:0;
  padding:0 12px 0 14px;height:44px;border-bottom:1px solid var(--rule-2);color:var(--ink-3);
}
.pal-head svg{flex-shrink:0}
.pal-in{
  flex:1;min-width:0;height:100%;border:none;outline:none;background:none;
  font-size:14px;letter-spacing:-.01em;color:var(--ink);
}
.pal-in::placeholder{color:var(--ink-3)}
.pal-kbd,.pal-keys kbd,.pal-right kbd{
  font-size:10px;line-height:1;padding:3px 5px;border-radius:var(--r-xs);
  background:var(--sunk);color:var(--ink-3);border:none;cursor:pointer;
}
@media (hover:hover) and (pointer:fine){
  .pal-kbd:hover{color:var(--ink)}
}

/* ── лист ── */
.pal-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 8px 8px}
.pal-body:focus{outline:none}
.pal-g{
  display:flex;align-items:center;gap:8px;padding:9px 8px 3px;
  font-size:11px;font-weight:500;color:var(--ink-3);
}
.pal-g::after{content:"";flex:1;height:1px;background:var(--rule-2)}
.pal-g em{font-style:normal;letter-spacing:.02em;text-transform:none;order:3}
.pal-row{
  position:relative;display:flex;align-items:center;gap:11px;width:100%;
  min-height:38px;padding:5px 10px 5px 12px;border-radius:var(--r-sm);text-align:left;
  transition:background-color var(--t-tap) var(--ease);
}
.pal-row::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;border-radius:1px;
  background:transparent;
}
@media (hover:hover) and (pointer:fine){
  .pal-row:hover{background:var(--paper)}
}
.pal-row.on{background:var(--sunk)}
.pal-row.on::before{background:var(--ink)}
.pal-row:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.pal-ic{width:22px;height:22px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--ink-3)}
.pal-ic svg{width:15px;height:15px}
.pal-row.on .pal-ic{color:var(--ink)}
.pal-av{
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  border-radius:var(--r-mark);font-size:9.5px;font-style:normal;font-weight:600;letter-spacing:.03em;
  color:var(--av-ink);background:var(--av,var(--stop));box-shadow:inset 0 0 0 1px rgb(0 0 0 / .06);
}
.pal-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.pal-main b{font-size:13px;font-weight:600;letter-spacing:-.02em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-main span{font-size:11px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-right{
  flex-shrink:0;font-size:11.5px;font-style:normal;letter-spacing:0;
  color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap;
}
.pal-right.wait{color:var(--wait)}
.pal-right.late{color:var(--late)}
.pal-more .pal-main span{color:var(--ink-3)}
.pal-askrow .pal-ic{color:var(--ink-2)}
.pal-askrow .pal-main span{font-style:italic}
/* Вопрос — просто строка: значок у каждого превратил бы список в столбик
   иконок, а говорит он одно и то же пять раз подряд. */
.pal-askrow .pal-main b{font-weight:500;letter-spacing:-.01em}
.pal-none{padding:18px 10px 8px}
.pal-none b{display:block;font-size:13px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.pal-none span{display:block;margin-top:4px;font-size:11.5px;line-height:1.45;color:var(--ink-2)}

/* Строка про сегодня — первое в пустом ящике: за этим и открывают. */
.pal-now{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;padding:9px 10px 1px}
.pal-now b{font-size:12.5px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.pal-now span{font-size:11.5px;color:var(--ink-2)}

.pal-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 10px 6px}
.pal-chips.in-list{padding-top:4px}
.pal-chip{
  height:26px;padding:0 10px;border-radius:var(--r-pill);border:1px solid var(--rule);background:var(--card);
  font-size:11.5px;color:var(--ink-2);white-space:nowrap;
  transition:background-color var(--t-tap) var(--ease), border-color var(--t-tap) var(--ease), color var(--t-tap) var(--ease);
}
@media (hover:hover) and (pointer:fine){
  .pal-chip:hover{background:var(--sunk);color:var(--ink);border-color:var(--ink-3)}
}
.pal-chip:active{transform:scale(.97)}

/* ── разговор: тот же пузырь речи, что в аналитике ── */
.pal-talk{padding:4px 6px 6px}
.pal-turn{padding:10px 6px 4px;animation:palRise 200ms var(--ease) both}
.pal-turn + .pal-turn{border-top:1px solid var(--rule-2)}
.pal-q{font-size:12.5px;font-weight:600;letter-spacing:-.01em;color:var(--ink);margin-bottom:6px}
.pal-q::before{content:"— ";color:var(--ink-3)}
.pal-a{margin-top:2px}
.pal-a p,.pal-a li{font-size:12.5px;line-height:1.55;color:var(--ink-2)}
.pal-a p + p,.pal-a ul + p,.pal-a p + ul{margin-top:6px}
.pal-a ul{list-style:none;margin:0;padding:0}
.pal-a li + li{margin-top:3px}
.pal-a li::before{content:"· ";color:var(--ink-3)}
.pal-a h4{margin:8px 0 4px;font-size:11px;font-weight:500;color:var(--ink-3)}
.pal-a b{font-weight:600;color:var(--ink)}
.pal-wait{color:var(--ink-3)!important}
.pal-turn.live .pal-a > :last-child::after{
  content:"";display:inline-block;width:2px;height:.95em;margin-left:3px;vertical-align:-.1em;
  background:var(--ink);border-radius:1px;animation:palCaret 1.05s step-end infinite;
}
.pal-links{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0 2px 13px}
.pal-link{
  display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;
  border:1px solid var(--rule);border-radius:var(--r);background:var(--card);
  font-size:11.5px;font-weight:550;color:var(--ink);box-shadow:var(--sh-1);
  transition:background-color var(--t-tap) var(--ease), border-color var(--t-tap) var(--ease);
}
.pal-link svg{width:12px;height:12px;color:var(--ink-3)}
@media (hover:hover) and (pointer:fine){
  .pal-link:hover{background:var(--sunk);border-color:var(--ink-3)}
}
.pal-link:active{transform:scale(.97)}
.pal-by{display:block;margin:8px 0 0 13px;font-size:10.5px;font-style:normal;color:var(--ink-3)}
.pal-by.warn{color:var(--late)}
.pal-talk-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 6px 2px;font-size:10.5px;color:var(--ink-3)}
.pal-clear{font-size:10.5px;color:var(--ink-3);text-decoration:underline;text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){
  .pal-clear:hover{color:var(--ink)}
}
@keyframes palRise{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes palCaret{0%,50%{opacity:1}50.01%,100%{opacity:0}}

/* ── подвал: дятел и клавиши ── */
.pal-foot{
  display:flex;align-items:center;gap:10px;flex-shrink:0;
  padding:6px 12px 6px 10px;border-top:1px solid var(--rule-2);background:var(--paper);
}
.pal-bird{position:relative;width:24px;height:24px;flex-shrink:0}
.pal-bird img{display:block;width:100%;height:100%;object-fit:contain}
/* Три точки у клюва — «думает»: тот же знак, что в карточке аналитики. */
.pal-dots{
  position:absolute;left:20px;top:-4px;display:none;gap:3px;align-items:center;
  padding:4px 6px;border-radius:var(--r) var(--r) var(--r) var(--r-xs);background:var(--accent);box-shadow:var(--sh-1);
}
.pal-dots s{width:3px;height:3px;border-radius:50%;background:var(--accent-ink);opacity:.5;text-decoration:none;
  animation:palDot 1.5s var(--ease) infinite}
.pal-dots s:nth-child(2){animation-delay:.18s}
.pal-dots s:nth-child(3){animation-delay:.36s}
.pal-bird.busy .pal-dots{display:flex}
@keyframes palDot{0%,64%,100%{opacity:.5;transform:none}28%{opacity:1;transform:translateY(-2px)}}
.pal-foot-t{flex:1;min-width:0;font-size:11px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-foot-t:empty{flex:1}
.pal-keys{display:flex;align-items:center;gap:5px;flex-shrink:0;font-size:10px;color:var(--ink-3);white-space:nowrap}
.pal-keys kbd{cursor:default}

/* ── телефон: лист во весь экран ── */
@media (max-width:720px){
  .pal-box{left:0;top:0;width:100%;height:100dvh;max-height:none;border-radius:0;border:none}
  .pal-head{height:52px}
  .pal-in{font-size:16px}
  .pal-row{min-height:46px}
  .pal-keys{display:none}
}
@media (prefers-reduced-motion:reduce){
  .pal-turn{animation:none}
  .pal-dots s{animation:none;opacity:.9}
  .pal-turn.live .pal-a > :last-child::after{animation:none}
  .pal-chip:active,.pal-link:active{transform:none}
}