/* Command palette. A flat paper tile on a veil; mono labels; hairlines. */
.pal { border: 0; padding: 0; background: transparent; color: var(--ink); width: min(620px, calc(100vw - 24px)); max-width: none; margin: 14vh auto auto; overflow: visible; }
.pal::backdrop { background: color-mix(in srgb, var(--paper) 62%, transparent); opacity: 0; transition: opacity 160ms var(--ease); }
.pal.open::backdrop { opacity: 1; }
.pal-box {
  background: var(--paper-2); border: var(--hairline) solid var(--rule-strong); border-radius: var(--radius-tile); overflow: hidden;
  opacity: 0; transform: translateY(-6px) scale(.985); transition: opacity 160ms var(--ease), transform 160ms var(--ease);
}
.pal.open .pal-box { opacity: 1; transform: none; }
.pal-top { display: flex; align-items: center; gap: 12px; padding: 0 16px; border-bottom: var(--hairline) solid var(--rule); }
.pal-top .label { flex: none; }
.pal .pal-input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--ink); font: 16px/1.3 var(--font-sans); padding: 16px 0; outline: none; width: auto; }
.pal .pal-input::placeholder { color: var(--ink-2); }
.pal .pal-input:focus-visible { outline: none; }
.pal-top:focus-within { border-bottom-color: var(--ink); }
.pal-kbd { font: 10px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); border: var(--hairline) solid var(--rule); border-radius: 6px; padding: 2px 6px; }
.pal-list { list-style: none; margin: 0; padding: 6px; max-height: min(52vh, 420px); overflow: auto; }
.pal-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; cursor: pointer; border: var(--hairline) solid transparent; }
.pal-item[aria-selected="true"] { background: var(--paper); border-color: var(--ink); }
.pal-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal-kind, .pal-hint { flex: none; font: 10px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.pal-empty { padding: 22px 12px; text-align: center; }
.pal-foot { margin: 0; padding: 10px 16px; border-top: var(--hairline) solid var(--rule); font-size: 10px; }
@media (max-width: 720px) { .pal { margin-top: 8vh; } .pal-foot { display: none; } }
@media (prefers-reduced-motion: reduce) { .pal::backdrop, .pal-box { transition: none; } }
