/* 🗓 Календарь собственника (app/owner-cal.js), дизайн C. Только токены → тёмная и светлая темы сами.
   Сетка 07:00–21:00, клетка 30 мин = --ocal-slot; позиции событий считаются от неё (calc), поэтому клетки border-box. */
.ocal{--ocal-slot:12px;--ocal-g:48px;--c:var(--text-3)}   /* 03.10: вдвое ниже (было 22px) — неделя целиком на экране */
.ocal .insp{--c:var(--info)} .ocal .meet{--c:var(--ai)} .ocal .task{--c:var(--warn)} .ocal .learn{--c:var(--ok)}

/* шапка: заголовок · диапазон · ‹ Сегодня › */
.ocal-h{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;min-height:44px;padding:6px 14px;border-bottom:1px solid var(--border)}
.ocal-ttl{font-size:var(--fs-md);font-weight:var(--fw-semibold);color:var(--text);white-space:nowrap}
.ocal-rng{min-width:0;color:var(--text-2);font-size:var(--fs-sm);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocal-nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.ocal-ib{border:1px solid var(--border)}
.ocal-ib:hover,.ocal-ev:hover{filter:none}
.ocal-h button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* легенда */
.ocal-leg{display:flex;flex-wrap:wrap;gap:4px 14px;padding:7px 14px;border-bottom:1px solid var(--border-soft);font-size:var(--fs-sm);color:var(--text-2)}
.ocal-lg{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ocal-lg i{width:10px;height:10px;border-radius:2px;background:var(--c);flex-shrink:0}
.ocal-lg em{font:500 var(--fs-xs) var(--font-mono);color:var(--text-3);font-style:normal}
.ocal-lg em.ocal-er{color:var(--text-3);cursor:help}

/* тело */
.ocal-body{padding:0 0 10px;transition:opacity var(--t-fast)}
.ocal-body[aria-busy=true] .ocal-tg{opacity:.55}
.ocal-row{display:grid;grid-template-columns:var(--ocal-g) repeat(var(--ocal-n,7),minmax(0,1fr))}

/* дни */
.ocal-hd{border-bottom:1px solid var(--border)}
.ocal-dh{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0;padding:6px 2px 5px;border-left:1px solid var(--border-soft)}
.ocal-dh.we{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
.ocal-dw{font-size:var(--fs-xs);color:var(--text-3);letter-spacing:.03em;text-transform:uppercase}
.ocal-dn{display:grid;place-items:center;min-width:28px;height:28px;padding:0 4px;border-radius:var(--r-lg);font-size:var(--fs-xl);font-weight:var(--fw-semibold);font-variant-numeric:tabular-nums;color:var(--text);line-height:1}
.ocal-dh.today .ocal-dn{background:var(--fill);color:var(--on-fill)}
.ocal-dh.today .ocal-dw{color:var(--accent)}
.ocal-ld{max-width:100%;font-size:var(--fs-xs);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocal-ld.full{color:var(--warn);font-weight:var(--fw-medium)}

/* весь день (обучение) */
.ocal-ad{border-bottom:1px solid var(--border)}
.ocal-adl{padding:5px 6px 0 0;font-size:var(--fs-xs);line-height:1.2;color:var(--text-3);text-align:right}
.ocal-adg{grid-column:2 / -1;display:grid;grid-template-columns:repeat(var(--ocal-n,7),minmax(0,1fr));grid-auto-flow:row dense;gap:2px 0;padding:3px 0}
.ocal-ae{min-width:0;margin:0 2px;padding:2px 6px;border-left:3px solid var(--ok);border-radius:var(--r-sm);background:var(--ok-bg);color:var(--text);font-size:var(--fs-xs);font-weight:var(--fw-medium);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* часы и колонки */
.ocal-tg{padding-top:8px}
.ocal-hrs{display:flex;flex-direction:column}
.ocal-hrs span{box-sizing:border-box;height:calc(var(--ocal-slot) * 2);padding-right:6px;font:500 var(--fs-xs) var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-3);text-align:right;line-height:1;transform:translateY(-.5em)}
.ocal-col{position:relative;min-width:0;border-left:1px solid var(--border-soft);border-bottom:1px solid var(--border)}
.ocal-col.we{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
.ocal-col.today{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.ocal-slot{box-sizing:border-box;height:var(--ocal-slot);border-top:1px dashed var(--border-soft)}
.ocal-slot.hr{border-top:1px solid var(--border)}
.ocal-slot.drop{background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}

/* события */
.ocal-ev{-webkit-appearance:none;appearance:none;position:absolute;z-index:1;box-sizing:border-box;display:block;min-width:0;margin:0;padding:0;border:0;border-left:3px solid var(--c);border-radius:var(--r-sm);background:color-mix(in srgb,var(--c) 16%,var(--surface));color:var(--text);font:inherit;font-size:var(--fs-xs);line-height:1.25;text-align:left;cursor:pointer;transition:background var(--t-fast)}
.ocal-ev:hover{background:color-mix(in srgb,var(--c) 26%,var(--surface))}
.ocal-ev:focus-visible{z-index:5;outline:2px solid var(--accent);outline-offset:1px}
.ocal-in{display:flex;flex-direction:column;height:100%;padding:2px 5px;overflow:hidden}
.ocal-tm{flex-shrink:0;font:500 var(--fs-xs) var(--font-mono);font-variant-numeric:tabular-nums;color:var(--c);white-space:nowrap}
.ocal-et{font-weight:var(--fw-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocal-es{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocal-ev.short .ocal-in{flex-direction:row;align-items:center;gap:4px;padding-top:0;padding-bottom:0}
.ocal-ev.done{opacity:.6}
.ocal-ev.out{border-left-style:dashed}
.ocal-ev.task{z-index:2;border:1px solid color-mix(in srgb,var(--warn) 55%,transparent);border-radius:var(--r-md);background:var(--warn-bg)}
.ocal-ev.task:hover{background:color-mix(in srgb,var(--warn) 22%,var(--surface))}
.ocal-ev.task .ocal-in{flex-direction:row;align-items:center;gap:4px;padding:0 6px}
.ocal-ev.task .ocal-et{color:var(--warn)}
.ocal-ev.task.hi{box-shadow:inset 0 0 0 1px var(--warn)}
.ocal-ic{display:inline-flex;flex-shrink:0;color:var(--warn)}
.ocal-ic svg{width:12px;height:12px}
/* пересечения: в узкой дорожке (2 рядом) — меньше отступы, без адреса и значка; в очень узкой (3+) — только название, время в подсказке */
.ocal-ev.l2 .ocal-in,.ocal-ev.l3 .ocal-in{padding-left:3px;padding-right:3px}
.ocal-ev.l2 .ocal-es,.ocal-ev.l3 .ocal-es,.ocal-ev.l3 .ocal-tm,.ocal-ev.l2 .ocal-ic,.ocal-ev.l3 .ocal-ic{display:none}
.ocal-ev.l3 .ocal-et{text-overflow:clip}

/* линия «сейчас» */
.ocal-now{position:absolute;left:-1px;right:0;z-index:4;height:2px;margin-top:-1px;background:var(--crit);pointer-events:none}
.ocal-now::before{content:"";position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--crit)}

.ocal-empty{margin:10px 14px 0;font-size:var(--fs-sm);color:var(--text-2);text-align:center}

/* телефон: 3 дня, зоны нажатия ≥40px */
@media (max-width:599px){
  .ocal{--ocal-slot:24px;--ocal-g:40px}
  .ocal-h{padding:6px 12px}
  .ocal-leg{gap:4px 12px;padding:7px 12px}
  .ocal-hrs span{padding-right:4px}
  .ocal-ev::after{content:"";position:absolute;left:0;right:0;top:50%;height:max(100%,40px);transform:translateY(-50%)}
}
@media (prefers-reduced-motion:reduce){.ocal-body,.ocal-ev{transition:none}}

/* компактные блоки на низкой сетке: одна строка «время · название», без переносов */
@media (min-width:600px){.ocal-in{padding:0 5px;flex-direction:row;align-items:center;gap:6px;white-space:nowrap}.ocal-in>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ocal-ev{line-height:1.15}}

/* 03.10 (2): компактный виджет — «картина загрузки недели». Когда календарь узкий (половина экрана),
   блоки событий без текста, только цвет; подробности — во всплывающей подсказке (title) и по клику. */
.ocal{container-type:inline-size}
@container (max-width:900px){
  /* 03.10 (3): в узком виде текст оставляем — одна строка «время · город», мелко; пусто только в тесных параллельных дорожках
     03.10 (4): осмотры идут каждые 30 мин по 60 мин — 2 дорожки обычное дело: в них «время · город» (обрезается), пусто — только 3+ */
  .ocal-in{padding:0 3px;gap:3px;font-size:10px;line-height:1.1}
  .ocal-ev.l2 .ocal-in{padding:0 2px;gap:2px}
  .ocal-ev.l3 .ocal-in{display:none}
  .ocal-ev.l3{border-left-width:0;background:color-mix(in srgb,var(--c) 55%,var(--surface))}
  .ocal-es{display:none}
  .ocal-ev.task{background:transparent;border:0;border-top:2px solid var(--c);border-radius:0}
  .ocal-ld{font-size:10px}
  .ocal-ae{font-size:10px;padding:1px 4px}
  .ocal-leg{font-size:var(--fs-xs)}
}

/* «Мой календарь» — личный Google-календарь собственника (owner-gcal, только чтение): свой цвет, без перехода по клику */
.ocal .gcal{--c:var(--accent)}
.ocal-ev.gcal{cursor:default}
.ocal-ae.gcal{border-left-color:var(--accent);background:var(--accent-soft)}
.ocal-lg em.ocal-ns{font-family:inherit;color:var(--warn)}

/* ⚡ фокус-слот «Решения и проверки» (owner-cal.js slotHtml, макет focus-slots.html Б): предложен — пунктир со штриховкой, принят — сплошной */
.ocal .slot{--c:var(--accent)}
.ocal-ev.slot{z-index:2;border:1.5px dashed var(--accent-line);border-radius:var(--r-md);background:repeating-linear-gradient(135deg,transparent 0 6px,color-mix(in srgb,var(--accent) 7%,transparent) 6px 12px)}
.ocal-ev.slot.acc{border:1.5px solid var(--accent);background:var(--accent-soft)}
.ocal-ev.slot:hover{background:color-mix(in srgb,var(--accent) 16%,var(--surface))}
.ocal-ev.slot .ocal-et{color:var(--text)}
.ocal-lg.slot i{background:transparent;border:1.5px dashed var(--accent-line)}
.ocal-fsd{display:flex;flex-direction:column;gap:10px;font-size:var(--fs-md);color:var(--text-2)}
.ocal-fsw{display:flex;align-items:center;gap:8px;margin:0;font:500 var(--fs-lg) var(--font-mono);color:var(--text)}
.ocal-fsl{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.ocal-fsn{margin:0;font-size:var(--fs-sm);color:var(--text-3)}