/* Общий компонент сайта: выбор из дерева (js/shared/tree-pick.js, .tp-*) — оболочка от выпадашки .pk (css/shared/pick.css).
   Виды А/Б/В — токены --sk-*; правила под html[data-skin]. Телефон — панель снизу во всю ширину (как .pk-panel). */

html[data-skin] .tp-panel { max-height: 420px; }
html[data-skin] .tp-crumbs { display: flex; flex-wrap: wrap; gap: 2px 4px; padding: 0 8px 6px; border-bottom: 1px solid var(--sk-line); }
html[data-skin] .tp-crumb { border: 0; background: none; padding: 2px 4px; font: 500 12px/1.3 var(--sk-font); color: var(--sk-muted); cursor: pointer; border-radius: 4px; }
html[data-skin] .tp-crumb:not(:last-child)::after { content: "›"; margin-left: 6px; color: var(--sk-muted); }
html[data-skin] .tp-crumb.is-on { color: var(--sk-ink); font-weight: 600; cursor: default; }
html[data-skin] .tp-crumb:hover:not(.is-on) { background: var(--sk-soft); }
html[data-skin] .tp-item { width: 100%; border: 0; background: none; text-align: left; font-family: var(--sk-font); }
html[data-skin] .tp-item__t { flex: 1 1 auto; }
html[data-skin] .tp-item--more::after { content: "›"; color: var(--sk-muted); font-size: 16px; }
html[data-skin] .tp-item--pick { font-weight: 600; border-bottom: 1px solid var(--sk-line); }
html[data-skin] .tp-item--pick::before { content: "✓"; color: var(--sk-accent); }
html[data-skin] .tp-list:empty::before { content: "—"; display: block; padding: 10px 12px; color: var(--sk-muted); }

/* в мастере подачи — поле во всю ширину, как текстовое */
html[data-skin] .acc-w__fld--tree .pk { width: 100%; }
html[data-skin] .acc-w__fld--tree .pk-btn { min-height: 42px; border-radius: 8px; }