/* Home board: the back-of-house wall screen (board E, "socials lead, tasks
   rail") rendered inside the staff console. Fed by board.js from the latest
   daily_briefs row. Every colour comes from the console's tokens so the
   board follows the skin and the light/dark switch like everything else.
   Every class is lfb- prefixed: the console owns short names like .x, .v
   and .note, and a bare one here would inherit their sizes. */

/* The type and bar tokens every board-styled surface reads: Home (.lfb) and
   the other dashboards (.lfd, the dashboard kit near the end of this file). */
.lfb,.lfd{
  --lfb-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --lfb-display:"Bricolage Grotesque",Inter,system-ui,sans-serif;
  --lfb-bar:color-mix(in srgb, var(--gold) 58%, var(--surface));
  --lfb-track:color-mix(in srgb, var(--ink) 9%, var(--surface))}
.lfb{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:14px;margin:16px 0 6px}
.lfb *,.lfd-top *,.lfb-lead *{box-sizing:border-box;min-width:0}

/* Header strip across both columns */
.lfb-head{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  border-bottom:2px solid var(--gold);padding-bottom:10px}
.lfb-stamp{font-family:var(--lfb-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.lfb-stamp b{color:var(--gold);font-weight:600}
.lfb-stamp.lfb-stale b{color:var(--clay)}
.lfb-live{display:inline-flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--gold);
  border-radius:999px;padding:7px 14px;font-size:13.5px;color:var(--ink2)}
.lfb-live i{width:9px;height:9px;border-radius:50%;background:var(--gold);flex:0 0 auto;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 25%, transparent)}
.lfb-live b{color:var(--ink);font-weight:700}
.lfb-live .lfb-in{font-family:var(--lfb-mono);font-size:12.5px;color:var(--ink3)}

/* Last night's closing brief, one line under the header until the morning
   brief replaces it. */
.lfb-close{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;padding:10px 14px;
  background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:8px;font-size:13.5px;color:var(--ink2)}
.lfb-close b{color:var(--ink);font-weight:700}
.lfb-close .lfb-kicker{margin:0}

/* Columns: both stretch to the row; the last panel in each absorbs the
   difference, so neither side ends in a hole. */
.lfb-left,.lfb-right{display:flex;flex-direction:column;gap:14px}
.lfb-grow{flex:1 1 auto}

/* Panels */
.lfb-panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px;
  display:flex;flex-direction:column;gap:10px;font-size:13.5px;line-height:1.4;color:var(--ink)}
.lfb-panel.lfb-hot{border-color:var(--gold)}
.lfb-kicker{font-family:var(--lfb-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;line-height:1.3}
.lfb-kicker span{color:var(--ink3);letter-spacing:.04em;text-transform:none;font-size:12px}
.lfb-big{font-family:var(--lfb-display);font-weight:800;font-size:44px;line-height:1;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;color:var(--ink)}
.lfb-big.lfb-gold{color:var(--gold)}
.lfb-big small{font-family:var(--lfb-mono);font-weight:500;font-size:16px;color:var(--gold);letter-spacing:0;margin-left:6px}
.lfb-big small.lfb-down{color:var(--clay)}
.lfb-sub{font-size:13.5px;color:var(--ink2)}
.lfb-sub b{color:var(--ink);font-weight:600}
.lfb-muted{font-size:12.5px;color:var(--ink3)}
.lfb-kv{display:grid;grid-template-columns:1fr auto;gap:5px 14px;font-size:13.5px;margin:0}
.lfb-kv dt{color:var(--ink3);margin:0}
.lfb-kv dd{margin:0;font-family:var(--lfb-mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink)}
.lfb-empty{color:var(--ink3);font-style:normal}

/* TikTok lead panel: stats column + chart */
.lfb-tiktok,.lfb-lead{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px}
.lfb-panel[hidden]{display:none}
.lfb-stats{display:flex;flex-direction:column;gap:9px;border-right:1px solid var(--line);padding-right:18px}
.lfb-chart{display:flex;flex-direction:column;gap:8px}
.lfb-best{margin-top:auto;border:1px solid var(--gold);border-radius:9px;padding:9px 11px;display:flex;flex-direction:column;gap:3px}
.lfb-best .lfb-kicker{font-size:10.5px}
.lfb-best .lfb-v{font-size:14px;font-weight:600;color:var(--ink)}

/* Bar charts: one scale per chart, tallest bar = 100% */
.lfb-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:end;height:150px}
.lfb-bars > div{display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:4px}
.lfb-bars .lfb-n{font-family:var(--lfb-mono);font-size:11.5px;text-align:center;color:var(--ink3);font-variant-numeric:tabular-nums}
.lfb-bars .lfb-n.lfb-hi{color:var(--ink)}
.lfb-bars .lfb-b{background:var(--lfb-bar);border-radius:3px 3px 0 0;min-height:2px}
.lfb-bars .lfb-b.lfb-hi{background:var(--gold)}
.lfb-bars .lfb-b.lfb-none{background:var(--lfb-track);min-height:2px}
.lfb-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;font-family:var(--lfb-mono);font-size:11px;
  color:var(--ink3);text-align:center;letter-spacing:.06em}
.lfb-days .lfb-liveday::after{content:"·";color:var(--gold);margin-left:3px;font-weight:700}
.lfb-chartfoot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--ink3);
  border-top:1px solid var(--line);padding-top:9px}
.lfb-chartfoot .lfb-dot{color:var(--gold);font-weight:700}
.lfb-mini{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;align-items:end;height:48px;margin-top:4px}
.lfb-mini > div{background:var(--lfb-bar);border-radius:2px 2px 0 0;min-height:2px}
.lfb-mini > div.lfb-hi{background:var(--gold)}
.lfb-mini > div.lfb-none{background:var(--lfb-track)}
.lfb-minidays{display:flex;justify-content:space-between;font-family:var(--lfb-mono);font-size:10.5px;color:var(--ink3)}

/* Network cards: follows, views, best and worst video, tags that work */
.lfb-nets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lfb-net{gap:9px}
.lfb-netnums{display:grid;grid-template-columns:auto auto auto;justify-content:start;gap:4px 22px;align-items:end}
.lfb-net .lfb-big{font-size:32px}
.lfb-follow{font-family:var(--lfb-mono);font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums;color:var(--ink)}
.lfb-up{color:var(--jade);font-weight:600} .lfb-down{color:var(--clay);font-weight:600}
.lfb-vids{display:flex;flex-direction:column;gap:5px;border-top:1px solid var(--line);padding-top:9px}
.lfb-vid{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:8px;align-items:baseline;font-size:13px}
.lfb-vk{font-family:var(--lfb-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.lfb-vbest .lfb-vk{color:var(--jade)} .lfb-vworst .lfb-vk{color:var(--clay)}
.lfb-vt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lfb-vt,.lfb-vt .lfb-link{color:var(--ink)} .lfb-vt .lfb-link:hover{color:var(--gold)}
.lfb-vv{font-family:var(--lfb-mono);font-size:12px;color:var(--ink3);font-variant-numeric:tabular-nums;white-space:nowrap}
.lfb-vwin{font-size:11.5px;color:var(--ink3)}
.lfb-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:auto;padding-top:2px}
.lfb-tags .lfb-vk{margin-right:2px}
.lfb-tag{border:1px solid var(--line);border-radius:999px;padding:2px 9px;font-size:12px;color:var(--ink2);background:var(--surface2)}
.lfb-tag b{color:var(--gold);font-family:var(--lfb-mono);font-weight:600;font-size:11.5px}

/* Folds: <details> wrappers. On desktop they are always open and the
   socials fold is invisible (display:contents keeps its panels as direct
   children of the column); the brief's summary doubles as its kicker. */
.lfb-socials{display:contents}
.lfb-socials > summary{display:none}
summary.lfb-kicker{list-style:none;cursor:default}
summary::-webkit-details-marker{display:none}

/* The morning brief, as it went to Discord */
.lfb-brief .lfb-lines{display:flex;flex-direction:column;gap:7px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.lfb-brief .lfb-line b{color:var(--gold);font-weight:700;margin-right:6px;font-family:var(--lfb-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.lfb-brief .lfb-line.lfb-title{display:none}

/* Sales card */
.lfb-sales{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.lfb-sales > div{display:flex;flex-direction:column;gap:7px}
.lfb-chan{display:grid;grid-template-columns:82px minmax(0,1fr) 62px;gap:9px;align-items:center;font-size:13px}
.lfb-chan .lfb-t{height:10px;background:var(--lfb-track);border-radius:3px;overflow:hidden}
.lfb-chan .lfb-t > i{display:block;height:100%;background:var(--gold)}
.lfb-chan .lfb-v{font-family:var(--lfb-mono);text-align:right;font-variant-numeric:tabular-nums}
.lfb-top{display:flex;flex-direction:column;gap:3px;font-size:13px;color:var(--ink2)}
.lfb-top div{display:flex;justify-content:space-between;gap:10px}
.lfb-top div span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lfb-top div span:last-child{font-family:var(--lfb-mono);color:var(--ink3);flex:0 0 auto}
.lfb-addrpanel .lfb-top{font-size:13.5px;gap:5px}
.lfb-addrpanel .lfb-top div span:last-child{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

/* Needs a hand */
.lfb-rows{display:flex;flex-direction:column;font-size:13.5px}
.lfb-row{display:grid;grid-template-columns:60px minmax(0,1fr) auto auto;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line)}
/* Check-off: the tick clears the item for everyone (board_done). */
.lfb-ok{appearance:none;border:1px solid var(--line);background:transparent;color:var(--ink3);border-radius:999px;width:22px;height:22px;line-height:1;font-size:12px;cursor:pointer;padding:0;align-self:center;transition:border-color .15s,color .15s,background .15s}
.lfb-ok:hover,.lfb-ok:focus-visible{border-color:var(--jade);color:var(--jade);background:var(--jadebg);outline:none}
.lfb-ok:disabled{opacity:.5;cursor:default}
.lfb-row.lfb-gone{opacity:0;transition:opacity .24s}
/* The "more in the inbox" fold */
.lfb-row.lfb-more .lfb-x{color:var(--ink2)} .lfb-row.lfb-more.lfb-open .lfb-x{color:var(--gold)}
.lfb-row .lfb-k.INBOX{color:var(--ink3)}
.lfb-morelist[hidden]{display:none}
.lfb-morelist{border-left:2px solid var(--line);margin-left:2px;padding-left:10px}
.lfb-link{color:var(--gold);text-decoration:none} .lfb-link:hover{text-decoration:underline}
.lfb-row:last-child{border-bottom:0}
.lfb-row .lfb-k{font-family:var(--lfb-mono);font-size:11px;letter-spacing:.06em;color:var(--ink3)}
.lfb-row .lfb-k.SHIP{color:var(--clay)} .lfb-row .lfb-k.REPLY{color:var(--gold)} .lfb-row .lfb-k.FIX{color:var(--gold)}
.lfb-row .lfb-k.STOCK{color:var(--sky)} .lfb-row .lfb-k.MONEY{color:var(--jade)} .lfb-row .lfb-k.NOTE{color:var(--ink3)}
.lfb-row .lfb-x{font-size:13.5px;color:var(--ink)}
.lfb-row .lfb-a{font-family:var(--lfb-mono);font-size:12px;color:var(--ink3)}
.lfb-row.lfb-act{cursor:pointer} .lfb-row.lfb-act:hover .lfb-x{color:var(--gold)}
.lfb-first{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12.5px;color:var(--ink3)}
.lfb-first .lfb-c{border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--ink2);background:var(--surface2)}
.lfb-foot{margin-top:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-top:1px solid var(--line);padding-top:12px}
.lfb-foot .lfb-kicker{font-size:10.5px}
.lfb-foot .lfb-v{font-family:var(--lfb-display);font-weight:700;font-size:22px;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--ink);margin-top:2px}
.lfb-foot .lfb-v.lfb-gold{color:var(--gold)} .lfb-foot .lfb-v.lfb-sky{color:var(--sky)} .lfb-foot .lfb-v.lfb-clay{color:var(--clay)}
.lfb-foot .lfb-muted{font-size:12px}

/* Floor cut: the pack list and order flags */
.lfb-prow{grid-template-columns:72px minmax(0,1fr) auto;align-items:start}
.lfb-prow .lfb-k{font-size:12px;font-weight:600;color:var(--ink);padding-top:1px}
.lfb-prow.lfb-late .lfb-k,.lfb-prow.lfb-late .lfb-a{color:var(--clay)}
.lfb-prow .lfb-x{display:flex;flex-direction:column;gap:2px;color:var(--ink2)}
.lfb-plines{display:flex;flex-direction:column;gap:1px;font-size:12.5px;color:var(--ink);line-height:1.35;margin-top:2px}
.lfb-pline{display:block;padding-left:12px;text-indent:-12px}
.lfb-pline.lfb-phead{font-weight:600}
.lfb-pline.lfb-pvar{padding-left:28px;color:var(--ink2)}
.lfb-pline.lfb-muted{color:var(--ink3)}
.lfb-ttid{font-family:var(--lfb-mono);font-size:11.5px;color:var(--ink3);user-select:all;margin-left:4px}

/* Week ahead */
.lfb-week{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;font-size:13.5px}
.lfb-week .lfb-kicker{grid-column:1 / -1}
.lfb-week .lfb-ev{display:flex;justify-content:space-between;gap:10px}
.lfb-week .lfb-ev .lfb-d{font-family:var(--lfb-mono);color:var(--gold);font-size:12px;margin-right:6px}
.lfb-week .lfb-ev .lfb-t{font-family:var(--lfb-mono);color:var(--ink3);font-size:12.5px;flex:0 0 auto}
.lfb-week .lfb-ev.lfb-ev-release .lfb-d{color:var(--sky)} .lfb-week .lfb-ev.lfb-ev-live .lfb-d{color:var(--jade)}

/* Content cut: when to post, when we're live, views by network, what's
   worth filming */
.lfb-post{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.lfb-post > div{border:1px solid var(--line);border-radius:9px;padding:9px 11px;display:flex;flex-direction:column;gap:2px}
.lfb-post .lfb-v{font-family:var(--lfb-display);font-weight:700;font-size:24px;line-height:1.1;color:var(--gold);font-variant-numeric:tabular-nums}
.lfb-livepanel .lfb-big{font-size:36px}
.lfb-slots{display:flex;flex-wrap:wrap;gap:6px}
.lfb-slots span{border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-family:var(--lfb-mono);font-size:12px;color:var(--ink2);background:var(--surface2)}
.lfb-slots span b{color:var(--jade);font-weight:600;margin-right:5px}

/* Stream kit: copy for OBS before going live (YouTube and TikTok at once) */
.lfb-kit{grid-column:1 / -1}
.lfb-kit > summary{cursor:pointer;list-style:none}
.lfb-kit > summary > span{margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}
.lfb-kit > summary::after{content:"▾";margin-left:8px;color:var(--ink3);font-size:14px;letter-spacing:0}
.lfb-kit[open] > summary::after{content:"▴"}
.lfb-kit:not([open]) > :not(summary){display:none}
.lfb-kitgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 22px}
.lfb-kitrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:start;padding:9px 0;border-bottom:1px solid var(--line)}
.lfb-kitrow .lfb-vk{grid-column:1 / -1;display:flex;justify-content:space-between;gap:8px}
.lfb-kitrow .lfb-vk span{letter-spacing:0;text-transform:none}
.lfb-kitrow .lfb-vk span.lfb-over{color:var(--clay);font-weight:600}
.lfb-kittext{font-size:13.5px;line-height:1.45;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
.lfb-copy{appearance:none;border:1px solid var(--gold);background:transparent;color:var(--gold);border-radius:999px;
  font:600 12px/1 Inter,system-ui,sans-serif;padding:7px 13px;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.lfb-copy:hover,.lfb-copy:focus-visible{background:var(--gold);color:var(--paper);outline:none}

/* Agents: the AI agents on the task board, what each is doing and what's
   waiting on a person. Overview cut, under the week. */
.lfb-agents{display:flex;flex-direction:column}
.lfb-agents .lfb-kicker{margin-bottom:4px}
.lfb-agent{display:grid;grid-template-columns:8px minmax(0,1fr) auto;gap:2px 10px;align-items:center;padding:8px 0;border-top:1px solid var(--line);font-size:13.5px}
.lfb-agents .lfb-kicker + .lfb-agent{border-top:0}
.lfb-agent i{width:8px;height:8px;border-radius:50%;background:var(--ink3)}
.lfb-agent.lfb-on i{background:var(--jade)}
.lfb-agent.lfb-busy i{background:var(--gold)}
.lfb-agent b{font-weight:600;color:var(--ink)}
.lfb-agent .lfb-an{font-family:var(--lfb-mono);font-size:12px;color:var(--ink3);white-space:nowrap}
.lfb-agent .lfb-an.lfb-ask{color:var(--clay);font-weight:600}
.lfb-agent .lfb-muted{grid-column:2 / -1;font-size:12.5px;overflow-wrap:anywhere}

/* Dashboard kit: Home's look on every other dashboard. Expenses, Orders and
   the Money room carry .lfd on their container. Their cards and resizable
   squares take the board panel (surface, hairline, 12px radius, no shadow),
   titles become gold mono kickers, and the stamp strip and lead panel come
   from dash.js. !important only where the older markup sets inline padding,
   sizes and margins. */
.lfd-top{margin:2px 0 14px}
.lfd .lfb-lead{margin:0 0 14px}
.lfd .card,.lfd .sqz{background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:none;padding:16px 18px !important}
:root[data-skin] .lfd .card{border-color:var(--line);border-radius:12px}
.lfd .card h3,.lfd .sqz > h3{font-family:var(--lfb-mono);font-size:11px !important;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold);line-height:1.3;margin:0 0 10px !important}
.lfd .sqz .card{border:0;padding:0 !important;margin:0 !important;background:transparent;box-shadow:none}
.lfd .card table.buy,.lfd .sqz table.buy{border:0;box-shadow:none;border-radius:0;background:transparent}
.lfd .dashwrap{gap:14px}
.lfb-kv dd.lfd-good{color:var(--jade)} .lfb-kv dd.lfd-warn{color:var(--clay)}
/* Dollars with cents run longer than Home's "47.9K", so a dashboard's lead
   gives its stats column more room and sets the big number a size down. */
.lfd .lfb-lead{grid-template-columns:300px minmax(0,1fr)}
.lfd .lfb-lead .lfb-big{font-size:38px}
@media (max-width:1080px){
  .lfd .lfb-lead{grid-template-columns:260px minmax(0,1fr)}
  .lfd .lfb-lead .lfb-big{font-size:32px}
}
@media (max-width:760px){
  .lfd .lfb-lead{grid-template-columns:minmax(0,1fr)}
  .lfd .lfb-lead .lfb-big{font-size:36px}
}

/* Dashboard boards (the Money room and Expenses): a column of rows - the
   stamp strip, a full-width lead, then rows of panels that share a height.
   Built to land on one laptop screen: long lists fold behind "N more" or
   scroll inside a panel that fills its row (.lfd-fill). */
.lfd-page{display:flex;flex-direction:column;gap:14px}
.lfd-page *{box-sizing:border-box;min-width:0}
.lfd-page .lfd-top{margin:2px 0 0}
.lfd-page .lfb-lead{margin:0}
.lfd-headright{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lfd-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 12px}
.lfd-period{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:-2px}
.lfd-period > .lfd-plabel{font-family:var(--lfb-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin-right:4px}
.lfd-period > .lfd-aside{margin-left:auto;font-size:12.5px;color:var(--ink3)}
.lfd-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lfd-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lfd-tri.lfd-start,.lfd-pair.lfd-start{align-items:start}
.lfd-col{display:flex;flex-direction:column;gap:14px}
.lfb-big.lfd-good{color:var(--jade)} .lfb-big.lfd-warn{color:var(--clay)}
.lfb-sub b.lfd-good{color:var(--jade)} .lfb-sub b.lfd-warn{color:var(--clay)}
.lfd .lfb-big.lfd-mid{font-size:30px}
.lfb-foot .lfb-v.lfb-jade{color:var(--jade)}
.lfd-page .lfb-foot{margin-top:0}
.lfd-page .lfb-chart{min-width:0}

/* Share rows: label, bar, amount, share of the whole */
.lfd-chans{display:flex;flex-direction:column;gap:1px}
.lfd-chans.lfd-cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px 28px}
.lfd-chan{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) auto 34px;gap:10px;align-items:center;
  font-size:13px;padding:4px 6px;margin:0 -6px;border-radius:6px}
.lfd-noshare .lfd-chan{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) auto}
.lfd-cl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.lfd-chan .lfb-t{height:9px;background:var(--lfb-track);border-radius:3px;overflow:hidden}
.lfd-chan .lfb-t > i{display:block;height:100%;background:var(--lfb-bar);border-radius:3px}
.lfd-chan.lfd-top1 .lfb-t > i{background:var(--gold)}
.lfd-jade .lfd-chan .lfb-t > i{background:color-mix(in srgb, var(--jade) 55%, var(--surface))}
.lfd-jade .lfd-chan.lfd-top1 .lfb-t > i{background:var(--jade)}
.lfd-clay .lfd-chan .lfb-t > i{background:color-mix(in srgb, var(--clay) 55%, var(--surface))}
.lfd-clay .lfd-chan.lfd-top1 .lfb-t > i{background:var(--clay)}
.lfd-cv{font-family:var(--lfb-mono);font-size:12.5px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:var(--ink)}
.lfd-cp{font-family:var(--lfb-mono);font-size:11px;color:var(--ink3);text-align:right;font-variant-numeric:tabular-nums}
.lfd-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);margin-left:6px;vertical-align:middle}
.lfd-act{cursor:pointer}
.lfd-act:hover .lfd-cl{color:var(--gold)}
.lfd-act:focus-visible{outline:2px solid var(--gold);outline-offset:0}
.lfd-chan.lfd-on{background:color-mix(in srgb, var(--gold) 13%, transparent)}
.lfd-chan.lfd-on .lfd-cl{color:var(--gold);font-weight:600}
.lfd-more{grid-column:1 / -1}
.lfd-more > summary{list-style:none;cursor:pointer;font-family:var(--lfb-mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink3);padding:7px 0 3px;border-top:1px solid var(--line);margin-top:4px}
.lfd-more > summary::-webkit-details-marker{display:none}
.lfd-more > summary::after{content:"▾";margin-left:6px}
.lfd-more[open] > summary::after{content:"▴"}
.lfd-more > summary:hover,.lfd-more > summary:focus-visible{color:var(--gold);outline:none}

/* A small switch that sits in a kicker (Category / Merchant) */
.lfd-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;flex:0 0 auto}
.lfd-seg button{appearance:none;border:0;background:transparent;color:var(--ink3);font:500 11.5px/1 var(--lfb-mono);
  padding:5px 10px;cursor:pointer;letter-spacing:.02em}
.lfd-seg button.on{background:var(--gold);color:var(--paper)}
.lfd-seg button:not(.on):hover{color:var(--gold)}
.lfd-seg button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}

/* A body that takes the row's spare height and scrolls inside itself */
.lfd-fill{position:relative;flex:1 1 auto;min-height:180px}
.lfd-intro{font-size:13px;line-height:1.45;color:var(--ink3);margin-top:-4px;max-width:110ch}
.lfd-fillin{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  scrollbar-color:var(--line) transparent}

/* Month flow rows: in over out, the amounts, the net */
.lfd-flow{display:flex;flex-direction:column}
.lfd-frow{display:grid;grid-template-columns:40px minmax(0,1fr) 100px 100px 108px;gap:12px;align-items:center;
  padding:4px 0;border-bottom:1px solid color-mix(in srgb, var(--line) 65%, transparent)}
.lfd-frow:last-child{border-bottom:0}
.lfd-fhead{font-family:var(--lfb-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);padding-top:0}
.lfd-fhead span{text-align:right}
.lfd-fm{font-family:var(--lfb-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.lfd-fbars{display:flex;flex-direction:column;gap:2px}
.lfd-fbars i{display:block;height:6px;border-radius:2px;min-width:2px}
.lfd-fa{background:var(--jade)} .lfd-fb{background:var(--clay)}
.lfd-fv{font-family:var(--lfb-mono);font-size:12.5px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink2)}
.lfd-fv.lfd-fn{font-weight:600} .lfd-fv.lfd-good{color:var(--jade)} .lfd-fv.lfd-warn{color:var(--clay)}

/* Paired bars: in beside out per month */
.lfd-pairs{display:grid;gap:10px;align-items:end;height:172px}
.lfd-pairs > div{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:100%}
.lfd-pairs i{display:block;width:min(18px,42%);border-radius:3px 3px 0 0;min-height:2px}
.lfd-pairs .lfd-pa{background:var(--jade)} .lfd-pairs .lfd-pb{background:var(--clay)}
.lfd-pdays > div{display:flex;flex-direction:column;gap:2px}
.lfd-pdays b{font-weight:600;font-size:10.5px;letter-spacing:0}
.lfd-pdays b.lfd-good{color:var(--jade)} .lfd-pdays b.lfd-warn{color:var(--clay)}

/* Stacked bars: one colour per book */
.lfd-sk{display:flex;flex-direction:column-reverse;border-radius:3px 3px 0 0;overflow:hidden;min-height:2px}
.lfd-sk > i{display:block;min-height:1px}
.lfd-t-gold{background:var(--gold)} .lfd-t-sky{background:var(--sky)} .lfd-t-violet{background:var(--violet)}
.lfd-t-jade{background:var(--jade)} .lfd-t-clay{background:var(--clay)}
.lfd-legend{display:inline-flex;flex-wrap:wrap;gap:4px 14px}
.lfd-legend > span{display:inline-flex;align-items:center;gap:6px}
.lfd-legend i{width:9px;height:9px;border-radius:2px;display:inline-block}
.lfd-legend b{font-family:var(--lfb-mono);font-weight:500;color:var(--ink2)}

/* Lines: the tax pack's label-and-amount rows */
.lfd-lines{display:flex;flex-direction:column}
.lfd-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:baseline;padding:6px 0;
  border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.35}
.lfd-line:last-child{border-bottom:0}
.lfd-lk{color:var(--ink)}
.lfd-ln{font-size:12px;color:var(--ink3);line-height:1.4;margin-top:2px}
.lfd-lv{font-family:var(--lfb-mono);font-size:13px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:var(--ink)}
.lfd-line.lfd-sub .lfd-lk{padding-left:14px;color:var(--ink2)}
.lfd-line.lfd-sub .lfd-lv{color:var(--ink2)}
.lfd-line.lfd-total .lfd-lk,.lfd-line.lfd-total .lfd-lv{font-weight:700;color:var(--ink)}
.lfd-line.lfd-head{border-bottom:0;padding:12px 0 2px}
.lfd-line.lfd-head .lfd-lk{font-family:var(--lfb-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.lfd-line.lfd-note{grid-template-columns:minmax(0,1fr);font-size:12.5px;padding:5px 0}
.lfd-line.lfd-note .lfd-lk{color:var(--ink2)}
.lfd-line.lfd-note .lfd-lv{display:none}

/* Receipts and line items */
.lfd-rrow{display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:2px 10px;align-items:baseline;padding:6px 0;
  border-bottom:1px solid var(--line);font-size:13px}
.lfd-rrow:last-child{border-bottom:0}
.lfd-rd{font-family:var(--lfb-mono);font-size:11.5px;color:var(--ink3);white-space:nowrap}
.lfd-rx{display:flex;flex-direction:column;gap:1px}
.lfd-rx b{font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lfd-rx span{font-size:11.5px;color:var(--ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lfd-rv{font-family:var(--lfb-mono);font-size:13px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:var(--ink)}
.lfd-rv small{display:block;font-size:10.5px;color:var(--ink3);margin-top:2px}

/* Donuts and the trend line (canvas; the colours come from the tokens) */
.lfd-donut{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:center}
.lfd-donut canvas{width:150px;height:150px;display:block}
.lfd-legrow{display:grid;grid-template-columns:9px minmax(0,1fr) auto 32px;gap:8px;align-items:center;font-size:12.5px;padding:2.5px 0}
.lfd-legrow > i{width:9px;height:9px;border-radius:2px}
.lfd-trend{position:relative;flex:1 1 auto;min-height:190px}
.lfd-trend canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

/* Tables inside a board panel */
.lfd-table{width:100%;border-collapse:collapse;font-size:12.5px}
.lfd-table th{font-family:var(--lfb-mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink3);text-align:right;padding:0 0 6px 10px;position:sticky;top:0;background:var(--surface)}
.lfd-table td{font-family:var(--lfb-mono);font-variant-numeric:tabular-nums;text-align:right;padding:5px 0 5px 10px;
  border-top:1px solid var(--line);white-space:nowrap;color:var(--ink2)}
.lfd-table th:first-child,.lfd-table td:first-child{text-align:left;padding-left:0}
.lfd-table td:first-child{color:var(--ink3);letter-spacing:.04em}
.lfd-table td b{color:var(--ink);font-weight:600}
.lfd-table tr.lfd-ahead td{color:var(--ink3)}
.lfd-table tr.lfd-sum td{color:var(--ink);font-weight:600}

@media (max-width:1080px){
  .lfd-tri{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lfd-tri > :nth-child(3):last-child{grid-column:1 / -1}
  .lfd-frow{grid-template-columns:36px minmax(0,1fr) 92px 92px 100px;gap:10px}
}
@media (max-width:760px){
  .lfd-tri,.lfd-pair,.lfd-chans.lfd-cols2{grid-template-columns:minmax(0,1fr)}
  .lfd-tri > :nth-child(3):last-child{grid-column:auto}
  .lfd-frow{grid-template-columns:34px repeat(3,minmax(0,1fr));gap:8px}
  .lfd-fbars,.lfd-fhead span:nth-child(2){display:none}
  .lfd-fv{font-size:11.5px}
  .lfd-fill{min-height:340px}
  .lfd-pairs{height:130px;gap:4px}
  .lfd-pdays b{display:none}
  .lfd-donut{grid-template-columns:118px minmax(0,1fr);gap:12px}
  .lfd-donut canvas{width:118px;height:118px}
  .lfd-period > .lfd-aside{margin-left:0;flex-basis:100%}
  .lfd-chan{grid-template-columns:minmax(0,1.2fr) minmax(0,.7fr) auto 30px;gap:8px}
}

/* Waiting for the first brief */
.lfb-wait{grid-column:1 / -1;background:var(--surface);border:1px dashed var(--line);border-radius:12px;padding:18px;
  display:flex;flex-direction:column;gap:6px}
.lfb-wait .lfb-big{font-size:26px}

/* Narrow: stack the rail under the socials, keep the tiles in a row until
   they'd crush */
@media (max-width:1080px){
  .lfb{grid-template-columns:minmax(0,1fr)}
  .lfb-tiktok,.lfb-lead{grid-template-columns:200px minmax(0,1fr)}
}
@media (max-width:760px){
  /* Phone order: what needs doing first, the socials folded behind a tap.
     The column wrappers dissolve so the panels can be reordered. */
  .lfb{display:flex;flex-direction:column}
  .lfb-left,.lfb-right{display:contents}
  .lfb-head{order:0} .lfb-salespanel{order:1} .lfb-hand{order:2} .lfb-weekpanel{order:3} .lfb-addrpanel{order:3} .lfb-agentspanel{order:3}
  .lfb-socials{order:4} .lfb-brief{order:5}
  .lfb-pack{order:1} .lfb-flags{order:2}
  /* Floor on a phone: pack, flags, the brief, the week, then socials */
  .lfb.lfb-cut-floor .lfb-brief{order:3} .lfb.lfb-cut-floor .lfb-weekpanel{order:4} .lfb.lfb-cut-floor .lfb-socials{order:5}
  /* Content on a phone: socials lead, then the planning panels */
  .lfb.lfb-cut-content .lfb-socials{order:1} .lfb-postpanel{order:2} .lfb-livepanel{order:3}
  .lfb-leadpanel{order:4} .lfb-filmpanel{order:5}
  .lfb-socials{display:flex;flex-direction:column;gap:14px}
  .lfb-socials > summary{display:flex;cursor:pointer;gap:6px}
  .lfb-socials > summary .lfb-sub{font-size:13px}
  .lfb-socials:not([open]) > :not(summary){display:none}
  .lfb-brief:not([open]) > :not(summary){display:none}
  summary.lfb-kicker,.lfb-socials > summary .lfb-kicker{cursor:pointer}
  .lfb-socials > summary .lfb-kicker::after,summary.lfb-kicker::after{content:"▾";margin-left:8px;color:var(--ink3);font-size:14px;letter-spacing:0}
  .lfb-socials[open] > summary .lfb-kicker::after,.lfb-brief[open] > summary.lfb-kicker::after{content:"▴"}
  .lfb-socials > summary .lfb-kicker{justify-content:flex-start}
  summary.lfb-kicker > span{margin-left:auto}
  .lfb-tiktok,.lfb-lead{grid-template-columns:minmax(0,1fr)}
  /* Twelve months of bars on a phone: drop the value labels, keep the bars */
  .lfd-dense.lfb-bars .lfb-n{display:none}
  .lfd-dense.lfb-days{font-size:9.5px;letter-spacing:0}
  .lfb-stats{border-right:0;padding-right:0;border-bottom:1px solid var(--line);padding-bottom:12px}
  .lfb-nets{grid-template-columns:minmax(0,1fr)}
  .lfb-kitgrid{grid-template-columns:minmax(0,1fr)}
  .lfb-sales{grid-template-columns:minmax(0,1fr)}
  .lfb-week{grid-template-columns:minmax(0,1fr)}
  .lfb-big{font-size:38px}
  .lfb-foot{gap:8px}
  .lfb-foot .lfb-v{font-size:18px}
}
@media (prefers-reduced-motion:no-preference){
  .lfb-live i{animation:lfb-pulse 2.4s ease-in-out infinite}
  @keyframes lfb-pulse{0%,100%{box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 25%, transparent)}50%{box-shadow:0 0 0 6px color-mix(in srgb, var(--gold) 10%, transparent)}}
}

/* The in-app notification banner (dash.js drop()), shared by both faces:
   drops from the top while the app is open; clay and waiting when urgent. */
#lfdrop{position:fixed;left:50%;top:calc(env(safe-area-inset-top, 0px) + 10px);z-index:1000;
  width:min(520px, calc(100% - 24px));display:flex;align-items:stretch;
  background:var(--surface);border:1px solid var(--gold);border-radius:14px;
  box-shadow:0 14px 36px rgba(6,14,12,.32);overflow:hidden;
  transform:translate(-50%, calc(-100% - 90px));visibility:hidden;
  transition:transform .34s cubic-bezier(.2,.85,.25,1), visibility 0s linear .34s}
#lfdrop.on{transform:translate(-50%, 0);visibility:visible;
  transition:transform .34s cubic-bezier(.2,.85,.25,1)}
#lfdrop.lfdrop-urgent{border-color:var(--clay)}
#lfdrop .lfdrop-open{flex:1;min-width:0;display:flex;gap:12px;align-items:center;text-align:left;
  background:none;border:0;padding:12px 4px 12px 14px;color:var(--ink);font:inherit;cursor:pointer}
#lfdrop img{width:38px;height:38px;border-radius:9px;flex:0 0 auto}
#lfdrop .lfdrop-open > span{display:flex;flex-direction:column;gap:2px;min-width:0}
#lfdrop b{font-size:14px;font-weight:600;line-height:1.3}
#lfdrop.lfdrop-urgent b{color:var(--clay)}
#lfdrop .lfdrop-open span span{font-size:12.5px;line-height:1.35;color:var(--ink2);overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#lfdrop .lfdrop-x{background:none;border:0;color:var(--ink3);font-size:22px;padding:0 14px;cursor:pointer}
#lfdrop button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
@media (prefers-reduced-motion: reduce){ #lfdrop,#lfdrop.on{transition:none} }