/* Publishing in the Hallmark look (Rami, 2 November 2026: the approved Publishing mockup; public/publishing.js). The title with its
   tabs and ⋯, one toolbar (By client | By date, Mine, Client ▾), then one list: a group per client (or day), a row per post, every
   download, caption and the Scheduled tick on the row; a press on a row opens the post's panel. A phone: short rows.
   Cadence tokens only, so light and dark follow by themselves; no sideways scroll at 400px. Loaded after app.css (whose older .pb-*
   card rules no longer match anything the page draws). */
html body #pubPage .pb2:not(#_){max-width:1440px;min-width:0}

/* the title, its tabs and ⋯ */
html body #pubPage .pb-head:not(#_){margin:0 0 18px;align-items:center}
html body #pubPage .pb-head .hl-head-l:not(#_){flex-wrap:nowrap;gap:12px 28px;min-width:0;flex:1 1 auto}
html body #pubPage .pb-head .hl-title:not(#_):not(#_){font-size:30px;letter-spacing:-.02em;flex:none}
html body #pubPage .pb-tabs:not(#_):not(#_){display:flex;align-items:stretch;gap:4px 22px;min-width:0;overflow-x:auto;scrollbar-width:none;padding:0;margin:0;background:transparent;border-radius:0;box-shadow:none}
html body #pubPage .pb-tabs::-webkit-scrollbar{display:none}
html body #pubPage .pb-tabs button:not(#_):not(#_){display:inline-flex;align-items:center;gap:8px;flex:none;padding:8px 0 9px;border:0;border-radius:0;background:transparent;box-shadow:none;border-bottom:2px solid transparent;font:600 15px/1.2 var(--font-sans);color:var(--ink-muted);white-space:nowrap;cursor:pointer}
html body #pubPage .pb-tabs button:hover:not(#_):not(#_){color:var(--c-ink)}
html body #pubPage .pb-tabs button.on:not(#_):not(#_){color:var(--c-ink);border-bottom-color:var(--c-ink)}
html body #pubPage .pb-tabs button i:not(#_):not(#_){display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 7px;box-sizing:border-box;border-radius:999px;background:var(--surface-sunken);color:var(--ink-muted);font:600 12px/1 var(--font-sans);font-style:normal}
html body #pubPage .pb-tabs button.on i:not(#_):not(#_){background:var(--c-ink);color:var(--surface)}
html body #pubPage .pb-tabs button:focus-visible:not(#_){outline:2px solid var(--focus);outline-offset:2px}
html body #pubPage .pb-head .hl-more>summary:not(#_):not(#_){width:40px;height:40px;min-height:40px;padding:0;display:inline-grid;place-items:center;font-size:18px}

/* the toolbar */
html body #pubPage .pb-bar:not(#_){display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 16px;min-width:0}
html body #pubPage .pb-bar .bk-tabs:not(#_):not(#_){height:40px;box-sizing:border-box}
html body #pubPage .pb-bar .bk-tabs>button:not(#_):not(#_){padding:0 14px;font-weight:600;min-height:0}
html body #pubPage .pb-vsep:not(#_){width:1px;height:24px;background:var(--border);margin:0 4px}
html body #pubPage .pb-mine:not(#_):not(#_){height:40px;min-height:40px;padding:0 16px;border-radius:var(--radius-md);font-weight:600;border:1px solid var(--border-strong);background:var(--surface);color:var(--c-ink)}
html body #pubPage .pb-mine.on:not(#_):not(#_){background:var(--c-ink);color:var(--surface);border-color:var(--c-ink)}
html body #pubPage .pb-bar .bk-pkb:not(#_):not(#_){height:40px;min-height:40px;box-sizing:border-box}
html body #pubPage .pb-dsub:not(#_),html body #pubPage .pb-flash:not(#_){margin:-4px 0 12px}

/* the list */
html body #pubPage .pb-tw:not(#_){overflow-x:auto;min-width:0}
html body #pubPage .pb-t:not(#_){width:100%;border-collapse:collapse;font-size:14px;color:var(--c-ink)}
html body #pubPage .pb-t thead th:not(#_){text-align:start;font-size:12.5px;font-weight:600;color:var(--ink-muted);padding:11px 8px;border-bottom:1px solid var(--border);white-space:nowrap;background:transparent}
html body #pubPage .pb-t td:not(#_){padding:9px 8px;border-bottom:1px solid var(--border);vertical-align:middle}
html body #pubPage .pb-t tr.pb-g th:not(#_){padding:20px 8px 8px;border-bottom:1px solid var(--border);text-align:start;font-weight:500;background:transparent}
html body #pubPage .pb-t tbody tr.pb-g:first-child th:not(#_){padding-top:8px}
html body #pubPage .pb-gi:not(#_){display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-muted)}
html body #pubPage .pb-gn:not(#_){display:inline-flex;align-items:center;gap:8px;min-width:0}
html body #pubPage .pb-gn b:not(#_){font-size:15px;font-weight:700;color:var(--c-ink)}
html body #pubPage .pb-gd:not(#_){width:9px;height:9px;border-radius:50%;flex:none}
html body #pubPage .pb-g.late .pb-gn b:not(#_):not(#_),html body #pubPage .pb-pg.late.pb-dayg .pb-gn b:not(#_){color:var(--status-stuck-fg)}
html body #pubPage .pb-g:not(.pb-dayg).late .pb-gn b:not(#_):not(#_){color:var(--c-ink)}
html body #pubPage .pb-late:not(#_){font-style:normal;font-weight:700;color:var(--status-stuck-fg);background:transparent;padding:0}
html body #pubPage .pb-sp:not(#_){flex:1 1 auto}
html body #pubPage .pb-zip:not(#_):not(#_){display:inline-flex;align-items:center;gap:7px;height:34px;min-height:34px;padding:0 12px;border-radius:var(--radius-md);font-size:13px;font-weight:600}
html body #pubPage .pb-znote:not(#_){display:block;margin-top:6px;text-align:end;color:var(--ink-muted);font-size:12.5px;font-weight:500}
html body #pubPage tr.pb-r:not(#_){cursor:pointer;transition:background-color .12s}
@media (hover:hover){html body #pubPage tr.pb-r:hover:not(#_){background:var(--surface-hover)}}
html body #pubPage tr.pb-r.open:not(#_){background:var(--surface-sunken)}
html body #pubPage tr.pb-r:focus-visible:not(#_){outline:2px solid var(--focus);outline-offset:-2px}
html body #pubPage td.pb-pc:not(#_){width:100%;max-width:0;min-width:220px}
html body #pubPage .pb-pw:not(#_){display:flex;align-items:center;gap:12px;min-width:0}
html body #pubPage .pb-tx:not(#_){display:flex;flex-direction:column;min-width:0}
html body #pubPage .pb-tx b:not(#_){font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #pubPage .pb-tx small:not(#_){font-size:12.5px;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
html body :is(#pubPage,.sp.pb-sp) .pb-note:not(#_){display:block;margin-top:4px;font-size:12.5px;line-height:1.35;color:var(--status-stuck-fg);font-weight:600;white-space:normal}
html body .sp.pb-sp .pb-chgp:not(#_){margin:10px 0 0;padding:10px 14px;border-radius:12px;font-size:13px;line-height:1.4;font-weight:600;color:var(--status-stuck-fg);background:var(--status-stuck-bg)}
html body #pubPage .pb-th:not(#_){position:relative;flex:none;width:40px;height:40px;border-radius:8px;overflow:hidden;background:var(--surface-sunken)}
html body #pubPage .pb-th.tall:not(#_){height:52px}
html body #pubPage .pb-th img:not(#_){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body :is(#pubPage,.sp.pb-sp) .pb-ct:not(#_){pointer-events:none;position:absolute;bottom:3px;inset-inline-end:3px;top:auto;background:rgba(0,0,0,.62);color:#fff;font-size:10px;font-weight:700;line-height:1;padding:2px 4px;border-radius:4px}
html body #pubPage .pb-dc:not(#_){display:flex;flex-direction:column;gap:1px;white-space:nowrap}
html body #pubPage .pb-dc small:not(#_){font-size:12px;color:var(--ink-muted)}
html body #pubPage .pb-dc.od:not(#_),html body #pubPage .pb-dc.od small:not(#_){color:var(--status-stuck-fg);font-weight:600}
html body #pubPage .pb-pp:not(#_){display:block;font-size:11.5px;color:var(--ink-subtle);white-space:nowrap}
html body #pubPage td.pb-day:not(#_){margin:0}
html body #pubPage .pb-clc span:not(#_){display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-weight:600}
html body #pubPage .pb-clc i:not(#_){width:8px;height:8px;border-radius:50%;flex:none}
html body #pubPage .pb-plats:not(#_){display:inline-flex;gap:4px}
html body #pubPage .pb-plat:not(#_){display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 5px;box-sizing:border-box;border-radius:6px;background:var(--surface-sunken);font-size:11px;font-weight:700;color:var(--ink-muted)}
html body :is(#pubPage,.sp.pb-sp) .pb-none:not(#_){color:var(--ink-subtle);font-size:12.5px;margin:0}
html body :is(#pubPage,.sp.pb-sp) .pb-ic:not(#_){width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
html body #pubPage .pb-cps:not(#_){display:inline-flex;gap:4px;white-space:nowrap}
html body :is(#pubPage,.sp.pb-sp) .pb-cpy:not(#_):not(#_){display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:0 9px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font:inherit;font-size:12px;font-weight:700;color:var(--ink-muted);cursor:pointer;white-space:nowrap}
html body :is(#pubPage,.sp.pb-sp) .pb-cpy:hover:not(#_):not(#_){background:var(--surface-hover);color:var(--c-ink)}
html body :is(#pubPage,.sp.pb-sp) .pb-cpy.done:not(#_):not(#_){background:var(--status-done-bg,var(--surface-sunken));color:var(--status-done-fg,var(--c-ink));border-color:transparent}
html body #pubPage .pb-dl:not(#_):not(#_){display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;padding:4px 6px;margin-inline-start:-6px;border-radius:8px;font:inherit;font-weight:600;color:var(--c-ink);cursor:pointer;white-space:nowrap;text-decoration:underline;text-decoration-color:var(--ink-subtle);text-underline-offset:3px}
html body #pubPage .pb-dl .pb-ic:not(#_){color:var(--ink-muted)}
html body #pubPage .pb-dl:hover:not(#_):not(#_){background:var(--surface-hover)}
html body #pubPage .pb-dl:disabled:not(#_){opacity:.5;cursor:default}
html body #pubPage .pb-stc:not(#_),html body #pubPage .pb-lv:not(#_){display:flex;flex-direction:column;align-items:flex-start;gap:4px}
html body #pubPage .pb-stc small:not(#_),html body #pubPage .pb-lv small:not(#_){font-size:12px;color:var(--ink-muted);white-space:nowrap}
html body #pubPage .pb-not:not(#_):not(#_){font-size:13px}
html body #pubPage .pb-tick:not(#_):not(#_){display:flex;flex-direction:column;align-items:center;gap:3px;min-width:56px;border:0;background:transparent;padding:0;font:600 11px/1.2 var(--font-sans);color:var(--ink-muted);cursor:pointer}
html body #pubPage .pb-tick i:not(#_){width:22px;height:22px;box-sizing:border-box;border-radius:50%;border:2px solid var(--ink-subtle);background:var(--surface);display:grid;place-items:center;font-style:normal;font-size:12px;color:transparent;transition:background .15s,border-color .15s}
html body #pubPage .pb-tick:hover:not(:disabled) i:not(#_){border-color:var(--accent-green)}
html body #pubPage .pb-tick.on:not(#_):not(#_){color:var(--c-ink)}
html body #pubPage .pb-tick.on i:not(#_){background:var(--accent-green);border-color:var(--accent-green);color:#fff}
html body #pubPage .pb-tick:disabled:not(#_):not(#_){cursor:default;opacity:.75}
html body #pubPage .pb-tick:focus-visible:not(#_){outline:none}
html body #pubPage .pb-tick:focus-visible i:not(#_){outline:2px solid var(--focus);outline-offset:2px}
html body #pubPage .pb-fix:not(#_):not(#_){height:32px;min-height:32px;padding:0 14px}
html body #pubPage td.pb-mc:not(#_){width:40px;text-align:end}
html body #pubPage .pb-mb:not(#_):not(#_){width:32px;height:32px;display:inline-grid;place-items:center;border-radius:8px;color:var(--ink-muted);background:transparent;border:0}
html body #pubPage .pb-mb:hover:not(#_):not(#_),html body #pubPage .pb-rmore[open]>.pb-mb:not(#_):not(#_){background:var(--surface-hover);color:var(--c-ink)}
html body #pubPage .pb-msgr td:not(#_){border-bottom:0;padding-top:0}
html body #pubPage .pb-msg:not(#_){margin:0}
html body #pubPage .pb-empty:not(#_){display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:40px 8px}
html body #pubPage .pb-empty .btn-s:not(#_){margin-top:4px}

/* the post's panel */
html body .sp.pb-sp .sp-tools .hl-menu>summary:not(#_):not(#_){width:34px;height:34px;min-height:34px;padding:0;display:inline-grid;place-items:center;border-radius:8px}
html body .sp.pb-sp .pb-mb:not(#_):not(#_){color:var(--ink-muted);background:transparent;border:1px solid var(--border)}
html body .sp.pb-sp .sp-b:not(#_){display:flex;flex-direction:column;gap:18px}
html body .sp.pb-sp .pb-dec:not(#_){border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:color-mix(in srgb,#fbe08a 32%,var(--surface));box-shadow:inset 4px 0 0 #c99a06}
html body .sp.pb-sp .pb-dec.good:not(#_){background:color-mix(in srgb,var(--accent-green) 14%,var(--surface));box-shadow:inset 4px 0 0 var(--accent-green)}
html body .sp.pb-sp .pb-dec.bad:not(#_){background:var(--status-stuck-bg);box-shadow:inset 4px 0 0 var(--status-stuck-fg)}
html body .sp.pb-sp .pb-dec p:not(#_){margin:0;color:var(--c-ink)}
html body .sp.pb-sp .pb-k:not(#_){font-size:12.5px;font-weight:700;color:var(--ink-muted)}
html body .sp.pb-sp .pb-da:not(#_),html body .sp.pb-sp .pb-row2:not(#_){display:flex;gap:8px;flex-wrap:wrap}
html body .sp.pb-sp .pb-da .btn-s:not(#_):not(#_),html body .sp.pb-sp .pb-row2 .btn-s:not(#_):not(#_){display:inline-flex;align-items:center;gap:7px;height:36px;min-height:36px;padding:0 14px}
html body .sp.pb-sp .pb-dsec:not(#_){display:flex;flex-direction:column;gap:10px}
html body .sp.pb-sp .pb-big:not(#_){position:relative;width:340px;max-width:100%;aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:var(--surface-sunken);display:grid;place-items:center}
html body .sp.pb-sp .pb-big.tall:not(#_){width:240px;aspect-ratio:9/16}
html body .sp.pb-sp .pb-big img:not(#_){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body .sp.pb-sp .pb-big>i:not(#_){font-style:normal;color:var(--ink-subtle);font-size:13px}
html body .sp.pb-sp .pb-big .pb-ct:not(#_){top:8px;bottom:auto;inset-inline-end:8px;font-size:12px;padding:3px 8px;border-radius:6px}
html body .sp.pb-sp .pb-car:not(#_){display:flex;gap:6px;overflow-x:auto;padding:2px}
html body .sp.pb-sp .pb-car button:not(#_){position:relative;flex:none;width:56px;height:56px;border-radius:8px;overflow:hidden;border:0;padding:0;cursor:pointer;opacity:.7;background:var(--surface-sunken)}
html body .sp.pb-sp .pb-car button[aria-current="true"]:not(#_){opacity:1;box-shadow:0 0 0 2px var(--c-ink)}
html body .sp.pb-sp .pb-car img:not(#_){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body .sp.pb-sp .pb-caps:not(#_){display:flex;flex-direction:column;gap:10px}
html body .sp.pb-sp .pb-capc:not(#_){background:var(--surface-sunken);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
html body .sp.pb-sp .pb-caph:not(#_){display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--ink-muted)}
html body .sp.pb-sp .pb-capc p:not(#_){margin:0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.55;font-size:14.5px}
html body .sp.pb-sp .pb-capc:is([lang=ar],[lang=he]) p:not(#_){font-family:"IBM Plex Sans Arabic",var(--font-sans);font-size:15px}
html body .sp.pb-sp .pb-facts:not(#_){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0}
html body .sp.pb-sp .pb-facts dt:not(#_){font-size:12.5px;font-weight:600;color:var(--ink-muted)}
html body .sp.pb-sp .pb-facts dd:not(#_){margin:4px 0 0}
html body .sp.pb-sp .pb-hist h3:not(#_){font-size:15px;margin:0 0 4px}
html body .sp.pb-sp .pb-hist ul:not(#_){list-style:none;margin:0;padding:0}
html body .sp.pb-sp .pb-hist li:not(#_){display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13.5px}
html body .sp.pb-sp .pb-hist time:not(#_){color:var(--ink-muted);font-size:12.5px}

/* a phone: the title goes (the header names the page), the tabs take a line of their own, each post a short row */
html body #pubPage .pb-plist:not(#_){display:flex;flex-direction:column;gap:18px}
html body #pubPage .pb-pgh:not(#_){display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap;padding:0 0 8px;border-bottom:1px solid var(--border);font-size:13px;color:var(--ink-muted)}
html body #pubPage .pb-pz:not(#_){display:flex;flex-direction:column;gap:6px;margin-top:8px}
html body #pubPage .pb-pz .pb-zip:not(#_):not(#_){width:100%;justify-content:center;min-height:40px}
html body #pubPage .pb-prow:not(#_){display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--border);cursor:pointer}
html body #pubPage .pb-prow .pb-th:not(#_){width:48px;height:48px}
html body #pubPage .pb-prow .pb-th.tall:not(#_){height:60px}
html body #pubPage .pb-pb:not(#_){display:flex;flex-direction:column;min-width:0}
html body #pubPage .pb-pb>b:not(#_){font-size:15.5px;font-weight:600;line-height:1.3}
html body #pubPage .pb-pm:not(#_){display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:2px;color:var(--ink-muted);font-size:13.5px}
html body #pubPage .pb-pm .od:not(#_){color:var(--status-stuck-fg);font-weight:700}
html body #pubPage .pb-pa:not(#_){display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
html body #pubPage .pb-pa .pb-stc:not(#_){display:contents}
html body #pubPage .pb-pa .pb-tick:not(#_):not(#_){flex-direction:row;font-size:13px;gap:6px;min-height:40px;padding:0 12px;border-radius:999px;background:var(--surface-sunken)}
html body #pubPage .pb-pa :is(.pb-cpy,.pb-dl,.pb-fix):not(#_):not(#_){min-height:40px}
html body #pubPage .pb-pa .pb-dl:not(#_):not(#_){margin-inline-start:0}
@media (max-width:860px){
  html body #pubPage .pb-head:not(#_):not(#_){position:relative;margin-bottom:12px}
  html body #pubPage .pb-head .hl-title:not(#_):not(#_):not(#_){display:none}
  html body #pubPage .pb-head .hl-head-l:not(#_):not(#_){width:calc(100% - 52px);flex:1 1 auto}
  html body #pubPage .pb-head .hl-head-r:not(#_):not(#_){position:absolute;top:0;inset-inline-end:0;width:auto}
  html body #pubPage .pb-head .hl-more>summary:not(#_):not(#_):not(#_){width:36px;height:36px;min-height:36px}
  html body #pubPage .pb-tabs:not(#_):not(#_){gap:4px 18px}
  html body #pubPage .pb-bar:not(#_){gap:8px}
  html body #pubPage .pb-vsep:not(#_){display:none}
  html body #pubPage .pb-bar .bk-tabs:not(#_):not(#_){flex:1 1 100%}
  html body #pubPage .pb-bar .bk-tabs>button:not(#_):not(#_){flex:1 1 0}
  html body #pubPage .pb-bar .bk-pk:not(#_){flex:1 1 auto;min-width:0}
  html body #pubPage .pb-bar .bk-pkb:not(#_):not(#_){width:100%}
  html body .sp.pb-sp .pb-big:not(#_):not(#_){width:100%}
  html body .sp.pb-sp .pb-big.tall:not(#_):not(#_){width:min(240px,100%)}
}
