:root {
  --bg: #f4f5f7; --panel: #ffffff; --card: #ffffff; --fg: #14171a; --muted: #6b7280; --line: #e3e6ea;
  --accent: #2563eb; --pin: #c26a00; --today: #fff4e0; --event: #2563eb; --event-bg: #e7efff; --drop: #fff7e8;
  --fevent: #a15c00; --fevent-bg: #fdeccc; --cevent: #15803d; --cevent-bg: #dcfce7; --oevent: #c2410c; --oevent-bg: #ffedd5; --vevent: #7c3aed; --vevent-bg: #ede9fe;
  --c-red: #dc2626; --c-orange: #ea580c; --c-yellow: #ca8a04; --c-green: #16a34a; --c-blue: #2563eb; --c-purple: #9333ea;
  color-scheme: light;
}
/* тёмная тема: выбрана на сайте (кнопка в шапке) или, если ничего не выбрано, — системная */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1216; --panel: #151a20; --card: #1b2128; --fg: #e5e7eb; --muted: #9ca3af; --line: #2a3139;
    --accent: #60a5fa; --pin: #f59e0b; --today: #2a2214; --event: #93c5fd; --event-bg: #1c2a3f; --drop: #2a2214;
    --fevent: #fbbf24; --fevent-bg: #33270f; --cevent: #86efac; --cevent-bg: #14301f; --oevent: #fb923c; --oevent-bg: #3b1d0c; --vevent: #c4b5fd; --vevent-bg: #2a1f45;
    --c-red: #f87171; --c-orange: #fb923c; --c-yellow: #facc15; --c-green: #4ade80; --c-blue: #60a5fa; --c-purple: #c084fc;
    color-scheme: dark;  /* тёмные полосы прокрутки и поля даты */
  
  }
}
:root[data-theme="dark"] {
    --bg: #0f1216; --panel: #151a20; --card: #1b2128; --fg: #e5e7eb; --muted: #9ca3af; --line: #2a3139;
    --accent: #60a5fa; --pin: #f59e0b; --today: #2a2214; --event: #93c5fd; --event-bg: #1c2a3f; --drop: #2a2214;
    --fevent: #fbbf24; --fevent-bg: #33270f; --cevent: #86efac; --cevent-bg: #14301f; --oevent: #fb923c; --oevent-bg: #3b1d0c; --vevent: #c4b5fd; --vevent-bg: #2a1f45;
    --c-red: #f87171; --c-orange: #fb923c; --c-yellow: #facc15; --c-green: #4ade80; --c-blue: #60a5fa; --c-purple: #c084fc;
    color-scheme: dark;  /* тёмные полосы прокрутки и поля даты */
  
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }  /* иначе .meta (display:flex) показывает скрытые подписи */
body { margin: 0; background: var(--bg); color: var(--fg); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.wrap { max-width: 1440px; margin: 0 auto; padding: 16px; }
header { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
h1 { font-size: 20px; margin: 0; }
h2 { font-size: 16px; margin: 0; letter-spacing: 0.02em; }
nav { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
nav a { color: var(--accent); text-decoration: none; }
a { color: inherit; }
button { padding: 6px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--fg); cursor: pointer; font: inherit; }
button.small { font-size: 12px; padding: 4px 8px; }
button.sound { font-size: 12px; }
button.icon { border: none; background: none; padding: 0 4px; color: var(--muted); }
button.icon:hover { color: var(--fg); }
.meta { color: var(--muted); font-size: 13px; display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; }
.tk { font-weight: 600; color: var(--pin); }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }

/* календарь */
#cal { margin-bottom: 16px; }
.cal-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.cal-head #caltoggle { margin-left: auto; }
.calgrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.calwd { font-size: 12px; color: var(--muted); text-align: center; }
.day { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; min-height: 64px; cursor: pointer; background: var(--card); display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.day:hover { border-color: var(--accent); }
.day.past { opacity: 0.45; }
.day.today { background: var(--today); border-color: var(--pin); }
.day.sel { outline: 2px solid var(--accent); }
.day.weekend .dnum { color: var(--pin); }
.dhead { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; color: var(--muted); }
.dnum { font-size: 16px; font-weight: 700; color: var(--fg); }
.ev { font-size: 12px; background: var(--event-bg); color: var(--event); border-radius: 4px; padding: 1px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev.evf { background: var(--fevent-bg); color: var(--fevent); }  /* событие из FOCUS BUKV */
.evmore { font-size: 12px; color: var(--muted); }
.calnav { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.calnav + #caltoggle { margin-left: 0; }
.calnav[hidden] + #caltoggle { margin-left: auto; }

/* две колонки */
.cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 900px) { .cols { grid-template-columns: minmax(0, 1fr); } .calgrid.month .ev { display: none; } }
.col-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }

/* FOCUS BUKV: колонка на всю высоту экрана и не уезжает при прокрутке пинов — бросить карточку
   можно из любого места списка */
#focuspanel { position: sticky; top: 12px; height: calc(100vh - 24px); display: flex; flex-direction: column; }
#focus { flex: 1; overflow-y: auto; min-height: 120px; scrollbar-width: none; }  /* прокрутка есть, полосы нет */
#focus::-webkit-scrollbar { display: none; }
.fi.onday { background: var(--fevent-bg); }
.fi.hl { box-shadow: inset 0 0 0 2px var(--pin); }
.fwhen { color: var(--fevent); }
@media (max-width: 900px) { #focuspanel { position: static; height: auto; } #focus { max-height: none; } }
.fnav { display: flex; gap: 4px; }
#fday { color: var(--pin); }
#focuspanel.archive .fadd, #focuspanel.archive .drophint { display: none; }
#farchive { margin: 0 0 6px; }
.fi { display: flex; gap: 8px; align-items: flex-start; }
.fi .mark { border: none; background: none; padding: 0; font-size: 16px; line-height: 1.4; cursor: pointer; }
span.mark { cursor: default; }
.fbody { flex: 1; min-width: 0; }
.fi.fnew { box-shadow: inset 2px 0 0 var(--muted); }  /* добавлено сегодня — нейтрально, чтобы не путать с подсветкой */
.fadd { display: flex; gap: 6px; align-items: stretch; }
.fadd textarea { flex: 1; min-width: 0; resize: none; overflow-y: auto; scrollbar-width: none; max-height: 240px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); font: inherit; }
.drophint { margin: 6px 0; font-size: 12px; }
#focus { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 8px; }
#focus li { padding: 8px 10px; border-top: 1px solid var(--line); }
#focus li:first-child { border-top: none; }
.ftext { white-space: pre-wrap; word-break: break-word; }
.fnews { font-size: 14px; margin-bottom: 2px; }
.fi .meta { margin-top: 2px; }
.fi .meta button { margin-left: auto; }
.fi .meta button + button { margin-left: 0; }
#focuspanel.dragover { background: var(--drop); outline: 2px dashed var(--pin); }
.empty { padding: 8px 10px; }

/* пины */
.tabs { display: flex; gap: 6px; }
.tabs button.on { border-color: var(--accent); color: var(--accent); }
.tabs span { color: var(--muted); }
#pins.only-mine .card[data-mine="0"] { display: none; }
.card.onday { box-shadow: 0 0 0 2px var(--accent); }  /* пин с датой выбранного дня */
#dayfilter { margin: 0 0 6px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin: 0 0 10px; }
.card[draggable="true"] { cursor: grab; }
.card.dragging { opacity: 0.5; }
.title { font-weight: 600; margin: 4px 0; }
.short { color: var(--muted); font-size: 14px; white-space: pre-line; }
.also { margin-top: 4px; }
.also a { color: var(--accent); }
.dt { margin-top: 6px; font-size: 13px; }
.dt summary { cursor: pointer; }
.dt summary .meta { display: inline; }
.dt form { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; align-items: center; }
.dt input[type="date"] { padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); font: inherit; }
.c { border-top: 1px solid var(--line); margin-top: 8px; padding-top: 6px; font-size: 14px; }
.c b { font-weight: 600; }
form.add { display: flex; gap: 6px; margin-top: 8px; }
form.add input { flex: 1; min-width: 0; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); font: inherit; }
.actions { margin-top: 6px; }
.card.new { animation: flash 10s ease-out; }
@keyframes flash { from { box-shadow: 0 0 0 2px var(--pin); } to { box-shadow: 0 0 0 2px transparent; } }
.card.hl { box-shadow: 0 0 0 2px var(--accent); }
.card.dropinto { outline: 2px dashed var(--pin); outline-offset: 2px; background: var(--drop); }  /* сюда объединить */
/* группа: вкладки по одной на новость */
/* вкладки группы — как в браузере: сидят на линии сверху карточки, активная «срастается» с содержимым */
.tabbar { display: flex; gap: 2px; margin: -12px 28px 10px -14px; padding: 6px 0 0 8px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.tabbar::-webkit-scrollbar { display: none; }
.tab { flex: 0 1 200px; min-width: 60px; font-size: 12px; padding: 5px 10px; margin-bottom: -1px; white-space: nowrap; overflow: hidden;
       text-overflow: ellipsis; text-align: left; color: var(--muted); background: transparent; border: 1px solid transparent;
       border-bottom: none; border-radius: 8px 8px 0 0; }
.tab:hover { color: var(--fg); background: var(--bg); }
.tab.on { color: var(--fg); background: var(--card); border-color: var(--line); box-shadow: inset 0 2px 0 var(--pin); }
.ungroup { margin-top: 6px; }

table { width: 100%; border-collapse: collapse; font-size: 14px; }
td { border-bottom: 1px solid var(--line); padding: 4px 6px; vertical-align: top; }

/* «Отменить» после снятия пина / удаления записи */
#toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 10; display: flex; align-items: center;
         gap: 14px; padding: 10px 14px 12px; border-radius: 10px; background: var(--card); border: 1px solid var(--pin);
         box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35); overflow: hidden; }
#toast button { border-color: var(--pin); color: var(--pin); }
#toast .bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--pin); transform-origin: left; }
@keyframes undo { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* сортировка рядом с «Все / Мои» */
.pinctl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* подсветка цветом: полоса слева и лёгкий фон того же цвета */
.card { position: relative; }
.cpick { font-size: 14px; }
.card > .cpick { position: absolute; top: 8px; right: 8px; opacity: 0.5; }
.card:hover > .cpick, .card[data-color]:not([data-color=""]) > .cpick { opacity: 1; }
.card.group > .cpick { top: 10px; }
[data-color="red"] { --hl: var(--c-red); } [data-color="orange"] { --hl: var(--c-orange); } [data-color="yellow"] { --hl: var(--c-yellow); }
[data-color="green"] { --hl: var(--c-green); } [data-color="blue"] { --hl: var(--c-blue); } [data-color="purple"] { --hl: var(--c-purple); }
.card[data-color]:not([data-color=""]) { border-left: 4px solid var(--hl); background: color-mix(in srgb, var(--hl) 9%, var(--card)); }
.fi[data-color]:not([data-color=""]) { box-shadow: inset 4px 0 0 var(--hl); background: color-mix(in srgb, var(--hl) 12%, transparent); }
.card[data-color]:not([data-color=""]) > .cpick, .fi[data-color]:not([data-color=""]) .cpick { color: var(--hl); }
#palette { position: absolute; z-index: 20; display: flex; gap: 6px; padding: 8px; border-radius: 10px; background: var(--card);
           border: 1px solid var(--line); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35); }
#palette .sw { width: 22px; height: 22px; padding: 0; border-radius: 50%; border: 2px solid var(--line); font-size: 11px; color: var(--muted); }
#palette .sw[data-c="red"] { background: var(--c-red); } #palette .sw[data-c="orange"] { background: var(--c-orange); }
#palette .sw[data-c="yellow"] { background: var(--c-yellow); } #palette .sw[data-c="green"] { background: var(--c-green); }
#palette .sw[data-c="blue"] { background: var(--c-blue); } #palette .sw[data-c="purple"] { background: var(--c-purple); }
#palette .sw:hover { border-color: var(--fg); }

/* правка записи фокуса в строке */
.fedit { width: 100%; resize: none; overflow: hidden; padding: 4px 6px; border: 1px solid var(--accent); border-radius: 6px;
         background: var(--bg); color: var(--fg); font: inherit; }
/* ник в шапке — нажать, чтобы сменить */
.uname { color: var(--muted); font-size: 13px; cursor: pointer; border-bottom: 1px dashed transparent; }
.uname:hover { color: var(--fg); border-bottom-color: var(--muted); }
.unedit { width: 160px; padding: 3px 6px; border: 1px solid var(--accent); border-radius: 6px; background: var(--bg); color: var(--fg); font: inherit; font-size: 13px; }
.unerr { color: var(--c-red); }
#sortsel { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--fg); font: inherit; font-size: 12px; }

/* ⧉ — копировать текст новости; справа в строке источника, левее ◐ */
.copybtn { margin-left: auto; margin-right: 22px; font-size: 14px; opacity: 0.6; }
.copybtn:hover { opacity: 1; }
.copybtn.done { color: var(--c-green); opacity: 1; }
#themebtn { font-size: 13px; }
/* ❕ — белый значок: в светлой теме затемняем его, иначе на белом не виден */
:root[data-theme="light"] .m-wait { filter: brightness(0.35); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .m-wait { filter: brightness(0.35); } }

/* кто запинил — в строке источника, справа, перед ⧉ */
.pinby { margin-left: auto; color: var(--pin); white-space: nowrap; cursor: default; }
.pinby b { font-weight: 600; }
.pinby + .copybtn { margin-left: 4px; }

/* комментарий: «Имя 09.10 16:55» одной строкой, текст под ней */
.c .meta { display: inline; }

/* действие уже показано, сервер сохраняет */
.pending { opacity: 0.45; pointer-events: none; transition: opacity 0.15s; }

/* корпоративные события из календаря Google — зелёные */
.ev.evc { background: var(--cevent-bg); color: var(--cevent); }
.caltgl { opacity: 0.55; }
#corptoggle.on { opacity: 1; border-color: var(--cevent); color: var(--cevent); }
#officetoggle.on { opacity: 1; border-color: var(--oevent); color: var(--oevent); }
.ev.evo { background: var(--oevent-bg); color: var(--oevent); }
.cal-office .ctime, li.cal-office .ctime { color: var(--oevent); }
.dp-sec .cal-office li.hl { box-shadow: inset 0 0 0 2px var(--oevent); }
.cal-head .caltgl { margin-left: 0; }

/* панель дня под календарём: всё, что есть на выбранный день */
#daypanel { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--card);
            max-height: 320px; overflow-y: auto; scrollbar-width: thin; }
.dp-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 6px; }
.dp-head #dpclose { margin-left: auto; }
.dp-sec { margin-top: 8px; }
.dp-sec ul, .fcorp ul { list-style: none; margin: 4px 0 0; padding: 0; }
.dp-sec li, .fcorp li { display: flex; gap: 10px; align-items: baseline; padding: 4px 6px; border-radius: 6px; }
.dp-sec li:hover, .fcorp li:hover { background: var(--bg); }
.dp-sec li.hl { box-shadow: inset 0 0 0 2px var(--cevent); }
.dp-sec .jump { cursor: pointer; }
.ctime { flex: 0 0 64px; color: var(--cevent); font-size: 13px; font-variant-numeric: tabular-nums; }
.ctitle { flex: 1; min-width: 0; }
.ctitle a { color: inherit; }
.cdesc { display: block; color: var(--muted); font-size: 13px; white-space: pre-line; }

/* FOCUS BUKV: вкладки, панель над списком, события дня, архив */
.ftabs { display: flex; gap: 4px; margin-left: auto; margin-right: 8px; }
.ftabs button.on { border-color: var(--accent); color: var(--accent); }
.ftabs span { color: var(--muted); }
.fbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0; }
.fbar .drophint { margin: 0; }
#focuspanel.archive .fbar, #focuspanel.tab-archive .fbar, #focuspanel.tab-archive .fadd { display: none; }
.fcorp { margin-bottom: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; font-size: 14px; }
.fcorp summary { cursor: pointer; color: var(--cevent); }
.fcorp ul { max-height: 180px; overflow-y: auto; scrollbar-width: none; }
#farch { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 8px; flex: 1; overflow-y: auto; scrollbar-width: none; }
#farch li { padding: 8px 10px; border-top: 1px solid var(--line); }
#farch li:first-child { border-top: none; }
#farch .ahead { background: var(--bg); padding: 4px 10px; }
#farch .meta button { margin-left: auto; }
.ccat { margin-left: 8px; font-size: 11px; padding: 0 6px; border-radius: 4px; background: var(--bg); color: var(--muted); white-space: nowrap; }
.ctime:empty { display: none; }  /* у событий на весь день колонку времени не показываем */
.cdesc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.dp-sec li.open .cdesc { display: block; }

/* FOCUS BUKV: ручной порядок перетаскиванием */
#focus .fi[draggable="true"] { cursor: grab; }
#focus .fi.dragging { opacity: 0.4; }
#focus .fi.drop-before { box-shadow: inset 0 3px 0 var(--accent); }
#focus .fi.drop-after { box-shadow: inset 0 -3px 0 var(--accent); }
.fbottom { display: flex; justify-content: flex-end; margin-top: 8px; }
#focuspanel.tab-archive .fbottom { display: none; }
.fadd textarea::-webkit-scrollbar { display: none; }
.fadd button { align-self: flex-start; }

/* ===== компактный вид: меньше рамок, действия — по наведению ===== */
.panel { border: none; background: transparent; padding: 0; }
#cal { padding-bottom: 4px; border-bottom: 1px solid var(--line); border-radius: 0; }
header h1 a { color: inherit; text-decoration: none; }

/* меню: ник в шапке, «⋯» у фокуса */
.umenu { position: relative; display: inline-block; }
.ubtn { border: none; background: none; color: var(--muted); font-size: 14px; }
.ubtn:hover { color: var(--fg); }
.menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 200px; display: flex; flex-direction: column;
        padding: 6px; border-radius: 10px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35); }
.menu > button, .menu > a { text-align: left; border: none; background: none; padding: 7px 10px; border-radius: 6px; font-size: 14px;
                            color: var(--fg); text-decoration: none; }
.menu > button:hover, .menu > a:hover { background: var(--bg); }
.unedit { margin-right: 4px; }

/* карточка пина: панель действий справа сверху — только при наведении */
.card > .cact { position: absolute; top: 6px; right: 8px; display: flex; gap: 2px; align-items: center; padding: 2px 4px;
                border-radius: 8px; background: var(--card); box-shadow: 0 0 0 1px var(--line); opacity: 0; transition: opacity 0.12s; }
.card[data-color]:not([data-color=""]) > .cact { background: color-mix(in srgb, var(--hl) 9%, var(--card)); }
.card:hover > .cact, .card:focus-within > .cact { opacity: 1; }
.card.group > .cact { top: 40px; }
.cact .icon { font-size: 15px; padding: 2px 5px; opacity: 0.85; }
.cact .icon:hover { opacity: 1; }
.cact small { font-size: 11px; margin-left: 2px; color: var(--muted); }
form.inl { display: inline; margin: 0; }
.card > .cpick, .meta .copybtn { display: none; }  /* старые места кнопок */
.card .short { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.card .short.open { display: block; }
.card .ungroup { display: none; }  /* «Отделить» — значок ⇤ в панели действий */
.card .dt { margin-top: 4px; }

/* строки фокуса: ◐ 🗄 ✎ ✕ — только при наведении на строку */
#focus .fi .meta .icon { visibility: hidden; }
#focus .fi:hover .meta .icon, #focus .fi:focus-within .meta .icon { visibility: visible; }

/* подсказка про перетаскивание — только во время перетаскивания пина */
#focuspanel { position: sticky; }
#focuspanel.dragover::after { content: "Отпустите — добавить в фокус"; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
                              padding: 10px 16px; border-radius: 10px; background: var(--card); color: var(--pin); font-weight: 600;
                              box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35); pointer-events: none; }

/* на сенсорных экранах наведения нет — действия видны всегда */
@media (hover: none) {
  .card > .cact { position: static; opacity: 1; box-shadow: none; padding: 0; margin: -4px 0 4px auto; width: max-content; }
  #focus .fi .meta .icon { visibility: visible; }
}

/* ===== страница «новости по тикеру» (админ) ===== */
.tk-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.tk-form input { padding: 7px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--fg); font: inherit; }
#tkinput { width: 260px; }
.tk-head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.tk-head h2 { font-size: 26px; }
.up { color: var(--c-green); } .down { color: var(--c-red); }
.tk-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 12px 0; }
.tk-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.tk-val { font-size: 22px; font-weight: 700; margin: 2px 0; }
.tk-chart { width: 100%; height: 260px; display: block; background: var(--card); border: 1px solid var(--line); border-radius: 10px; }
.tk-chart .price { fill: none; stroke: var(--accent); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.tk-chart .prev { stroke: var(--muted); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.tk-chart .vol { fill: var(--muted); opacity: 0.35; }
.tk-chart .gap { fill: var(--muted); opacity: 0.12; }
.tk-chart .night { fill: var(--muted); opacity: 0.07; }
.tk-chart .nline { stroke-width: 1; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; }
.tk-chart .nline.tag, .tk-chart .ndot.tag { stroke: var(--pin); fill: var(--pin); }
.tk-chart .nline.text, .tk-chart .ndot.text { stroke: var(--c-purple); fill: var(--c-purple); }
.tk-chart .nnum { fill: var(--card); font-size: 10px; font-weight: 700; }
.tk-chart .ax { fill: var(--muted); font-size: 11px; }
.tk-legend { margin: 6px 0 14px; gap: 6px; align-items: center; }
.lg { display: inline-block; width: 14px; height: 3px; margin-left: 8px; border-radius: 2px; }
.lg.price { background: var(--accent); } .lg.prev { background: var(--muted); } .lg.vol { background: var(--muted); opacity: 0.4; height: 8px; }
.lg.tag { background: var(--pin); } .lg.text { background: var(--c-purple); } .lg.gap { background: var(--muted); opacity: 0.2; height: 10px; }
.tk-sec { margin: 14px 0; }
.tk-sec h3 { font-size: 16px; margin: 0 0 8px; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.tk-gaps { color: var(--c-orange); }
.tk-news { list-style: none; margin: 0; padding: 0; }
.tk-news li { display: flex; gap: 10px; padding: 8px 10px; border-top: 1px solid var(--line); }
.tk-news li:target { background: var(--drop); }
.tk-num { flex: 0 0 22px; height: 22px; border-radius: 50%; background: var(--pin); color: var(--card); font-size: 12px; font-weight: 700;
          display: flex; align-items: center; justify-content: center; }
.tk-nbody { flex: 1; min-width: 0; }
.tk-tag { font-size: 11px; padding: 0 6px; border-radius: 4px; background: var(--bg); }
.tk-tag.text { color: var(--c-purple); }
.tk-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) { .tk-cols { grid-template-columns: 1fr; } }
.tk-list { list-style: none; margin: 0; padding: 0; }
.tk-list li { padding: 6px 0; border-top: 1px solid var(--line); }
.tk-src { font-size: 11px; color: var(--muted); }
.tk-news .short { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--muted); font-size: 14px; }
/* событие календаря, объединённое с пином про ту же компанию в тот же день */
.cpin { display: block; font-size: 13px; color: var(--pin); cursor: pointer; }
.cpin:hover { text-decoration: underline; }
.cpinmark { margin-left: 6px; font-size: 12px; }
/* страница тикера: сюжеты — пересказы одной новости свёрнуты под первой */
.tk-sec h3 .tk-mode { margin-left: 12px; display: inline-flex; gap: 4px; vertical-align: middle; }
.tk-mode button.on { border-color: var(--accent); color: var(--accent); }
.tk-more { padding: 0 6px; font-size: 12px; }
.tk-news .tk-dups { list-style: none; margin: 6px 0 0; padding: 0 0 0 10px; border-left: 2px solid var(--line); }
.tk-news .tk-dups li { display: block; border-top: 0; padding: 2px 0; font-size: 14px; }
.tk-news .tk-dups .meta b { font-variant-numeric: tabular-nums; }
.tk-all { margin: 8px 10px; }
/* «Влагус» — маловероятные идеи: фиолетовые */
.ev.evv { background: var(--vevent-bg); color: var(--vevent); }
.fi.fl-vlagus { border-left: 3px solid var(--vevent); background: color-mix(in srgb, var(--vevent-bg) 55%, transparent); }
.ftabs button[data-ft="vlagus"].on { border-color: var(--vevent); color: var(--vevent); }
.vbadge { font-size: 11px; padding: 0 6px; border-radius: 4px; background: var(--vevent-bg); color: var(--vevent); }
.dp-vlagus .ctitle { color: var(--vevent); }
/* переключатель «Влагус» и его блок под фокусом */
.vtgl { font-size: 11px; color: var(--vevent); border-color: var(--vevent); opacity: 0.6; }
.vtgl.on { opacity: 1; background: var(--vevent-bg); }
.vhead { margin-top: 10px; padding: 4px 8px; border-top: 2px solid var(--vevent); color: var(--vevent); font-weight: 600; }
.vhead.drop-after { box-shadow: 0 2px 0 var(--vevent); }
.fbtns { display: flex; flex-direction: column; gap: 4px; align-self: flex-start; }
.vadd { border-color: var(--vevent); color: var(--vevent); }
/* многодневные события календаря: одна строка через все дни, плашки сливаются в полосу */
.ev.evgap { visibility: hidden; }
.ev.cont-l { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -6px; padding-left: 10px; }
.ev.cont-r { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: -6px; }
#faddbtn { align-self: flex-start; white-space: nowrap; }
#faddbtn.to-vlagus { border-color: var(--vevent); color: var(--vevent); }
/* ночная сводка */
.nt-mine { display: flex; flex-wrap: wrap; gap: 6px; }
.nt-our { display: inline-flex; align-items: baseline; gap: 4px; padding: 3px 8px; border: 1px solid var(--line); border-radius: 6px;
          background: var(--card); color: var(--muted); cursor: pointer; font: inherit; font-size: 13px; }
.nt-our.has { color: var(--fg); border-color: var(--accent); }
.nt-our.on { background: var(--event-bg); }
.nt-cols { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 20px; }
@media (max-width: 800px) { .nt-cols { grid-template-columns: 1fr; } }
.nt-tks { display: flex; flex-wrap: wrap; gap: 4px; margin: 3px 0; }
.nt-tk { font-size: 12px; padding: 0 6px; border-radius: 4px; background: var(--bg); border: 1px solid var(--line); color: var(--fg); text-decoration: none; }
.nt-tk.mine { border-color: var(--pin); }
.tk-news li.nt-ours { box-shadow: inset 3px 0 0 var(--pin); }
.nt-events li { display: flex; gap: 8px; align-items: baseline; }
.nt-events li { padding-left: 8px; }
.nt-events li.cal-office { box-shadow: inset 3px 0 0 var(--oevent); }
.nt-events li.cal-corp { box-shadow: inset 3px 0 0 var(--cevent); }
.nt-events .ctime:empty { display: none; }
/* шапка: ссылки на «Ночную сводку» и «Новости по тикеру» рядом с ником */
nav a.navlink { color: var(--muted); font-size: 14px; }
nav a.navlink:hover { color: var(--fg); }
/* страница тикера: минутные свечи вокруг новости (клик по номеру новости) */
.tk-num { cursor: pointer; }
.tk-num:hover { filter: brightness(1.15); }
.tk-news > li.zoomed { background: var(--drop); }
.tk-zoomhead { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.tk-zstats { display: inline-flex; gap: 12px; flex-wrap: wrap; margin-left: 8px; }
.tk-candles .body.cu, .tk-candles .wick.cu { fill: var(--c-green); stroke: var(--c-green); }
.tk-candles .body.cd, .tk-candles .wick.cd { fill: var(--c-red); stroke: var(--c-red); }
.tk-candles .body.cf, .tk-candles .wick.cf { fill: var(--muted); stroke: var(--muted); }
.tk-candles .wick { stroke-width: 1; vector-effect: non-scaling-stroke; }
.tk-candles .base { stroke: var(--accent); stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.tk-candles .tick { stroke: var(--muted); stroke-dasharray: 1 4; opacity: .6; vector-effect: non-scaling-stroke; }
.tk-candles .nline.cur { stroke-dasharray: none; stroke-width: 2; }
/* сюжет от ИИ: заголовок и важность 1–5 */
.tk-story { display: flex; align-items: baseline; gap: 8px; font-weight: 600; margin-bottom: 2px; }
.tk-w { flex: 0 0 auto; min-width: 18px; text-align: center; font-size: 11px; font-weight: 700; padding: 0 5px; border-radius: 4px;
        background: var(--bg); color: var(--muted); border: 1px solid var(--line); }
.tk-w.w5 { background: var(--c-red); border-color: var(--c-red); color: #fff; }
.tk-w.w4 { border-color: var(--c-orange); color: var(--c-orange); }
.tk-w.w3 { border-color: var(--c-yellow); color: var(--c-yellow); }
/* страница тикера: топ-20 по обороту — одна таблица во всю ширину окна */
.tk-top { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; table-layout: auto; }
.tk-top th { text-align: left; font-weight: 500; color: var(--muted); font-size: 12px; padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tk-top td { padding: 7px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; vertical-align: middle; }
.tk-top .num { text-align: right; }
.tk-top .c-n { width: 1%; color: var(--muted); font-size: 12px; }
.tk-top .c-sec { font-weight: 700; width: 1%; }
.tk-top .c-name { color: var(--muted); max-width: 0; width: 40%; overflow: hidden; text-overflow: ellipsis; }
.tk-top .c-val { color: var(--muted); }
.tk-top tbody tr { cursor: pointer; }
.tk-top tbody tr:hover td { background: var(--drop); }
.tk-top .fl-up { animation: flup 1.5s; } .tk-top .fl-down { animation: fldown 1.5s; }
@keyframes flup { from { background: color-mix(in srgb, var(--c-green) 35%, transparent); } }
@keyframes fldown { from { background: color-mix(in srgb, var(--c-red) 35%, transparent); } }
@media (max-width: 520px) { .tk-top .c-name { display: none; } .tk-top td, .tk-top th { padding-left: 5px; padding-right: 5px; } }
/* узкое окно (телефон): шапка и форма тикера переносятся, ничего не выходит за край */
@media (max-width: 600px) {
  header nav { flex-basis: 100%; justify-content: flex-start; gap: 10px; }
  nav a.navlink { font-size: 13px; }
  .tk-form > * { flex: 1 1 auto; }
  #tkinput { width: auto; min-width: 0; flex: 1 1 140px; }
  .tk-form input[type="date"], .tk-form input[type="datetime-local"] { flex: 1 1 140px; min-width: 0; }
  .tk-sec h3 .meta { font-size: 12px; }
}
/* поиск по словам: найденное в заголовке */
.tk-news mark { background: color-mix(in srgb, var(--c-yellow) 35%, transparent); color: inherit; border-radius: 2px; padding: 0 1px; }
#tkdays { padding: 7px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--fg); font: inherit; }
/* ВЛАГУС — третья колонка между фокусом и пинами (кнопка «Влагус» во вкладках фокуса) */
.cols.with-vlagus { grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr) minmax(0, 1.15fr); }
#vlaguspanel { position: sticky; top: 12px; height: calc(100vh - 24px); display: flex; flex-direction: column; }
#vlaguspanel h2 { color: var(--vevent); }
#vlagus { flex: 1; overflow-y: auto; min-height: 120px; scrollbar-width: none; list-style: none; margin: 0; padding: 0;
          border: 1px solid color-mix(in srgb, var(--vevent) 45%, var(--line)); border-radius: 8px; }
#vlagus::-webkit-scrollbar { display: none; }
#vlagus li { padding: 8px 10px; border-top: 1px solid var(--line); }
#vlagus li:first-child { border-top: none; }
#vlagus .fi.fl-vlagus { background: none; border-left: 0; }
#vlagus .fi[draggable="true"] { cursor: grab; }
#vlagus .fi.dragging { opacity: 0.4; }
#vlagus .fi.drop-before, #focus .fi.drop-before { box-shadow: inset 0 3px 0 var(--accent); }
#vlagus .fi.drop-after, #focus .fi.drop-after { box-shadow: inset 0 -3px 0 var(--accent); }
#vlagus.drop-into, #focus.drop-into { box-shadow: inset 0 -3px 0 var(--accent); }
#vlagus .fi .meta .icon { visibility: hidden; }
#vlagus .fi:hover .meta .icon, #vlagus .fi:focus-within .meta .icon { visibility: visible; }
#vlaguspanel.archive .fadd { display: none; }
#vlaguspanel.dragover { background: var(--drop); outline: 2px dashed var(--vevent); }
#vlaguspanel .fadd { margin-bottom: 8px; }
@media (max-width: 900px) { .cols.with-vlagus { grid-template-columns: minmax(0, 1fr); } #vlaguspanel { position: static; height: auto; } }
@media (hover: none) { #vlagus .fi .meta .icon { visibility: visible; } }
/* шапки колонок фокуса и ВЛАГУСа: одна строка одной высоты; в узкой колонке кнопки сжимаются, а не переносятся */
#focuspanel, #vlaguspanel { container-type: inline-size; }
#focuspanel .col-head, #vlaguspanel .col-head { flex-wrap: nowrap; min-height: 34px; }
#focuspanel .col-head h2, #vlaguspanel .col-head h2 { white-space: nowrap; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; }
#focuspanel .ftabs { flex-wrap: nowrap; margin-right: 4px; }
#focuspanel .ftabs button, #focuspanel .fnav button { white-space: nowrap; }
#focuspanel .fnav { flex-wrap: nowrap; }
@container (max-width: 520px) {
  #focuspanel .col-head h2 { font-size: 14px; }
  #focuspanel .ftabs button, #focuspanel .fnav button { padding: 2px 6px; font-size: 12px; }
  #ftoday { display: none; }  /* «сегодня» — и так кнопкой › до сегодняшнего дня */
}
@container (max-width: 470px) { #focuspanel .fbukv { display: none; } }  /* «FOCUS 15/10» — дата остаётся */
@container (max-width: 400px) { #focuspanel .ftabs #narch { display: none; } }
/* ширина колонки ВЛАГУС — мышкой за край (двойной клик — обычная ширина) */
.cols.with-vlagus { grid-template-columns: minmax(0, 1fr) var(--vw, minmax(0, 0.85fr)) minmax(0, 1.15fr); }
#vlaguspanel { position: sticky; }
.vresize { position: absolute; top: 0; bottom: 0; width: 10px; cursor: col-resize; z-index: 2; touch-action: none; }
.vresize.l { left: -13px; } .vresize.r { right: -13px; }
.vresize::after { content: ""; position: absolute; top: 40px; bottom: 40px; left: 4px; width: 2px; border-radius: 1px; background: transparent; transition: background .15s; }
.vresize:hover::after, .vresize.on::after { background: var(--vevent); }
body.resizing { cursor: col-resize; user-select: none; }
@media (max-width: 900px) { .vresize { display: none; } .cols.with-vlagus { grid-template-columns: minmax(0, 1fr); } }
@container (max-width: 360px) {
  #focuspanel .col-head { gap: 4px; }
  #focuspanel .col-head h2 { font-size: 13px; overflow: visible; }
  #focuspanel .ftabs { gap: 2px; margin-right: 2px; }
  #focuspanel .ftabs button, #focuspanel .fnav button { padding: 2px 4px; font-size: 11px; }
}
/* страница входа по токену */
.login-body { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; }
.login { width: 100%; max-width: 360px; display: flex; flex-direction: column; gap: 12px; background: var(--card); border: 1px solid var(--line);
         border-radius: 14px; padding: 24px 20px; }
.login h1 { margin: 0; font-size: 22px; }
.login .meta { display: block; }
.login input { padding: 12px; font-size: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--fg); }
.login button { padding: 12px; font-size: 16px; border-radius: 8px; border: 1px solid var(--accent); background: var(--accent); color: #fff; cursor: pointer; }
.login-err { margin: 0; color: var(--c-red); font-size: 14px; }
/* телефон: панель быстрого перехода, календарь недели — списком по дням, отступы поменьше */
.mjump { display: none; }
@media (max-width: 900px) {
  /* фон сплошной — сквозь панель не просвечивает листающаяся страница */
  .mjump { display: flex; gap: 6px; position: sticky; top: 0; z-index: 20; margin: 0 -10px 10px; padding: 8px 10px;
           background: var(--bg); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
  .mjump a { flex: 0 0 auto; padding: 6px 12px; border: 1px solid var(--line); border-radius: 16px; color: var(--fg); text-decoration: none; font-size: 14px; }
  .mjump a[hidden] { display: none; }
  #cal, #focuspanel, #vlaguspanel, #pinspanel { scroll-margin-top: 56px; }
}
@media (max-width: 600px) {
  .wrap { padding: 10px; }
  .calgrid.week { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .calgrid.week .day { flex-direction: row; align-items: center; flex-wrap: wrap; min-height: 0; padding: 6px 10px; gap: 4px 6px; }
  .calgrid.week .dhead { flex: 0 0 62px; justify-content: flex-start; gap: 6px; }
  .calgrid.week .ev { max-width: 100%; }
  .calgrid.month { gap: 3px; }
  .calgrid.month .day { min-height: 40px; padding: 4px; }
  .cal-head { flex-wrap: wrap; row-gap: 6px; }
  button, .small { min-height: 30px; }  /* пальцем попадать легче */
}
/* «приложение» с экрана «Домой» на iPhone: статус-бар поверх страницы — отступ под вырез экрана */
@media (display-mode: standalone) {
  .wrap { padding-top: calc(10px + env(safe-area-inset-top)); }
  /* панель прилипает под статус-баром; сама полоска статус-бара (часы, вырез) — неподвижный слой фона ровно
     её высоты: листающаяся страница под ней не видна, а шапку сайта он не закрывает */
  .mjump { top: env(safe-area-inset-top); }
  body::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: env(safe-area-inset-top);
                 background: var(--bg); z-index: 30; pointer-events: none; }
  .login-body { padding-top: calc(16px + env(safe-area-inset-top)); }
}
/* телефон: панель дня — прямо под нажатым днём (в сетке календаря на всю ширину) */
.calgrid > #daypanel.inline { grid-column: 1 / -1; margin: 2px 0 6px; }
/* телефон: фокус, ВЛАГУС и пины — карусель, по колонке на экран, свайп влево/вправо; у каждой колонки
   своя прокрутка внутри — при листании страницы они не наезжают друг на друга */
@media (max-width: 900px) {
  .cols, .cols.with-vlagus { display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
                             overscroll-behavior-x: contain; scrollbar-width: none; scroll-margin-top: 52px; }
  .cols::-webkit-scrollbar { display: none; }
  .cols > .panel { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always;
                   position: relative; top: auto; height: calc(100dvh - 64px); display: flex; flex-direction: column; }
  .cols > #focuspanel, .cols > #vlaguspanel { position: relative; top: auto; height: calc(100dvh - 64px); }
  #focus, #vlagus, #farch { flex: 1; min-height: 0; overflow-y: auto; max-height: none; }
  #pins { flex: 1; min-height: 0; overflow-y: auto; }
  .vresize { display: none; }
  .mjump a.on { border-color: var(--accent); color: var(--accent); }
}