
/* ── Токены. Значения взяты из макетов design/*.dc.html без округления ─────── */
:root{
  --ground:#EDF1F0;--surface:#FFFFFF;--surface-sunk:#E3E9E7;
  --ink:#13211F;--ink-soft:#4A5F5C;--ink-faint:#7C8F8C;
  --rule:#CFDAD7;--rule-strong:#A9BAB6;
  --accent:#0E6B5C;--accent-soft:#DCEBE7;--alert:#A84E15;--alert-soft:#F5E5D8;
  --t-olympiad:#0E6B5C;--t-test:#4D5AA8;--t-lesson:#5C7A1F;
  --t-deadline:#A84E15;--t-tour:#8A3F73;--t-other:#7C8F8C;
  --t-olympiad-soft:#DCEBE7;--t-test-soft:#E1E4F3;--t-lesson-soft:#E6EDD5;
  --t-deadline-soft:#F5E5D8;--t-tour-soft:#F0E0EB;--t-other-soft:#EDF1F0;
  --display:"IBM Plex Sans Condensed","Helvetica Neue",Arial,sans-serif;
  --body:"Source Serif 4",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;
  /* Стрелка выпадающих списков: системную гасим appearance:none, рисуем свою. */
  --chevron:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%2313211F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8l6 6 6-6'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--accent)}a:hover{color:#0B5549}
button{font:inherit;color:inherit;background:none;border:none;padding:0;margin:0;cursor:pointer;text-align:inherit}
[hidden]{display:none !important}

.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.h1{font-family:var(--display);font-weight:700;font-size:44px;letter-spacing:-.015em;line-height:1;margin:0;
    min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sw{width:8px;height:8px;border-radius:2px;display:inline-block;flex-shrink:0}
.muted{color:var(--ink-faint)}
.empty{font-family:var(--mono);font-size:12px;color:var(--ink-faint);padding:24px 0}

/* ── Ворота: пока не введён пароль, кроме этой формы на странице ничего нет ── */
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 18px}
.gate-card{width:100%;max-width:360px;display:flex;flex-direction:column;gap:10px;
  background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:24px 22px 22px}
.gate-card .h1{font-size:34px;margin:2px 0 4px}
.gate-note{font-size:15px;line-height:1.4;color:var(--ink-soft);margin:0 0 8px}
.gate-err{font-family:var(--mono);font-size:12px;color:var(--alert);margin:0}

/* ── Каркас и шапка ────────────────────────────────────────────────────────── */
.shell{max-width:1440px;margin:0 auto;padding:36px 40px 28px;display:flex;flex-direction:column;gap:22px;min-height:100vh}
.hd{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;
    grid-template-areas:"ttl zoom tabs add" "own own own own";align-items:end;gap:16px}
.hd-l{grid-area:ttl;display:flex;flex-direction:column;gap:10px;min-width:0}
.ttl-row{display:flex;align-items:center;gap:14px;min-width:0}
.nav{width:44px;height:44px;border-radius:8px;border:1px solid var(--rule-strong);background:var(--surface);
     display:flex;align-items:center;justify-content:center;color:var(--ink-soft);flex-shrink:0}
.nav:hover{border-color:var(--ink-soft);color:var(--ink)}
.tabs{grid-area:tabs;display:flex;gap:4px;background:var(--surface-sunk);padding:4px;border-radius:10px;width:560px}
.tab{flex:1;display:flex;align-items:center;justify-content:center;height:40px;border-radius:7px;
     font-family:var(--display);font-weight:600;font-size:15px;color:var(--ink-soft)}
.tab.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(19,33,31,.08)}
/* Масштаб календаря — один список: четыре пилюли не влезали в строку с четырьмя вкладками. */
.zoom{grid-area:zoom;justify-self:start;display:flex;align-items:center;width:140px;height:44px;
      padding:0 32px 0 12px;border:1px solid var(--rule-strong);border-radius:8px;background:var(--surface);
      font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink);cursor:pointer;
      -webkit-appearance:none;appearance:none;
      background-image:var(--chevron);background-repeat:no-repeat;background-position:right 10px center}
.zoom:focus{outline:2px solid var(--accent);outline-offset:-1px}
.btn{grid-area:add;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 18px;
     border-radius:8px;background:var(--accent);color:#FFFFFF;font-family:var(--display);font-weight:600;font-size:15px}
.btn:hover{background:#0B5549}
.owners{grid-area:own;display:flex;gap:6px;min-width:0;max-width:100%;overflow-x:auto;
        padding-bottom:2px;scrollbar-width:thin}
.owners .pill{flex-shrink:0}
.shell:not([data-view="cal"]) .zoom{display:none}
/* Стрелки листают месяц в календаре и неделю в кабинете, в остальных видах они не нужны. */
.shell:not([data-view="cal"]):not([data-view="cabinet"]) .nav{display:none}
/* На вики и в кабинете «Добавить» завело бы карточку, а не страницу и не задачу:
   у этих вкладок свои кнопки внутри. */
.shell[data-view="wiki"] #add,.shell[data-view="cabinet"] #add{display:none}
main{flex:1;min-width:0}
.legend{display:flex;flex-wrap:wrap;gap:10px 18px;font-family:var(--mono);font-size:11px;color:var(--ink-soft);
        margin-top:auto;padding-top:12px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend .tail{margin-left:auto;color:var(--ink-faint)}

/* ── «Ближайшее» и списки дней ─────────────────────────────────────────────── */
.group{display:flex;flex-direction:column;gap:0;margin-bottom:18px}
.sec{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);
     padding-bottom:6px;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;gap:12px}
.sec.alert{color:var(--alert);border-bottom-color:var(--alert)}
.row{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;padding:12px 0;
     border-bottom:1px solid var(--rule);align-items:start;width:100%;cursor:pointer}
.row:hover .t{color:var(--accent)}
.d{display:flex;flex-direction:column;gap:2px}
.d-wd{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.d-n{font-family:var(--display);font-weight:700;font-size:26px;line-height:1}
.d-n.alert{color:var(--alert)}
.c{display:flex;flex-direction:column;gap:5px;min-width:0}
.t{font-family:var(--body);font-size:16px;line-height:1.3;margin:0;overflow-wrap:anywhere}
.t.done,.t.cancelled{color:var(--ink-faint);text-decoration:line-through}
.m{font-family:var(--mono);font-size:11px;color:var(--ink-soft);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.m .alert{color:var(--alert)}
.m .faint{color:var(--ink-faint)}

/* ── Календарь: сетка месяца, десктоп ──────────────────────────────────────── */
.cal-head{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px}
.cal-head .wd{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
              color:var(--ink-faint);padding:0 10px 8px}
.cal-head .wd.we{color:var(--ink-soft)}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.cell{background:var(--surface);min-height:126px;padding:8px 10px;display:flex;flex-direction:column;gap:5px}
.cell.we{background:#F6F8F7}
.cell.out{background:var(--surface-sunk)}
.cell.out .dn{color:var(--ink-faint)}
.dn{font-family:var(--mono);font-size:12px;color:var(--ink-soft);height:22px;display:flex;align-items:center}
.dn.today span{background:var(--accent);color:#FFFFFF;border-radius:11px;height:22px;min-width:22px;padding:0 6px;
               display:inline-flex;align-items:center;justify-content:center;font-weight:500}
.chip{display:flex;align-items:center;gap:6px;font-family:var(--body);font-size:13px;line-height:1.25;
      padding:4px 7px;border-radius:4px;background:var(--ground);color:var(--ink);text-align:left;width:100%}
.chip:hover{filter:brightness(.96)}
.chip .ttl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip .ttl.od{color:var(--alert)}
.chip .tm{font-family:var(--mono);font-size:10px;color:var(--ink-soft);margin-left:auto;flex-shrink:0}
.chip.done,.chip.cancelled{opacity:.55;text-decoration:line-through}
.chip.span{border-radius:4px 0 0 4px}
.chip.spanmid{border-radius:0}
.chip.span2{border-radius:0 4px 4px 0}

/* ── Календарь: сетка месяца, телефон ──────────────────────────────────────── */
.grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.grid .wd{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
          color:var(--ink-faint);text-align:center;padding-bottom:4px}
.day{height:48px;border-radius:8px;background:var(--surface);display:flex;flex-direction:column;align-items:center;
     justify-content:center;gap:4px;font-family:var(--mono);font-size:13px;color:var(--ink)}
.day.out{background:transparent;color:var(--ink-faint)}
.day.today{box-shadow:inset 0 0 0 2px var(--accent);font-weight:500}
.day.sel{background:var(--accent);color:#FFFFFF}
.dots{display:flex;gap:3px;height:5px}
.dots i{width:5px;height:5px;border-radius:50%;display:inline-block}

/* ── Календарь: лента на 3/6/12 месяцев, десктоп ───────────────────────────── */
.tl{display:grid;grid-template-columns:130px minmax(0,1fr);border:1px solid var(--rule);background:var(--surface)}
.tl-mh{display:grid;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
       color:var(--ink-soft);border-bottom:1px solid var(--rule);background:var(--surface-sunk);position:relative}
.tl-mh div{padding:10px}
.tl-mh div+div{border-left:1px solid var(--rule)}
.lab{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);
     display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule)}
.lab.head{background:var(--surface-sunk)}
.lane{position:relative;border-bottom:1px solid var(--rule);
      background-image:linear-gradient(90deg,var(--rule) 1px,transparent 1px);
      background-size:var(--col) 100%;background-position:-1px 0}
.tl > :nth-last-child(-n+2){border-bottom:none}
.ev{position:absolute;display:flex;align-items:center;gap:7px;height:28px;padding:0 10px 0 8px;border-radius:14px;
    font-family:var(--body);font-size:13px;white-space:nowrap;color:var(--ink);background:var(--ground)}
.ev:hover,.bar:hover{box-shadow:0 0 0 1px var(--rule-strong)}
.ev .dt{font-family:var(--mono);font-size:10px;color:var(--ink-soft)}
.ev .sw{width:8px;height:8px;border-radius:50%}
.ev.flip{flex-direction:row-reverse;transform:translateX(-100%);padding:0 8px 0 10px}
.ev.done,.bar.done{opacity:.55}
.ev.cancelled,.bar.cancelled{opacity:.55;text-decoration:line-through}
.bar{position:absolute;height:26px;border-radius:6px;padding:0 10px;display:flex;align-items:center;gap:8px;
     font-family:var(--body);font-size:13px;white-space:nowrap;overflow:hidden;color:var(--ink)}
.bar .dt{font-family:var(--mono);font-size:10px;color:var(--ink-soft);flex-shrink:0}
.bar .ttl{overflow:hidden;text-overflow:ellipsis}
.tl-today{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);transform:translateX(-1px);pointer-events:none}
.tl-today-lbl{position:absolute;top:-1px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
              color:#FFFFFF;background:var(--accent);padding:3px 6px;border-radius:0 0 4px 4px;transform:translateX(-1px)}

/* ── Календарь: список по месяцам, телефон ─────────────────────────────────── */
.mon{display:flex;flex-direction:column;gap:0;margin-bottom:18px}
.mon-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
       font-family:var(--display);font-weight:700;font-size:20px;padding-bottom:6px}
.mon-h .cnt{font-family:var(--mono);font-size:12px;color:var(--ink-faint);font-weight:400}
.strip{position:relative;height:14px;border-top:1px solid var(--rule-strong);margin-bottom:6px}
.strip i{position:absolute;top:-4px;width:7px;height:7px;border-radius:50%;transform:translateX(-3px)}
.strip b{position:absolute;top:-3px;height:5px;border-radius:3px}
.strip .tick{position:absolute;top:-1px;width:1px;height:6px;background:var(--rule-strong)}
.mon .row{grid-template-columns:62px minmax(0,1fr);gap:10px;padding:9px 0;align-items:baseline}
.mon .dt{font-family:var(--mono);font-size:12px;color:var(--ink-soft);white-space:nowrap}
.mon .dt.faint{color:var(--ink-faint)}
.mon .t{font-size:15px;display:flex;align-items:baseline;gap:8px}
.mon .t .sw{position:relative;top:-1px}
.mon .t .tm{font-family:var(--mono);font-size:11px;color:var(--ink-soft);white-space:nowrap}

/* ── Доска ─────────────────────────────────────────────────────────────────── */
.board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.col{background:var(--surface-sunk);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px;min-height:690px}
.col.over{outline:2px solid var(--accent);outline-offset:-2px}
.colh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
      font-family:var(--display);font-weight:700;font-size:18px;padding:2px 4px 6px}
.cnt{font-family:var(--mono);font-size:12px;color:var(--ink-faint);font-weight:400}
.card{background:var(--surface);border-radius:8px;padding:12px 14px;display:flex;flex-direction:column;gap:7px;
      box-shadow:0 1px 2px rgba(19,33,31,.06);text-align:left;width:100%;cursor:pointer}
.card:hover{box-shadow:0 1px 2px rgba(19,33,31,.06),0 0 0 1px var(--rule-strong)}
.card.done{opacity:.6}
.card.cancelled{opacity:.6}
.card.cancelled .t{text-decoration:line-through}
.card.drag{opacity:.4}
/* Клон под снимком курсора: он должен быть плотным и не сдвигать раскладку,
   поэтому непрозрачность возвращается даже отменённым и сделанным карточкам. */
.card.ghost{position:fixed;top:-1000px;left:-1000px;width:260px;opacity:1;pointer-events:none;
      background:var(--surface);box-shadow:0 6px 18px rgba(19,33,31,.18)}
.tag{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
     display:flex;align-items:center;gap:6px;color:var(--ink-soft)}
.drop{border:1px dashed var(--rule-strong);border-radius:8px;height:44px;display:flex;align-items:center;justify-content:center;
      font-family:var(--mono);font-size:11px;color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase}
.board-phone{display:flex;flex-direction:column;gap:18px}
.board-phone .sect{display:flex;flex-direction:column;gap:10px}
.board-phone .colh{height:44px;align-items:center;border-bottom:2px solid var(--ink);padding:0;width:100%}
.board-phone .colh.closed{border-bottom:1px solid var(--rule);color:var(--ink-soft)}
.board-phone .colh .cnt{display:flex;align-items:center;gap:10px}
.st,.wiki-sel{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 12px;
    border:1px solid var(--rule-strong);border-radius:8px;font-family:var(--display);font-weight:600;font-size:14px;
    color:var(--ink);background:var(--ground);margin-top:2px;width:100%;
    -webkit-appearance:none;appearance:none;cursor:pointer;
    background-image:var(--chevron);
    background-repeat:no-repeat;background-position:right 10px center}

/* ── Вики ──────────────────────────────────────────────────────────────────── */
.wiki{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;align-items:start}
.wiki-nav{display:flex;flex-direction:column;gap:2px;min-width:0}
.wiki-item{display:flex;align-items:center;min-height:38px;padding:7px 10px;border-radius:8px;
      font-family:var(--display);font-weight:600;font-size:15px;line-height:1.2;color:var(--ink-soft)}
.wiki-item:hover{background:var(--surface-sunk);color:var(--ink)}
.wiki-item.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(19,33,31,.08)}
.wiki-new{display:flex;align-items:center;min-height:38px;padding:7px 10px;margin-top:4px;
      font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.wiki-new:hover{color:#0B5549}
.wiki-page{background:var(--surface);border:1px solid var(--rule);border-radius:12px;
      padding:26px 30px 20px;display:flex;flex-direction:column;gap:14px;min-width:0}
.wiki-hd{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.wiki-h{font-family:var(--display);font-weight:700;font-size:30px;letter-spacing:-.01em;line-height:1.05;
      margin:0;min-width:0;overflow-wrap:anywhere}
.wiki-acts{display:flex;gap:16px;flex-shrink:0}
.wiki-acts .lnk{height:auto;font-size:14px}
.wiki-acts .lnk:hover{color:var(--ink)}
.wiki-acts .lnk.danger{color:var(--alert)}
.wiki-body{font-family:var(--body);font-size:16px;line-height:1.55;color:var(--ink);
      max-width:68ch;min-width:0;overflow-wrap:anywhere}
.wiki-body h1,.wiki-body h2,.wiki-body h3{font-family:var(--display);font-weight:700;
      line-height:1.15;margin:20px 0 8px}
.wiki-body h1{font-size:24px}
.wiki-body h2{font-size:20px}
.wiki-body h3{font-size:17px}
.wiki-body > :first-child{margin-top:0}
.wiki-body p{margin:0 0 12px}
.wiki-body ul,.wiki-body ol{margin:0 0 12px;padding-left:22px}
.wiki-body li{margin:4px 0}
.wiki-body li ul,.wiki-body li ol{margin:4px 0}
.wiki-body code{font-family:var(--mono);font-size:13px;background:var(--surface-sunk);
      border-radius:4px;padding:1px 5px}
.wiki-body hr{border:none;border-top:1px solid var(--rule);margin:18px 0}
.wiki-upd{font-family:var(--mono);font-size:11px;color:var(--ink-faint);margin:0;
      padding-top:10px;border-top:1px solid var(--rule)}
/* Поле тела уточняет .ta, поэтому селектор из двух классов: сам .ta описан ниже. */
.ta.wiki-ta{min-height:340px;font-family:var(--mono);font-size:14px;line-height:1.5}
.wiki-save{display:flex;align-items:center;gap:18px;margin-top:4px}
.wiki-save .save{width:auto;padding:0 24px}
.wiki-none{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.wiki-none .btn{display:inline-flex}

/* ── Кабинет: неделя, пул и задачи ─────────────────────────────────────────── */
.cab-hd{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.cab-hd .btn{grid-area:auto;display:inline-flex;margin-left:auto}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.daycol{background:var(--surface);min-height:240px;padding:8px;display:flex;flex-direction:column;gap:6px}
.daycol.we{background:#F6F8F7}
.daycol.off{background:var(--surface-sunk)}
.daycol.over{box-shadow:inset 0 0 0 2px var(--alert)}
.daycol.drop-on{outline:2px solid var(--accent);outline-offset:-2px}
.dayh{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:22px;
      font-family:var(--mono);font-size:12px;color:var(--ink-soft)}
.daycol.today .dnm{background:var(--accent);color:#FFFFFF;border-radius:11px;height:22px;padding:0 8px;
      display:inline-flex;align-items:center;font-weight:500}
.off-lbl{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.evs,.tasks{display:flex;flex-direction:column;gap:4px}
.dsum{margin-top:auto;padding-top:6px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;
      gap:6px;flex-wrap:wrap;font-family:var(--mono);font-size:10px;color:var(--ink-soft)}
.daycol.over .dsum{color:var(--alert)}
.wtot{display:flex;justify-content:flex-end;gap:12px;margin-top:10px;
      font-family:var(--mono);font-size:11px;color:var(--ink-soft)}

.task{display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;padding:6px 7px;border-radius:6px;
      background:var(--ground);align-items:start;width:100%;text-align:left;cursor:pointer}
.task:hover{background:var(--surface-sunk)}
.task.done{opacity:.6}
.task.done .tt{text-decoration:line-through}
.task.run{box-shadow:inset 0 0 0 1px var(--accent)}
.task.drag{opacity:.4}
/* Снимок под курсором: плотная строка целиком, как у карточек доски. Ширину снимок берёт
   с самой строки, поэтому строку пула во всю ширину окна приходится ужимать. */
.task.ghost{position:fixed;top:-1000px;left:-1000px;width:272px;max-width:272px;opacity:1;
      background:var(--surface);box-shadow:0 6px 18px rgba(19,33,31,.18);pointer-events:none}
.tbody{display:flex;flex-direction:column;gap:3px;min-width:0}
.tt{font-family:var(--body);font-size:13px;line-height:1.25;color:var(--ink);overflow-wrap:anywhere}
a.tt{text-decoration:underline;text-decoration-color:var(--rule-strong)}
a.tt:hover{color:var(--accent)}
.tmeta{font-family:var(--mono);font-size:10px;color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:6px}
.tmeta .faint{color:var(--ink-faint)}
.tacts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:2px}
.tbtn{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.tbtn:hover{color:#0B5549}
.tbtn.danger{color:var(--alert)}
.run-lbl{font-family:var(--mono);font-size:10px;color:var(--accent)}
/* Чекбокс и полоса нагрузки нарисованы сами: системные в эту палитру не встают. */
.chk{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--rule-strong);background:var(--surface);
     display:inline-flex;align-items:center;justify-content:center;color:transparent;flex-shrink:0}
.chk:hover{border-color:var(--ink-soft)}
.chk.on{background:var(--accent);border-color:var(--accent);color:#FFFFFF}
.pbar{display:block;height:6px;border-radius:3px;background:var(--surface-sunk);overflow:hidden;
      min-width:120px;flex:1 1 120px}
.pbar i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.pbar.over i{background:var(--alert)}

.today{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:16px 18px 14px;
       margin-bottom:16px;display:flex;flex-direction:column;gap:10px}
.today-h{font-family:var(--display);font-weight:700;font-size:22px;line-height:1.1}
.load{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
      font-family:var(--mono);font-size:11px;color:var(--ink-soft)}
.load.over{color:var(--alert)}
.today-ev{margin-top:2px}
.cab-sec{margin-bottom:16px;display:flex;flex-direction:column;gap:8px}
.cab-sec .sec{margin-bottom:2px}
/* Задачи без дня — секция под сеткой недели, во всю ширину (колонкой справа она
   отбирала у дней ширину). Разделители строк рисует фон контейнера сквозь зазор в
   1px, как в сетке недели. Зона сброса — вся секция, подсветка тем же классом
   .drop-on, что у колонки дня: .over в кабинете занят под превышение лимита. */
.pool{margin-top:18px;border-radius:10px}
.pool.drop-on{outline:2px solid var(--accent);outline-offset:4px}
.pool-hint{font-family:var(--mono);font-size:11px;color:var(--ink-faint);margin:0}
.pool-rows{display:flex;flex-direction:column;gap:1px;background:var(--rule);
           border:1px solid var(--rule);border-radius:8px;overflow:hidden}
.pool .task{background:var(--surface);border-radius:0;padding:7px 10px;align-items:center}
.pool .task:hover{background:var(--surface-sunk)}
.pool .tbody{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 14px}
.pool .tt{flex:1 1 240px}
.pool .tmeta{margin-left:auto}
.pool .tacts{margin-top:0}
.pool .empty{padding:10px 0}
/* Бейдж задач в ячейке месяца. */
.tbadge{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:4px;
        font-family:var(--mono);font-size:10px;color:var(--accent);background:var(--accent-soft);
        border-radius:4px;padding:3px 6px}
.tbadge:hover{background:#CFE3DE}
.tbadge-row{display:flex;margin-top:10px}

/* ── Карточка: форма ───────────────────────────────────────────────────────── */
.sheet{position:fixed;inset:0;background:rgba(19,33,31,.35);display:flex;align-items:flex-start;justify-content:center;
       overflow-y:auto;z-index:20;padding:24px 0}
.sheet-in{width:100%;max-width:460px;background:var(--ground);border-radius:12px;
          padding:12px 18px 28px;display:flex;flex-direction:column;gap:16px}
.sheet-hd{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sheet-hd .h2{font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:-.01em;line-height:1;margin:0}
.lnk{font-family:var(--display);font-weight:600;font-size:15px;color:var(--ink-soft);height:44px;display:flex;align-items:center}
.lnk.ghost{visibility:hidden}
.f{display:flex;flex-direction:column;gap:6px}
.lbl{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.in{height:46px;border:1px solid var(--rule-strong);border-radius:8px;background:var(--surface);padding:0 12px;
    font-family:var(--body);font-size:16px;color:var(--ink);width:100%}
.in.mono{font-family:var(--mono);font-size:14px}
.in:focus,.ta:focus{outline:2px solid var(--accent);outline-offset:-1px}
/* Список в форме — тем же видом, что масштаб календаря: системную стрелку гасим, рисуем свою. */
.pick{height:44px;width:100%;max-width:200px;padding:0 32px 0 12px;border:1px solid var(--rule-strong);
     border-radius:8px;background:var(--surface);font-family:var(--display);font-weight:600;font-size:14px;
     color:var(--ink);cursor:pointer;-webkit-appearance:none;appearance:none;
     background-image:var(--chevron);background-repeat:no-repeat;background-position:right 10px center}
.pick:focus{outline:2px solid var(--accent);outline-offset:-1px}
/* Обязательное поле, оставленное пустым. */
.in.bad{border-color:var(--alert);box-shadow:inset 0 0 0 1px var(--alert)}
.ta{min-height:84px;border:1px solid var(--rule-strong);border-radius:8px;background:var(--surface);padding:10px 12px;
    font-family:var(--body);font-size:15px;line-height:1.4;color:var(--ink);width:100%;resize:vertical}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pill{height:36px;padding:0 12px;border-radius:18px;border:1px solid var(--rule-strong);background:var(--surface);
      display:inline-flex;align-items:center;gap:6px;font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink-soft)}
.pill.on{border-color:var(--ink);color:var(--ink);background:var(--surface-sunk)}
.save{height:48px;border-radius:8px;background:var(--accent);color:#FFFFFF;display:flex;align-items:center;
      justify-content:center;font-family:var(--display);font-weight:700;font-size:16px;width:100%}
.save:hover{background:#0B5549}
.del{color:var(--alert)}
.err{font-family:var(--mono);font-size:12px;color:var(--alert);margin:0}

/* ── Широкое окно форм карточки и задачи ─────────────────────────────────────
   Раскладка с карточки задачи YouTrack и формы записи Odoo: слева главное
   (название крупно, ссылка, заметка), справа — свойства строками «подпись —
   значение». Даты и числа держим узкими: системному полю даты хватает 160 px,
   и строка свойства не расползается на всю ширину. */
.sheet-in.wide{max-width:880px;               /* дубль строкой ниже: min() понимают */
               max-width:min(880px,92vw);     /* браузеры, но не парсер CSS в jsdom */
               padding:0;gap:0;max-height:calc(100vh - 48px);overflow-y:auto}
.sheet-in.wide .sheet-hd{position:sticky;top:0;z-index:2;background:var(--ground);
       border-bottom:1px solid var(--rule);border-radius:12px 12px 0 0;padding:12px 14px 12px 20px}
.hd-acts{display:flex;align-items:center;gap:8px;flex-shrink:0}
.sheet-hd .save{width:auto;height:44px;padding:0 18px;font-weight:600;font-size:15px}
.sheet-body{display:grid;grid-template-columns:minmax(0,3fr) minmax(300px,2fr);flex:1}
.sheet-main{min-width:0;display:flex;flex-direction:column;gap:14px;padding:18px 20px 24px}
.sheet-side{min-width:0;display:flex;flex-direction:column;gap:8px;padding:18px 20px 24px;
            border-left:1px solid var(--rule)}
.in.big{height:52px;padding:0 14px;font-family:var(--display);font-weight:600;font-size:20px}
.ta.main{min-height:160px;max-height:40vh}
/* Строка свойства: подпись слева, значение справа. */
.prop{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;align-items:center}
.prop.tall{align-items:start}
.prop.tall > .lbl{margin-top:12px}
.pv{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
/* Имя не из списка: рядом со списком, а когда не влезает — строкой под ним. */
.pv .in.other{flex:1 1 120px;width:auto;min-width:0}
.pv .in.date{width:160px;flex:0 0 auto}
.pv .in.num{width:96px;flex:0 0 auto}
.pv-note{font-family:var(--mono);font-size:10px;color:var(--ink-faint)}
.sheet-side .del{margin-top:auto;align-self:flex-start}

/* ── Телефон ───────────────────────────────────────────────────────────────── */
@media (max-width:899px){
  .shell{padding:20px 18px 28px;gap:18px}
  .hd{grid-template-columns:minmax(0,1fr) auto;
      grid-template-areas:"ttl add" "tabs tabs" "own own" "zoom zoom";gap:12px}
  .h1{font-size:34px;line-height:1.02}
  .ttl-row{justify-content:space-between;gap:8px}
  .tabs{width:auto}
  .zoom{justify-self:stretch;width:100%}
  .btn{padding:0 16px}
  .shell[data-view="cal"] .btn{padding:0 12px}
  .shell[data-view="cal"] .btn .btn-lbl{display:none}
  .cab-hd .btn{margin-left:0}
  /* Неделя на телефоне — не сетка, а список дней, начиная с сегодняшнего. */
  .week{grid-template-columns:minmax(0,1fr);gap:10px;background:transparent;border:none}
  .daycol{border:1px solid var(--rule);border-radius:10px;min-height:0}
  /* Пул на телефоне: строки в один столбец, отдельными карточками, как задачи дня. */
  .pool{margin-top:14px}
  .pool-rows{gap:8px;background:transparent;border:none;border-radius:0;overflow:visible}
  .pool .task{border-radius:8px;padding:8px 10px}
  /* В колонке flex-basis — это высота, поэтому десктопную ширину названия снимаем. */
  .pool .tbody{flex-direction:column;align-items:stretch;gap:3px}
  .pool .tt{flex:0 1 auto}
  .pool .tmeta{margin-left:0}
  .board{grid-template-columns:minmax(0,1fr);gap:20px}
  .wiki{grid-template-columns:minmax(0,1fr);gap:14px}
  .wiki-page{padding:18px 16px 16px}
  .wiki-h{font-size:24px}
  .ta.wiki-ta{min-height:300px}
  .wiki-save{gap:12px}
  .sheet{padding:0}
  .sheet-in{max-width:none;min-height:100vh;border-radius:0}
  /* Одна колонка на весь экран; шапка липнет к верху самого листа,
     поэтому собственная прокрутка окна здесь выключена. */
  .sheet-in.wide{max-width:none;max-height:none;overflow:visible}
  .sheet-in.wide .sheet-hd{border-radius:0;padding:10px 12px 10px 16px}
  /* Заголовок ужимается первым: «Сохранить» в шапке важнее названия окна. */
  .sheet-in.wide .sheet-hd .h2{font-size:20px;min-width:0;overflow:hidden;
                               text-overflow:ellipsis;white-space:nowrap}
  .sheet-body{grid-template-columns:minmax(0,1fr)}
  .sheet-main{padding:14px 16px 6px;gap:12px}
  .sheet-side{border-left:none;border-top:1px solid var(--rule);padding:14px 16px 28px}
}

[hidden]{display:none!important}
