/* Доска команды видеопоздравлений. Взята с карты работы Сергея (plans/karta.html).
   Дизайн-система кабинета: те же токены, что в kabinet.css и reestr-*.html,
   стеклянные плашки с блюром, фоновая сетка 32px.
   Темы: светлая на :root, тёмная по системе, тумблер перебивает обе.

   Данные живут внутри страницы — <script id="dannye"> в конце файла.
   Редактируется прямо на странице: перенос карточек между колонками,
   правка и добавление через диалог, порядок направлений перетаскиванием.
   На артефакте правки публикуются в общую версию (capability "artifact"),
   в локальном файле — копятся в localStorage браузера, кнопка «⌂ локально»
   копирует JSON для Клода. Поле obnovleno в данных — штамп последней
   правки файла Клодом: локальная копия старше него отбрасывается. */

:root{
  --bg:#F4F2FA; --bg-grid:rgba(21,17,31,.014); --panel:#FFFFFF; --panel-2:#FAF9FE;
  --glass:rgba(255,255,255,.72);
  --ink:#15111F; --ink-strong:#05030E; --muted:#6B6480; --faint:#9892AC;
  --violet:#6A44F2; --violet-soft:rgba(106,68,242,.10); --violet-line:rgba(106,68,242,.30);
  --teal:#00806F; --teal-soft:rgba(0,128,111,.10);
  --amber:#B77A0C; --amber-soft:rgba(183,122,12,.12);
  --danger:#C7302F; --danger-soft:rgba(199,48,47,.10);
  --line:rgba(21,17,31,.11); --line-strong:rgba(21,17,31,.22);
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --r:14px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#08070C; --bg-grid:rgba(255,255,255,.012); --panel:#100E18; --panel-2:#15121F;
    --glass:rgba(16,14,24,.66);
    --ink:#ECEAF4; --ink-strong:#FFFFFF; --muted:#84819A; --faint:#635F78;
    --violet:#7C5CFF; --violet-soft:rgba(124,92,255,.14); --violet-line:rgba(124,92,255,.42);
    --teal:#00B5A3; --teal-soft:rgba(0,181,163,.13);
    --amber:#F2A93B; --amber-soft:rgba(242,169,59,.13);
    --danger:#FF6B6B; --danger-soft:rgba(255,107,107,.12);
    --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.2);
  }
}
:root[data-theme="dark"]{
  --bg:#08070C; --bg-grid:rgba(255,255,255,.012); --panel:#100E18; --panel-2:#15121F;
  --glass:rgba(16,14,24,.66);
  --ink:#ECEAF4; --ink-strong:#FFFFFF; --muted:#84819A; --faint:#635F78;
  --violet:#7C5CFF; --violet-soft:rgba(124,92,255,.14); --violet-line:rgba(124,92,255,.42);
  --teal:#00B5A3; --teal-soft:rgba(0,181,163,.13);
  --amber:#F2A93B; --amber-soft:rgba(242,169,59,.13);
  --danger:#FF6B6B; --danger-soft:rgba(255,107,107,.12);
  --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.2);
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--bg);
  background-image:linear-gradient(var(--bg-grid) 1px,transparent 1px),
                   linear-gradient(90deg,var(--bg-grid) 1px,transparent 1px);
  background-size:32px 32px;
  color:var(--ink); font-family:var(--sans); font-size:15px; line-height:1.45;
  min-height:100vh;
}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0}
:focus-visible{outline:2px solid var(--violet); outline-offset:2px; border-radius:6px}

/* ── каркас ── */
.shapka{
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 20px; border-bottom:1px solid var(--line);
  background:var(--glass); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
}
.shapka h1{margin:0; font-size:17px; font-weight:800; letter-spacing:.01em; color:var(--ink-strong)}
.shapka .data{font-family:var(--mono); font-size:12px; color:var(--muted)}
.svod{font-size:12.5px; color:var(--muted)}
.svod b{color:var(--ink); font-weight:650}
.rost{flex:1}
.sost{
  font-family:var(--mono); font-size:11px; font-weight:600; color:var(--muted);
  border:1px solid var(--line); border-radius:20px; padding:4px 11px;
}
.sost.obsh{color:var(--teal); border-color:var(--teal)}
.sost.pishu{color:var(--amber); border-color:var(--amber)}
.sost.lok{color:var(--violet); border-color:var(--violet-line); cursor:pointer}
.vid{display:flex; border:1px solid var(--line); border-radius:10px; overflow:hidden}
.vid button{padding:7px 14px; font-size:13px; font-weight:600; color:var(--muted)}
.vid button.on{background:var(--violet-soft); color:var(--violet)}
.tema{width:34px; height:34px; border:1px solid var(--line); border-radius:10px; font-size:15px; line-height:1}

.telo{display:flex; align-items:flex-start; gap:0; max-width:1600px; margin:0 auto}

/* ── сайдбар направлений ── */
.bok{
  position:sticky; top:59px; flex:0 0 248px;
  max-height:calc(100vh - 59px); overflow-y:auto;
  padding:16px 12px 24px 20px;
}
.bok .metka{font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--faint); margin:0 0 8px 10px}
.bok .hint{font-size:11.5px; color:var(--faint); margin:10px 4px 0 10px; line-height:1.4}
.nap{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px}
.nap li{
  display:flex; align-items:center; gap:9px;
  padding:8px 10px; border-radius:11px; border:1px solid transparent;
  cursor:pointer; user-select:none;
}
.nap li:hover{background:var(--panel-2)}
.nap li.on{
  background:var(--glass); border-color:var(--violet-line);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:0 4px 18px rgba(0,0,0,.06);
}
.nap li.tash{opacity:.35}
.nap .em{width:20px; text-align:center; flex:0 0 auto}
.nap .imya{flex:1; font-size:13.5px; font-weight:600; min-width:0}
.nap li.on .imya{color:var(--ink-strong)}
.nap .schet{
  font-family:var(--mono); font-size:11px; color:var(--muted);
  background:var(--panel-2); border:1px solid var(--line);
  border-radius:20px; padding:1px 7px; min-width:24px; text-align:center;
}
.nap .vaga{cursor:grab; color:var(--faint); font-size:13px; padding:0 2px; touch-action:none}
.nap .vaga:active{cursor:grabbing}

/* ── рабочее поле ── */
.pole{flex:1; min-width:0; padding:16px 20px 60px 8px}
.filtry{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px}
.chip{
  font-size:12px; font-weight:600; padding:5px 11px;
  border:1px solid var(--line); border-radius:20px; color:var(--muted);
  background:var(--panel);
}
.chip.on{border-color:var(--violet-line); color:var(--violet); background:var(--violet-soft)}
.chip .tochka{display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; vertical-align:1px}
.razdel{flex-basis:100%; height:0}

/* ── канбан ── */
.doska{display:flex; gap:12px; overflow-x:auto; padding-bottom:16px; align-items:flex-start}
.kol{flex:0 0 268px; min-width:268px; border-radius:var(--r)}
.kol > h2{
  margin:0 0 10px; font-size:12px; font-weight:700; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted);
  display:flex; align-items:center; gap:8px; padding:0 4px;
}
.kol > h2 .n{font-family:var(--mono); font-size:11px; color:var(--faint); font-weight:500; flex:1}
.kol > h2 .dob{
  font-size:15px; font-weight:600; color:var(--faint); line-height:1;
  width:22px; height:22px; border:1px solid var(--line); border-radius:7px;
}
.kol > h2 .dob:hover{color:var(--violet); border-color:var(--violet-line); background:var(--violet-soft)}
.kol .stopka{display:flex; flex-direction:column; gap:10px; min-height:48px; border-radius:var(--r)}
.kol.pusto .stopka::after{
  content:"пусто"; font-size:12px; color:var(--faint);
  border:1px dashed var(--line); border-radius:var(--r); padding:14px; text-align:center;
}
.kol.priyom .stopka{outline:2px dashed var(--violet-line); outline-offset:4px; background:var(--violet-soft)}

.kart{
  background:var(--glass); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--line); border-radius:var(--r);
  box-shadow:0 4px 20px rgba(0,0,0,.05);
}
.kart.tash{opacity:.35}
.kart summary{
  list-style:none; cursor:pointer; padding:11px 13px 10px;
  border-radius:var(--r); position:relative;
}
.kart summary::-webkit-details-marker{display:none}
.kart summary:hover .naz{color:var(--ink-strong)}
.kart .naz{font-size:13.8px; font-weight:650; line-height:1.32; color:var(--ink); padding-right:22px}
.kart .pravka{
  position:absolute; top:9px; right:9px; width:22px; height:22px;
  font-size:12px; color:var(--faint); border-radius:7px; line-height:1;
  opacity:0; transition:opacity .12s;
}
.kart summary:hover .pravka, .kart .pravka:focus-visible{opacity:1}
.kart .pravka:hover{color:var(--violet); background:var(--violet-soft)}
@media (hover:none){ .kart .pravka{opacity:.55} }
.kart .znachki{display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; align-items:center}
.pil{
  font-size:10.5px; font-weight:700; letter-spacing:.03em;
  padding:2px 8px; border-radius:20px; white-space:nowrap;
}
.pil.sup{background:var(--danger-soft); color:var(--danger)}
.pil.vaz{background:var(--amber-soft); color:var(--amber)}
.pil.poy{background:var(--violet-soft); color:var(--violet)}
.pil.pot{background:var(--panel-2); color:var(--faint); border:1px solid var(--line)}
.pil.kto{background:none; border:1px solid var(--line); color:var(--muted); font-family:var(--mono); font-weight:600}
.pil.srok{background:var(--teal-soft); color:var(--teal); font-family:var(--mono); font-weight:600}
.pil.shagi-n{background:none; color:var(--faint); font-family:var(--mono); font-weight:500; padding:2px 0}
.kart .nutro{padding:0 13px 12px; border-top:1px dashed var(--line); margin-top:2px; padding-top:10px}
.kart .opis{font-size:12.8px; color:var(--muted); line-height:1.5; margin:0}
.kart ul.shagi{list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:5px}
.kart ul.shagi li{font-size:12.5px; color:var(--ink); display:flex; gap:8px; line-height:1.4; cursor:pointer; border-radius:6px}
.kart ul.shagi li:hover{background:var(--panel-2)}
.kart ul.shagi li::before{content:"○"; color:var(--faint); flex:0 0 auto}
.kart ul.shagi li.est::before{content:"●"; color:var(--teal)}
.kart ul.shagi li.est{color:var(--muted); text-decoration:line-through; text-decoration-color:var(--line-strong)}
.kart .ssylki{margin-top:10px; display:flex; flex-direction:column; gap:3px}
.kart .ssylki code{font-family:var(--mono); font-size:10.8px; color:var(--faint); word-break:break-all}
.kart .meta{margin-top:9px; font-family:var(--mono); font-size:10.5px; color:var(--faint)}
.kol[data-k="gotovo"] .kart{opacity:.72}
.kol[data-k="gotovo"] .kart .naz{color:var(--muted)}
.kol[data-k="otlozheno"] .kart{opacity:.6; border-style:dashed}

/* ── диалог правки ── */
dialog.forma{
  border:1px solid var(--line-strong); border-radius:16px; padding:0;
  background:var(--panel); color:var(--ink); width:min(480px, calc(100vw - 32px));
  box-shadow:0 24px 80px rgba(0,0,0,.35);
}
dialog.forma::backdrop{background:rgba(5,3,14,.5); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px)}
.forma .vnutri{padding:18px 20px 16px; display:flex; flex-direction:column; gap:12px}
.forma h3{margin:0; font-size:15px; font-weight:700; color:var(--ink-strong)}
.forma label{display:flex; flex-direction:column; gap:5px; font-size:11.5px; font-weight:600; color:var(--muted)}
.forma .ryad{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.forma input, .forma select, .forma textarea{
  font:inherit; font-size:13.5px; color:var(--ink);
  background:var(--panel-2); border:1px solid var(--line); border-radius:9px;
  padding:8px 10px; width:100%;
}
.forma textarea{resize:vertical; min-height:60px; line-height:1.45}
.forma input:focus, .forma select:focus, .forma textarea:focus{outline:none; border-color:var(--violet-line)}
.forma .pod{font-size:10.5px; font-weight:500; color:var(--faint)}
.forma .knopki{display:flex; gap:8px; align-items:center; margin-top:4px}
.forma .knopki .rost{flex:1}
.kn{
  font-size:13px; font-weight:650; padding:8px 16px; border-radius:10px;
  border:1px solid var(--line);
}
.kn.glav{background:var(--violet); border-color:var(--violet); color:#fff}
.kn.glav:hover{filter:brightness(1.08)}
.kn.opasno{color:var(--danger); border-color:transparent}
.kn.opasno:hover{background:var(--danger-soft)}

/* ── выпадающий список у плашек ── */
.vypad{
  position:absolute; z-index:60; display:none; flex-direction:column; gap:2px;
  min-width:170px; padding:5px;
  background:var(--panel); border:1px solid var(--line-strong); border-radius:11px;
  box-shadow:0 14px 44px rgba(0,0,0,.22);
}
.vypad.on{display:flex}
.vypad button{
  display:flex; align-items:center; gap:9px; text-align:left;
  padding:7px 11px; border-radius:8px; font-size:12.5px; font-weight:600; color:var(--ink);
}
.vypad button:hover{background:var(--violet-soft); color:var(--violet)}
.vypad button.tek{background:var(--panel-2)}
.vypad .tochka{width:8px; height:8px; border-radius:50%; flex:0 0 auto}
.znachki .pil{cursor:pointer}
.znachki .pil.kto, .znachki .pil.srok, .znachki .pil.shagi-n{cursor:default}

/* ── карта по датам ── */
.lenta-obl{display:none}
.lenta-obl.on{display:block}
.doska-obl.off{display:none}
.lenta-shap{font-size:13px; color:var(--muted); margin:0 0 14px; max-width:640px}
.lenta{
  position:relative; overflow-x:auto;
  background:var(--glass); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--line); border-radius:var(--r); padding:18px 0 20px;
}
.lenta .polosa{position:relative; min-width:960px}
.nedeli{display:flex; border-bottom:1px solid var(--line)}
.ned{flex:1; min-width:80px; padding:0 0 8px 10px; font-family:var(--mono); font-size:10.5px; color:var(--faint); border-left:1px dashed var(--line)}
.ned:first-child{border-left:0}
.ned .mes{display:block; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em}
.segodnya{position:absolute; top:0; bottom:0; width:2px; background:var(--violet); z-index:5}
.segodnya::after{
  content:"сегодня"; position:absolute; top:-2px; left:6px;
  font-family:var(--mono); font-size:10px; font-weight:700; color:var(--violet); white-space:nowrap;
}
.sloy{position:relative; padding:14px 0 4px; min-height:40px}
.veha{
  position:absolute; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center;
}
.veha .romb{width:11px; height:11px; background:var(--amber); transform:rotate(45deg); border-radius:2px}
.veha.orient .romb{background:none; border:2px solid var(--amber)}
.veha .pod{font-size:11px; font-weight:650; color:var(--ink); max-width:120px; line-height:1.25}
.veha .pod small{display:block; font-family:var(--mono); font-weight:500; font-size:10px; color:var(--faint)}
.lenta-kart{
  position:absolute; transform:translateX(-50%);
  background:var(--panel); border:1px solid var(--line); border-radius:10px;
  padding:6px 10px; font-size:11.5px; font-weight:600; color:var(--ink);
  box-shadow:0 3px 12px rgba(0,0,0,.07); max-width:170px; line-height:1.3; text-align:center;
}
.lenta-kart .polka{display:block; font-size:10px; color:var(--faint); font-weight:500; margin-top:2px}
.lenta-kart.sup{border-color:var(--danger)}
.lenta-kart.vaz{border-color:var(--amber)}
.bez-sroka{font-size:12.5px; color:var(--faint); margin:14px 4px 0; line-height:1.5}

/* ── мобильный ── */
@media (max-width:860px){
  .telo{flex-direction:column}
  .bok{position:static; flex:none; width:100%; max-height:none; padding:10px 14px 0}
  .nap{flex-direction:row; overflow-x:auto; gap:6px; padding-bottom:8px}
  .nap li{flex:0 0 auto}
  .nap .vaga{display:none}
  .bok .hint{display:none}
  .pole{padding:10px 14px 60px; width:100%}
  .shapka{position:static; padding:10px 14px; gap:10px}
  .shapka .data{display:none}
  .kol{flex:0 0 82vw; min-width:82vw}
}
@media (prefers-reduced-motion:no-preference){
  .kart, .nap li{transition:border-color .15s, background .15s, opacity .15s}
}

/* ── доска команды: шапка с человеком, история, вход ── */
.ya{font-size:12.5px; color:var(--muted)}
.ya b{color:var(--ink); font-weight:650}
.kn-mal{font-size:12px; font-weight:600; color:var(--muted); border:1px solid var(--line); border-radius:9px; padding:6px 10px}
.kn-mal:hover{color:var(--violet); border-color:var(--violet-line)}
.istoriya-obl{display:none; max-width:760px}
.istoriya-obl.on{display:block}
.ist{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px}
.ist li{display:grid; grid-template-columns:92px 1fr; gap:12px; padding:9px 12px; border-radius:10px; font-size:13px; line-height:1.45}
.ist li:nth-child(odd){background:var(--glass)}
.ist .kogda{font-family:var(--mono); font-size:11px; color:var(--faint); padding-top:2px}
.ist .kto-i{font-weight:650; color:var(--ink)}
.ist .naz-i{color:var(--ink)}
.ist .chto-i{color:var(--muted)}
.ssylka-okno .ssylka-pole{font-family:var(--mono); font-size:12px; word-break:break-all; background:var(--panel-2); border:1px solid var(--line); border-radius:9px; padding:10px; user-select:all}
.kart .ssylki a{font-family:var(--mono); font-size:10.8px; color:var(--violet); word-break:break-all}
.sost.oshibka{color:var(--danger); border-color:var(--danger)}
.vhod-telo{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px 16px}
.vhod-kart{max-width:380px; width:100%; text-align:center; background:var(--glass); border:1px solid var(--line); border-radius:16px; padding:32px 24px; display:flex; flex-direction:column; gap:18px; align-items:center}
.vhod-kart h1{margin:0; font-size:20px; color:var(--ink-strong)}
.vhod-kart p{margin:0; color:var(--muted)}
.vhod-kart form{margin:0}
.vhod-kart .kn{font-size:15px; padding:11px 28px}
.pil.srok.prosrochen{background:var(--danger-soft); color:var(--danger)}
.svod span + span{margin-left:14px}