/* Publishing workspace. Shares the off-white, navy and blue brand tokens. */
body.is-app { margin: 0; }
.app-frame { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100dvh; }
.app-sidebar { --sidebar-muted: #acbacb; position: sticky; top: 0; height: 100dvh; overflow-y: auto; display: flex; flex-direction: column; gap: 26px; padding: 30px 18px 20px; background: var(--navy); color: #fff; }
.app-sidebar__brand { display: flex; align-items: center; gap: 10px; padding: 0 10px; color: #fff; text-decoration: none; }
.app-sidebar__brand img { width: 42px; height: 34px; object-fit: contain; }
.app-sidebar__brand span { font: 400 1.8rem var(--font-display); letter-spacing: -.035em; }
.app-sidebar__cta { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 12px; border-radius: var(--radius-sm); background: var(--cardinal); color: #fff; font-size: .84rem; font-weight: 700; text-decoration: none; }
.app-sidebar__cta:hover { background: var(--cardinal-dark); }
.app-sidebar__nav { display: flex; flex-direction: column; align-items: stretch; gap: 5px; }
.app-sidebar__link { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 10px 12px; border-radius: var(--radius-sm); color: var(--sidebar-muted); font-size: .81rem; font-weight: 500; text-decoration: none; }
.app-sidebar__link-label { display: flex; align-items: center; gap: 12px; }
.app-sidebar__link .app-icon { width: 18px; height: 18px; opacity: .9; }
.app-sidebar__link:hover { background: #213149; color: #fff; }
.app-sidebar__link.is-current { background: #263c56; color: #fff; box-shadow: inset 3px 0 #7cbbf0; }
.app-sidebar__count { font: 400 .69rem var(--font-meta); color: inherit; }
.app-sidebar__card { display: grid; gap: 15px; padding: 22px 10px 0; border-top: 1px solid #304057; }
.app-sidebar__card-label { margin: 0; font: 400 .61rem var(--font-meta); letter-spacing: .11em; text-transform: uppercase; color: var(--sidebar-muted); }
.app-sidebar__accounts { display: grid; gap: 12px; }
.app-sidebar__account { display: flex; align-items: center; gap: 9px; min-width: 0; }
.app-sidebar__account-mark { display: grid; place-items: center; width: 25px; height: 25px; flex: 0 0 auto; background: #2b3d53; border-radius: 7px; color: #e3edf8; font: 400 .6rem var(--font-meta); }
.app-sidebar__account-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #e0e8f1; font-size: .76rem; }
.app-sidebar__account-dot { width: 6px; height: 6px; border-radius: 50%; background: #7ec4a4; flex: 0 0 auto; }
.app-sidebar__account-dot--expiring { background: #efc279; }
.app-sidebar__account-dot--expired { background: #fb9c9c; }
.app-sidebar__warning, .app-sidebar__empty { margin: 0; color: var(--sidebar-muted); font-size: .73rem; line-height: 1.6; }
.app-sidebar__warning a, .app-sidebar__connect { color: #a7d3fb; font-size: .73rem; font-weight: 700; }
.app-sidebar__utilities { margin-top: auto; }
.app-sidebar__profile { display: flex; align-items: center; gap: 9px; border-top: 1px solid #304057; padding-top: 19px; min-width: 0; }
.app-sidebar__avatar { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: #30445e; color: #fff; font-size: .78rem; font-weight: 700; }
.app-sidebar__profile-info { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.app-sidebar__profile-name, .app-sidebar__profile-email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-sidebar__profile-name { color: #eef2f7; font-size: .73rem; font-weight: 600; }
.app-sidebar__profile-email { color: var(--sidebar-muted); font-size: .63rem; }
.app-sidebar__profile form { margin: 0; flex: 0 0 auto; }
.app-sidebar__signout { display: grid; place-items: center; width: 32px; height: 44px; border: 0; background: transparent; border-radius: 6px; color: var(--sidebar-muted); }
.app-sidebar__signout:hover { background: #263c56; color: #fff; }
.app-main { width: 100%; min-width: 0; max-width: 1320px; margin-inline: auto; padding: 48px clamp(24px, 4vw, 64px) 80px; display: flex; flex-direction: column; gap: 32px; }
.app-main:focus { outline: none; }
.app-main > .flash { width: 100%; margin: 0; padding: 12px 16px; border-radius: var(--radius-sm); font-size: .83rem; }
.app-main > .billing-banner { margin: 0; font-size: .83rem; }
.dash-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.dash-head > div { min-width: 0; }
.dash-head h1 { margin: 10px 0; font: 400 2.6rem/1.12 var(--font-display); letter-spacing: -.035em; overflow-wrap: anywhere; text-wrap: balance; }
.dash-head p:not(.eyebrow) { margin: 0; color: var(--soft); font-size: .87rem; }
.dash-head > .button { flex-shrink: 0; }
.dash-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 24px 0; border-block: 1px solid var(--line); }
.dash-stat { position: relative; display: grid; gap: 6px; padding: 0 28px; border-left: 1px solid var(--line); text-decoration: none; }
.dash-stat:first-child { padding-left: 0; border-left: 0; }
.dash-stat > span { color: var(--soft); font-size: .75rem; }
.dash-stat strong { font: 600 2.2rem/1.15 var(--font-ui); letter-spacing: -.07em; font-variant-numeric: tabular-nums; }
.dash-stat .app-icon { position: absolute; right: 28px; top: 2px; color: var(--soft); }
.dash-stat:hover strong { color: var(--cardinal); }
.dash-connections { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 16px 18px; border: 1px solid #d8bd91; border-radius: 10px; background: #fffaf0; }
.dash-connections__accounts { display: flex; gap: 8px; }
.dash-connections__account { display: flex; align-items: center; gap: 4px; }
.dash-connections__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.dash-connections__dot--expiring { background: #906221; }
.dash-connections__dot--expired { background: var(--red); }
.dash-connections p { flex: 1; margin: 0; font-size: .76rem; color: #75531f; }
.dash-connections p strong { display: block; color: #604110; }
.dash-connections .text-link { font-size: .76rem; min-height: 36px; display: inline-flex; align-items: center; }
.dash-section { display: grid; gap: 18px; }
.dash-section__head { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.dash-section__head h2 { margin: 6px 0 0; font: 400 1.75rem/1.1 var(--font-display); letter-spacing: -.02em; }
.dash-section__head .eyebrow { font-size: .6rem; }
.dash-section__head > a { padding-block: 7px; color: var(--cardinal); font-size: .77rem; font-weight: 700; text-decoration: none; }
.dash-upcoming { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dash-upcoming__card { display: flex; flex-direction: column; align-items: stretch; gap: 18px; min-width: 0; min-height: 180px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--card); box-shadow: var(--shadow-sm); text-decoration: none; }
.dash-upcoming__card:hover { border-color: var(--cardinal); }
.dash-upcoming__time { display: flex; align-items: center; gap: 8px; color: var(--cardinal); }
.dash-upcoming__time time { font: 500 .66rem/1.5 var(--font-meta); }
.dash-upcoming__card > strong { flex: 1; font-size: .84rem; line-height: 1.55; overflow-wrap: anywhere; }
.dash-upcoming__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dash-upcoming__row > .app-icon { color: var(--soft); }
.dash-upcoming__platforms { display: flex; flex-wrap: wrap; gap: 5px; }
.post-table { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--card); }
.post-table-head, .post-table-row { grid-template-columns: minmax(180px, 1.8fr) minmax(86px, .8fr) minmax(110px, 1fr) minmax(100px, .9fr); padding: 18px 20px; gap: 16px; }
.post-table-head { background: var(--wash); padding-block: 13px; color: var(--soft); font-size: .59rem; }
.post-title { min-width: 0; }
.post-title > span:last-child { min-width: 0; }
.post-title strong { font-size: .81rem; font-weight: 600; white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.post-title small { margin-top: 4px; color: var(--soft); font-size: .61rem; }
.video-tile { width: 48px; height: 72px; overflow: hidden; border-radius: 6px; flex: 0 0 auto; background: var(--wash); color: var(--cardinal); }
.post-table-row { min-height: 90px; }
.post-table-row:hover { background: var(--wash); }
.platform-dots { flex-wrap: wrap; }
.post-table-row time { color: var(--soft); font: 400 .64rem/1.6 var(--font-meta); }
.post-result { font-size: .71rem; }
.post-result:before { width: 5px; height: 5px; }
.empty-state { display: flex; flex-direction: column; align-items: center; padding: 48px 24px; background: var(--card); border: 1px dashed var(--line); border-radius: var(--radius-md); }
.empty-state__icon { display: grid; place-items: center; width: 58px; height: 58px; background: var(--wash); color: var(--cardinal); border-radius: 16px; }
.empty-state h2 { margin: 20px 0 8px; font: 400 2rem/1.2 var(--font-display); }
.empty-state p { max-width: 43ch; margin: 0 0 24px; font-size: .86rem; }
.app-tabbar, .app-mobile-header { display: none; }
@media (min-width: 901px) and (max-width: 1150px) {
  .app-frame { grid-template-columns: 212px minmax(0, 1fr); }
  .app-sidebar { padding-inline: 12px; }
  .app-main { padding-inline: 28px; }
  .dash-head { flex-wrap: wrap; }
  .dash-upcoming { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .post-table-head, .post-table-row { gap: 12px; padding-inline: 16px; grid-template-columns: minmax(150px, 1.4fr) 70px minmax(90px, 1fr) 92px; }
}
@media (max-width: 900px) {
  .app-frame { display: block; min-height: calc(100dvh - 65px); }
  .app-sidebar { display: none; }
  .app-mobile-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 24px; border-bottom: 1px solid var(--line); background: var(--card); }
  .app-mobile-header .brand { font-size: 1.45rem; }
  .app-mobile-header .brand-mark { width: 32px; height: 24px; }
  .app-mobile-menu { position: relative; }
  .app-mobile-menu summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px; cursor: pointer; list-style: none; font-size: .77rem; font-weight: 700; }
  .app-mobile-menu summary::-webkit-details-marker { display: none; }
  .app-mobile-menu nav { position: absolute; z-index: 40; right: 0; top: calc(100% + 10px); width: 210px; display: flex; flex-direction: column; align-items: stretch; gap: 2px; padding: 8px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); box-shadow: 0 12px 32px rgb(20 32 52 / 12%); }
  .app-mobile-menu nav a, .app-mobile-menu button { display: flex; align-items: center; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 6px; background: transparent; text-decoration: none; color: var(--ink); font-size: .8rem; text-align: left; }
  .app-mobile-menu nav a:hover, .app-mobile-menu button:hover { background: var(--wash); }
  .app-main { max-width: none; padding: 32px 24px calc(104px + env(safe-area-inset-bottom)); gap: 28px; }
  .app-tabbar { display: grid; position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; min-height: 74px; padding: 6px max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); border-top: 1px solid var(--line); background: var(--card); }
  .app-tabbar__link { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; min-height: 54px; color: var(--soft); text-decoration: none; }
  .app-tabbar__link > span { display: grid; place-items: center; width: 32px; height: 28px; }
  .app-tabbar small { font-size: .59rem; font-weight: 600; }
  .app-tabbar__link.is-current { color: var(--cardinal); }
  .app-tabbar__link--cta > span { color: #fff; background: var(--cardinal); border-radius: 9px; }
}
@media (max-width: 700px) {
  .dash-head { align-items: flex-start; flex-direction: column; gap: 18px; }
  .dash-head h1 { font-size: 2.25rem; }
  .dash-stats { padding-block: 20px; }
  .dash-stat { padding-inline: 16px; }
  .dash-stat > span { font-size: .68rem; }
  .dash-stat strong { font-size: 1.8rem; }
  .dash-stat .app-icon { display: none; }
  .dash-upcoming { grid-template-columns: 1fr; gap: 12px; }
  .dash-upcoming__card { min-height: auto; gap: 14px; }
  .dash-upcoming__time time { font-size: .69rem; }
  .dash-connections { gap: 10px; }
  .dash-connections p { min-width: 150px; }
  .dash-connections .text-link { margin-left: auto; }
  .post-table-head { display: none; }
  .post-table-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 17px 16px; gap: 12px; }
  .post-table-row:first-of-type { border-top: 0; }
  .post-title { grid-column: 1 / -1; }
  .post-title strong { font-size: .85rem; }
  .platform-dots { grid-column: 1; padding-left: 60px; }
  .post-result { grid-column: 2; grid-row: 2; text-align: right; }
  .post-table-row time { display: block; grid-column: 1 / -1; padding-left: 60px; font-size: .62rem; }
}
@media (max-width: 400px) {
  .app-main { padding-inline: 16px; }
  .app-mobile-header { padding-inline: 16px; }
  .dash-head h1 { font-size: 2rem; }
  .dash-stat { padding-inline: 12px; }
  .dash-stat > span { font-size: .62rem; }
  .dash-section__head > a { font-size: .69rem; }
  .empty-state { padding: 32px 18px; }
}

.video-tile img { display: block; width: 100%; height: 100%; object-fit: contain; background: var(--ink); }
.dash-upcoming__preview { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.dash-upcoming__preview strong { font-size: .84rem; line-height: 1.55; overflow-wrap: anywhere; }