#view-profits {

  .mono{font-family:'Roboto Mono',monospace;font-variant-numeric:tabular-nums;}
  .wrap{max-width:960px;margin:0 auto;padding:24px 24px 40px;}

  .page-title{font-size:15px;font-weight:700;margin:0 0 2px;}
  .page-note{font-size:12.5px;color:var(--ink-soft);margin:0 0 18px;max-width:660px;}

  .data-card{background:var(--card);border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow-rest);overflow:hidden;}
  .table-scroll{overflow-x:auto;}

  .section-row{display:flex;align-items:center;justify-content:space-between;margin:22px 0 7px;}
  .section-row:first-of-type{margin-top:0;}
  .section-label{font-size:10.5px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;}

  /* ---------- MTD summary cards: tinted fill, no accent line ---------- */
  .lv-row{display:flex;gap:12px;align-items:stretch;}
  .lv-card{background:var(--card);border:1px solid var(--line);border-left-width:4px;border-left-style:solid;border-radius:10px;box-shadow:var(--shadow-rest);padding:12px 18px;flex:1;display:flex;align-items:center;justify-content:space-between;}
  .lv-card.lyd{border-left-color:var(--lyd);}
  .lv-card.b2l{border-left-color:var(--b2l);}
  .lv-card.lv{border-left-color:var(--lv-orange);}
  .lv-card .l{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
  .lv-card.lyd .l{color:var(--lyd);}
  .lv-card.b2l .l{color:var(--b2l);}
  .lv-card.lv .l{color:var(--lv-orange);}
  .lv-card.lv .v{color:var(--lv-orange);}
  .lv-card .v{font-family:'Roboto Mono',monospace;font-size:16px;font-weight:700;color:var(--ink);}

  /* ---------- daily table: single-row solid headers, no accent lines ---------- */
  table{width:100%;border-collapse:collapse;}
  thead th{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;text-align:right;padding:10px 12px;white-space:nowrap;}
  thead th:first-child{text-align:left;color:var(--ink-faint);background:transparent;}
  th.h-lyd-profit{background:var(--lyd);color:#fff;}
  th.h-lyd-goal{background:var(--lyd-tint);color:var(--lyd);}
  th.h-b2l-profit{background:var(--b2l);color:#fff;}
  th.h-b2l-goal{background:var(--b2l-tint);color:var(--b2l);}
  th.h-lv{background:var(--lv-orange);color:#fff;}

  tbody tr{border-bottom:1px solid #F1EFEA;}
  tbody tr:last-child{border-bottom:none;}
  tbody tr:hover td{background:#FBFAF8;}
  tbody tr.weekend td{background:var(--weekend-bg);}
  tbody tr.weekend:hover td{background:#EFEFED;}
  td{padding:8px 12px;text-align:right;white-space:nowrap;font-size:13.5px;}
  td.date-col{text-align:left;color:var(--ink-soft);}
  td.date-col .wk{color:var(--ink-faint);margin-left:4px;}
  td.lv-total-cell{font-family:'Roboto Mono',monospace;font-weight:700;color:var(--lv-orange);}

  /* highlight the most recently completed row */
  tr.latest-row td{background:#EEF2FA !important;}
  tr.latest-row:hover td{background:#E7EDF8 !important;}
  .latest-tag{display:inline-block;font-size:8.5px;font-weight:700;color:var(--ink-soft);background:#fff;border:1px solid var(--line);padding:1px 5px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;margin-left:5px;vertical-align:middle;}

  tr.total-row td{font-weight:700;border-top:1.5px solid var(--ink);border-bottom:none;background:#FBFAF8 !important;}
  tr.total-row td.lv-total-cell{font-family:'Roboto Mono',monospace;font-weight:700;}

  .edit-input{border:1.5px solid transparent;background:transparent;border-radius:6px;box-sizing:content-box;line-height:1;font-family:'Roboto Mono';transition:background-color .6s ease;}
  .profit-cell .edit-input{width:9ch;text-align:right;padding:4px 5px;font-size:13.5px;font-weight:700;color:var(--ink);}
  .profit-input.ahead{color:var(--ahead);}
  .profit-input.pace{color:var(--pace);}
  .profit-input.watch{color:var(--watch);}
  .profit-input.behind{color:var(--behind);}
  .goal-cell .edit-input{width:6ch;text-align:right;padding:4px 5px;font-size:13.5px;font-weight:500;color:var(--ink-faint);}
  .ps-cell .edit-input{width:11ch;text-align:right;padding:4px 6px;font-size:13px;font-weight:700;color:var(--ink);}
  .edit-input[readonly]{cursor:pointer;}
  .edit-input:hover{border-color:var(--line);}
  .edit-input:not([readonly]):focus{outline:none;border-color:var(--ink);background:#fff;cursor:text;}
  .edit-input.save-flash{background:#E1F3EA;}
  .edit-input::placeholder{color:var(--ink-faint);font-weight:500;}

  .legend{display:flex;gap:14px;font-size:11px;color:var(--ink-soft);margin-top:8px;flex-wrap:wrap;align-items:center;}
  .legend span{display:flex;align-items:center;gap:5px;}
  .legend-dot{display:inline-block;width:8px;height:8px;border-radius:2px;}
  .legend-dot.ahead{background:var(--ahead);} .legend-dot.pace{background:var(--pace);}
  .legend-dot.watch{background:var(--watch);} .legend-dot.behind{background:var(--behind);}

  /* ---------- monthly rollup: same solid-header language ---------- */
  th.h-b2l{background:var(--b2l);color:#fff;}
  th.h-lyd{background:var(--lyd);color:#fff;}
  td.lv-cell{font-weight:700;color:var(--lv-orange);font-family:'Roboto Mono',monospace;}

  .year-switch{display:flex;align-items:center;gap:2px;background:#fff;border:1px solid var(--line);border-radius:9px;padding:3px;box-shadow:var(--shadow-rest);}
  .year-switch button.arrow{background:none;border:none;color:var(--ink-soft);width:22px;height:22px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
  .year-switch button.arrow:hover{background:var(--paper);}
  .year-switch button.arrow:disabled{opacity:.3;cursor:default;}
  .year-switch button.arrow:disabled:hover{background:none;}
  .year-switch .ylabel{font-weight:700;font-size:12px;padding:0 6px;font-family:'Roboto Mono';}


  @media (max-width:760px){
    .wrap{padding:14px 14px 40px;}
    .lv-row{flex-direction:column;}
  }

}

/* Days that haven't happened yet in the current month — the mockup only
   ever showed a past month, so it had no state for this. */
#view-profits tr.future .date-col,
#view-profits tr.future .edit-input { opacity:.45; }

/* Sticky header on the daily table — the mockup froze it so column labels
   stay put while scrolling through a full month. .table-scroll's own
   overflow-x is what makes a plain `sticky` position work here: the
   header sticks to the TOP of that scroll container, not the page,
   so it only engages once you're scrolled past it within the card. */
#view-profits .table-scroll { max-height: 70vh; overflow-y: auto; }
#view-profits .table-scroll thead th {
  position: sticky; top: 0; z-index: 2;
  background: var(--card);
  box-shadow: 0 1px 0 var(--line);
}
#view-profits .table-scroll thead th:first-child { background: var(--card); }
/* The sticky rule above needs an opaque background to hide rows scrolling
   underneath it, but `var(--card)` painted it white on every header cell —
   including the solid-color ones, silently hiding their white text. These
   match its specificity and come after it, so the real colors win back. */
#view-profits .table-scroll thead th.h-lyd-profit { background: var(--lyd); }
#view-profits .table-scroll thead th.h-lyd-goal   { background: var(--lyd-tint); }
#view-profits .table-scroll thead th.h-b2l-profit { background: var(--b2l); }
#view-profits .table-scroll thead th.h-b2l-goal   { background: var(--b2l-tint); }
#view-profits .table-scroll thead th.h-lv         { background: var(--lv-orange); }
#view-profits .table-scroll thead th.h-b2l        { background: var(--b2l); }
#view-profits .table-scroll thead th.h-lyd        { background: var(--lyd); }



@keyframes cardIn{to{opacity:1;transform:translateY(0);}}
#view-offers {

  @media (prefers-reduced-motion: reduce){ *{animation-duration:.001ms !important; transition-duration:.001ms !important;} }

  .mono{font-family:'Roboto Mono',monospace;font-variant-numeric:tabular-nums;}
  .wrap{max-width:1600px;margin:0 auto;padding:0 28px 100px;}

  /* ---------- CHROME ---------- */
  header.chrome{background:var(--ink);color:#fff;}
  .chrome-inner{max-width:1600px;margin:0 auto;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  .brandmark{display:flex;align-items:center;gap:10px;}
  .brandmark .mark{width:28px;height:28px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;letter-spacing:.02em;color:var(--ink);}
  .brandmark .word{font-weight:700;font-size:15px;letter-spacing:-.01em;}
  .brandmark .word small{display:block;font-weight:400;font-size:10.5px;color:#9A9CA5;letter-spacing:.06em;text-transform:uppercase;margin-top:1px;}

  .month-switch{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.07);border-radius:10px;padding:3px;}
  .month-switch button.arrow{background:none;border:none;color:#C7C9D0;width:26px;height:26px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
  .month-switch button.arrow:hover{background:rgba(255,255,255,.12);}
  .month-switch button.arrow:disabled{opacity:.25;cursor:default;}
  .month-switch button.arrow:disabled:hover{background:none;}
  .month-label-wrap{position:relative;}
  .month-label{display:flex;align-items:center;gap:7px;padding:0 10px;cursor:pointer;}
  .month-label .m{font-weight:600;font-size:13px;color:#fff;}
  .month-badge{font-size:9px;font-weight:700;padding:2px 6px;border-radius:20px;text-transform:uppercase;letter-spacing:.05em;}
  .month-badge.current{background:var(--ahead);color:#fff;}
  .month-badge.past{background:#4A4C55;color:#D8D9DE;}
  .month-badge.future{background:var(--watch);color:#fff;}
  .month-dropdown{display:none;position:absolute;top:calc(100% + 8px);left:0;background:#fff;border-radius:10px;box-shadow:0 12px 28px rgba(0,0,0,.2);overflow:hidden;min-width:190px;z-index:60;}
  .month-dropdown.open{display:block;}
  .month-dropdown button{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;padding:10px 14px;border:none;background:#fff;font-size:13px;color:var(--ink);cursor:pointer;}
  .month-dropdown button+button{border-top:1px solid var(--line);}
  .month-dropdown button:hover{background:#F5F4F1;}
  .month-dropdown button.sel{font-weight:700;}
  .month-dropdown button:last-child{color:var(--pace);}
  .avatar{width:26px;height:26px;border-radius:50%;background:#2C2E36;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;}
  .bell-btn{position:relative;background:rgba(255,255,255,.08);border:none;color:#E9E5DF;width:28px;height:28px;border-radius:8px;cursor:pointer;display:none;align-items:center;justify-content:center;}
  .bell-btn:hover{background:rgba(255,255,255,.15);}
  .bell-count{position:absolute;top:-4px;right:-4px;background:var(--behind);color:#fff;font-size:9.5px;font-weight:800;min-width:15px;height:15px;border-radius:20px;display:flex;align-items:center;justify-content:center;padding:0 3px;}

  .modal-overlay{position:fixed;inset:0;background:rgba(21,22,26,.5);display:none;align-items:center;justify-content:center;z-index:300;padding:20px;}
  .modal-overlay.open{display:flex;}
  .modal-box{background:#fff;border-radius:16px;max-width:560px;width:100%;max-height:82vh;overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.28);}
  .modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;}
  .modal-head h3{margin:0;font-size:15px;font-weight:700;}
  .modal-head p{margin:2px 0 0;font-size:12px;color:var(--ink-faint);}
  .modal-close{background:none;border:none;color:var(--ink-faint);cursor:pointer;font-size:20px;line-height:1;padding:4px;}
  .modal-body{padding:16px 14px 18px;}
  .icon-btn{width:38px;height:38px;border-radius:8px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .icon-btn:hover{border-color:var(--behind);color:var(--behind);background:var(--behind-soft);}
  .btn-row{display:flex;gap:8px;align-items:center;}
  .btn-primary{background:var(--ink);color:#fff;border:none;padding:10px 18px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:7px;}
  .btn-primary:hover{background:#33343A;}
  .modal-section-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);padding:12px 10px 4px;}
  .modal-item{padding:13px 14px;border-radius:10px;border:1px solid var(--line);border-left:3px solid transparent;display:flex;align-items:center;gap:12px;}
  .modal-item.lyd{border-left-color:var(--lyd);}
  .modal-item.b2l{border-left-color:var(--b2l);}
  .modal-item+.modal-item{margin-top:8px;}
  .mi-content{flex:1;min-width:0;}
  .mi-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
  .mi-name{font-weight:700;font-size:13.5px;}
  .mi-detail{margin-top:5px;}
  .mi-desc{font-size:12.5px;color:var(--ink-soft);line-height:1.4;}
  .mi-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .mi-btn{background:var(--ink);color:#fff;border:none;padding:8px 14px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;white-space:nowrap;}
  .mi-btn:hover{background:#33343A;}
  .mi-btn.outline{background:none;border:1.5px solid var(--line);color:var(--ink);}
  .mi-btn.outline:hover{border-color:var(--ink);}
  .mi-icon-btn{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--line);background:#fff;color:var(--ink-faint);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .mi-icon-btn:hover{border-color:var(--behind);color:var(--behind);background:var(--behind-soft);}
  .brand-chip{font-size:9.5px;font-weight:800;padding:2px 7px;border-radius:5px;color:#fff;white-space:nowrap;flex-shrink:0;}
  .brand-chip.lyd{background:var(--lyd);}
  .brand-chip.b2l{background:var(--b2l);}
  .cat-icon{display:inline-flex;vertical-align:-2px;margin-right:5px;}

  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 12px 4px;}
  .form-grid label{display:flex;flex-direction:column;gap:4px;font-size:10.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
  .form-grid label.full{grid-column:1/-1;}
  .form-grid input,.form-grid select{padding:8px 10px;border:1.5px solid var(--line);border-radius:8px;font-family:'Roboto';font-size:13px;background:#fff;color:var(--ink);}
  .form-actions{padding:14px 12px 8px;display:flex;justify-content:flex-end;}
  .form-actions button{background:var(--ink);color:#fff;border:none;padding:9px 18px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;}
  .form-actions button:hover{background:#33343A;}

  /* ---------- scheduled-change modal footer ----------
     Deliberately its own classes, not .btn-primary/.btn-row — .btn-primary
     picks up `width:100%` from the login button's rule in base.css (same
     class name, no scoping), which is why that footer used to render as
     one giant full-width bar. Auto-width buttons here sidestep it instead
     of touching the shared class everywhere else it's used. */
  .sched-actions{display:flex;align-items:center;gap:8px;margin-top:16px;}
  .sched-btn{border:none;padding:10px 16px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
  .sched-btn.save{background:var(--ink);color:#fff;}
  .sched-btn.save:hover{background:#33343A;}
  .sched-btn.apply{background:var(--ahead);color:#fff;}
  .sched-btn.apply:hover{background:#186B45;}

  /* ---------- day-of-month calendar picker ---------- */
  .day-field{position:relative;display:flex;flex-direction:column;gap:4px;}
  .day-field-label{font-size:10.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
  .day-field-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border:1.5px solid var(--line);border-radius:8px;font-family:'Roboto Mono';font-size:13px;color:var(--ink);background:#fff;cursor:pointer;box-sizing:border-box;}
  .day-field-btn:hover{border-color:var(--ink-soft);}
  .day-field-btn svg{color:var(--ink-faint);flex-shrink:0;}
  /* In-flow, not absolutely positioned: the modal itself scrolls
     (.modal-box{overflow-y:auto}), and an absolutely-positioned popover
     opening near the bottom of that scroll area got silently clipped
     instead of pushing it taller. Expanding in place always has room. */
  .day-cal-pop{display:none;margin-top:6px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-rest);padding:10px;}
  .day-cal-pop.open{display:block;}
  .day-cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:3px;}
  .day-cal-dow span{font-size:9px;font-weight:700;color:var(--ink-faint);text-align:center;text-transform:uppercase;}
  .day-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
  .day-cal-grid button{aspect-ratio:1;border:none;background:none;border-radius:6px;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;font-family:'Roboto Mono';}
  .day-cal-grid button:hover:not(:disabled){background:var(--paper);}
  .day-cal-grid button.today{color:var(--lv-orange);}
  .day-cal-grid button.selected{background:var(--ink);color:#fff;}
  .day-cal-grid button:disabled{cursor:default;}

  /* ---------- CONTROLS ---------- */
  .controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:20px 0 16px;}
  .seg{display:flex;background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden;box-shadow:var(--shadow-rest);}
  .seg button{border:none;background:transparent;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;}
  .seg button+button{border-left:1px solid var(--line);}
  .seg button.active{background:var(--ink);color:#fff;}
  select.filter-select{appearance:none;background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9" height="9"><path d="M1 3l3.5 3.5L8 3" stroke="%235B5D66" stroke-width="1.4" fill="none"/></svg>') no-repeat right 11px center;border:1px solid var(--line);border-radius:9px;padding:7px 30px 7px 12px;font-family:'Roboto';font-size:12.5px;color:var(--ink);cursor:pointer;box-shadow:var(--shadow-rest);}
  .searchbox{position:relative;flex:1;min-width:170px;max-width:230px;}
  .searchbox input{width:100%;padding:7px 12px 7px 30px;border:1px solid var(--line);border-radius:9px;font-family:'Roboto';font-size:12.5px;background:#fff;box-shadow:var(--shadow-rest);}
  .searchbox svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--ink-faint);}
  .controls .spacer{flex:1;}
  .clearf{font-size:12px;color:var(--ink-soft);text-decoration:underline;cursor:pointer;background:none;border:none;}
  .add-offer-btn{background:var(--ink);color:#fff;border:none;padding:8px 14px;border-radius:9px;font-size:12.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;box-shadow:var(--shadow-rest);}
  .add-offer-btn:hover{background:#33343A;}

  .period-note{font-size:12.5px;color:var(--ink-soft);padding:2px 2px 14px;}
  .period-note b{color:var(--ink);}
  .period-note.future{color:#7A5B0A;}

  /* ---------- BRAND BANNER ---------- */
  .brand-banner{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-radius:12px;margin:22px 0 10px;}
  .brand-banner.lyd{background:var(--lyd);}
  .brand-banner.b2l{background:var(--b2l);}
  .brand-banner .bname{font-weight:700;font-size:15px;color:#fff;}
  .brand-banner .bstat{font-size:12px;color:rgba(255,255,255,.85);font-weight:500;}

  /* ---------- ROWS (compact, horizontal) ---------- */
  .card-list{display:flex;flex-direction:column;}
  .offer-card{background:var(--card);border-radius:11px;box-shadow:var(--shadow-rest);border:1px solid var(--line);margin-top:12px;position:relative;transition:box-shadow .18s;overflow:hidden;opacity:0;transform:translateY(4px);animation:cardIn .35s ease forwards;}
  .offer-card:hover{box-shadow:var(--shadow-hover);}
  .offer-card.lyd{border-left:4px solid var(--lyd);}
  .offer-card.b2l{border-left:4px solid var(--b2l);}
  .offer-card.has-scheduled{box-shadow:0 0 0 1.5px var(--lv-orange), var(--shadow-rest);}
  .offer-card.has-scheduled:hover{box-shadow:0 0 0 1.5px var(--lv-orange), var(--shadow-hover);}
  .offer-card.clustered{margin-top:8px;}
  

  /* fr, not %: percentages sum to 100% on their own, so the 8px gap × 9
     gaps between these 10 columns (72px) was demanded on top of that and
     overflowed the card — pushing the last two columns (the scheduled-
     change clock and the chevron) out past the right edge. fr shares out
     the space that's actually left after gaps, so it doesn't. */
  .row{display:grid;grid-template-columns:23fr 8fr 12fr 8fr 6fr 6fr 6fr 23fr 4fr 4fr;align-items:center;gap:8px;padding:11px 16px;cursor:pointer;}
  .row .num-cell{padding-right:2px;}
  .row:hover{background:#FBFAF8;}
  .col-headers{cursor:default;padding:10px 16px;margin-top:18px;position:-webkit-sticky;position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:1px solid var(--line);}
  .col-headers:hover{background:none;}
  .col-headers span{font-size:10px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;}
  .col-headers .num-cell{text-align:right;}
  .col-offer{min-width:0;display:flex;align-items:flex-start;gap:8px;}
  .status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:5px;}
  .status-dot.ahead{background:var(--ahead);} .status-dot.pace{background:var(--pace);}
  .status-dot.watch{background:var(--watch);} .status-dot.behind{background:var(--behind);} .status-dot.over{background:var(--over);}
  .mute-badge{display:inline-flex;color:var(--ink-faint);cursor:pointer;margin-top:4px;flex-shrink:0;}
  .mute-badge:hover{color:var(--ink);}
  .of-title{font-size:14px;font-weight:700;line-height:1.25;}
  .of-adv{font-size:11px;color:var(--ink-faint);font-weight:500;}
  .edit-text{border:1.5px solid transparent;background:transparent;border-radius:6px;padding:1px 4px;font-family:'Roboto';color:inherit;width:100%;}
  .edit-text[readonly]{cursor:pointer;}
  .edit-text:hover{border-color:var(--line);}
  .of-title.edit-text{font-size:14px;font-weight:700;}
  .of-adv.edit-text{font-size:11px;font-weight:500;}

  .school-tag{font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;white-space:nowrap;}
  .school-tag.campus{background:#F6EEE0;color:#8A6A22;}
  .school-tag.online{background:var(--pace-soft);color:var(--pace);}
  .school-tag.both{background:#EEE4F7;color:#6A4E9E;}

  .col-type{display:flex;align-items:center;gap:6px;min-width:0;}
  .media-chip{width:20px;height:20px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .media-chip.call{background:#EEE4F7;color:#7A4EC2;}
  .media-chip.web{background:var(--pace-soft);color:var(--pace);}
  .subtype-txt{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

  .num-cell{text-align:right;font-size:14px;line-height:1;}
  .num-cell.faint{color:var(--ink-soft);}
  .edit-input,.readonly-num{display:inline-block;width:56px;text-align:right;border:1.5px solid transparent;background:transparent;border-radius:6px;padding:4px 5px;font-family:'Roboto Mono';font-size:14px;font-weight:700;color:var(--ink);box-sizing:border-box;line-height:1;}
  .edit-input::-webkit-outer-spin-button,.edit-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
  .edit-input[type=number]{-moz-appearance:textfield;appearance:textfield;}
  .edit-input.cpl-w{width:64px;}
  .cpl-wrap{display:inline-flex;align-items:center;justify-content:flex-end;gap:1px;width:100%;}
  .currency-sign{font-family:'Roboto Mono';font-size:14px;color:var(--ink-soft);}
  .edit-input[readonly]{cursor:pointer;}
  .edit-input:not([readonly]):focus,.edit-text:not([readonly]):focus{outline:none;border-color:var(--ink);background:#fff;cursor:text;}
  .edit-input:hover{border-color:var(--line);}
  .readonly-num{color:var(--ink-soft);font-weight:500;cursor:default;}
  .edit-input.dirty,.edit-text.dirty,.dm .v input.dirty{border-color:#B9B7B0;background:#F1EFEA;}
  .save-bar{position:fixed;bottom:0;left:0;right:0;background:var(--ink);color:#fff;padding:14px 28px;display:flex;align-items:center;justify-content:center;gap:18px;transform:translateY(100%);transition:transform .2s;z-index:250;box-shadow:0 -6px 20px rgba(0,0,0,.15);}
  .save-bar.show{transform:translateY(0);}
  .save-bar span{font-size:13.5px;font-weight:600;}
  .save-bar button{border:none;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;}
  .save-bar .discard-btn{background:rgba(255,255,255,.1);color:#fff;}
  .save-bar .discard-btn:hover{background:rgba(255,255,255,.18);}
  .save-bar .save-btn2{background:#fff;color:var(--ink);}
  .save-bar .save-btn2:hover{background:#EDEBE5;}

  .col-pace{display:flex;flex-direction:column;gap:5px;margin-left:16px;padding-left:14px;border-left:1px solid var(--line);}
  .pace-top{display:flex;align-items:baseline;gap:7px;}
  .pace-pct{font-size:15px;font-weight:800;}
  .delta-chip{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;white-space:nowrap;}
  .delta-chip.ahead{background:var(--ahead-soft);color:var(--ahead);}
  .delta-chip.pace{background:var(--pace-soft);color:var(--pace);}
  .delta-chip.watch{background:var(--watch-soft);color:var(--watch);}
  .delta-chip.behind{background:var(--behind-soft);color:var(--behind);}
  .delta-chip.over{background:var(--over-soft);color:var(--over);}
  .bar-track{position:relative;height:6px;background:#EDEBE5;border-radius:4px;}
  .bar-fill{position:absolute;left:0;top:0;height:100%;border-radius:4px;}
  .bar-fill.ahead{background:var(--ahead);} .bar-fill.pace{background:var(--pace);}
  .bar-fill.watch{background:var(--watch);} .bar-fill.behind{background:var(--behind);} .bar-fill.over{background:var(--over);}

  .col-sched{display:flex;justify-content:center;}
  .sched-icon{width:24px;height:24px;border-radius:7px;background:var(--lv-orange-soft);color:var(--lv-orange);display:flex;align-items:center;justify-content:center;cursor:pointer;}
  .sched-icon:hover{background:var(--lv-orange);color:#fff;}
  .sched-icon.muted{background:#EFEDE8;color:var(--ink-faint);}
  .sched-icon.muted:hover{background:var(--lv-orange-soft);color:var(--lv-orange);}

  .chev{color:var(--ink-faint);transition:transform .18s;text-align:center;}
  .offer-card.open .chev{transform:rotate(180deg);}

  [data-tip]{position:relative;}
  .js-tooltip{position:fixed;z-index:200;background:var(--ink);color:#fff;font-size:11px;font-weight:500;padding:6px 9px;border-radius:7px;box-shadow:var(--shadow-hover);max-width:220px;white-space:normal;line-height:1.35;opacity:0;pointer-events:none;transition:opacity .12s;}
  .js-tooltip.show{opacity:1;}

  /* ---------- DETAIL ---------- */
  .detail{max-height:0;overflow:hidden;transition:max-height .28s ease;}
  .offer-card.open .detail{max-height:760px;}
  .detail-inner{padding:16px 18px 18px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:26px;}
  .metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;align-content:start;}
  .dm{background:var(--paper);border-radius:9px;padding:10px 12px;}
  .dm .l{font-size:9.5px;color:var(--ink-faint);font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
  .dm .v{font-size:16px;font-weight:700;margin-top:2px;}
  .dm .v.pos{color:var(--ahead);}
  .dm .v input{width:64px;border:1.5px solid transparent;background:transparent;border-radius:5px;padding:1px 3px;font-family:'Roboto Mono';font-size:15px;font-weight:700;color:var(--ink);}
  .dm .v input.edit-input{text-align:left;}
  .dm .v input:hover{border-color:var(--line);}
  .dm .v input:focus{outline:none;border-color:var(--ink);background:#fff;}
  /* trajectory and trending-revenue now sit side by side, each its own single grid cell */
  .traj{display:block;margin-top:4px;width:100%;height:auto;}
  .traj .ideal{fill:none;stroke:#C7C5BE;stroke-width:1.4;stroke-dasharray:3 3;}
  .traj .actual{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
  .traj .actual.ahead{stroke:var(--ahead);} .traj .actual.pace{stroke:var(--pace);}
  .traj .actual.watch{stroke:var(--watch);} .traj .actual.behind{stroke:var(--behind);}
  .traj .dot-end{fill:currentColor;}

  .actions{display:flex;gap:6px;margin-top:11px;grid-column:1/-1;flex-wrap:wrap;}
  .act-btn{font-size:12px;font-weight:600;padding:8px 10px;border-radius:8px;border:1.5px solid var(--line);background:#fff;cursor:pointer;display:flex;align-items:center;gap:5px;color:var(--ink);}
  .act-btn:hover{border-color:var(--ink);}
  .act-btn.icon-only{padding:8px 11px;}
  .act-btn.icon-only svg{width:14px;height:14px;}
  .act-btn.icon-only{padding:8px 10px;justify-content:center;}
  .act-btn.danger{color:var(--behind);border-color:#F1C6BD;}
  .act-btn.success{color:var(--ahead);border-color:#BFE3CC;}
  .mini-form{grid-column:1/-1;background:var(--paper);border-radius:9px;padding:12px;display:none;gap:9px;flex-wrap:wrap;align-items:flex-end;}
  .mini-form.open{display:flex;}
  .mini-form label{display:flex;flex-direction:column;gap:4px;font-size:9.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
  .mini-form input,.mini-form select{padding:6px 9px;border:1.5px solid var(--line);border-radius:7px;font-family:'Roboto';font-size:12.5px;min-width:110px;background:#fff;}
  .mini-form .mf-note{flex:1;min-width:170px;}
  .mini-form .save-btn{background:var(--ink);color:#fff;border:none;padding:8px 15px;border-radius:7px;font-weight:600;font-size:12px;cursor:pointer;}
  .changelog h4{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);font-weight:700;margin:0 0 9px;}
  .cl-item{display:flex;gap:9px;margin-bottom:11px;}
  .cl-dotwrap{display:flex;flex-direction:column;align-items:center;padding-top:3px;}
  .cl-dot{width:6px;height:6px;border-radius:50%;background:var(--ink-faint);flex-shrink:0;}
  .cl-dot.sched{background:var(--lv-orange);}
  .cl-item.cl-sched{cursor:pointer;border-radius:8px;padding:4px 6px;margin:-4px -6px 7px;transition:background .12s;}
  .cl-item.cl-sched:hover{background:var(--lv-orange-soft);}
  .cl-line{width:1px;flex:1;background:var(--line);margin-top:4px;}
  .cl-top{display:flex;gap:6px;align-items:baseline;}
  .cl-date{font-size:11px;color:var(--ink-soft);font-weight:700;}
  .cl-who{font-size:10.5px;color:var(--ink-faint);}
  .cl-text{font-size:12px;margin-top:1px;line-height:1.4;}
  .cl-text b{font-weight:700;}

  /* ---------- ARCHIVE ---------- */
  .archive-card{display:grid;grid-template-columns:1fr 12% 18% 16% 14%;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:12px 16px;margin-top:8px;}
  .archive-card .name{font-weight:600;font-size:13.5px;}
  .archive-card .meta{font-size:11.5px;color:var(--ink-faint);margin-top:2px;}
  .archive-card .nums{font-family:'Roboto Mono';font-size:13px;color:var(--ink-soft);text-align:right;white-space:nowrap;}
  .archive-headers{padding:0 16px 6px;color:var(--ink-faint);}
  .archive-headers span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
  .status-tag{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:20px;white-space:nowrap;}
  .status-tag .dt{width:6px;height:6px;border-radius:50%;background:currentColor;}
  .status-tag.completed{background:#ECEBE8;color:var(--ink-faint);}
  .status-tag.paused{background:var(--watch-soft);color:var(--watch);}
  .restore-btn{font-size:11.5px;font-weight:600;color:var(--pace);background:var(--pace-soft);border:none;padding:7px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;justify-self:end;}

  .empty-state{padding:50px;text-align:center;color:var(--ink-faint);font-size:13px;}
  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(16px);background:var(--ink);color:#fff;padding:11px 18px;border-radius:9px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.2s;z-index:100;display:flex;align-items:center;gap:8px;}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
  svg{display:block;}

  .mlabel{display:none;}

  @media (max-width:760px){
    .wrap{padding:0 14px 100px;}
    .chrome-inner{padding:12px 14px;}
    .controls{gap:6px;}
    .searchbox{max-width:none;min-width:140px;}
    .col-headers{display:none;}
    .brand-banner{padding:11px 14px;}

    .row{
      display:grid;
      grid-template-columns:1fr 1fr;
      grid-template-areas:
        "offer offer"
        "school type"
        "cpl alloc"
        "mtd needed"
        "pace pace"
        "sched chev";
      gap:8px 12px;
      padding:14px;
    }
    .col-offer{grid-area:offer;}
    .col-school{grid-area:school;display:inline-flex;}
    .col-type{grid-area:type;display:inline-flex;}
    .col-cpl{grid-area:cpl;}
    .col-alloc{grid-area:alloc;}
    .col-mtd{grid-area:mtd;}
    .col-needed{grid-area:needed;}
    .col-pace{grid-area:pace;margin-left:0;padding-left:0;border-left:none;border-top:1px solid var(--line);padding-top:10px;}
    .col-sched{grid-area:sched;justify-content:flex-start;}
    .chev{grid-area:chev;text-align:right;}

    .num-cell{text-align:left;}
    .edit-input,.readonly-num{width:auto;min-width:60px;text-align:left;font-size:15px;}
    .cpl-wrap{justify-content:flex-start;}
    .mlabel{display:block;font-size:9.5px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px;}

    .of-title{font-size:15px;}
    .save-bar{padding:12px 16px;flex-wrap:wrap;gap:10px;}
    .modal-box{max-width:94vw;}
    .form-grid{grid-template-columns:1fr;}
    .archive-card{grid-template-columns:1fr;gap:6px;}
    .archive-card .nums{text-align:left;}
    .archive-headers{display:none;}
  }

  /* Autosave feedback for MTD/Allocation/CPL/Target — a quiet color
     pulse instead of a toast, since these save on every field without
     asking for confirmation. */
  .edit-input.saving{ opacity:.6; }
  .edit-input.save-flash{ background:#E1F3EA; transition:background 1.4s ease; }
}


@keyframes spin{to{transform:rotate(360deg);}}
#view-api {

  .mono{font-family:'Roboto Mono',monospace;font-variant-numeric:tabular-nums;}
  .wrap{max-width:1600px;margin:0 auto;padding:0 28px 100px;}

  /* ---------- CHROME ---------- */
  header.chrome{background:var(--ink);color:#fff;}
  .chrome-inner{max-width:1600px;margin:0 auto;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  .brandmark{display:flex;align-items:center;gap:10px;}
  .brandmark .mark{width:28px;height:28px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;letter-spacing:.02em;color:var(--ink);}
  .brandmark .word{font-weight:700;font-size:15px;letter-spacing:-.01em;}
  .brandmark .word small{display:block;font-weight:400;font-size:10.5px;color:#9A9CA5;letter-spacing:.06em;text-transform:uppercase;margin-top:1px;}

  .month-switch{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.07);border-radius:10px;padding:3px;}
  .month-switch button.arrow{background:none;border:none;color:#C7C9D0;width:26px;height:26px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
  .month-switch button.arrow:hover{background:rgba(255,255,255,.12);}
  .month-switch button.arrow:disabled{opacity:.25;cursor:default;}
  .month-switch button.arrow:disabled:hover{background:none;}
  .month-nav-label{font-weight:600;font-size:13px;color:#fff;padding:0 6px;min-width:118px;text-align:center;}
  .back-today{background:var(--lv-orange);color:#fff;border:none;font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:20px;cursor:pointer;display:none;white-space:nowrap;}
  .back-today.show{display:inline-block;}
  .chrome-right{display:flex;align-items:center;gap:14px;}
  .save-state{display:flex;align-items:center;gap:6px;font-size:12px;color:#B9E6C9;min-width:56px;}
  .save-state .spinner{width:11px;height:11px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;}
  
  .avatar{width:26px;height:26px;border-radius:50%;background:#2C2E36;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;}

  /* ---------- CONTROLS ---------- */
  .controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:20px 0 16px;}
  .seg{display:flex;background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden;box-shadow:var(--shadow-rest);}
  .seg button{border:none;background:transparent;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;}
  .seg button+button{border-left:1px solid var(--line);}
  .seg button.active{background:var(--ink);color:#fff;}
  .controls .spacer{flex:1;}
  .add-btn{border:none;padding:8px 14px;border-radius:9px;font-size:12.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;box-shadow:var(--shadow-rest);}
  .add-btn{background:var(--ink);color:#fff;}
  .add-btn:hover{background:#33343A;}

  /* ---------- SUMMARY ---------- */
  .summary-row{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:12px;margin-bottom:22px;max-width:520px;}
  .summary-card{background:var(--card);border:1px solid var(--line);border-left:3px solid transparent;border-radius:10px;padding:14px 16px;box-shadow:var(--shadow-rest);}
  .summary-card.lyd{border-left-color:var(--lyd);}
  .summary-card.b2l{border-left-color:var(--b2l);}
  .summary-label{font-size:10.5px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:6px;}
  .summary-value{font-family:'Roboto Mono',monospace;font-size:22px;font-weight:700;color:var(--ink);}

  /* ---------- BRAND BANNER ---------- */
  .brand-banner{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-radius:12px;margin:22px 0 10px;}
  .brand-banner.lyd{background:var(--lyd);}
  .brand-banner.b2l{background:var(--b2l);}
  .brand-banner .bname{font-weight:700;font-size:15px;color:#fff;}
  .brand-banner .bstat{font-size:12px;color:rgba(255,255,255,.85);font-weight:500;}

  /* ---------- LEDGER ---------- */
  .ledger-wrap{border:1px solid var(--line);border-radius:11px;background:var(--card);overflow:auto;box-shadow:var(--shadow-rest);}
  table.ledger{width:100%;border-collapse:collapse;font-size:13px;min-width:700px;}
  th.lh{text-align:right;font-size:10px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;padding:9px 8px;border-bottom:1px solid var(--line);white-space:nowrap;position:-webkit-sticky;position:sticky;top:0;background:var(--card);z-index:2;}
  th.lh.client-col{text-align:left;position:-webkit-sticky;position:sticky;left:0;z-index:3;min-width:160px;}
  /* Airy, not color-blocked: whitespace and a plain rule under the latest-filled
     column do the grouping instead of tinted bands, which read as too
     much orange once real data filled the table. */
  th.lh.day-col{min-width:28px;padding-left:2px;padding-right:2px;}
  th.lh.day-col .daynum{display:block;font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:0;}
  th.lh.day-col .dow{display:block;font-size:8.5px;color:var(--ink-faint);font-weight:400;margin-top:1px;}
  th.lh.latest{box-shadow:inset 0 -2px 0 var(--lv-orange);}
  th.lh.latest .daynum{color:var(--lv-orange);}
  th.lh.actions-col{min-width:32px;text-align:center;}
  th.lh.notes-col{text-align:left;min-width:130px;}
  th.lh.goal-col,th.lh.pct-col,th.lh.mtd-col,th.lh.trend-col{min-width:56px;}
  /* A single light rule separates entry days from the computed summary,
     and again before Notes — the grouping cue, without banding backgrounds. */
  th.lh.goal-col,td.goal-cell{border-left:1px solid var(--line);}
  th.lh.notes-col,td.notes-td{border-left:1px solid var(--line);}

  td.lc{padding:5px 8px;border-bottom:1px solid var(--line);white-space:nowrap;}
  td.name-cell{padding:8px 10px;position:-webkit-sticky;position:sticky;left:0;background:var(--card);z-index:1;border-bottom:1px solid var(--line);font-weight:600;font-size:13px;cursor:pointer;}
  td.name-cell input{font:inherit;font-weight:600;color:var(--ink);border:1.5px solid var(--ink);border-radius:6px;padding:3px 6px;width:100%;outline:none;background:#fff;}
  tr.lrow:hover td{background:#FBFAF8;}
  tr.lrow:hover td.name-cell{background:#FBFAF8;}
  td.day-cell.latest{box-shadow:inset 0 0 0 1px var(--lv-orange-soft);background:#FFFCFA;}
  .computed-cell{font-family:'Roboto Mono',monospace;font-size:13px;color:var(--ink-soft);text-align:right;padding:6px 8px;font-weight:600;}
  .computed-cell.mtd{color:var(--ink);font-weight:700;}
  /* Highlight only what's actually worth a second look — pacing well past
     goal — the way conditional formatting would in a spreadsheet, rather
     than coloring the whole MTD column regardless of whether it stands out. */
  .computed-cell.pct-standout{background:var(--ahead-soft);color:var(--ahead);border-radius:5px;font-weight:700;}

  .li-input{background:transparent;border:1.5px solid transparent;color:var(--ink);font-family:'Roboto Mono';font-size:12.5px;width:28px;text-align:right;padding:5px 2px;border-radius:6px;outline:none;}
  .li-input:hover{border-color:var(--line);}
  .li-input:focus{border-color:var(--ink);background:#fff;}
  .li-input::placeholder{color:#C7C5BE;}
  .li-input.goal-input{width:40px;}
  input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
  input[type=number]{-moz-appearance:textfield;appearance:textfield;}

  .notes-cell{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;color:var(--ink-soft);font-size:12.5px;padding:6px 6px;border-radius:6px;}
  .notes-cell:hover{background:var(--paper);color:var(--ink);}
  .notes-cell.empty{color:var(--ink-faint);}
  .notes-popover{position:fixed;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-hover);padding:10px;z-index:250;width:240px;}
  .notes-popover textarea{width:100%;min-height:90px;border:1.5px solid var(--line);border-radius:8px;padding:8px;font-family:'Roboto';font-size:12.5px;resize:vertical;outline:none;color:var(--ink);}
  .notes-popover textarea:focus{border-color:var(--ink);}

  .row-menu-btn{background:none;border:none;color:var(--ink-faint);cursor:pointer;padding:5px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;}
  .row-menu-btn:hover{background:var(--paper);color:var(--ink);}
  .adv-menu{display:none;position:fixed;background:#fff;border-radius:9px;box-shadow:var(--shadow-hover);border:1px solid var(--line);min-width:170px;z-index:200;overflow:hidden;}
  .adv-menu.open{display:block;}
  .adv-menu button{display:block;width:100%;text-align:left;padding:9px 13px;border:none;background:#fff;font-size:12.5px;color:var(--ink);cursor:pointer;}
  .adv-menu button:hover{background:var(--paper);}
  .adv-menu button.danger{color:var(--behind);}
  .adv-menu hr{border:none;border-top:1px solid var(--line);margin:0;}

  tfoot td{border-bottom:none;border-top:1.5px solid var(--line);}
  .total-label{font-weight:700;color:var(--ink);position:-webkit-sticky;position:sticky;left:0;background:var(--card);}
  .total-cell{font-family:'Roboto Mono',monospace;font-weight:700;color:var(--ink);text-align:right;padding:8px 6px;}
  .total-cell.mtd{color:var(--lv-orange);}

  .empty-state{padding:28px;text-align:center;color:var(--ink-faint);font-size:13px;}
  .grid-block{margin-bottom:10px;}

  /* ---------- ARCHIVE ---------- */
  .archive-card{display:grid;grid-template-columns:1fr 90px 110px;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-top:8px;}
  .archive-headers{display:grid;grid-template-columns:1fr 90px 110px;padding:0 16px 6px;gap:12px;}
  .archive-headers span{font-size:10px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;}
  .archive-headers span:nth-child(2){text-align:right;}
  .archive-card .name{font-weight:700;font-size:13.5px;}
  .brand-chip{font-size:9.5px;font-weight:800;padding:2px 7px;border-radius:5px;color:#fff;white-space:nowrap;display:inline-block;margin-top:3px;}
  .brand-chip.lyd{background:var(--lyd);}
  .brand-chip.b2l{background:var(--b2l);}
  .archive-card .nums{font-family:'Roboto Mono';text-align:right;font-size:13px;color:var(--ink-soft);}
  .restore-btn{background:none;border:1.5px solid var(--line);color:var(--ink);padding:7px 12px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;justify-self:end;}
  .restore-btn:hover{border-color:var(--ahead);color:var(--ahead);background:var(--ahead-soft);}

  /* ---------- MODAL ---------- */
  .modal-overlay{position:fixed;inset:0;background:rgba(21,22,26,.5);display:none;align-items:center;justify-content:center;z-index:300;padding:20px;}
  .modal-overlay.open{display:flex;}
  .modal-box{background:#fff;border-radius:16px;max-width:420px;width:100%;box-shadow:0 24px 60px rgba(0,0,0,.28);}
  .modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid var(--line);}
  .modal-head h3{margin:0;font-size:15px;font-weight:700;}
  .modal-close{background:none;border:none;color:var(--ink-faint);cursor:pointer;font-size:20px;line-height:1;padding:4px;}
  .form-grid{display:grid;grid-template-columns:1fr;gap:10px;padding:16px 18px 4px;}
  .form-grid label{display:flex;flex-direction:column;gap:4px;font-size:10.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
  .form-grid input,.form-grid select{padding:9px 10px;border:1.5px solid var(--line);border-radius:8px;font-family:'Roboto';font-size:13px;background:#fff;color:var(--ink);}
  .form-actions{padding:16px 18px 18px;display:flex;justify-content:flex-end;}
  .form-actions button{background:var(--ink);color:#fff;border:none;padding:9px 18px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;}
  .form-actions button:hover{background:#33343A;}

  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:10px 18px;border-radius:9px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:all .25s;z-index:400;display:flex;align-items:center;gap:8px;}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

  @media (max-width:760px){
    .wrap{padding:0 14px 100px;}
    .chrome-inner{padding:12px 14px;}
    .summary-row{max-width:none;grid-template-columns:1fr 1fr;}
  }

}



#view-brief {

  html,body{margin:0;padding:0;}

  .mono{font-family:'Roboto Mono',monospace;}

  /* ---------- chrome ---------- */
  .chrome{
    background:var(--paper);
    border-bottom:1px solid var(--line);
    position:-webkit-sticky;
    position:sticky;
    top:0;
    z-index:20;
  }
  .chrome-inner{
    max-width:1180px;
    margin:0 auto;
    padding:0 28px;
    display:flex;
    align-items:center;
    height:60px;
    gap:28px;
  }
  .brandmark{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight:700;
    font-size:14.5px;
    letter-spacing:0.01em;
    color:var(--ink);
    white-space:nowrap;
  }
  .brandmark .dot{
    width:9px;height:9px;border-radius:50%;
    background:var(--lv-orange);
    display:inline-block;
  }
  nav.tabs{
    display:flex;
    align-items:center;
    gap:4px;
    flex:1;
  }
  nav.tabs a{
    display:inline-flex;
    align-items:center;
    padding:8px 14px;
    border-radius:7px;
    font-size:13.5px;
    font-weight:500;
    color:var(--ink-soft);
    text-decoration:none;
  }
  nav.tabs a:hover{background:var(--line-soft);color:var(--ink);}
  nav.tabs a.active{
    background:#FBEFF3;
    color:var(--lyd-pink);
    font-weight:600;
  }
  .chrome-right{display:flex;align-items:center;gap:14px;}
  .userchip{
    display:flex;align-items:center;gap:8px;
    padding:5px 10px 5px 5px;
    border-radius:20px;
    border:1px solid var(--line);
    cursor:pointer;
    background:var(--paper);
  }
  .userchip .avatar{
    width:26px;height:26px;border-radius:50%;
    background:var(--b2l-navy);
    color:#fff;
    font-size:11px;font-weight:600;
    display:flex;align-items:center;justify-content:center;
  }
  .userchip span{font-size:13px;font-weight:500;color:var(--ink);}

  /* ---------- page ---------- */
  .page{
    max-width:1180px;
    margin:0 auto;
    padding:36px 28px 80px;
  }
  .page-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:28px;
    gap:24px;
  }
  .page-head h1{
    font-size:23px;
    font-weight:700;
    margin:0 0 6px;
    letter-spacing:-0.01em;
  }
  .page-head p{
    margin:0;
    font-size:14px;
    color:var(--ink-soft);
    max-width:520px;
    line-height:1.5;
  }
  .btn{
    border:1px solid var(--line);
    background:var(--paper);
    padding:9px 16px;
    border-radius:8px;
    font-size:13.5px;
    font-weight:500;
    color:var(--ink);
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:7px;
    white-space:nowrap;
  }
  .btn:hover{border-color:#C7CCD3;}
  .btn.primary{
    background:var(--ink);
    border-color:var(--ink);
    color:#fff;
  }
  .btn.primary:hover{background:#000;}
  .btn.sending{background:var(--status-ahead);border-color:var(--status-ahead);color:#fff;}

  .stack{
    display:flex;
    flex-direction:column;
    gap:24px;
  }

  .mini-table-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    margin:0 22px 18px;
  }
  .mini-table-row:last-child{margin-bottom:22px;}
  @media (max-width:760px){ .mini-table-row{grid-template-columns:1fr;} }
  .mini-section.standalone{margin:0 22px 18px;}
  .mini-section.standalone:last-child{margin-bottom:22px;}

  .card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
  }
  .card-head{
    padding:18px 22px;
    border-bottom:1px solid var(--line-soft);
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .card-head h2{
    font-size:15px;
    font-weight:600;
    margin:0 0 2px;
  }
  .card-head .sub{
    font-size:12.5px;
    color:var(--ink-faint);
  }

  /* ---------- recipients table ---------- */
  table.recipients{
    width:100%;
    border-collapse:collapse;
  }
  table.recipients thead th{
    position:-webkit-sticky;
    position:sticky;
    top:60px;
    background:var(--paper);
    text-align:left;
    font-size:11px;
    font-weight:600;
    letter-spacing:0.02em;
    color:var(--ink-faint);
    padding:10px 22px;
    border-bottom:1px solid var(--line-soft);
  }
  table.recipients th.center, table.recipients td.center{text-align:center;}
  table.recipients tbody tr{border-bottom:1px solid var(--line-soft);}
  table.recipients tbody tr:last-child{border-bottom:none;}
  table.recipients td{
    padding:13px 22px;
    font-size:13.5px;
    vertical-align:middle;
  }
  .person{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .person .avatar{
    width:30px;height:30px;border-radius:50%;
    background:var(--canvas);
    border:1px solid var(--line);
    color:var(--ink-soft);
    font-size:11.5px;font-weight:600;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }
  .person .name{font-weight:500;color:var(--ink);}
  .person .email{font-size:12px;color:var(--ink-faint);margin-top:1px;}

  .role-chip{
    display:inline-block;
    font-size:11px;
    font-weight:600;
    padding:3px 9px;
    border-radius:20px;
    background:var(--line-soft);
    color:var(--ink-soft);
  }

  .toggle{
    width:34px;height:20px;
    border-radius:20px;
    background:var(--line);
    position:relative;
    cursor:pointer;
    display:inline-block;
    transition:background .15s ease;
    flex-shrink:0;
  }
  .toggle::after{
    content:"";
    position:absolute;
    top:2px;left:2px;
    width:16px;height:16px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 1px 2px rgba(0,0,0,.25);
    transition:left .15s ease;
  }
  .toggle.on{background:var(--ink);}
  .toggle.on::after{left:16px;}
  .toggle.flash{background:var(--status-ahead) !important;}

  .brandbox-row{display:flex;gap:14px;align-items:center;justify-content:center;}
  .brandbox{
    display:flex;align-items:center;gap:6px;
    font-size:11.5px;font-weight:500;color:var(--ink-faint);
  }
  .checkbox{
    width:15px;height:15px;
    border-radius:4px;
    border:1.5px solid #C7CCD3;
    cursor:pointer;
    position:relative;
    flex-shrink:0;
  }
  .checkbox.checked{border-color:transparent;}
  .checkbox.checked.lyd{background:var(--lyd-pink);}
  .checkbox.checked.b2l{background:var(--b2l-navy);}
  .checkbox.checked::after{
    content:"";
    position:absolute;
    left:4px;top:1px;
    width:4px;height:8px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    transform:rotate(45deg);
  }

  .disabled-row{opacity:.45;}
  .disabled-row .toggle,.disabled-row .checkbox{pointer-events:none;}

  .card-foot{
    padding:14px 22px;
    border-top:1px solid var(--line-soft);
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .savemsg{
    font-size:12px;
    color:var(--status-ahead);
    font-weight:500;
    opacity:0;
    transition:opacity .2s ease;
    display:flex;align-items:center;gap:5px;
  }
  .savemsg.show{opacity:1;}
  .add-recipient{
    font-size:13px;
    color:var(--ink-soft);
    font-weight:500;
    display:flex;
    align-items:center;
    gap:6px;
    cursor:pointer;
  }
  .add-recipient:hover{color:var(--ink);}

  /* ---------- last brief preview ---------- */
  .preview-meta{
    padding:18px 22px 14px;
    display:flex;
    flex-direction:column;
    gap:3px;
  }
  .preview-meta .sent-label{
    font-size:12px;
    color:var(--ink-faint);
  }
  .preview-meta .sent-time{
    font-size:14px;
    font-weight:600;
    color:var(--ink);
  }
  .preview-status-pill{
    display:inline-flex;
    align-items:center;
    gap:5px;
    font-size:11.5px;
    font-weight:600;
    padding:3px 9px;
    border-radius:20px;
    background:var(--status-ahead-bg);
    color:var(--status-ahead);
    margin-top:6px;
    width:fit-content;
  }
  .preview-status-pill .dot{width:5px;height:5px;border-radius:50%;background:var(--status-ahead);}

  .digest{
    margin:0 22px 18px;
    padding:16px 18px 4px;
    background:var(--canvas);
    border-radius:8px;
    font-size:13px;
    line-height:1.6;
    color:var(--ink-soft);
  }
  .digest b{color:var(--ink);font-weight:600;}
  .digest-cat{margin-bottom:14px;}
  .digest-cat-label{
    font-size:11px;
    font-weight:600;
    color:var(--ink-faint);
    margin-bottom:5px;
  }
  .digest-line{
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-bottom:4px;
    max-width:640px;
  }
  .digest-line .brand-tag{margin-top:5px;}
  .digest .chip{
    display:inline-block;
    font-size:10.5px;
    font-weight:700;
    padding:1px 7px;
    border-radius:20px;
    margin:0 1px;
  }
  .chip.ahead{background:var(--status-ahead-bg);color:var(--status-ahead);}
  .chip.onpace{background:var(--status-onpace-bg);color:var(--status-onpace);}
  .chip.watch{background:var(--status-watch-bg);color:var(--status-watch);}
  .chip.behind{background:var(--status-behind-bg);color:var(--status-behind);}

  .mini-section{margin:0 0 18px;}
  .mini-section:last-child{margin-bottom:0;}
  .mini-table-row .mini-section{margin-bottom:0;}
  .mini-head{
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:8px;
  }
  .brand-tag{
    width:8px;height:8px;border-radius:2px;
    flex-shrink:0;
  }
  .brand-tag.lyd{background:var(--lyd-pink);}
  .brand-tag.b2l{background:var(--b2l-navy);}
  .mini-head span{
    font-size:12px;
    font-weight:600;
    color:var(--ink);
  }
  .mini-head .brandname-sub{
    font-weight:400;
    color:var(--ink-faint);
  }

  table.mini{
    width:100%;
    border-collapse:collapse;
    border:1px solid var(--line-soft);
    border-radius:6px;
    overflow:hidden;
    font-size:11.5px;
  }
  table.mini th{
    text-align:left;
    font-weight:600;
    color:var(--ink-faint);
    background:var(--canvas);
    padding:6px 9px;
    font-size:10.5px;
    letter-spacing:0.01em;
  }
  table.mini td{
    padding:6px 9px;
    border-top:1px solid var(--line-soft);
    color:var(--ink-soft);
  }
  table.mini td.name{color:var(--ink);font-weight:500;}
  table.mini .status-dot{
    display:inline-block;
    width:6px;height:6px;
    border-radius:50%;
    margin-right:5px;
  }
  .status-dot.ahead{background:var(--status-ahead);}
  .status-dot.onpace{background:var(--status-onpace);}
  .status-dot.watch{background:var(--status-watch);}
  .status-dot.behind{background:var(--status-behind);}

  .preview-note{
    margin:0 22px 20px;
    padding:10px 14px;
    background:#FBF7EF;
    border:1px solid #F0E4CC;
    border-radius:7px;
    font-size:12px;
    color:#8A6A2E;
    line-height:1.5;
  }

  .helper-text{
    font-size:12px;
    color:var(--ink-faint);
    padding:14px 22px 0;
    line-height:1.5;
  }

  /* ---------- frequency pill ---------- */
  .freq-wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }
  .freq{
    display:inline-flex;
    border:1px solid var(--line);
    border-radius:20px;
    padding:2px;
    background:var(--canvas);
    flex-shrink:0;
  }
  .freq button{
    border:none;
    background:none;
    font-size:11px;
    font-weight:600;
    padding:4px 10px;
    border-radius:16px;
    color:var(--ink-faint);
    cursor:pointer;
    font-family:inherit;
    white-space:nowrap;
  }
  .freq button.active{
    background:var(--paper);
    color:var(--ink);
    box-shadow:0 1px 2px rgba(0,0,0,.08);
  }
  select.freq-day{
    display:none;
    font-family:inherit;
    font-size:11px;
    font-weight:500;
    color:var(--ink-soft);
    border:1px solid var(--line);
    border-radius:14px;
    padding:5px 8px;
    background:var(--paper);
    flex-shrink:0;
  }

  /* ---------- delivery time ---------- */
  .delivery-card{
    margin-bottom:24px;
    padding:16px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
  }
  .delivery-left{display:flex;align-items:center;gap:12px;}
  .delivery-icon{
    width:36px;height:36px;
    border-radius:8px;
    background:var(--canvas);
    display:flex;align-items:center;justify-content:center;
    color:var(--ink-soft);
    flex-shrink:0;
  }
  .delivery-title{font-size:13.5px;font-weight:600;color:var(--ink);}
  .delivery-sub{font-size:12px;color:var(--ink-faint);margin-top:1px;max-width:420px;line-height:1.45;}
  select.hour-select{
    font-family:inherit;
    font-size:13px;
    font-weight:500;
    color:var(--ink);
    border:1px solid var(--line);
    border-radius:8px;
    padding:8px 12px;
    background:var(--paper);
    cursor:pointer;
  }

}

/* Delete in the Offers archive — destructive, so it reads as such. */
#view-offers .restore-btn.danger-btn{
  color:var(--status-behind);
  border-color:var(--status-behind-bg);
  background:var(--status-behind-bg);
}
#view-offers .restore-btn.danger-btn:hover{
  background:var(--status-behind);
  border-color:var(--status-behind);
  color:#fff;
}

/* ============ API Clients corrections ============ */
/* Header padding (2px) and cell padding (4px) disagreed, so the numbers sat
   two pixels off from the day they belong to. Same box for both, centred —
   these are 1-3 digit counts in a dense grid, and centring reads cleaner
   than right-aligning inside a 28px column. */
#view-api th.lh.day-col,
#view-api td.lc.day-cell{
  padding-left:3px; padding-right:3px;
  min-width:30px; width:30px;
  text-align:center;
}
#view-api th.lh.day-col .daynum,
#view-api th.lh.day-col .dow{ text-align:center; }
#view-api .li-input{ width:100%; text-align:center; padding-left:0; padding-right:0; }
#view-api .li-input.saving{ opacity:.55; }
#view-api .li-input.save-flash{ background:#E1F3EA; transition:background 1.4s ease; }
#view-api .li-input.goal-input{ width:46px; }

/* This is the rule that actually wins over the plain th.lh.latest/
   td.day-cell.latest above (it's more specific — same trap as the Profits
   header and the API total-row bugs), so it's the one to edit if the
   highlight needs to change again. The class marks the latest day with a
   figure (not the calendar's today), mirroring Profits' "Latest". Toned down from a solid orange fill to a thin
   underline + hairline box — visible without reading as a wall of color. */
#view-api th.lh.day-col.latest{ background:var(--card); box-shadow:inset 0 -2px 0 var(--lv-orange); }
#view-api td.day-cell.latest{ background:#FFFCFA; box-shadow:inset 0 0 0 1px var(--lv-orange-soft); }

/* The Total row's day cells used .total-cell's default right-align/padding
   instead of the day columns' centered 30px box, so the totals sat off
   from the numbers above them. Match the day-cell box exactly. */
#view-api td.total-cell[data-daytotal]{
  text-align:center; padding-left:3px; padding-right:3px;
  min-width:30px; width:30px;
}


/* The row menu column was being clipped by the horizontal scroll, so the
   three dots were only half reachable. Pin it to the right edge the way
   the client name column is pinned left. */
#view-api th.lh.actions-col,
#view-api td.lc.row-actions{
  position:sticky; right:0; z-index:3;
  background:#fff; min-width:40px; width:40px;
  text-align:center;
  box-shadow:-6px 0 6px -6px rgba(21,22,26,.18);
}
#view-api tr:hover td.lc.row-actions{ background:#FAFAF8; }
#view-api .row-menu-btn{ display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border:none; background:transparent; border-radius:6px;
  color:var(--ink-faint); cursor:pointer; }
#view-api .row-menu-btn:hover{ background:var(--paper); color:var(--ink); }

/* Restore and Delete share the archive card's last grid cell — added as
   separate children they became a sixth column and shunted the row. */
#view-offers .arch-actions{
  display:flex; align-items:center; justify-content:flex-end; gap:8px;
}
#view-offers .arch-actions .restore-btn{ margin:0; }

/* Offers rules are nested under #view-offers, so these must be too —
   otherwise the existing nested rules (more specific) win. */
#view-offers {
  /* ---------- OFFER DETAIL · Delivery / Conversions (toggled by a button) ---------- */
  .conv-pane{display:none;padding:16px 18px 18px;border-top:1px solid var(--line);}
  .conv-pane .actions{margin-top:12px;}
  .offer-card.show-conv .detail-inner{display:none;}
  .offer-card.show-conv .conv-pane{display:block;}
  .conv-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
  .conv-tile .v input{width:100%;font-size:20px;}
  .conv-tile .v input.saving{opacity:.5;}
  .conv-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px;padding-top:6px;border-top:1px solid var(--line);}
  .conv-stats .cs{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:11px;color:var(--ink-faint);font-weight:700;}
  .conv-stats b{font-size:13.5px;color:var(--ink);}
  @media (max-width:640px){ .conv-tiles{grid-template-columns:1fr;} }

  /* Track conversions (add offer + per-offer modal) */
  .track-box{grid-column:1/-1;border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;background:var(--paper);}
  .track-box label{display:flex;flex-direction:row;align-items:center;gap:9px;text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;}
  .track-box input[type=checkbox]{padding:0;border:none;margin:0;width:16px;height:16px;flex:none;accent-color:var(--ink);}
  .track-opts{display:grid;grid-template-columns:1fr;gap:7px;margin-top:11px;padding-top:11px;border-top:1px solid var(--line);}
  .track-opts.flat{margin-top:0;padding-top:0;border-top:none;}
  .track-opt{background:#fff;border:1.5px solid var(--line);border-radius:8px;padding:9px 12px;min-width:0;}
  .track-opt span{flex:1;}
  .track-box .track-opt em{font-style:normal;font-size:9.5px;color:var(--ink-faint);font-weight:700;letter-spacing:.04em;}
}

/* =====================================================================
   CALL CENTER — scoped to its own view, like every other area
   ===================================================================== */
#view-callcenter {
  .mono{font-family:'Roboto Mono',monospace;font-variant-numeric:tabular-nums;}
  .wrap{max-width:1600px;margin:0 auto;padding:0 28px 100px;}

  .controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:20px 0 4px;}
  .controls .spacer{flex:1;}
  .seg{display:flex;background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden;box-shadow:var(--shadow-rest);}
  .seg button{border:none;background:transparent;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;}
  .seg button+button{border-left:1px solid var(--line);}
  .seg button.active{background:var(--ink);color:#fff;}
  select.filter-select{background:#fff;border:1px solid var(--line);border-radius:9px;padding:7px 12px;font-family:'Roboto';font-size:12.5px;font-weight:600;color:var(--ink-soft);box-shadow:var(--shadow-rest);cursor:pointer;}
  .clearf{font-size:12px;color:var(--ink-soft);text-decoration:underline;cursor:pointer;background:none;border:none;}
  .add-btn{background:var(--ink);color:#fff;border:none;padding:8px 14px;border-radius:9px;font-size:12.5px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-rest);display:flex;align-items:center;gap:6px;}
  .add-btn:hover{background:#33343A;}
  body.is-viewer & .add-btn{display:none;}

  .brand-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 18px;border-radius:12px;margin:18px 0 10px;background:var(--b2l);}
  .brand-banner .bname{font-weight:700;font-size:15px;color:#fff;}
  .brand-banner .bstat{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.85);font-weight:500;}
  .brand-banner .bstat b{font-family:'Roboto Mono',monospace;color:#fff;font-weight:700;margin-left:5px;}

  .scroll{overflow-x:auto;}
  .grid-wrap{min-width:1160px;}
  .row{display:grid;grid-template-columns:minmax(130px,1fr) 90px 80px 72px 52px 64px 64px 100px 100px 100px 96px 62px 32px 66px;align-items:center;gap:4px;padding:9px 14px;}
  .col-headers{padding:6px 14px;margin-top:10px;}
  .col-headers span{font-size:10px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;line-height:1.25;}
  .col-headers .r{text-align:center;}
  .offer-card{background:var(--card);border-radius:11px;box-shadow:var(--shadow-rest);border:1px solid var(--line);border-left:4px solid var(--b2l);margin-top:10px;transition:box-shadow .18s;}
  .offer-card:hover{box-shadow:var(--shadow-hover);}
  .num-cell{text-align:center;font-family:'Roboto Mono',monospace;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;}
  .num-cell.soft{font-weight:500;color:var(--ink-faint);font-size:13px;}
  .edit-input,.edit-text{width:100%;border:1.5px solid transparent;background:transparent;border-radius:6px;padding:4px 5px;color:var(--ink);transition:background .5s,border-color .5s;}
  .edit-input{font-family:'Roboto Mono',monospace;font-size:14px;font-weight:700;text-align:center;}
  .edit-text{font-family:'Roboto';font-size:13px;}
  .edit-text.center{font-weight:700;font-size:14px;}
  .edit-input::placeholder{color:#C9C7C0;font-weight:500;}
  .edit-input:hover,.edit-text:hover{border-color:var(--line);}
  .edit-input:focus,.edit-text:focus{outline:none;border-color:var(--ink);background:#fff;}
  .edit-input:read-only,.edit-text:read-only{cursor:default;}
  .edit-input:read-only:hover,.edit-text:read-only:hover{border-color:transparent;}
  .edit-input.saving,.edit-text.saving{opacity:.55;}
  .edit-input.save-flash,.edit-text.save-flash{border-color:var(--ahead);background:var(--ahead-soft);transition:none;}
  .money-box{display:flex;align-items:center;justify-content:center;gap:2px;border:1.5px solid transparent;border-radius:6px;background:transparent;padding:0 3px;cursor:text;}
  .money-box:hover{border-color:var(--line);}
  .money-box:focus-within{border-color:var(--ink);background:#fff;}
  .money-box span{font-family:'Roboto Mono',monospace;font-size:14px;font-weight:700;color:var(--ink);}
  .money-box .edit-input{border:none;background:transparent;padding:4px 2px;width:74px;font-size:13px;}
  .money-box .edit-input:hover,.money-box .edit-input:focus{border:none;background:transparent;}
  .money-box .edit-input.save-flash{background:var(--ahead-soft);}
  input[type=number]{-moz-appearance:textfield;appearance:textfield;}
  select.type-sel{font-weight:600;cursor:pointer;font-family:'Roboto';font-size:13px;}
  .profit.pos{color:var(--ahead);} .profit.neg{color:var(--behind);} .profit.zero{color:var(--ink-faint);}
  .chip{display:inline-flex;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;}
  .chip.ahead{background:var(--ahead-soft);color:var(--ahead);}
  .chip.watch{background:var(--watch-soft);color:var(--watch);}
  .chip.behind{background:var(--behind-soft);color:var(--behind);}
  .chip.none{color:var(--ink-faint);}
  .icon-btn{width:30px;height:30px;border-radius:8px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;font-size:16px;line-height:1;position:relative;}
  .icon-btn:hover{border-color:var(--ink);color:var(--ink);background:#F5F4F1;}
  .icon-btn svg{display:block;margin:auto;}
  .icon-btn.has-note{color:var(--ink);border-color:var(--ink-faint);}
  .icon-btn.has-note::after{content:"";position:absolute;top:-3px;right:-3px;width:8px;height:8px;border-radius:50%;background:var(--lv-orange);border:1.5px solid #fff;}
  .icon-btn.danger:hover{color:var(--behind);border-color:#F1C6BD;}
  .arch-pair{display:flex;gap:4px;}

  .empty{background:#fff;border:1px dashed var(--line);border-radius:11px;padding:36px 20px;text-align:center;color:var(--ink-soft);margin-top:12px;}
  .empty b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px;}
  .empty button{margin-top:14px;}

  .modal-overlay{position:fixed;inset:0;background:rgba(21,22,26,.5);display:none;align-items:center;justify-content:center;z-index:300;padding:20px;}
  .modal-overlay.open{display:flex;}
  .modal-box{background:#fff;border-radius:16px;max-width:560px;width:100%;max-height:86vh;overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.28);}
  .modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid var(--line);}
  .modal-head h3{margin:0;font-size:15px;font-weight:700;}
  .modal-head p{margin:2px 0 0;font-size:12px;color:var(--ink-faint);}
  .modal-close{background:none;border:none;color:var(--ink-faint);cursor:pointer;font-size:20px;line-height:1;padding:4px;}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 16px 4px;}
  .form-grid label{display:flex;flex-direction:column;gap:4px;font-size:10.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
  .form-grid label.full{grid-column:1/-1;}
  .form-grid input,.form-grid select,.form-grid textarea{padding:8px 10px;border:1.5px solid var(--line);border-radius:8px;font-family:'Roboto';font-size:13px;color:var(--ink);background:#fff;}
  .form-grid textarea{resize:vertical;line-height:1.45;}
  .form-actions{padding:14px 16px 18px;display:flex;justify-content:flex-end;}
  .form-actions button{background:var(--ink);color:#fff;border:none;padding:9px 18px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;}
  .form-actions button:hover{background:#33343A;}

  .cc-banner{font-family:'Roboto',sans-serif;background:var(--b2l);border-radius:12px;margin:18px 0 10px;padding:14px 18px 16px;color:#fff;}
  .cc-btitle{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;}
  .cc-btitle .n{font-weight:700;font-size:15px;}
  .cc-btitle .m{font-size:12px;color:rgba(255,255,255,.6);font-weight:500;}
  .cc-tiles{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch;}
  .cc-grp{display:flex;background:rgba(255,255,255,.08);border-radius:10px;padding:2px;}
  .cc-grp:nth-child(1){flex:1.5;min-width:290px;}
  .cc-grp:nth-child(2){flex:2;min-width:300px;}
  .cc-grp.cc-result{flex:1.1;min-width:200px;background:rgba(255,255,255,.14);}
  .cc-grp.cc-result.pos{background:rgba(31,157,107,.28);}
  .cc-grp.cc-result.neg{background:rgba(214,69,69,.32);}
  .cc-tile{flex:1;padding:8px 14px;display:flex;flex-direction:column;gap:3px;min-width:0;}
  .cc-tile + .cc-tile{border-left:1px solid rgba(255,255,255,.12);}
  .cc-tile .l{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.65);white-space:nowrap;}
  .cc-tile b{font-family:'Roboto Mono',monospace;font-size:16px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;}
  .cc-tile.minus b{color:rgba(255,255,255,.85);}
  .cc-bar{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.18);overflow:hidden;margin-top:2px;}
  .cc-bar i{display:block;height:100%;background:#5fd4a0;border-radius:2px;}
  .cc-rate{font-size:10.5px;color:rgba(255,255,255,.65);}
}

/* Call Center needs a little more room than other tabs */
.content:has(#view-callcenter.show){max-width:1320px;}