/* ═══ Телефон — наряд смены ═══
   Строки, галка, разделы и линейка — styles/tasks.css стойки; своё здесь —
   плита под палец: дата и слова, плюс «Задача» справа, линейка, два ряда
   отбора, которые листаются вбок. */
.tel-screen.tel-tasks{background:var(--card)}
.tel-tk-plate{border-radius:0;padding:calc(12px + env(safe-area-inset-top,0px)) 0 12px}
.tel-tk-face{display:flex;align-items:flex-start;gap:12px;padding:0 var(--ph-gutter)}
.tel-tk-of{flex:1;min-width:0}
/* Заголовок экрана — «Задачи»; дата и слова о наряде строкой под ним (шкала телефона — shell.css). */
.tel-tk-of h2{margin:0;font-size:var(--ph-title);font-weight:600;letter-spacing:-.03em;line-height:1.05;color:var(--band-ink)}
.tel-tk-of span{display:block;margin-top:5px;font-size:var(--ph-s);line-height:1.4;color:var(--band-ink-2)}
.tel-tk-of span b{font-weight:500;color:var(--band-ink)}
.tel-tk-new{
  display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:var(--r-pill);
  background:var(--accent);color:var(--accent-ink);transition:transform var(--t-tap) var(--ease);
}
.tel-tk-new svg{width:20px;height:20px}
.tel-tk-new:active{transform:scale(.94)}
.tel-tk-plate .tk-day{margin:12px var(--ph-gutter) 0}
.tel-tk-sift{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.tel-tk-row{display:flex;gap:6px;padding:0 var(--ph-gutter);overflow-x:auto;scrollbar-width:none}
.tel-tk-row::-webkit-scrollbar{display:none}
.tk-chip{
  flex:0 0 auto;height:34px;padding:0 13px;border-radius:var(--r-pill);font-size:14px;font-weight:500;
  color:var(--band-ink-2);background:color-mix(in srgb,var(--band-ink) 10%,transparent);
  transition:background-color var(--t-tap) var(--ease),color var(--t-tap) var(--ease),transform var(--t-tap) var(--ease);
}
.tk-chip.on{background:var(--band-ink);color:var(--band)}
.tk-chip:active{transform:scale(.97)}
.tel-tk-scroll{flex:1;min-height:0}
.tel-tasks .tk-body{padding:4px var(--ph-gutter) calc(20px + env(safe-area-inset-bottom,0px));max-width:none}
/* Разделы и строки по шкале телефона: галка 26 с зоной касания 44, час 15, название 16, подпись 14. */
.tel-tasks .tk-sec{margin-top:16px}
.tel-tasks .tk-sec h3{padding-bottom:8px;font-size:var(--ph-s)}
.tel-tasks .tk-sec h3 i{font-size:var(--ph-xs)}
/* Пять колонок: «когда» на телефоне скрыто (tasks.css), и шестая колонка стояла бы пустой, отняв ширину у названия. */
.tel-tasks .tk-row{grid-template-columns:28px 46px 18px minmax(0,1fr) auto;gap:0 10px;min-height:60px;padding:10px 0}
.tel-tasks .tk-box{position:relative;width:26px;height:26px;border-radius:calc(var(--r-sm) + 2px)}
.tel-tasks .tk-box svg{width:14px;height:14px}
.tel-tasks .tk-box::before{content:"";position:absolute;inset:-9px}
.tel-tasks .tk-at{font-size:var(--ph-b)}
.tel-tasks .tk-glyph svg{width:15px;height:15px}
.tel-tasks .tk-main b{font-size:16px;font-weight:550;letter-spacing:-.015em}
.tel-tasks .tk-main span{margin-top:2px;font-size:var(--ph-s);line-height:1.35}
.tel-tasks .tk-open{font-size:var(--ph-s)}
.tel-tasks .tk-when{font-size:var(--ph-xs)}
.tel-tasks .tk-who{width:32px;height:32px;font-size:var(--ph-xs)}
.tel-tasks .tk-who.none{width:auto;height:30px;padding:0 11px;font-size:var(--ph-s)}
/* У персонала (§8.18) своё дело помечено словом «вы» — тем же знаком, но тоном действия. */
.tel-tasks .tk-who.me{width:auto;height:30px;padding:0 11px;font-size:var(--ph-s);background:var(--accent);color:var(--accent-ink)}
.tel-tasks .tk-stamp{font-size:9px}
/* На узком экране название и вторая строка переносятся, а не обрезаются:
   штамп «срочно» и «бронь» иначе уходили за край строки (320 px). */
.tel-tasks .tk-main b,.tel-tasks .tk-main span{white-space:normal;overflow:visible;text-overflow:clip}
@media (prefers-reduced-motion:reduce){
  .tel-tk-new,.tk-chip{transition:none}
}
