/* Talentport Team Portal: NETWRK (netwrk.js) on the new desktop, the iPad and the iPhone look. Split out on 7 Oct 2026 (clean-up wave 3):
   one screen, one script and one stylesheet. */

/* ==== New desktop and iPad (html.tp-desk2) ==== */

/* ---- NETWRK (Business › NETWRK; public/netwrk.js, migration 0151) ----------------
   Mocks: design/network-portal/mocks.html frames 1-3 (Mac) and 7 (iPad). Owner
   only. The toolbar carries the tabs and the business; the page is a large
   sentence, numbers, then the work. */
@media (min-width: 769px) {
  html.tp-desk2 #view-netwrk { padding: 0; }
  html.tp-desk2 .nw { font: 400 var(--d2-t-13)/1.4 var(--d2-font); color: var(--d2-ink); padding: 22px 28px 40px; min-width: 0; }
  html.tp-desk2 .nw *, html.tp-desk2 .nw-tb * { box-sizing: border-box; }
  html.tp-desk2 .nw button, html.tp-desk2 .nw select, html.tp-desk2 .nw input { font: inherit; color: inherit; }
  html.tp-desk2 .nw-tb .d2-seg button.is-later { color: var(--d2-mute); }
  /* Voicemail and Patterns are placeholders in phase 1: they make room on narrower windows. */
  @media (max-width: 1520px) { html.tp-desk2 .nw-tb .d2-seg button.is-later { display: none; } }
  html.tp-desk2 .nw-mark { display: block; }
  html.tp-desk2 .d2-ico-mark svg { width: 20px; height: 20px; }
  /* toolbar */
  html.tp-desk2 .nw-tb { display: flex; align-items: center; gap: 10px; }
  html.tp-desk2 .nw-tb .d2-seg { margin: 0; }
  html.tp-desk2 .nw-count { display: inline-flex; min-width: 17px; height: 17px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--d2-y); color: var(--d2-ink); font: 700 var(--d2-t-11) var(--d2-font); line-height: 17px; justify-content: center; }
  html.tp-desk2 .nw-tenant { display: inline-flex; align-items: center; gap: 7px; height: var(--d2-btn-h); padding: 0 10px 0 4px; border-radius: var(--d2-radius); background: var(--d2-card); box-shadow: var(--d2-edge); font: 600 var(--d2-t-13) var(--d2-font); white-space: nowrap; }
  html.tp-desk2 .nw-tenant select { border: 0; background: transparent; font: 600 var(--d2-t-13) var(--d2-font); padding: 0 2px; cursor: pointer; }
  html.tp-desk2 .nw-tbadge { display: inline-flex; align-items: center; justify-content: center; width: auto; min-width: 22px; padding: 0 4px; flex: none; height: 20px; border-radius: 5px; background: var(--d2-ink); color: var(--d2-y); font: 800 var(--d2-t-11) var(--d2-font); letter-spacing: -.02em; }
  /* type */
  html.tp-desk2 .nw-kicker { margin: 0 0 4px; font: 500 var(--d2-t-12) var(--d2-font); color: var(--d2-mute); }
  html.tp-desk2 .nw-large { margin: 0; font: 700 var(--d2-t-26)/1.2 var(--d2-font); letter-spacing: -.01em; }
  html.tp-desk2 .nw-lede { margin: 6px 0 0; font-size: var(--d2-t-13); color: #4b4b46; max-width: 860px; }
  html.tp-desk2 .nw-mute { color: var(--d2-mute); }
  html.tp-desk2 .nw-sub { display: block; color: var(--d2-mute); font-size: var(--d2-t-12); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.tp-desk2 .nw-foot { margin: 10px 2px 0; font-size: var(--d2-t-12); color: var(--d2-mute); max-width: 900px; }
  html.tp-desk2 .nw-pad { padding: 14px 16px; margin: 0; }
  html.tp-desk2 .nw-grow { flex: 1 1 auto; }
  html.tp-desk2 .nw-num { font-variant-numeric: tabular-nums; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
  html.tp-desk2 .is-red { color: var(--d2-red); }
  html.tp-desk2 .is-amber { color: #A66F00; }
  /* cards, buttons */
  html.tp-desk2 .nw-card { background: var(--d2-card); border-radius: 12px; box-shadow: var(--d2-edge); margin-top: 12px; }
  html.tp-desk2 .nw-card-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px 6px; }
  html.tp-desk2 .nw-card-h h3 { margin: 0; font: 600 var(--d2-t-13) var(--d2-font); display: inline-flex; align-items: center; gap: 7px; }
  html.tp-desk2 .nw-card-h.nw-out { padding: 18px 4px 0; }
  html.tp-desk2 .nw-loading { padding: 28px; text-align: center; color: var(--d2-mute); }
  html.tp-desk2 .nw-btn { display: inline-flex; align-items: center; gap: 6px; height: var(--d2-btn-h); padding: 0 11px; border-radius: var(--d2-radius); border: 0; background: var(--d2-card); box-shadow: var(--d2-edge); cursor: pointer; white-space: nowrap; font-weight: 500; }
  html.tp-desk2 .nw-btn:hover:not(:disabled) { background: #FAFAF7; }
  html.tp-desk2 .nw-btn:disabled { opacity: .45; cursor: default; }
  html.tp-desk2 .nw-btn-y { background: var(--d2-y); box-shadow: var(--d2-edge-y); font-weight: 600; }
  html.tp-desk2 .nw-btn-y:hover:not(:disabled) { background: #EDBD00; }
  html.tp-desk2 .nw-btn-danger { color: var(--d2-red); }
  html.tp-desk2 .nw-btn.nw-icon { width: var(--d2-btn-h); padding: 0; justify-content: center; }
  html.tp-desk2 .nw-btnrow { display: inline-flex; gap: 8px; }
  html.tp-desk2 .nw-link { border: 0; background: none; padding: 0; color: #8A6A00; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 2px; }
  html.tp-desk2 .nw-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; flex: none; background: #B9B9B2; }
  html.tp-desk2 .nw-dot.is-green, html.tp-desk2 .nw-why-bar.is-green { background: var(--d2-green); }
  html.tp-desk2 .nw-dot.is-red, html.tp-desk2 .nw-why-bar.is-red { background: var(--d2-red); }
  html.tp-desk2 .nw-dot.is-amber, html.tp-desk2 .nw-why-bar.is-amber { background: var(--d2-amber); }
  html.tp-desk2 .nw-dot.is-blue, html.tp-desk2 .nw-why-bar.is-blue { background: #3A74D8; }
  html.tp-desk2 .nw-dot.is-grey, html.tp-desk2 .nw-why-bar.is-grey { background: #9B9B94; }
  html.tp-desk2 .nw-tag { display: inline-flex; height: 18px; align-items: center; padding: 0 6px; margin-left: 6px; border-radius: 5px; background: var(--d2-soft); font: 600 var(--d2-t-11) var(--d2-font); color: #55554F; }
  html.tp-desk2 .nw-rep { display: inline-flex; height: 17px; align-items: center; padding: 0 5px; margin-left: 4px; border-radius: 5px; background: var(--d2-pill); color: #6B5100; font: 700 var(--d2-t-11) var(--d2-font); }
  html.tp-desk2 .nw-banner { display: flex; align-items: center; gap: 10px; padding: 10px 14px; margin-bottom: 16px; border-radius: 10px; background: #FFF6D6; color: #5B4600; }
  html.tp-desk2 .nw-note { display: flex; gap: 7px; align-items: flex-start; margin: 12px 0 0; font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .nw-note svg { flex: none; margin-top: 1px; }
  html.tp-desk2 .nw-empty { text-align: center; padding: 40px 20px; color: var(--d2-mute); }
  html.tp-desk2 .nw-empty h3 { color: var(--d2-ink); margin: 12px 0 4px; font: 600 var(--d2-t-17) var(--d2-font); }
  html.tp-desk2 .nw-empty p { margin: 0 auto 14px; max-width: 520px; }
  html.tp-desk2 .nw-empty-ic { display: inline-flex; width: 48px; height: 48px; border-radius: 13px; background: #111; align-items: center; justify-content: center; }
  html.tp-desk2 .nw-empty-ic svg { width: 34px; height: 34px; }
  /* overview */
  html.tp-desk2 .nw-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 18px 0 6px; }
  html.tp-desk2 .nw-stat { padding: 2px 16px 2px 0; border-right: 1px solid var(--d2-line); margin-right: 16px; }
  html.tp-desk2 .nw-stat:last-child { border-right: 0; }
  html.tp-desk2 .nw-stat b { display: block; font: 700 var(--d2-t-26)/1.2 var(--d2-font); font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-stat span { color: var(--d2-mute); font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-stat em { font-style: normal; font-weight: 600; margin-left: 4px; }
  html.tp-desk2 .nw-stat em.is-up { color: var(--d2-green); }
  html.tp-desk2 .nw-stat em.is-down { color: var(--d2-red); }
  html.tp-desk2 .nw-cols { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(300px, 1fr); gap: 24px; align-items: start; margin-top: 6px; }
  html.tp-desk2 .nw-chart { display: block; width: 100%; height: auto; padding: 0 12px 10px; }
  html.tp-desk2 .nw-grid { stroke: var(--d2-line2); stroke-width: 1; }
  html.tp-desk2 .nw-axis { fill: var(--d2-mute); font-size: var(--d2-t-11); }
  html.tp-desk2 .nw-bar-c { fill: #111; }
  html.tp-desk2 .nw-bar-m { fill: #D8D8D1; }
  html.tp-desk2 .nw-bar-p { fill: var(--d2-y); }
  html.tp-desk2 .nw-bar-pm { fill: #F2E3A0; }
  html.tp-desk2 .nw-legend { display: inline-flex; gap: 12px; align-items: center; color: var(--d2-mute); font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: -6px; }
  html.tp-desk2 .nw-legend i.is-c { background: #111; }
  html.tp-desk2 .nw-legend i.is-m { background: #D8D8D1; }
  html.tp-desk2 .nw-legend i.is-p { background: var(--d2-y); }
  html.tp-desk2 .nw-why { padding-bottom: 10px; }
  html.tp-desk2 .nw-why-row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 40px; gap: 12px; align-items: center; padding: 6px 16px; }
  html.tp-desk2 .nw-why-row b { text-align: right; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-why-track { height: 6px; border-radius: 3px; background: var(--d2-line2); overflow: hidden; }
  html.tp-desk2 .nw-why-bar { display: block; height: 100%; border-radius: 3px; }
  html.tp-desk2 .nw-flist { overflow: hidden; margin-top: 8px; }
  html.tp-desk2 .nw-frow { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 14px; border: 0; border-top: 1px solid var(--d2-line2); background: none; text-align: left; cursor: pointer; }
  html.tp-desk2 .nw-frow:first-child { border-top: 0; }
  html.tp-desk2 .nw-frow:hover { background: #FAFAF6; }
  html.tp-desk2 .nw-fmain { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
  html.tp-desk2 .nw-ficon { flex: none; width: 34px; height: 34px; border-radius: 9px; background: #FCE9E7; color: var(--d2-red); display: inline-flex; align-items: center; justify-content: center; }
  html.tp-desk2 .nw-ficon.is-ok { background: #E4F5EA; color: var(--d2-green); }
  html.tp-desk2 .nw-chev { color: #A8A8A1; display: inline-flex; }
  html.tp-desk2 .nw-holly { padding-bottom: 6px; }
  html.tp-desk2 .nw-holly-ic { display: inline-flex; width: 22px; height: 22px; border-radius: 6px; background: var(--d2-y); align-items: center; justify-content: center; }
  html.tp-desk2 .nw-ins { display: flex; gap: 12px; padding: 10px 16px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-card-h + .nw-ins { border-top: 0; }
  html.tp-desk2 .nw-ins-ic { flex: none; width: 26px; height: 26px; border-radius: 7px; background: #FFF4B9; color: #6B5100; display: inline-flex; align-items: center; justify-content: center; }
  html.tp-desk2 .nw-ins b { font-weight: 600; }
  html.tp-desk2 .nw-ins p { margin: 3px 0 0; color: #4b4b46; }
  html.tp-desk2 .nw-ins p.nw-try { color: #8A6A00; }
  /* calls */
  html.tp-desk2 .nw-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  html.tp-desk2 .nw-pop { height: var(--d2-btn-h); border: 0; border-radius: var(--d2-radius); background: var(--d2-card); box-shadow: var(--d2-edge); padding: 0 8px; cursor: pointer; }
  html.tp-desk2 .nw-search { display: inline-flex; align-items: center; gap: 6px; height: var(--d2-btn-h); padding: 0 9px; border-radius: var(--d2-radius); background: #E9E9E2; color: var(--d2-mute); }
  html.tp-desk2 .nw-search input { border: 0; background: transparent; width: 120px; outline: none; color: var(--d2-ink); }
  html.tp-desk2 .nw-split { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
  html.tp-desk2 .nw-main { min-width: 0; }
  html.tp-desk2 .nw-table { overflow: hidden; }
  html.tp-desk2 .nw-tr { display: grid; grid-template-columns: 82px 66px minmax(90px, 1fr) 122px minmax(150px, 1.6fr) 50px 72px 74px; gap: 8px; align-items: center; padding: 0 14px; min-height: 36px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-th { min-height: 30px; border-top: 0; color: var(--d2-mute); font: 500 var(--d2-t-12) var(--d2-font); }
  html.tp-desk2 .nw-row { cursor: pointer; }
  html.tp-desk2 .nw-row:hover { background: #FAFAF6; }
  html.tp-desk2 .nw-row.is-sel { background: #FFF4C2; }
  html.tp-desk2 .nw-r { text-align: right; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-oc { display: inline-flex; align-items: center; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.tp-desk2 .nw-recic { color: #A8A8A1; }
  html.tp-desk2 .nw-insp { position: sticky; top: 12px; background: var(--d2-card); border-radius: 12px; box-shadow: var(--d2-edge); padding: 16px; margin-top: 12px; min-height: 200px; }
  html.tp-desk2 .nw-insp-hd { display: flex; gap: 12px; align-items: center; }
  html.tp-desk2 .nw-insp-hd h3 { margin: 0; font: 700 var(--d2-t-17) var(--d2-font); }
  html.tp-desk2 .nw-insp-hd p { margin: 2px 0 0; font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-verdict { margin: 14px 0 4px; padding: 10px 12px; border-radius: 10px; }
  html.tp-desk2 .nw-verdict.is-bad { background: #FDECEA; }
  html.tp-desk2 .nw-verdict.is-bad b { color: #B4271D; }
  html.tp-desk2 .nw-verdict.is-ok { background: #E9F6EE; }
  html.tp-desk2 .nw-verdict.is-ok b { color: #17753A; }
  html.tp-desk2 .nw-verdict p { margin: 4px 0 0; }
  html.tp-desk2 .nw-h4 { margin: 16px 0 6px; font: 600 var(--d2-t-12) var(--d2-font); color: var(--d2-mute); }
  html.tp-desk2 .nw-journey { list-style: none; margin: 0; padding: 0 0 0 4px; }
  html.tp-desk2 .nw-journey li { position: relative; padding: 0 0 12px 22px; display: flex; flex-direction: column; }
  html.tp-desk2 .nw-journey li::before { content: ""; position: absolute; left: 0; top: 3px; width: 8px; height: 8px; border-radius: 50%; border: 2px solid #111; background: #fff; }
  html.tp-desk2 .nw-journey li:not(:last-child)::after { content: ""; position: absolute; left: 5px; top: 15px; bottom: 0; width: 2px; background: var(--d2-line); }
  html.tp-desk2 .nw-journey li.is-end::before { background: var(--d2-red); border-color: var(--d2-red); }
  html.tp-desk2 .nw-journey li.is-ok::before { background: var(--d2-green); border-color: var(--d2-green); }
  html.tp-desk2 .nw-journey span { color: var(--d2-mute); font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-kv { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-kv span { color: var(--d2-mute); }
  html.tp-desk2 .nw-kv b { font-weight: 500; text-align: right; display: inline-flex; align-items: center; gap: 4px; justify-content: flex-end; }
  html.tp-desk2 .nw-insp-ft { display: flex; gap: 8px; align-items: center; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--d2-line); flex-wrap: wrap; }
  /* missed */
  html.tp-desk2 .nw-mhead { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
  html.tp-desk2 .nw-mhead .d2-seg { margin: 0; }
  html.tp-desk2 .nw-mlist { overflow: visible; }
  html.tp-desk2 .nw-mrow { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-mrow:first-child { border-top: 0; }
  html.tp-desk2 .nw-mrow.is-flash { background: #FFF8DA; }
  html.tp-desk2 .nw-tried { color: #8A6A00; font-weight: 600; }
  html.tp-desk2 .nw-age { color: var(--d2-mute); font-size: var(--d2-t-12); min-width: 34px; text-align: right; }
  html.tp-desk2 .nw-menu { position: relative; }
  html.tp-desk2 .nw-pop-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; display: flex; flex-direction: column; min-width: 210px; padding: 5px; border-radius: 10px; background: #fff; box-shadow: var(--d2-shadow); }
  html.tp-desk2 .nw-pop-menu button { display: flex; align-items: center; gap: 8px; border: 0; background: none; padding: 7px 10px; border-radius: 6px; text-align: left; cursor: pointer; }
  html.tp-desk2 .nw-pop-menu button:hover { background: var(--d2-y); }
  html.tp-desk2 .nw-funnel { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 14px 16px; gap: 12px; }
  html.tp-desk2 .nw-funnel b { display: block; font: 700 var(--d2-t-26)/1.2 var(--d2-font); font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-funnel span { color: var(--d2-mute); font-size: var(--d2-t-12); }
  /* setup */
  html.tp-desk2 .nw-setup { padding-bottom: 14px; }
  html.tp-desk2 .nw-setup .nw-kv, html.tp-desk2 .nw-setup .nw-lede { margin-left: 16px; margin-right: 16px; }
  html.tp-desk2 .nw-keyform { display: flex; gap: 8px; margin: 12px 16px 0; }
  html.tp-desk2 .nw-keyform input { flex: 1 1 auto; min-width: 0; height: var(--d2-btn-h); border: 0; border-radius: var(--d2-radius); background: #F1F1EB; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .12); padding: 0 10px; outline: none; }
  html.tp-desk2 .nw-setup .nw-note { margin-left: 16px; margin-right: 16px; }
  html.tp-desk2 .nw-card > p { margin: 4px 16px 12px; }
  html.tp-desk2 .nw-gaps { margin: 4px 0 14px; padding: 0 16px 0 32px; }
  html.tp-desk2 .nw-gaps li { margin: 0 0 8px; color: #4b4b46; }
  html.tp-desk2 .nw-gaps b { color: var(--d2-ink); font-weight: 600; }
  /* NETWRK GP (0165): the Gross profit card, All businesses summary, Setup › Costs */
  html.tp-desk2 .nw-gp .nw-kicker.nw-pad0 { margin: 0 16px 6px; }
  html.tp-desk2 .nw-gp-t .nw-gp-total { font-weight: 600; box-shadow: inset 0 .5px 0 rgba(0, 0, 0, .18); }
  html.tp-desk2 .nw-gpnotes { margin: 10px 0 8px; padding: 0 16px 0 30px; font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .nw-gpnotes li { margin: 0 0 4px; }
  html.tp-desk2 .nw-gpdrv { margin: 8px 16px 0; }
  html.tp-desk2 .nw-gpdrv summary { cursor: pointer; color: var(--d2-mute); font-size: var(--d2-t-12); margin-bottom: 6px; }
  html.tp-desk2 .nw-gpform { border-top: .5px solid rgba(0, 0, 0, .1); margin-top: 6px; padding-top: 12px; }
  html.tp-desk2 .nw-gpform label { grid-template-columns: 190px minmax(0, 1fr); }
  html.tp-desk2 .nw-gpform input[type="checkbox"] { justify-self: start; height: auto; box-shadow: none; }
  html.tp-desk2 .nw-costs .nw-sub { white-space: normal; }
  html.tp-desk2 .nw-gpsub { font-size: var(--d2-t-11); }
  html.tp-desk2 .nw-costs .nw-kv { padding-left: 16px; padding-right: 16px; }
  html.tp-desk2 .nw-gp .nw-gpseg { margin: 0 16px 10px; }
  html.tp-desk2 .nw-gpdrv .nw-t2 { margin: 0; }
  html.tp-desk2 .nw-soonpage { margin-top: 0; }
  @media (max-width: 1180px) {
    html.tp-desk2 .nw-cols { grid-template-columns: minmax(0, 1fr); }
    html.tp-desk2 .nw-split { grid-template-columns: minmax(0, 1fr) 300px; }

  }
}
/* NETWRK on the iPad: 44pt targets, list and inspector side by side. */
@media (min-width: 769px) {
  html.tp-ipad.tp-desk2 .nw { padding: 18px 22px 40px; }
  html.tp-ipad.tp-desk2 .nw-tb-ipad { margin: 0 0 16px; }
  html.tp-ipad.tp-desk2 .nw-tb .d2-seg button { height: 44px; padding: 0 16px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-tb .d2-seg button.is-later { display: inline-flex; align-items: center; }
  html.tp-ipad.tp-desk2 .nw-btn, html.tp-ipad.tp-desk2 .nw-pop, html.tp-ipad.tp-desk2 .nw-search, html.tp-ipad.tp-desk2 .nw-tenant { height: 44px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-btn.nw-icon { width: 44px; }
  html.tp-ipad.tp-desk2 .nw-tr { min-height: 44px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-frow, html.tp-ipad.tp-desk2 .nw-mrow { min-height: 56px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-cols { grid-template-columns: minmax(0, 1fr); }
  html.tp-ipad.tp-desk2 .nw-split { grid-template-columns: minmax(0, 1fr) 320px; }
  html.tp-ipad.tp-desk2 .nw-mp { height: 34px; padding: 0 12px 0 10px; border-radius: 17px; }
}

/* ---- NETWRK N2 (migration 0152): Inbound, Outbound, People, Patterns, All businesses,
   the business switcher, Add a business, the hours editor, names, export. Same type
   scale and controls as the rest of desk2. */
@media (min-width: 769px) {
  html.tp-desk2 .nw-tb { min-width: 0; }
  /* Nine tabs and the switcher: the slot may shrink (the tabs then scroll), tighter tabs, and the
     switcher keeps only its badge on narrower windows. */
  html.tp-desk2 #d2-topbar:has(.nw-tb) .d2-tbslot { flex: 0 1 auto; }
  html.tp-desk2 .d2-tbslot .nw-tb .d2-seg button { padding: 0 10px; }
  /* Up to 1700px wide the toolbar has no room for nine tabs: netwrk.js puts them at the top of
     the page (like the iPad) and the toolbar keeps the business switcher. */
  html.tp-desk2 .nw-tb-page { margin: 0 0 16px; }
  html.tp-desk2 .nw-tb-page .d2-seg button.is-later { display: inline-flex; align-items: center; }
  html.tp-desk2 .nw-tb .d2-seg { flex: 0 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
  html.tp-desk2 .nw-tb .d2-seg::-webkit-scrollbar { display: none; }
  html.tp-desk2 .nw-fbar { margin-bottom: 18px; }
  html.tp-desk2 .nw-date { width: 136px; }
  html.tp-desk2 .nw-small { font-size: var(--d2-t-12); margin-left: 6px; }
  html.tp-desk2 .nw-pad0 { margin: 8px 16px 12px; }
  html.tp-desk2 .is-green { color: var(--d2-green); }
  /* KPI tiles: two rows of four */
  html.tp-desk2 .nw-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0 4px; }
  html.tp-desk2 .nw-kpi { background: var(--d2-card); border-radius: 12px; box-shadow: var(--d2-edge); padding: 12px 14px; min-width: 0; }
  html.tp-desk2 .nw-kpi b { display: block; font: 700 var(--d2-t-26)/1.15 var(--d2-font); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.tp-desk2 .nw-kpi span { display: block; color: #4b4b46; font-size: var(--d2-t-12); margin-top: 2px; }
  html.tp-desk2 .nw-kpi em { display: block; font-style: normal; color: var(--d2-mute); font-size: var(--d2-t-11); margin-top: 1px; }
  html.tp-desk2 .nw-cols-even { grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); }
  html.tp-desk2 .nw-cols-half { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
  /* tables */
  /* Each table is its own size container: optional columns (nw-o1..3, see table() in
     netwrk.js) fold to zero width as the table narrows, so it always fits its card. */
  html.tp-desk2 .nw-t2 { overflow-x: auto; padding-bottom: 4px; container-type: inline-size; }
  @container (max-width: 1039px) { html.tp-desk2 .nw-t2r { --nw-o1: 0; } html.tp-desk2 .nw-t2r > .nw-o1 { visibility: hidden; } }
  @container (max-width: 759px) { html.tp-desk2 .nw-t2r { --nw-o2: 0; } html.tp-desk2 .nw-t2r > .nw-o2 { visibility: hidden; } }
  @container (max-width: 599px) { html.tp-desk2 .nw-t2r { --nw-o3: 0; } html.tp-desk2 .nw-t2r > .nw-o3 { visibility: hidden; } }
  html.tp-desk2 .nw-t2r { display: grid; gap: 8px; align-items: center; padding: 0 16px; min-height: 36px; border-top: 1px solid var(--d2-line2); min-width: 0; }
  html.tp-desk2 .nw-t2r > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-t2h { min-height: 30px; border-top: 0; color: var(--d2-mute); font: 500 var(--d2-t-12) var(--d2-font); }
  html.tp-desk2 .nw-t2r.nw-click { cursor: pointer; }
  html.tp-desk2 .nw-t2r.nw-click:hover { background: #FAFAF6; }
  html.tp-desk2 .nw-t2r.is-sel { background: #FFF4C2; }
  html.tp-desk2 .nw-t2r b { font-weight: 600; }
  html.tp-desk2 .nw-rate { display: inline-block; width: 52px; height: 6px; border-radius: 3px; background: var(--d2-line2); overflow: hidden; vertical-align: middle; margin-right: 8px; }
  html.tp-desk2 .nw-rate i { display: block; height: 100%; border-radius: 3px; background: var(--d2-green); }
  html.tp-desk2 .nw-rate i.is-mid { background: var(--d2-amber); }
  html.tp-desk2 .nw-rate i.is-bad { background: var(--d2-red); }
  html.tp-desk2 .nw-pager { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 10px 16px 12px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-split-in { margin-top: 0; }
  /* routes */
  html.tp-desk2 .nw-routes { padding-bottom: 8px; }
  html.tp-desk2 .nw-route { padding: 6px 16px 4px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-card-h + .nw-route { border-top: 0; }
  html.tp-desk2 .nw-route-h { display: flex; justify-content: space-between; gap: 10px; margin: 4px 0 6px; }
  html.tp-desk2 .nw-route-b { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(60px, 1fr) 40px; gap: 10px; align-items: center; padding: 3px 0; }
  html.tp-desk2 .nw-route-b b { text-align: right; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-route .nw-foot { margin: 6px 0 6px; }
  html.tp-desk2 .nw-tag-inf { background: #EEE8FB; color: #5B3FA8; }
  html.tp-desk2 .nw-honest { display: flex; gap: 12px; padding: 14px 16px; }
  html.tp-desk2 .nw-honest p { margin: 3px 0 0; color: #4b4b46; }
  html.tp-desk2 .nw-labelform { display: inline-flex; gap: 6px; align-items: center; }
  html.tp-desk2 .nw-labelform input, html.tp-desk2 .nw-name-r input, html.tp-desk2 .nw-form input { height: var(--d2-btn-h); border: 0; border-radius: var(--d2-radius); background: #F1F1EB; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .12); padding: 0 10px; outline: none; min-width: 0; }
  html.tp-desk2 .nw-labelform input { width: 170px; }
  /* charts */
  html.tp-desk2 .nw-line { stroke: #111; stroke-width: 2; }
  html.tp-desk2 .nw-pt { fill: #111; }
  html.tp-desk2 .nw-pt-bad { fill: var(--d2-red); }
  html.tp-desk2 .nw-axis-bad { fill: var(--d2-red); font-weight: 700; }
  html.tp-desk2 .nw-months { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; padding: 6px 16px 14px; }
  html.tp-desk2 .nw-month { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
  html.tp-desk2 .nw-month-track { display: flex; align-items: flex-end; width: 100%; max-width: 30px; height: 96px; border-radius: 4px; background: var(--d2-line2); overflow: hidden; }
  html.tp-desk2 .nw-month-track i { display: block; width: 100%; background: #111; border-radius: 4px; }
  html.tp-desk2 .nw-month-track i.is-y { background: var(--d2-y); }
  html.tp-desk2 .nw-month b { font: 700 var(--d2-t-11) var(--d2-font); font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw-month > span:last-child { color: var(--d2-mute); font-size: var(--d2-t-11); }
  /* heatmap */
  html.tp-desk2 .nw-heat { display: grid; gap: 4px; align-items: center; }
  html.tp-desk2 .nw-heat-h { text-align: center; color: var(--d2-mute); font-size: var(--d2-t-11); }
  html.tp-desk2 .nw-heat-d { color: #4b4b46; font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-hm { display: flex; align-items: center; justify-content: center; height: 32px; border-radius: 6px; font: 600 var(--d2-t-11) var(--d2-font); font-variant-numeric: tabular-nums; color: #3a3a36; min-width: 0; overflow: hidden; }
  html.tp-desk2 .nw-hm-e { background: #F4F4EF; }
  html.tp-desk2 .nw-hm-x { background: #ECECE5; color: #8b8b84; }
  html.tp-desk2 .nw-hm-0 { background: #DDF1E3; color: #17643A; }
  html.tp-desk2 .nw-hm-1 { background: #FCEFC9; color: #7A5A00; }
  html.tp-desk2 .nw-hm-2 { background: #F8D2B4; color: #8A3E0B; }
  html.tp-desk2 .nw-hm-3 { background: #F2A39C; color: #7D1710; }
  html.tp-desk2 .nw-heat-key { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; color: var(--d2-mute); font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-heat-key i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
  /* All businesses */
  html.tp-desk2 .nw-pill { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 10px; font: 600 var(--d2-t-12) var(--d2-font); }
  html.tp-desk2 .nw-pill.is-green { background: #DDF1E3; color: #17643A; }
  html.tp-desk2 .nw-pill.is-grey { background: var(--d2-soft); color: #5d5d57; }
  html.tp-desk2 .nw-pill.is-amber { background: #FCEFC9; color: #7A5A00; }
  html.tp-desk2 .nw-pill.is-red { background: #FCE2DF; color: #9C2219; }
  html.tp-desk2 .nw-tbadge.is-off { background: var(--d2-soft); color: #6d6d67; }
  html.tp-desk2 .nw-tbadge.is-all { background: transparent; color: var(--d2-ink); }
  html.tp-desk2 .nw-bizname { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
  html.tp-desk2 .nw-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; padding: 16px; }
  html.tp-desk2 .nw-steps div { display: flex; gap: 10px; }
  html.tp-desk2 .nw-steps i { flex: none; display: inline-flex; width: 22px; height: 22px; border-radius: 50%; background: #111; color: #fff; font: 700 var(--d2-t-12) var(--d2-font); font-style: normal; align-items: center; justify-content: center; }
  html.tp-desk2 .nw-steps p { margin: 1px 0 0; color: #4b4b46; }
  /* switcher */
  html.tp-desk2 .nw-switch { border: 0; cursor: pointer; max-width: 240px; }
  html.tp-desk2 .nw-switch-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  html.tp-desk2 .nw-sw { min-width: 290px; max-height: 70vh; overflow-y: auto; }
  html.tp-desk2 .nw-sw-h { padding: 8px 10px 4px; color: var(--d2-mute); font: 600 var(--d2-t-11) var(--d2-font); }
  html.tp-desk2 .nw-pop-menu .nw-sw-row { gap: 9px; }
  html.tp-desk2 .nw-pop-menu .nw-sw-row.is-on { background: #FFF4C2; }
  html.tp-desk2 .nw-sw-sep { display: block; height: 1px; margin: 5px 6px; background: var(--d2-line); }
  /* forms, sheet, hours */
  html.tp-desk2 .nw-sheet-bg { position: fixed; inset: 0; z-index: 900; background: rgba(20, 20, 18, .28); }
  html.tp-desk2 .nw-sheet { position: fixed; z-index: 901; top: 8vh; left: 50%; transform: translateX(-50%); width: min(560px, calc(100vw - 32px)); max-height: 84vh; overflow-y: auto; background: var(--d2-card); border-radius: 14px; box-shadow: var(--d2-shadow); }
  html.tp-desk2 .nw-sheet-h { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 6px; }
  html.tp-desk2 .nw-sheet-h h3 { margin: 0; font: 700 var(--d2-t-17) var(--d2-font); }
  html.tp-desk2 .nw-sheet-f { display: flex; align-items: center; gap: 8px; padding: 12px 16px 14px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-sheet-f.nw-inline { border-top: 0; padding-top: 6px; }
  html.tp-desk2 .nw-form { display: flex; flex-direction: column; gap: 10px; padding: 6px 16px 10px; }
  html.tp-desk2 .nw-form label, html.tp-desk2 .nw-formrow { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; align-items: center; }
  html.tp-desk2 .nw-form label > span, html.tp-desk2 .nw-formrow > span:first-child { color: #4b4b46; }
  html.tp-desk2 .nw-formrow.nw-formcol { display: block; }
  html.tp-desk2 .nw-formcol > span:first-child { display: block; margin-bottom: 6px; }
  html.tp-desk2 .nw-form label.nw-check { display: inline-flex; grid-template-columns: none; }
  html.tp-desk2 .nw-formcol .nw-week { padding: 0; }
  html.tp-desk2 .nw-formrow .d2-seg { margin: 0; justify-self: start; }
  html.tp-desk2 .nw-week { display: flex; flex-direction: column; gap: 4px; padding: 4px 16px 0; }
  html.tp-desk2 .nw-week-r { display: grid; grid-template-columns: 130px 112px 20px 112px; gap: 8px; align-items: center; min-height: 32px; }
  html.tp-desk2 .nw-week-r.is-closed > .nw-mute { grid-column: 2 / span 3; }
  html.tp-desk2 .nw-week-r .nw-pop { width: 112px; }
  html.tp-desk2 .nw-check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
  html.tp-desk2 .nw-check input { width: 16px; height: 16px; accent-color: #111; }
  html.tp-desk2 .nw-name-r { display: grid; grid-template-columns: minmax(0, 1fr) minmax(140px, 1fr) auto; gap: 8px; align-items: center; padding: 8px 16px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-card-h + .nw-name-r { border-top: 0; }
  html.tp-desk2 .nw-names { padding-bottom: 6px; }
  @media (max-width: 1180px) {
    html.tp-desk2 .nw-cols-even, html.tp-desk2 .nw-cols-half { grid-template-columns: minmax(0, 1fr); }
    html.tp-desk2 .nw-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html.tp-desk2 .nw-steps { grid-template-columns: minmax(0, 1fr); }
  }
}
/* N2 on the iPad: 44pt controls, tabs scroll sideways, one column. */
@media (min-width: 769px) {
  html.tp-ipad.tp-desk2 .nw-tb-ipad { flex-wrap: wrap; }
  html.tp-ipad.tp-desk2 .nw-tb-ipad .d2-seg { max-width: 100%; }
  html.tp-ipad.tp-desk2 .nw-tb .d2-seg button { padding: 0 13px; }
  html.tp-ipad.tp-desk2 .nw-t2r { min-height: 44px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-cols-even, html.tp-ipad.tp-desk2 .nw-cols-half { grid-template-columns: minmax(0, 1fr); }
  html.tp-ipad.tp-desk2 .nw-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html.tp-ipad.tp-desk2 .nw-date, html.tp-ipad.tp-desk2 .nw-week-r .nw-pop, html.tp-ipad.tp-desk2 .nw-form input, html.tp-ipad.tp-desk2 .nw-name-r input { height: 44px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-pop-menu button { min-height: 44px; }
  html.tp-ipad.tp-desk2 .nw-hm { height: 38px; }
  html.tp-ipad.tp-desk2 .nw-split-in { grid-template-columns: minmax(0, 1fr); }
  html.tp-ipad.tp-desk2 .nw-split-in .nw-insp { display: none; }
}

/* ---- NETWRK N3 (migration 0153): listening, transcripts and voicemail (mocks.html
   "listen" frames). Components are in styles.css (.nw .nw-pl, .nw-tx, ...). */
@media (min-width: 769px) {
  /* the shared components (the iPhone's copy is in styles.css) */
  html.tp-desk2 .nw .nw-tt { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: var(--d2-t-12); font-weight: 600; white-space: nowrap; background: #EEEEE8; color: #55554F; }
  html.tp-desk2 .nw .nw-tt.is-conv { background: #E6EEFB; color: #2B5BB0; }
  html.tp-desk2 .nw .nw-tt.is-vm { background: #EFE7FB; color: #6A3FB5; }
  html.tp-desk2 .nw .nw-tt.is-menu { background: #EEEEE8; color: #5D5D57; }
  /* rules3 (0167): self-served types */
  html.tp-desk2 .nw .nw-tt.is-ah { background: #E3EEF0; color: #2F6470; }
  html.tp-desk2 .nw .nw-tt.is-info { background: #E8F3E6; color: #3B6B2F; }
  html.tp-desk2 .nw-why-bar.is-ah { background: #6FA3AE; }
  html.tp-desk2 .nw-why-bar.is-info { background: #8DBE7F; }
  html.tp-desk2 .nw-why-self { border-top: 1px solid rgba(0,0,0,.06); margin-top: 6px; padding-top: 6px; }
  html.tp-desk2 .nw-why-self > .nw-mute { display: block; padding: 2px 16px; font-size: var(--d2-t-12); }
  html.tp-desk2 .nw .nw-tt.is-pend { background: #FFF6D6; color: #7A5D00; font-weight: 500; }
  html.tp-desk2 .nw .nw-tt.is-none { background: transparent; color: #9A9A93; font-weight: 500; padding: 0; }
  html.tp-desk2 .nw .nw-mp { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 9px 0 7px; border: 0; border-radius: 12px; background: #EFEFE9; color: #1A1A18; font-size: var(--d2-t-12); font-weight: 600; font-variant-numeric: tabular-nums; cursor: pointer; white-space: nowrap; }
  html.tp-desk2 .nw .nw-mp:hover { background: #E4E4DD; }
  html.tp-desk2 .nw .nw-mp.is-new { background: #F5C500; }
  html.tp-desk2 .nw .nw-mp.is-new:hover { background: #EBBC00; }
  html.tp-desk2 .nw .nw-mp.is-on { background: #111; color: #fff; }
  html.tp-desk2 .nw .nw-mp.is-off { background: transparent; color: #A8A8A1; cursor: default; padding: 0 4px; }
  html.tp-desk2 .nw .nw-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 12px 0 0; }
  html.tp-desk2 .nw .nw-op { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: var(--d2-t-12); font-weight: 600; background: #EEEEE8; color: #55554F; }
  html.tp-desk2 .nw .nw-op.is-green { background: #E4F5EA; color: #17753A; }
  html.tp-desk2 .nw .nw-op.is-red { background: #FCE9E7; color: #B4271D; }
  html.tp-desk2 .nw .nw-op.is-amber { background: #FDF0DA; color: #8A5A00; }
  html.tp-desk2 .nw .nw-op.is-blue { background: #E6EEFB; color: #2B5BB0; }
  html.tp-desk2 .nw .nw-chip { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 10px; font-size: var(--d2-t-12); font-weight: 600; white-space: nowrap; background: #FCE9E7; color: #B4271D; }
  html.tp-desk2 .nw .nw-chip.is-tried { background: #FFF4C2; color: #7A5D00; }
  html.tp-desk2 .nw .nw-chip.is-called, html.tp-desk2 .nw .nw-chip.is-not_needed { background: #E4F5EA; color: #17753A; }
  html.tp-desk2 .nw .nw-sum { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: #FFFBEA; }
  html.tp-desk2 .nw .nw-sum p { margin: 0; color: #2B2B28; }
  html.tp-desk2 .nw .nw-sum-ic { flex: none; display: inline-flex; width: 20px; height: 20px; border-radius: 6px; background: #F5C500; align-items: center; justify-content: center; }
  html.tp-desk2 .nw .nw-sum-ic svg { width: 13px; height: 13px; }
  html.tp-desk2 .nw .nw-pl { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 8px 10px; border-radius: 12px; background: #F4F4EF; }
  html.tp-desk2 .nw .nw-pl-b { flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #111; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
  html.tp-desk2 .nw .nw-pl.is-loading .nw-pl-b { opacity: .55; }
  html.tp-desk2 .nw .nw-pl-m { flex: 1 1 auto; min-width: 0; }
  html.tp-desk2 .nw .nw-pl-track { position: relative; height: 28px; cursor: pointer; outline-offset: 2px; }
  html.tp-desk2 .nw .nw-wv { position: absolute; inset: 0; display: flex; align-items: center; gap: 2px; }
  html.tp-desk2 .nw .nw-wv i { flex: 1 1 0; min-width: 1px; border-radius: 1px; background: #C9C9C1; }
  html.tp-desk2 .nw .nw-wv i.is-flat { height: 3px; background: #D6D6CF; }
  html.tp-desk2 .nw .nw-wv i.is-p { background: #111; }
  html.tp-desk2 .nw .nw-pl-line { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: transparent; }
  html.tp-desk2 .nw .nw-pl-prog { display: block; height: 2px; width: 0; background: #F5C500; }
  html.tp-desk2 .nw .nw-pl-t { display: flex; justify-content: space-between; gap: 8px; margin-top: 2px; font-size: var(--d2-t-11); color: #73736D; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw .nw-pl-t .is-red { color: #B4271D; }
  html.tp-desk2 .nw .nw-pl-s { flex: none; height: 26px; min-width: 38px; border: 0; border-radius: 13px; background: #fff; box-shadow: 0 0 0 .5px rgba(0,0,0,.14); font-size: var(--d2-t-12); font-weight: 600; cursor: pointer; }
  html.tp-desk2 .nw .nw-pl.is-big { padding: 12px; }
  html.tp-desk2 .nw .nw-pl.is-big .nw-pl-b { width: 48px; height: 48px; }
  html.tp-desk2 .nw .nw-pl.is-big .nw-pl-track { height: 38px; }
  html.tp-desk2 .nw .nw-tx { display: flex; flex-direction: column; gap: 1px; max-height: 340px; overflow: auto; margin: 0 -6px; position: relative; }
  html.tp-desk2 .nw .nw-tx.is-compact { max-height: 220px; }
  html.tp-desk2 .nw .nw-txl { display: grid; grid-template-columns: 38px 52px minmax(0, 1fr); gap: 6px; align-items: baseline; width: 100%; padding: 5px 6px; border: 0; border-radius: 8px; background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; }
  html.tp-desk2 .nw .nw-txl:hover { background: #F6F6F1; }
  html.tp-desk2 .nw .nw-txl.is-cur { background: #FFF4C2; }
  html.tp-desk2 .nw .nw-ts { font-size: var(--d2-t-12); color: #8A8A83; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .nw .nw-sp { font-size: var(--d2-t-12); font-weight: 600; color: #8A8A83; }
  html.tp-desk2 .nw .nw-sp.is-caller { color: #2B5BB0; }
  html.tp-desk2 .nw .nw-sp.is-team { color: #17753A; }
  html.tp-desk2 .nw .nw-sp.is-menu { color: #8A8A83; font-weight: 500; }
  html.tp-desk2 .nw .nw-txt { white-space: pre-wrap; overflow-wrap: anywhere; }
  html.tp-desk2 .nw .nw-txnote { margin: 10px 0 0; }
  html.tp-desk2 .nw .nw-txfoot { display: flex; gap: 6px; align-items: flex-start; }
  html.tp-desk2 .nw .nw-txfoot svg { flex: none; margin-top: 1px; width: 13px; height: 13px; }
  html.tp-desk2 .nw .nw-jline { display: flex; gap: 6px; align-items: center; margin: 12px 0 0; font-size: var(--d2-t-12); color: #73736D; }
  html.tp-desk2 .nw .nw-jline svg { flex: none; width: 14px; height: 14px; }
  html.tp-desk2 .nw .nw-ficon.is-vm { background: #EFE7FB; color: #6A3FB5; }
  html.tp-desk2 .nw .nw-unh { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #F5C500; box-shadow: 0 0 0 2px #FFF4C2; }
  html.tp-desk2 .nw .nw-unh.is-heard { background: transparent; box-shadow: none; }
  html.tp-desk2 .nw .nw-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
  html.tp-desk2 .nw .nw-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #111; flex: none; }
  html.tp-desk2 .nw .nw-check span { display: flex; flex-direction: column; gap: 2px; }
  html.tp-desk2 .nw .nw-check small { color: #5D5D57; font-size: var(--d2-t-12); }
  html.tp-desk2 .nw .nw-note.is-amber { color: #7A5D00; }
  html.tp-desk2 #nw-root button.nw-pl-b { color: #fff; }
  html.tp-desk2 #nw-root button.nw-mp.is-on { color: #fff; }
  html.tp-desk2 #nw-root button.nw-mp { color: #1A1A18; }
  html.tp-desk2 #nw-root button.nw-mp.is-on { color: #fff; }
  html.tp-desk2 .nw-tcell { min-width: 0; overflow: hidden; }
  html.tp-desk2 .nw-lcell { display: flex; justify-content: flex-end; }
  html.tp-desk2 .nw-tsearch input { width: 150px; }
  html.tp-desk2 .nw-insp.is-listen .nw-tx { max-height: 360px; }
  /* The Calls table folds to fit its pane (N3 added Type and Listen): Menu goes
     first, then Connected, then Time. */
  html.tp-desk2 .nw-split > .nw-main { container-type: inline-size; }
  @container (max-width: 899px) { html.tp-desk2 .nw-oc .nw-tag { display: none; } }
  @container (max-width: 799px) { html.tp-desk2 .nw-tr { grid-template-columns: 80px 62px minmax(80px, 1fr) 116px minmax(120px, 1.4fr) 70px 78px; } html.tp-desk2 .nw-tr > :nth-child(6) { display: none; } }
  @container (max-width: 689px) { html.tp-desk2 .nw-tr { grid-template-columns: 78px 60px minmax(70px, 1fr) 112px minmax(110px, 1.3fr) 78px; } html.tp-desk2 .nw-tr > :nth-child(7) { display: none; } }
  @container (max-width: 569px) { html.tp-desk2 .nw-tr { grid-template-columns: 76px minmax(70px, 1fr) 108px minmax(90px, 1.2fr) 78px; } html.tp-desk2 .nw-tr > :nth-child(2) { display: none; } }
  @container (max-width: 469px) { html.tp-desk2 .nw-tr { grid-template-columns: 64px minmax(56px, 1fr) 104px 74px; padding: 0 10px; gap: 6px; } html.tp-desk2 .nw-tr > :nth-child(5) { display: none; } }
  /* Missed: type, play, and the row that opens in place */
  html.tp-desk2 .nw-mtype { flex: none; }
  html.tp-desk2 .nw-mrow.is-exp { cursor: pointer; }
  html.tp-desk2 .nw-mrow.is-exp:hover { background: #FAFAF6; }
  html.tp-desk2 .nw-mrow.is-open { background: #FFFBEA; }
  html.tp-desk2 .nw-rowx { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 1.3fr); gap: 18px; padding: 4px 14px 14px 58px; background: #FFFBEA; border-top: 0; }
  html.tp-desk2 .nw-rowx .nw-pl { margin-top: 4px; background: #fff; }
  html.tp-desk2 .nw-rowx .nw-sum { background: #fff; }
  html.tp-desk2 .nw-rowx .nw-tx { margin-top: 4px; }
  /* Voicemail */
  html.tp-desk2 .nw-vsplit { margin-top: 14px; }
  html.tp-desk2 .nw-vlist { overflow: hidden; }
  html.tp-desk2 .nw-vrow { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 14px; border: 0; border-top: 1px solid var(--d2-line2); background: none; text-align: left; cursor: pointer; }
  html.tp-desk2 .nw-vrow:first-child { border-top: 0; }
  html.tp-desk2 .nw-vrow:hover { background: #FAFAF6; }
  html.tp-desk2 .nw-vrow.is-sel { background: #FFF4C2; }
  html.tp-desk2 .nw-vmain { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  html.tp-desk2 .nw-vh { display: flex; gap: 8px; align-items: baseline; }
  html.tp-desk2 .nw-vh .nw-mute { font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-vsum { color: #3C3C38; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.tp-desk2 .nw-vinsp .nw-kv b { max-width: 210px; }
  html.tp-desk2 .nw-setseg { margin: 0; }
  /* Setup › Recordings */
  html.tp-desk2 .nw-lanes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 4px 16px 4px; }
  html.tp-desk2 .nw-lane > b { display: block; margin: 0 0 6px; font-weight: 600; }
  html.tp-desk2 .nw-lane ol { list-style: none; margin: 0; padding: 0; counter-reset: lane; }
  html.tp-desk2 .nw-lane li { position: relative; padding: 0 0 10px 26px; counter-increment: lane; display: flex; flex-direction: column; }
  html.tp-desk2 .nw-lane li::before { content: counter(lane); position: absolute; left: 0; top: 0; width: 18px; height: 18px; border-radius: 50%; background: var(--d2-y); font-family: var(--d2-font); font-weight: 700; font-size: var(--d2-t-11); line-height: 18px; text-align: center; }
  html.tp-desk2 .nw-lane small { color: var(--d2-mute); font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-how .nw-foot { margin: 6px 16px 14px; }
  html.tp-desk2 .nw-keep .nw-t2r { display: grid; grid-template-columns: 1fr 1.4fr 1.1fr; gap: 10px; padding: 8px 16px; border-top: 1px solid var(--d2-line2); }
  html.tp-desk2 .nw-keep .nw-t2h { border-top: 0; color: var(--d2-mute); font-size: var(--d2-t-12); padding-top: 2px; }
  html.tp-desk2 .nw-notice { padding: 0 16px 14px; }
  html.tp-desk2 .nw-notice .nw-card-h { margin: 0 -16px; }
  html.tp-desk2 .nw-pad0 { margin: 10px 0 0; font-size: var(--d2-t-12); }
  html.tp-desk2 .nw-plog { padding: 0 0 6px; }
  html.tp-desk2 .nw-plr { display: grid; grid-template-columns: 130px minmax(0, 1fr) minmax(0, 1.3fr); gap: 10px; padding: 7px 16px; border-top: 1px solid var(--d2-line2); font-size: var(--d2-t-12); align-items: center; }
  html.tp-desk2 .nw-plr:first-child { border-top: 0; }
  @media (max-width: 1180px) {
    html.tp-desk2 .nw-split:not(.nw-split-in) { grid-template-columns: minmax(0, 1fr) 320px; }
    html.tp-desk2 .nw-rowx { grid-template-columns: minmax(0, 1fr); padding-left: 14px; }
  }
}
@media (min-width: 769px) {
  html.tp-ipad.tp-desk2 .nw-vrow { min-height: 60px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-pl-b { width: 44px; height: 44px; }
  html.tp-ipad.tp-desk2 .nw-pl-s { height: 34px; min-width: 46px; }
  html.tp-ipad.tp-desk2 .nw-txl { min-height: 40px; font-size: var(--d2-t-15); }
  html.tp-ipad.tp-desk2 .nw-split:not(.nw-split-in) { grid-template-columns: minmax(0, 1fr) 340px; }
  html.tp-ipad.tp-desk2 .nw-rowx { grid-template-columns: minmax(0, 1fr); padding-left: 14px; }
}
@media (min-width: 769px) and (max-width: 1000px) {
  html.tp-ipad.tp-desk2 .nw-lanes { grid-template-columns: 1fr; }
}

/* NETWRK N5: Setup › API keys (keys table, new-key sheet, show-once key, connect snippets) */
@media (min-width: 769px) {
  html.tp-desk2 .nw-api-t .nw-sub code, html.tp-desk2 .nw-api-sheet code, html.tp-desk2 .nw-api-urls code { font: 500 var(--d2-t-12) ui-monospace, SFMono-Regular, Menlo, monospace; }
  html.tp-desk2 .nw-api-acts { display: inline-flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }
  html.tp-desk2 .nw-link.nw-danger { color: #9C2219; }
  html.tp-desk2 .nw-t2r.nw-dim { opacity: .6; }
  html.tp-desk2 .nw-api-urls .nw-kv { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding-left: 16px; padding-right: 16px; }
  html.tp-desk2 .nw-api-urls .nw-kv b { min-width: 0; overflow-wrap: anywhere; font-weight: 500; }
  html.tp-desk2 .nw-code { margin: 4px 16px 10px; padding: 10px 12px; border-radius: 8px; background: #F4F4EF; color: #1d1d1b; font: 500 var(--d2-t-12)/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
  html.tp-desk2 .nw-api-sheet { width: min(640px, calc(100vw - 32px)); }
  html.tp-desk2 .nw-api-sheet .nw-form .nw-kv { padding-left: 0; padding-right: 0; }
  html.tp-desk2 .nw-api-sheet .nw-api-urls .nw-kv { padding-left: 0; padding-right: 0; }
  html.tp-desk2 .nw-api-sheet .nw-code { margin-left: 0; margin-right: 0; }
  html.tp-desk2 .nw-api-sheet .nw-kicker.nw-pad { padding-left: 0; }
  html.tp-desk2 .nw-api-secret { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; background: #FFF7D6; border: 1px solid #F1D97A; }
  html.tp-desk2 .nw-api-secret code { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: var(--d2-t-13); user-select: all; }
  html.tp-desk2 .nw-api-presets { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
  html.tp-desk2 .nw-api-preset { display: flex; flex-direction: column; gap: 3px; text-align: left; padding: 9px 11px; border-radius: 10px; border: 1px solid var(--d2-line2); background: var(--d2-card); cursor: pointer; font: inherit; color: inherit; }
  html.tp-desk2 .nw-api-preset small { color: var(--d2-mute); font-size: var(--d2-t-11); line-height: 1.35; }
  html.tp-desk2 .nw-api-preset.is-on { border-color: #111; box-shadow: inset 0 0 0 1px #111; background: #FFFBEA; }
  html.tp-desk2 .nw-api-scopes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px 14px; }
  html.tp-desk2 .nw-form label.nw-check.nw-api-scope, html.tp-desk2 .nw-form label.nw-check.nw-api-rec { display: flex; align-items: flex-start; gap: 8px; }
  html.tp-desk2 .nw-api-scope span, html.tp-desk2 .nw-api-rec span { display: flex; flex-direction: column; gap: 2px; color: inherit; }
  html.tp-desk2 .nw-api-scope small, html.tp-desk2 .nw-api-rec small { color: var(--d2-mute); font-size: var(--d2-t-11); line-height: 1.35; }
  html.tp-desk2 .nw-api-scope input, html.tp-desk2 .nw-api-rec input { flex: none; margin-top: 2px; }
  html.tp-desk2 .nw-api-scope.is-off { opacity: .55; cursor: default; }
  html.tp-ipad.tp-desk2 .nw-api-preset, html.tp-ipad.tp-desk2 .nw-api-acts .nw-link { min-height: 44px; }
  html.tp-ipad.tp-desk2 .nw-api-scope input, html.tp-ipad.tp-desk2 .nw-api-rec input { width: 22px; height: 22px; }
}

/* ---- NETWRK Call Flow (public/netwrk.js "Call Flow", migration 0177) ---------------------
   A left-to-right flow: each number is a lane; every step is a card; branches hang off
   a vertical rail with a pill naming the branch (Press 1, Mon–Fri 8am–5pm…) and the
   calls it took. The canvas scrolls sideways inside its card; the page never does. */
@media (min-width: 769px) {
  html.tp-desk2 .cf-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 16px 18px; flex-wrap: wrap; }
  html.tp-desk2 .cf-head h2 { margin: 0 0 2px; font-size: var(--d2-t-20); font-weight: 700; }
  html.tp-desk2 .cf-head p { margin: 2px 0 0; }
  html.tp-desk2 .cf-read { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: var(--d2-t-12); margin-top: 8px !important; }
  html.tp-desk2 .cf-head-r { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
  html.tp-desk2 .cf-acts { display: flex; gap: 8px; }
  html.tp-desk2 .cf-acts a.nw-btn { text-decoration: none; color: inherit; }
  html.tp-desk2 .cf-acts .nw-btn[disabled] { opacity: .45; cursor: default; }
  html.tp-desk2 .cf-sum { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
  html.tp-desk2 .cf-tile { background: var(--d2-card); border-radius: 12px; box-shadow: var(--d2-edge); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
  html.tp-desk2 .cf-tile b { font-size: var(--d2-t-20); font-weight: 700; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .cf-tile span { font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .cf-note { display: flex; gap: 8px; align-items: flex-start; font-size: var(--d2-t-12); color: var(--d2-mute); margin: 10px 2px 0; max-width: 900px; }
  html.tp-desk2 .cf-note svg { flex: none; margin-top: 1px; color: #B38B00; }
  html.tp-desk2 .cf-changed { margin: 10px 0 0; }
  html.tp-desk2 .cf-main { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 12px; align-items: start; }
  html.tp-desk2 .cf-canvas { overflow-x: auto; overflow-y: hidden; padding: 18px 16px 8px; margin-top: 12px; }
  html.tp-desk2 .cf-lane { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--d2-line2); width: max-content; min-width: 100%; }
  html.tp-desk2 .cf-lane:last-child { border-bottom: 0; margin-bottom: 0; }
  /* Top-aligned tree: every connector runs 28px below the top of its card, so a lane reads
     from its first line and a tall menu doesn't push its number halfway down the canvas. */
  html.tp-desk2 .cf-branch { display: flex; align-items: flex-start; }
  html.tp-desk2 .cf-kids { display: flex; flex-direction: column; position: relative; padding-left: 14px; }
  html.tp-desk2 .cf-kids::before { content: ''; position: absolute; left: 0; top: 28px; width: 14px; border-top: 1.5px solid #CFCFC6; }
  html.tp-desk2 .cf-kid { display: flex; align-items: flex-start; position: relative; padding: 0 0 12px; }
  html.tp-desk2 .cf-kid:last-child { padding-bottom: 0; }
  html.tp-desk2 .cf-kid::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; border-left: 1.5px solid #CFCFC6; }
  html.tp-desk2 .cf-kid:first-child::before { top: 28px; }
  html.tp-desk2 .cf-kid:last-child::before { bottom: auto; height: 28px; }
  html.tp-desk2 .cf-kid:only-child::before { display: none; }
  html.tp-desk2 .cf-edge { position: relative; display: flex; align-items: flex-start; min-width: 40px; max-width: 176px; min-height: 56px; padding: 0 10px 0 14px; }
  html.tp-desk2 .cf-edge::before { content: ''; position: absolute; left: 0; right: 0; top: 28px; border-top: 1.5px solid #CFCFC6; }
  html.tp-desk2 .cf-edge .cf-pill { margin-top: 12px; }
  html.tp-desk2 .cf-pill { position: relative; display: inline-flex; flex-direction: column; gap: 1px; padding: 4px 9px; border-radius: 9px; background: var(--d2-soft); font-size: var(--d2-t-11); font-weight: 600; line-height: 1.25; color: #3A3A36; }
  html.tp-desk2 .cf-pill.is-hours { background: #EEF3FF; color: #22407A; }
  html.tp-desk2 .cf-pill b { font-weight: 700; color: var(--d2-ink); font-variant-numeric: tabular-nums; }
  html.tp-desk2 .cf-now { align-self: flex-start; background: var(--d2-green); color: #fff; border-radius: 5px; padding: 0 5px; font-size: var(--d2-t-11); letter-spacing: .03em; text-transform: uppercase; }
  html.tp-desk2 .cf-card { display: flex; gap: 10px; align-items: flex-start; width: 214px; text-align: left; padding: 10px 12px; border: 0; border-radius: 12px; background: var(--d2-card); box-shadow: var(--d2-edge); cursor: pointer; font: inherit; color: inherit; position: relative; }
  html.tp-desk2 .cf-card:hover { box-shadow: 0 0 0 1px #D9D9D0, 0 2px 6px rgba(0,0,0,.06); }
  html.tp-desk2 .cf-card.is-sel { box-shadow: 0 0 0 2px var(--d2-y), 0 2px 8px rgba(0,0,0,.08); }
  html.tp-desk2 .cf-card.is-ref { width: auto; background: transparent; box-shadow: inset 0 0 0 1px var(--d2-line); padding: 6px 10px; }
  html.tp-desk2 .cf-card.is-number { background: #111; color: #fff; }
  html.tp-desk2 .cf-card.is-number .cf-sub, html.tp-desk2 .cf-card.is-number .cf-tr { color: #CFCFC6; }
  html.tp-desk2 .cf-card.is-number .cf-ic { background: var(--d2-y); color: #111; }
  html.tp-desk2 .cf-ic { flex: none; width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--d2-soft); color: #3A3A36; }
  html.tp-desk2 .cf-card.is-ivr .cf-ic { background: #FFF4B9; color: #6B5300; }
  html.tp-desk2 .cf-card.is-time_switch .cf-ic { background: #EEF3FF; color: #22407A; }
  html.tp-desk2 .cf-card.is-ring_group .cf-ic, html.tp-desk2 .cf-card.is-queue .cf-ic { background: #E7F6EC; color: #11622F; }
  html.tp-desk2 .cf-card.is-voicemail .cf-ic, html.tp-desk2 .cf-card.is-sound_event .cf-ic { background: #F3ECFF; color: #4E2C8A; }
  html.tp-desk2 .cf-card.is-hangup .cf-ic, html.tp-desk2 .cf-card.is-removed .cf-ic { background: #FDECEA; color: #9C2219; }
  html.tp-desk2 .cf-cm { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
  html.tp-desk2 .cf-name { font-weight: 600; font-size: var(--d2-t-13); overflow-wrap: anywhere; }
  html.tp-desk2 .cf-sub { font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .cf-tr { font-size: var(--d2-t-12); font-weight: 600; color: #2E2E2B; margin-top: 3px; font-variant-numeric: tabular-nums; }
  html.tp-desk2 .cf-tr.is-none { color: var(--d2-mute); font-weight: 500; }
  html.tp-desk2 .cf-tr.is-note { color: #8A6A00; font-weight: 500; }
  html.tp-desk2 .cf-bar { display: flex; height: 4px; border-radius: 2px; overflow: hidden; background: var(--d2-line2); margin-top: 4px; }
  html.tp-desk2 .cf-bar i { display: block; height: 100%; }
  html.tp-desk2 .cf-bar .is-ok { background: var(--d2-green); }
  html.tp-desk2 .cf-bar .is-vm { background: #8A63D2; }
  html.tp-desk2 .cf-bar .is-miss { background: var(--d2-red); }
  html.tp-desk2 .cf-agents { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
  html.tp-desk2 .cf-agent { display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px 2px 5px; border-radius: 7px; background: var(--d2-bg); font-size: var(--d2-t-11); color: #3A3A36; }
  html.tp-desk2 .cf-agent svg { width: 12px; height: 12px; }
  html.tp-desk2 .cf-agent b { font-weight: 700; margin-left: 2px; }
  html.tp-desk2 .cf-insp { margin-top: 12px; padding: 14px 16px; position: sticky; top: 12px; max-height: calc(100vh - 140px); overflow: auto; }
  html.tp-desk2 .cf-insp-h { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
  html.tp-desk2 .cf-insp-h h3 { margin: 0; font-size: var(--d2-t-17); font-weight: 700; }
  html.tp-desk2 .cf-insp h4 { margin: 14px 0 4px; font-size: var(--d2-t-11); text-transform: uppercase; letter-spacing: .06em; color: var(--d2-mute); }
  html.tp-desk2 .cf-kv { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid var(--d2-line2); font-size: var(--d2-t-13); }
  html.tp-desk2 .cf-kv > span:first-child { color: var(--d2-mute); flex: none; }
  html.tp-desk2 .cf-kv > span:last-child { text-align: right; }
  html.tp-desk2 .cf-quote { margin: 8px 0; padding: 8px 10px; border-left: 3px solid var(--d2-y); background: var(--d2-bg); border-radius: 0 8px 8px 0; font-size: var(--d2-t-12); color: #3A3A36; }
  html.tp-desk2 .cf-week { width: 100%; border-collapse: collapse; font-size: var(--d2-t-12); margin: 4px 0 6px; }
  html.tp-desk2 .cf-week th { text-align: left; width: 40px; padding: 4px 0; color: var(--d2-mute); font-weight: 600; vertical-align: top; }
  html.tp-desk2 .cf-week td { padding: 4px 0; border-bottom: 1px solid var(--d2-line2); }
  html.tp-desk2 .cf-sw { display: block; }
  html.tp-desk2 .cf-unused { margin-top: 12px; padding: 12px 16px; }
  html.tp-desk2 .cf-unused summary { cursor: pointer; font-weight: 600; }
  html.tp-desk2 .cf-unused-l { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
  html.tp-desk2 .cf-warn { margin: 10px 2px; font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .cf-changes { padding: 6px 18px 14px; }
  html.tp-desk2 .cf-changes h4 { margin: 14px 0 6px; font-size: var(--d2-t-13); }
  html.tp-desk2 .cf-changes ul { list-style: none; margin: 0; padding: 0; }
  html.tp-desk2 .cf-changes li { display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--d2-line2); font-size: var(--d2-t-13); }
  html.tp-desk2 .cf-chk { flex: none; width: 18px; height: 18px; border-radius: 6px; display: grid; place-items: center; font-weight: 700; font-size: var(--d2-t-12); background: var(--d2-soft); }
  html.tp-desk2 li.is-added .cf-chk { background: #E7F6EC; color: #11622F; }
  html.tp-desk2 li.is-removed .cf-chk { background: #FDECEA; color: #9C2219; }
  html.tp-desk2 .cf-acct { padding: 14px 18px; }
  html.tp-desk2 .cf-acct h4 { margin: 0 0 6px; }
  html.tp-desk2 .cf-acct p { margin: 4px 0 10px; font-size: var(--d2-t-13); }
  html.tp-desk2 .cf-acct-f { display: flex; flex-direction: column; gap: 10px; max-width: 420px; }
  html.tp-desk2 .cf-acct-f label { display: flex; flex-direction: column; gap: 4px; font-size: var(--d2-t-12); color: var(--d2-mute); }
  html.tp-desk2 .cf-acct-f input[type=text] { height: var(--d2-btn-h); border-radius: var(--d2-radius); border: 1px solid var(--d2-line); padding: 0 9px; font: inherit; color: var(--d2-ink); }
  html.tp-desk2 .cf-acct-f .cf-chk-l { flex-direction: row; align-items: center; gap: 6px; color: var(--d2-ink); }
  html.tp-desk2.tp-ipad .cf-card { min-height: 44px; }
  html.tp-desk2.tp-ipad .cf-head-r .nw-btn, html.tp-desk2.tp-ipad .cf-seg button, html.tp-desk2.tp-ipad .cf-days button { min-height: 44px; }
}
@media (min-width: 769px) and (max-width: 1280px) {
  html.tp-desk2 .cf-main { grid-template-columns: minmax(0, 1fr); }
  html.tp-desk2 .cf-insp { position: static; max-height: none; }
  html.tp-desk2 .cf-sum { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* ==== iPhone look (html.tp-ios-app) ==== */

/* NETWRK on the iPhone (public/netwrk.js; mocks.html frames 8-9). iOS app only. */
html.tp-ios-app .nw { padding: 4px 16px 32px; display: flex; flex-direction: column; gap: 12px; }
html.tp-ios-app .nw-ph-hd { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 6px; }
html.tp-ios-app .nw-tenant { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px 0 6px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 .5px rgba(0,0,0,.15); font: 600 15px -apple-system, system-ui, sans-serif; }
html.tp-ios-app .nw-tbadge { display: inline-flex; align-items: center; justify-content: center; width: auto; min-width: 24px; padding: 0 4px; flex: none; height: 22px; border-radius: 6px; background: #111; color: #F5C500; font: 800 11px -apple-system, system-ui, sans-serif; }
html.tp-ios-app .nw-ph-lede { margin: 0 2px; font-size: 15px; color: #55554f; }
html.tp-ios-app .nw-ph-stats { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; padding: 14px 6px; }
html.tp-ios-app .nw-ph-stats > div + div { border-left: 1px solid var(--grey-100); }
html.tp-ios-app .nw-ph-stats b { display: block; font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw-ph-stats span { font-size: 13px; color: var(--grey-600); }
html.tp-ios-app .is-red { color: #c0392b; }
html.tp-ios-app .nw-num { font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
html.tp-ios-app .nw-mute { color: var(--grey-600); }
html.tp-ios-app .nw-rep { display: inline-flex; padding: 0 5px; border-radius: 5px; background: #FFF4B9; color: #6b5300; font-size: 11px; font-weight: 700; }
html.tp-ios-app .nw-ficon { flex: none; width: 36px; height: 36px; border-radius: 10px; background: #FCE9E7; color: #c0392b; display: inline-flex; align-items: center; justify-content: center; }
html.tp-ios-app .nw-ficon.is-ok { background: #e3f4ea; color: #1f7a45; }
html.tp-ios-app .nw-ficon.is-lg { width: 56px; height: 56px; border-radius: 16px; }
html.tp-ios-app .nw-ficon.is-lg svg { width: 26px; height: 26px; }
html.tp-ios-app .nw-chev { color: #b3b3ad; display: inline-flex; }
html.tp-ios-app .nw-ph-frow { border-top: 1px solid var(--grey-100); }
html.tp-ios-app .ip-list > .nw-ph-frow:first-child { border-top: 0; }
html.tp-ios-app .nw-ph-frow > .ip-row { border-top: 0; }
html.tp-ios-app .nw-ph-acts { display: flex; gap: 8px; padding: 0 0 12px 48px; }
html.tp-ios-app .nw-ph-btn { flex: 1; min-height: 44px; border: 0; border-radius: 12px; background: #F1F1EC; font: 600 15px -apple-system, system-ui, sans-serif; color: #111; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
html.tp-ios-app .nw-ph-btn.is-y { background: #F5C500; }
html.tp-ios-app .nw-ph-btn.is-wide { width: 100%; flex: none; }
html.tp-ios-app .nw-ph-big { display: flex; flex-direction: column; gap: 8px; }
html.tp-ios-app .nw-ph-two { display: flex; gap: 8px; }
html.tp-ios-app .nw-ph-chips { margin-top: 2px; }
html.tp-ios-app .nw-ph-nav { display: flex; align-items: center; }
html.tp-ios-app .nw-ph-back { display: inline-flex; align-items: center; gap: 2px; padding-left: 0; color: #8A6A00; }
html.tp-ios-app .nw-ph-callhd { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
html.tp-ios-app .nw-ph-callhd h2 { margin: 4px 0 0; font-size: 26px; }
html.tp-ios-app .nw-verdict.is-bad { background: #FDECEA; border-color: transparent; }
html.tp-ios-app .nw-verdict.is-bad b { color: #B4271D; }
html.tp-ios-app .nw-verdict.is-ok { background: #E9F6EE; border-color: transparent; }
html.tp-ios-app .nw-verdict.is-ok b { color: #17753A; }
html.tp-ios-app .nw-verdict p { margin: 4px 0 0; font-size: 15px; color: #2b2b28; }
html.tp-ios-app .nw-journey { list-style: none; margin: 0; padding: 4px 0 0 4px; }
html.tp-ios-app .nw-journey li { position: relative; padding: 0 0 14px 24px; display: flex; flex-direction: column; font-size: 15px; }
html.tp-ios-app .nw-journey li::before { content: ""; position: absolute; left: 0; top: 4px; width: 9px; height: 9px; border-radius: 50%; border: 2px solid #111; background: #fff; }
html.tp-ios-app .nw-journey li:not(:last-child)::after { content: ""; position: absolute; left: 5.5px; top: 17px; bottom: 0; width: 2px; background: var(--grey-200); }
html.tp-ios-app .nw-journey li.is-end::before { background: #c0392b; border-color: #c0392b; }
html.tp-ios-app .nw-journey li.is-ok::before { background: #1f7a45; border-color: #1f7a45; }
html.tp-ios-app .nw-journey span { color: var(--grey-600); font-size: 13px; }
html.tp-ios-app .nw-holly .nw-card-h { display: none; }
html.tp-ios-app .nw-ins { display: flex; gap: 12px; }
html.tp-ios-app .nw-ins-ic { flex: none; width: 30px; height: 30px; border-radius: 8px; background: #FFF4B9; color: #6b5300; display: inline-flex; align-items: center; justify-content: center; }
html.tp-ios-app .nw-ins b { font-size: 16px; }
html.tp-ios-app .nw-ins p { margin: 4px 0 0; font-size: 15px; color: #444; }
html.tp-ios-app .nw-ins p.nw-try { color: #8A6A00; }
html.tp-ios-app .nw-empty { text-align: center; padding: 28px 12px; color: var(--grey-600); }
html.tp-ios-app .nw-empty h3 { color: #111; margin: 10px 0 4px; font-size: 17px; }
html.tp-ios-app .nw-empty p { margin: 0 0 12px; font-size: 15px; }
html.tp-ios-app .nw-empty-ic { display: inline-flex; width: 52px; height: 52px; border-radius: 14px; background: #111; align-items: center; justify-content: center; }
html.tp-ios-app .nw-empty-ic svg { width: 36px; height: 36px; }
html.tp-ios-app .nw-card { background: #fff; border: 1px solid var(--grey-200); border-radius: 16px; }

/* NETWRK N2 on the iPhone: report pages (Inbound, Outbound, People, Patterns) and All businesses. */
html.tp-ios-app button.nw-tenant { border: 0; color: #111; }
html.tp-ios-app .nw-ph-rt { margin: 0; }
html.tp-ios-app .nw-ph-back { margin-bottom: -6px; }
html.tp-ios-app .nw-ph-kpis { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; padding: 6px; }
html.tp-ios-app .nw-ph-kpis > div { padding: 10px 4px; }
html.tp-ios-app .nw-ph-kpis b { display: block; font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.tp-ios-app .nw-ph-kpis span { font-size: 13px; color: var(--grey-600); }
html.tp-ios-app .nw-ph-static { cursor: default; }
html.tp-ios-app .nw-ph-bizlink { margin-top: 0; }
html.tp-ios-app .ip-row .nw-tbadge { margin-right: 10px; flex: none; }
html.tp-ios-app .nw-tbadge.is-off { background: #e6e6e0; color: #6d6d67; }
html.tp-ios-app .nw-ph-heat { padding: 12px 10px; }
html.tp-ios-app .nw-heat { display: grid; gap: 3px; align-items: center; }
html.tp-ios-app .nw-heat-h { text-align: center; color: var(--grey-600); font-size: 10px; }
html.tp-ios-app .nw-heat-d { font-size: 12px; color: #444; }
html.tp-ios-app .nw-hm { display: block; height: 22px; border-radius: 4px; }
html.tp-ios-app .nw-hm-e { background: #F4F4EF; }
html.tp-ios-app .nw-hm-x { background: #E6E6E0; }
html.tp-ios-app .nw-hm-0 { background: #CDEBD6; }
html.tp-ios-app .nw-hm-1 { background: #F9E6AE; }
html.tp-ios-app .nw-hm-2 { background: #F4BE95; }
html.tp-ios-app .nw-hm-3 { background: #EE8B82; }
html.tp-ios-app .nw-heat-key { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 10px; color: var(--grey-600); font-size: 12px; }
html.tp-ios-app .nw-heat-key i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
html.tp-ios-app .nw-holly .nw-ins { padding: 12px 14px; }
html.tp-ios-app .nw-holly .nw-ins + .nw-ins { border-top: 1px solid var(--grey-100); }

/* ---- NETWRK N3 (migration 0153): listening, transcripts, voicemail. Shared by
   desk2 (Mac, iPad) and the iPhone app; layout lives in desk2.css and above. */
/* iPhone: the shared components, then the phone layout */
html.tp-ios-app .nw .nw-tt { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: 11.5px; font-weight: 600; white-space: nowrap; background: #EEEEE8; color: #55554F; }
html.tp-ios-app .nw .nw-tt.is-conv { background: #E6EEFB; color: #2B5BB0; }
html.tp-ios-app .nw .nw-tt.is-vm { background: #EFE7FB; color: #6A3FB5; }
html.tp-ios-app .nw .nw-tt.is-menu { background: #EEEEE8; color: #5D5D57; }
/* rules3 (0167): self-served types */
html.tp-ios-app .nw .nw-tt.is-ah { background: #E3EEF0; color: #2F6470; }
html.tp-ios-app .nw .nw-tt.is-info { background: #E8F3E6; color: #3B6B2F; }
html.tp-ios-app .nw .nw-tt.is-pend { background: #FFF6D6; color: #7A5D00; font-weight: 500; }
html.tp-ios-app .nw .nw-tt.is-none { background: transparent; color: #9A9A93; font-weight: 500; padding: 0; }
html.tp-ios-app .nw .nw-mp { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 9px 0 7px; border: 0; border-radius: 12px; background: #EFEFE9; color: #1A1A18; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; cursor: pointer; white-space: nowrap; }
html.tp-ios-app .nw .nw-mp:hover { background: #E4E4DD; }
html.tp-ios-app .nw .nw-mp.is-new { background: #F5C500; }
html.tp-ios-app .nw .nw-mp.is-new:hover { background: #EBBC00; }
html.tp-ios-app .nw .nw-mp.is-on { background: #111; color: #fff; }
html.tp-ios-app .nw .nw-mp.is-off { background: transparent; color: #A8A8A1; cursor: default; padding: 0 4px; }
html.tp-ios-app .nw .nw-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 12px 0 0; }
html.tp-ios-app .nw .nw-op { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: 11.5px; font-weight: 600; background: #EEEEE8; color: #55554F; }
html.tp-ios-app .nw .nw-op.is-green { background: #E4F5EA; color: #17753A; }
html.tp-ios-app .nw .nw-op.is-red { background: #FCE9E7; color: #B4271D; }
html.tp-ios-app .nw .nw-op.is-amber { background: #FDF0DA; color: #8A5A00; }
html.tp-ios-app .nw .nw-op.is-blue { background: #E6EEFB; color: #2B5BB0; }
html.tp-ios-app .nw .nw-chip { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 10px; font-size: 11.5px; font-weight: 600; white-space: nowrap; background: #FCE9E7; color: #B4271D; }
html.tp-ios-app .nw .nw-chip.is-tried { background: #FFF4C2; color: #7A5D00; }
html.tp-ios-app .nw .nw-chip.is-called, html.tp-ios-app .nw .nw-chip.is-not_needed { background: #E4F5EA; color: #17753A; }
html.tp-ios-app .nw .nw-sum { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: #FFFBEA; }
html.tp-ios-app .nw .nw-sum p { margin: 0; color: #2B2B28; }
html.tp-ios-app .nw .nw-sum-ic { flex: none; display: inline-flex; width: 20px; height: 20px; border-radius: 6px; background: #F5C500; align-items: center; justify-content: center; }
html.tp-ios-app .nw .nw-sum-ic svg { width: 13px; height: 13px; }
html.tp-ios-app .nw .nw-pl { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 8px 10px; border-radius: 12px; background: #F4F4EF; }
html.tp-ios-app .nw .nw-pl-b { flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #111; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
html.tp-ios-app .nw .nw-pl.is-loading .nw-pl-b { opacity: .55; }
html.tp-ios-app .nw .nw-pl-m { flex: 1 1 auto; min-width: 0; }
html.tp-ios-app .nw .nw-pl-track { position: relative; height: 28px; cursor: pointer; outline-offset: 2px; }
html.tp-ios-app .nw .nw-wv { position: absolute; inset: 0; display: flex; align-items: center; gap: 2px; }
html.tp-ios-app .nw .nw-wv i { flex: 1 1 0; min-width: 1px; border-radius: 1px; background: #C9C9C1; }
html.tp-ios-app .nw .nw-wv i.is-flat { height: 3px; background: #D6D6CF; }
html.tp-ios-app .nw .nw-wv i.is-p { background: #111; }
html.tp-ios-app .nw .nw-pl-line { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: transparent; }
html.tp-ios-app .nw .nw-pl-prog { display: block; height: 2px; width: 0; background: #F5C500; }
html.tp-ios-app .nw .nw-pl-t { display: flex; justify-content: space-between; gap: 8px; margin-top: 2px; font-size: 11px; color: #73736D; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw .nw-pl-t .is-red { color: #B4271D; }
html.tp-ios-app .nw .nw-pl-s { flex: none; height: 26px; min-width: 38px; border: 0; border-radius: 13px; background: #fff; box-shadow: 0 0 0 .5px rgba(0,0,0,.14); font-size: 12px; font-weight: 600; cursor: pointer; }
html.tp-ios-app .nw .nw-pl.is-big { padding: 12px; }
html.tp-ios-app .nw .nw-pl.is-big .nw-pl-b { width: 48px; height: 48px; }
html.tp-ios-app .nw .nw-pl.is-big .nw-pl-track { height: 38px; }
html.tp-ios-app .nw .nw-tx { display: flex; flex-direction: column; gap: 1px; max-height: 340px; overflow: auto; margin: 0 -6px; position: relative; }
html.tp-ios-app .nw .nw-tx.is-compact { max-height: 220px; }
html.tp-ios-app .nw .nw-txl { display: grid; grid-template-columns: 38px 52px minmax(0, 1fr); gap: 6px; align-items: baseline; width: 100%; padding: 5px 6px; border: 0; border-radius: 8px; background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; }
html.tp-ios-app .nw .nw-txl:hover { background: #F6F6F1; }
html.tp-ios-app .nw .nw-txl.is-cur { background: #FFF4C2; }
html.tp-ios-app .nw .nw-ts { font-size: 11.5px; color: #8A8A83; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw .nw-sp { font-size: 11.5px; font-weight: 600; color: #8A8A83; }
html.tp-ios-app .nw .nw-sp.is-caller { color: #2B5BB0; }
html.tp-ios-app .nw .nw-sp.is-team { color: #17753A; }
html.tp-ios-app .nw .nw-sp.is-menu { color: #8A8A83; font-weight: 500; }
html.tp-ios-app .nw .nw-txt { white-space: pre-wrap; overflow-wrap: anywhere; }
html.tp-ios-app .nw .nw-txnote { margin: 10px 0 0; }
html.tp-ios-app .nw .nw-txfoot { display: flex; gap: 6px; align-items: flex-start; }
html.tp-ios-app .nw .nw-txfoot svg { flex: none; margin-top: 1px; width: 13px; height: 13px; }
html.tp-ios-app .nw .nw-jline { display: flex; gap: 6px; align-items: center; margin: 12px 0 0; font-size: 12px; color: #73736D; }
html.tp-ios-app .nw .nw-jline svg { flex: none; width: 14px; height: 14px; }
html.tp-ios-app .nw .nw-ficon.is-vm { background: #EFE7FB; color: #6A3FB5; }
html.tp-ios-app .nw .nw-unh { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #F5C500; box-shadow: 0 0 0 2px #FFF4C2; }
html.tp-ios-app .nw .nw-unh.is-heard { background: transparent; box-shadow: none; }
html.tp-ios-app .nw .nw-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
html.tp-ios-app .nw .nw-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #111; flex: none; }
html.tp-ios-app .nw .nw-check span { display: flex; flex-direction: column; gap: 2px; }
html.tp-ios-app .nw .nw-check small { color: #5D5D57; font-size: 12px; }
html.tp-ios-app .nw .nw-note.is-amber { color: #7A5D00; }
html.tp-ios-app #nw-root button.nw-pl-b { color: #fff; }
html.tp-ios-app #nw-root button.nw-mp.is-on { color: #fff; }
html.tp-ios-app #nw-root button.nw-mp { color: #1A1A18; }
html.tp-ios-app #nw-root button.nw-mp.is-on { color: #fff; }
html.tp-ios-app .nw-ph-player { padding: 12px 14px; }
html.tp-ios-app .nw-ph-player .nw-pl { margin-top: 0; }
html.tp-ios-app .nw-ph-player .nw-tx { max-height: none; margin-top: 10px; }
html.tp-ios-app .nw-ph-player .nw-txl { grid-template-columns: 40px 54px minmax(0, 1fr); font-size: 15px; min-height: 40px; }
html.tp-ios-app .nw-ph-player .nw-foot { font-size: 12px; color: var(--grey-600); margin: 10px 0 0; }
html.tp-ios-app .nw-ph-player .nw-sum { margin: 0 0 10px; }
html.tp-ios-app .nw-ph-callhd .nw-tags { justify-content: center; margin-top: 4px; }
html.tp-ios-app .nw-ph-vrow { display: flex; align-items: center; gap: 4px; padding-right: 12px; border-top: 1px solid var(--grey-100); }
html.tp-ios-app .ip-list > .nw-ph-vrow:first-child { border-top: 0; }
html.tp-ios-app .nw-ph-vrow > .ip-row { flex: 1 1 auto; min-width: 0; border-top: 0; }
html.tp-ios-app .nw-ph-vrow .nw-unh { margin-right: 10px; }
html.tp-ios-app .nw-ph-vrow .ip-row-sub { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html.tp-ios-app .nw-ph-vstate { display: block; margin-top: 4px; }
html.tp-ios-app .nw-ph-vrow .nw-mp { height: 34px; padding: 0 12px 0 10px; border-radius: 17px; font-size: 13px; }
html.tp-ios-app .nw-ph-seg .ip-seg-opt { padding-left: 6px; padding-right: 6px; }

/* ---- NETWRK Call Flow on iPhone (public/netwrk.js phoneFlow, migration 0177) -------------
   The flow as an outline: each step a card, its branches indented under it on a rail. */
html.tp-ios-app .cf-ph-acts { display: flex; gap: 8px; padding: 0 16px 8px; }
html.tp-ios-app .cf-ph-acts .ip-btn { flex: 1; justify-content: center; text-decoration: none; color: inherit; white-space: nowrap; font-size: 15px; }
html.tp-ios-app .cf-ph-acts .ip-btn[disabled] { opacity: .45; }
html.tp-ios-app .cf-ph-lane { padding: 12px; margin: 0 16px 12px; overflow: hidden; }
html.tp-ios-app .cf-ph-n { position: relative; margin-left: calc(min(var(--d), 1) * 14px); padding-left: calc(min(var(--d), 1) * 10px); border-left: calc(min(var(--d), 1) * 2px) solid #E4E4DD; margin-top: 8px; }
html.tp-ios-app .cf-ph-l { display: block; font-size: 12px; font-weight: 600; color: #6B6B65; margin: 0 0 4px; }
html.tp-ios-app .cf-card { display: flex; gap: 10px; align-items: flex-start; width: 100%; text-align: left; padding: 10px 12px; border: 1px solid #E4E4DD; border-radius: 12px; background: #fff; font: inherit; color: inherit; min-height: 44px; }
html.tp-ios-app .cf-card.is-number { background: #111; color: #fff; border-color: #111; }
html.tp-ios-app .cf-card.is-number .cf-sub, html.tp-ios-app .cf-card.is-number .cf-tr { color: #CFCFC6; }
html.tp-ios-app .cf-card.is-ref { background: transparent; }
html.tp-ios-app .cf-ic { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: #F0F0EA; }
html.tp-ios-app .cf-card.is-number .cf-ic { background: #F5C500; color: #111; }
html.tp-ios-app .cf-cm { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
html.tp-ios-app .cf-name { font-weight: 600; font-size: 15px; overflow-wrap: anywhere; }
html.tp-ios-app .cf-sub, html.tp-ios-app .cf-tr { font-size: 13px; color: #6B6B65; }
html.tp-ios-app .cf-tr { color: #2E2E2B; font-weight: 600; }
html.tp-ios-app .cf-tr.is-note { color: #8A6A00; font-weight: 500; }
html.tp-ios-app .cf-bar { display: flex; height: 4px; border-radius: 2px; overflow: hidden; background: #EFEFE9; margin-top: 4px; }
html.tp-ios-app .cf-bar i { display: block; height: 100%; }
html.tp-ios-app .cf-bar .is-ok { background: #1E9A4B; }
html.tp-ios-app .cf-bar .is-vm { background: #8A63D2; }
html.tp-ios-app .cf-bar .is-miss { background: #D6362B; }
html.tp-ios-app .cf-agents { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
html.tp-ios-app .cf-agent { display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px; border-radius: 7px; background: #F4F4EF; font-size: 12px; }
html.tp-ios-app .cf-agent svg { width: 12px; height: 12px; }
html.tp-ios-app .cf-ph-d { margin: 6px 0 2px; padding: 10px 12px; border-radius: 12px; background: #F7F7F3; font-size: 14px; }
html.tp-ios-app .cf-ph-d h3 { margin: 0; font-size: 16px; }
html.tp-ios-app .cf-ph-d h4 { margin: 10px 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #6B6B65; }
html.tp-ios-app .cf-insp-h { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
html.tp-ios-app .cf-kv { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid #ECECE5; }
html.tp-ios-app .cf-kv > span:first-child { color: #6B6B65; flex: none; }
html.tp-ios-app .cf-kv > span:last-child { text-align: right; overflow-wrap: anywhere; }
html.tp-ios-app .cf-quote { margin: 6px 0; padding: 6px 10px; border-left: 3px solid #F5C500; background: #fff; font-size: 13px; }
html.tp-ios-app .cf-week { width: 100%; border-collapse: collapse; font-size: 13px; }
html.tp-ios-app .cf-week th { text-align: left; width: 38px; color: #6B6B65; vertical-align: top; padding: 3px 0; }
html.tp-ios-app .cf-week td { padding: 3px 0; }
html.tp-ios-app .cf-sw { display: block; }

/* ---- NETWRK iPhone parity (7 Oct 2026): More, Overview, reports, Locations, GP, Setup,
   All businesses. iOS app only (html.tp-ios-app); built from the ip-* parts above. ---- */
html.tp-ios-app .nw .nw-grow { flex: 1 1 auto; }
html.tp-ios-app .nw-ph-hdr { display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
html.tp-ios-app .nw-ph-tenant { max-width: 52vw; }
html.tp-ios-app .nw-ph-tname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.tp-ios-app .nw-ph-morebtn { background: #fff; border-radius: 22px; box-shadow: 0 0 0 .5px rgba(0,0,0,.15); width: 40px; height: 40px; }
html.tp-ios-app .nw-ph-morebtn svg { width: 20px; height: 20px; }
html.tp-ios-app .nw-ph-ic { flex: none; width: 32px; height: 32px; border-radius: 9px; background: #FFF4B9; color: #6b5300; display: inline-flex; align-items: center; justify-content: center; }
html.tp-ios-app .nw-ph-ic svg { width: 18px; height: 18px; }
html.tp-ios-app .nw-ph-tick { color: #1f7a45; display: inline-flex; }
html.tp-ios-app .nw-ph-sheet { z-index: 140; }
html.tp-ios-app .nw-ph-sheet .ip-sheet-panel { display: flex; flex-direction: column; gap: 8px; }
html.tp-ios-app .nw-ph-sheet .ip-grouphd { margin: 8px 4px 0; }
html.tp-ios-app .nw-ph-sheetgap { margin-top: 8px; }
html.tp-ios-app .nw-ph-nav { display: flex; align-items: center; gap: 8px; min-height: 44px; }
html.tp-ios-app .nw-ph-back span { white-space: nowrap; }
html.tp-ios-app .nw-ph-h { margin: 0 2px; font-size: 22px; line-height: 1.2; font-weight: 700; letter-spacing: -.01em; color: #111; }
html.tp-ios-app .nw-ph-l { text-align: left; margin-top: -4px; }
html.tp-ios-app .nw-ph-m { margin: 8px 0 0; }
html.tp-ios-app .nw-ph-mt { margin-top: 10px; }
html.tp-ios-app .nw-ph-mt0 { margin-top: 0; }
html.tp-ios-app .nw-ph-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
html.tp-ios-app .nw-ph-tile { background: #fff; border: 1px solid var(--grey-200); border-radius: 14px; padding: 10px 12px; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
html.tp-ios-app .nw-ph-tile b { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.tp-ios-app .nw-ph-tile span { font-size: 13px; color: #2b2b28; }
html.tp-ios-app .nw-ph-tile em { font-style: normal; font-size: 12px; color: var(--grey-600); overflow-wrap: anywhere; }
html.tp-ios-app .nw-ph-card { padding: 12px 12px 10px; }
html.tp-ios-app .nw-ph-card-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 2px 6px; }
html.tp-ios-app .nw-ph-card-h h3 { margin: 0; font-size: 16px; }
html.tp-ios-app .nw-ph-card-h .ip-link { min-height: 32px; }
html.tp-ios-app .nw-ph-leg { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 4px; }
html.tp-ios-app .nw .nw-chart { display: block; width: 100%; height: auto; }
html.tp-ios-app .nw .nw-grid { stroke: #ECECE6; stroke-width: 1; }
html.tp-ios-app .nw .nw-axis { fill: #8A8A83; font-size: 11px; font-family: -apple-system, system-ui, sans-serif; }
html.tp-ios-app .nw .nw-axis-bad { fill: #B4271D; font-weight: 700; }
html.tp-ios-app .nw .nw-bar-c { fill: #111; }
html.tp-ios-app .nw .nw-bar-m { fill: #D8D8D1; }
html.tp-ios-app .nw .nw-bar-p { fill: #F5C500; }
html.tp-ios-app .nw .nw-bar-pm { fill: #F2E3A0; }
html.tp-ios-app .nw .nw-line { stroke: #111; stroke-width: 2; }
html.tp-ios-app .nw .nw-pt { fill: #111; }
html.tp-ios-app .nw .nw-pt-bad { fill: #B4271D; }
html.tp-ios-app .nw .nw-legend { display: inline-flex; gap: 10px; align-items: center; color: var(--grey-600); font-size: 12px; }
html.tp-ios-app .nw .nw-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: -6px; }
html.tp-ios-app .nw .nw-legend i.is-c { background: #111; }
html.tp-ios-app .nw .nw-legend i.is-m { background: #D8D8D1; }
html.tp-ios-app .nw .nw-legend i.is-p { background: #F5C500; }
/* desk cards reused on the phone (why, insights) */
html.tp-ios-app .nw-ph-dcard { padding: 12px 12px 8px; }
html.tp-ios-app .nw-ph-dcard .nw-card-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 2px 6px; }
html.tp-ios-app .nw-ph-dcard .nw-card-h h3 { margin: 0; font-size: 16px; display: inline-flex; align-items: center; gap: 6px; }
html.tp-ios-app .nw-ph-dcard .nw-card-h .nw-mute { font-size: 12px; }
html.tp-ios-app .nw .nw-why-row { display: grid; grid-template-columns: minmax(0, 1fr) 72px 30px; gap: 8px; align-items: center; padding: 5px 2px; font-size: 14px; }
html.tp-ios-app .nw .nw-why-row b { text-align: right; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw .nw-why-track { display: block; height: 6px; border-radius: 3px; background: #ECECE6; overflow: hidden; }
html.tp-ios-app .nw .nw-why-bar { display: block; height: 100%; border-radius: 3px; background: #9B9B94; }
html.tp-ios-app .nw .nw-why-bar.is-green { background: #1f7a45; }
html.tp-ios-app .nw .nw-why-bar.is-red { background: #C0392B; }
html.tp-ios-app .nw .nw-why-bar.is-amber { background: #D99A00; }
html.tp-ios-app .nw .nw-why-bar.is-blue { background: #3A74D8; }
html.tp-ios-app .nw .nw-why-bar.is-ah { background: #6FA3AE; }
html.tp-ios-app .nw .nw-why-bar.is-info { background: #8DBE7F; }
html.tp-ios-app .nw .nw-why-self { border-top: 1px solid var(--grey-100); margin-top: 6px; padding-top: 6px; }
html.tp-ios-app .nw .nw-why-self > .nw-mute { display: block; padding: 2px; font-size: 12px; }
html.tp-ios-app .nw-holly.ip-card { padding: 0; }
html.tp-ios-app .nw .nw-holly-ic { display: inline-flex; color: #8A6A00; }
/* rate bars, pills, tags, dots */
html.tp-ios-app .nw .nw-rate { display: inline-block; width: 56px; height: 6px; border-radius: 3px; background: #ECECE6; overflow: hidden; vertical-align: middle; margin-right: 6px; }
html.tp-ios-app .nw .nw-rate i { display: block; height: 100%; border-radius: 3px; background: #1f7a45; }
html.tp-ios-app .nw .nw-rate i.is-mid { background: #D99A00; }
html.tp-ios-app .nw .nw-rate i.is-bad { background: #C0392B; }
html.tp-ios-app .nw-ph-bar { display: flex; align-items: center; gap: 2px; margin-top: 4px; font-size: 12px; }
html.tp-ios-app .nw-ph-bar b { font-size: 12px; }
html.tp-ios-app .nw .nw-pill { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 10px; font-size: 12px; font-weight: 600; white-space: nowrap; background: #EEEEE8; color: #5d5d57; }
html.tp-ios-app .nw .nw-pill.is-green { background: #DDF1E3; color: #17643A; }
html.tp-ios-app .nw .nw-pill.is-amber { background: #FCEFC9; color: #7A5A00; }
html.tp-ios-app .nw .nw-pill.is-red { background: #FCE2DF; color: #9C2219; }
html.tp-ios-app .nw .nw-tag { display: inline-flex; height: 18px; align-items: center; padding: 0 6px; border-radius: 5px; background: #F1F1EC; font-size: 11px; font-weight: 600; color: #55554F; white-space: nowrap; }
html.tp-ios-app .nw .nw-tag-inf { background: #EEE8FB; color: #5B3FA8; }
html.tp-ios-app .nw .nw-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; background: #9B9B94; }
html.tp-ios-app .nw .nw-dot.is-green { background: #1f7a45; }
html.tp-ios-app .nw .nw-dot.is-red { background: #C0392B; }
html.tp-ios-app .is-amber { color: #8A5A00; }
html.tp-ios-app .is-green { color: #1f7a45; }
html.tp-ios-app .nw .is-masked { letter-spacing: .15em; color: #55554F; }
html.tp-ios-app .nw-ph-tt { display: block; margin-top: 3px; }
html.tp-ios-app .nw .ip-row .ip-row-sub + .ip-row-sub { margin-top: 1px; }
/* filters */
html.tp-ios-app .nw-ph-fbtns { display: flex; align-items: center; gap: 8px; }
html.tp-ios-app .nw-ph-fbtns .ip-pill-btn svg { width: 16px; height: 16px; }
html.tp-ios-app .nw-ph-fbtns .ip-pill-btn.is-on { background: #111; color: #fff; border-color: #111; }
html.tp-ios-app .nw-ph-fpanel { padding: 4px 14px 14px; }
html.tp-ios-app .nw-ph-fpanel .ip-field select, html.tp-ios-app .nw-ph-form .ip-field select { appearance: auto; -webkit-appearance: menulist; width: 100%; }
html.tp-ios-app .nw-ph-fq { margin-top: 12px; }
html.tp-ios-app .nw-ph-exp { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
html.tp-ios-app .nw-ph-dates { display: flex; align-items: center; gap: 8px; }
html.tp-ios-app .nw-ph-sel { min-height: 44px; border: 1px solid var(--grey-200); border-radius: 12px; padding: 0 10px; font: 400 16px -apple-system, system-ui, sans-serif; background: #fff; color: #111; min-width: 0; flex: 1 1 0; }
html.tp-ios-app .nw-ph-tools { display: flex; gap: 8px; align-items: center; }
html.tp-ios-app .nw-ph-tools .nw-ph-sel { flex: 0 0 auto; }
html.tp-ios-app .nw-ph-tools .ip-search { flex: 1 1 auto; min-width: 0; }
html.tp-ios-app .nw-ph-in { min-height: 40px; border: 1px solid var(--grey-200); border-radius: 10px; padding: 0 10px; font: 400 16px -apple-system, system-ui, sans-serif; background: #fff; color: #111; min-width: 0; }
html.tp-ios-app .nw-ph-pager { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
html.tp-ios-app .nw-ph-pager .ip-pill-btn[disabled] { opacity: .4; }
html.tp-ios-app .ip-chip.is-on { background: #111; border-color: #111; color: #fff; }
/* heatmap, month bars, hour strips */
html.tp-ios-app .nw-ph-card .nw-ph-heat { padding: 2px 0 0; }
html.tp-ios-app .nw .nw-months { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; padding: 4px 0 2px; }
html.tp-ios-app .nw .nw-month { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
html.tp-ios-app .nw .nw-month-track { display: flex; align-items: flex-end; width: 100%; max-width: 22px; height: 80px; border-radius: 4px; background: #ECECE6; overflow: hidden; }
html.tp-ios-app .nw .nw-month-track i { display: block; width: 100%; background: #111; border-radius: 4px; }
html.tp-ios-app .nw .nw-month-track i.is-y { background: #F5C500; }
html.tp-ios-app .nw .nw-month b { font-size: 9.5px; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw .nw-month > span:last-child { color: var(--grey-600); font-size: 9.5px; }
html.tp-ios-app .nw-ph-strip { display: block; margin-top: 6px; }
html.tp-ios-app .nw-ph-strip svg { max-width: none !important; }
/* location and business cards */
html.tp-ios-app button.ip-card.nw-ph-loc, html.tp-ios-app button.ip-card.nw-ph-biz { display: flex; flex-direction: column; gap: 6px; width: 100%; text-align: left; font: inherit; color: inherit; }
html.tp-ios-app .nw-ph-loc.is-ghost { opacity: .7; border-style: dashed; }
html.tp-ios-app .nw-ph-loc-h { display: flex; align-items: center; gap: 8px; min-width: 0; width: 100%; }
html.tp-ios-app .nw-ph-loc-h b { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
html.tp-ios-app .nw-ph-loc-n { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; }
html.tp-ios-app .nw-ph-loc-n b { font-size: 16px; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw-ph-loc-s { font-size: 13px; color: var(--grey-600); }
html.tp-ios-app .nw-ph-locchips .ip-chip { min-height: 38px; }
html.tp-ios-app .nw-ph-locset { display: flex; flex-direction: column; gap: 4px; }
html.tp-ios-app .nw-ph-locset .ip-grouphd { margin: 6px 0 0; }
html.tp-ios-app .nw-ph-rchips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
html.tp-ios-app .nw-ph-rchips .nw-tag { height: 32px; padding: 0 10px; font-size: 13px; border: 0; }
html.tp-ios-app .nw-ph-add { display: inline-flex; align-items: center; gap: 2px; min-height: 36px; }
html.tp-ios-app .nw-ph-add svg { width: 14px; height: 14px; }
html.tp-ios-app .nw-ph-steps p { margin: 0 0 10px; font-size: 14px; display: flex; gap: 10px; }
html.tp-ios-app .nw-ph-steps p > b:first-child { flex: none; width: 22px; height: 22px; border-radius: 11px; background: #111; color: #F5C500; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
/* GP */
html.tp-ios-app button.nw-ph-gpsum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; text-align: center; font: inherit; color: inherit; padding: 12px 6px; }
html.tp-ios-app .nw-ph-gpsum > span + span { border-left: 1px solid var(--grey-100); }
html.tp-ios-app .nw-ph-gpsum em { display: block; font-style: normal; font-size: 12px; color: var(--grey-600); }
html.tp-ios-app .nw-ph-gpsum b { display: block; font-size: 17px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.tp-ios-app .nw-ph-gptot .ip-row-title { font-weight: 800; }
html.tp-ios-app .nw-ph-gptot .ip-row-val { font-size: 17px; }
html.tp-ios-app .nw-ph-revealrow { display: flex; justify-content: flex-end; }
html.tp-ios-app .nw-ph-revealrow .ip-btn { width: 100%; }
html.tp-ios-app .nw-ph-hide { display: inline-flex; align-items: center; gap: 6px; color: var(--grey-600); }
html.tp-ios-app .nw-ph-notes, html.tp-ios-app .nw .nw-gpnotes { margin: 0 4px; padding-left: 18px; font-size: 12.5px; line-height: 1.45; color: var(--grey-600); }
html.tp-ios-app .nw .nw-gpnotes li { margin: 0 0 4px; }
html.tp-ios-app .nw-ph-details summary { font-weight: 600; min-height: 32px; display: flex; align-items: center; cursor: pointer; }
html.tp-ios-app .nw-ph-gpseg .ip-seg-opt { font-size: 13px; }
/* setup */
html.tp-ios-app .nw-ph-kvs { padding: 0 14px; }
html.tp-ios-app .nw-ph-kvs .ip-set { padding: 10px 0; align-items: flex-start; }
html.tp-ios-app .nw-ph-kvs .ip-set > span:first-child { flex: none; max-width: 42%; }
html.tp-ios-app .nw-ph-kvs .ip-set > b { display: inline-flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 2px; }
html.tp-ios-app .nw-ph-stepnote { display: flex; gap: 10px; align-items: flex-start; background: #FFFBEA; border-color: #F1E3A6; }
html.tp-ios-app .nw-ph-stepnote > svg { flex: none; margin-top: 2px; color: #8A6A00; }
html.tp-ios-app .nw-ph-stepnote p { margin: 0; font-size: 14px; line-height: 1.4; color: #2b2b28; }
html.tp-ios-app .nw-ph-form { display: flex; flex-direction: column; }
html.tp-ios-app .ip-card.nw-ph-form { padding-top: 2px; }
html.tp-ios-app .nw-ph-form .ip-field input:disabled { background: #F4F4EF; color: #8A8A83; }
html.tp-ios-app .nw-ph-form .ip-btn { margin-top: 12px; }
html.tp-ios-app .ip-stack .ip-btn { margin-top: 0; }
html.tp-ios-app .nw-ph-check { margin-top: 14px; align-items: center !important; min-height: 32px; font-size: 15px; }
html.tp-ios-app .nw-ph-week { padding: 4px 12px; }
html.tp-ios-app .nw .nw-week { display: flex; flex-direction: column; }
html.tp-ios-app .nw .nw-week-r { display: grid; grid-template-columns: minmax(0, 1fr) 92px 18px 92px; gap: 6px; align-items: center; min-height: 52px; border-top: 1px solid var(--grey-100); }
html.tp-ios-app .nw .nw-week-r:first-child { border-top: 0; }
html.tp-ios-app .nw .nw-week-r.is-closed > .nw-mute { grid-column: 2 / span 3; text-align: right; }
html.tp-ios-app .nw .nw-week-r .nw-check { align-items: center; font-size: 15px; }
html.tp-ios-app .nw .nw-week-r input[type="time"] { min-height: 38px; border: 1px solid var(--grey-200); border-radius: 10px; padding: 0 6px; font: 400 15px -apple-system, system-ui, sans-serif; background: #fff; width: 100%; box-sizing: border-box; }
html.tp-ios-app .nw-ph-name-r { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; border-top: 1px solid var(--grey-100); }
html.tp-ios-app .ip-list > .nw-ph-name-r:first-child { border-top: 0; }
html.tp-ios-app .nw-ph-name-f { display: flex; gap: 8px; }
html.tp-ios-app .nw-ph-name-f .nw-ph-in { flex: 1 1 auto; }
html.tp-ios-app .nw-ph-name-f .nw-ph-btn { flex: none; padding: 0 16px; }
html.tp-ios-app .nw-ph-labelform { display: flex; gap: 8px; margin-top: 6px; }
html.tp-ios-app .nw-ph-labelform .nw-ph-in { flex: 1 1 auto; }
html.tp-ios-app .nw-ph-labelform .nw-ph-btn { flex: none; padding: 0 14px; }
html.tp-ios-app .nw-ph-name { min-height: 32px; padding: 0; align-self: flex-start; color: #8A6A00; }
html.tp-ios-app .nw-ph-notice .nw-check { font-size: 15px; }
html.tp-ios-app .nw-ph-gaps p { margin: 0 0 8px; font-size: 14px; line-height: 1.4; }
html.tp-ios-app .nw-ph-funnel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
html.tp-ios-app .nw-ph-funnel b { display: block; font-size: 22px; font-variant-numeric: tabular-nums; }
html.tp-ios-app .nw-ph-funnel span { font-size: 13px; color: var(--grey-600); }
html.tp-ios-app .nw-ph-mseg { margin-top: 2px; }
html.tp-ios-app .nw-ph-acts-in { padding: 8px 0 0; }
html.tp-ios-app .nw-ph-btn[disabled] { opacity: .45; }
html.tp-ios-app .nw-ph-btn.is-danger { color: #9C2219; }
/* API keys */
html.tp-ios-app .nw-ph-apikey { display: flex; flex-direction: column; gap: 3px; }
html.tp-ios-app .nw-ph-apikey.is-dim { opacity: .65; }
html.tp-ios-app .nw-ph-apikey .ip-meta { overflow-wrap: anywhere; }
html.tp-ios-app .nw-ph-connect { overflow: hidden; }
html.tp-ios-app .nw-ph-connect .nw-kv { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 8px 0; border-top: 1px solid var(--grey-100); font-size: 13px; }
html.tp-ios-app .nw-ph-connect .nw-kv:first-child { border-top: 0; }
html.tp-ios-app .nw-ph-connect .nw-kv > span { color: var(--grey-600); flex: 1 0 100%; }
html.tp-ios-app .nw-ph-connect .nw-kv > b { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; font-weight: 500; }
html.tp-ios-app .nw-ph-connect .nw-kv .nw-link { border: 0; background: none; font: 600 14px -apple-system, system-ui, sans-serif; color: #8A6A00; min-height: 36px; padding: 0 4px; }
html.tp-ios-app .nw .nw-kicker { margin: 10px 0 4px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--grey-600); }
html.tp-ios-app .nw .nw-code { margin: 0 0 6px; padding: 10px 12px; border-radius: 10px; background: #F4F4EF; color: #1d1d1b; font: 500 12px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
html.tp-ios-app .nw .nw-api-secret { display: flex; gap: 10px; align-items: center; padding: 12px; border-radius: 12px; background: #FFF7D6; border: 1px solid #F1D97A; }
html.tp-ios-app .nw .nw-api-secret code { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 14px; user-select: all; -webkit-user-select: all; }
html.tp-ios-app .nw-ph-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
html.tp-ios-app .nw .nw-api-preset { display: flex; flex-direction: column; gap: 3px; text-align: left; padding: 10px 12px; min-height: 44px; border-radius: 12px; border: 1px solid var(--grey-200); background: #fff; font: inherit; color: inherit; }
html.tp-ios-app .nw .nw-api-preset small { color: var(--grey-600); font-size: 12px; line-height: 1.35; }
html.tp-ios-app .nw .nw-api-preset.is-on { border-color: #111; box-shadow: inset 0 0 0 1px #111; background: #FFFBEA; }
html.tp-ios-app .nw-ph-scopes { display: flex; flex-direction: column; gap: 10px; }
html.tp-ios-app .nw .nw-api-scope.is-off { opacity: .55; }
html.tp-ios-app .nw .nw-api-scope input, html.tp-ios-app .nw .nw-api-rec input { width: 22px; height: 22px; }
html.tp-ios-app .nw-ph-sheet code, html.tp-ios-app .nw-ph-apikey code { font: 500 12.5px ui-monospace, SFMono-Regular, Menlo, monospace; }
html.tp-ios-app .nw-ph-route .ip-row { min-height: 48px; }
html.tp-ios-app .nw-ph-route .nw-why-track { width: 100%; margin-top: 4px; }
html.tp-ios-app .nw-ph-dcard.nw-holly .nw-card-h { display: none; }
/* NETWRK N5 (iPhone): API keys list */
html.tp-ios-app .nw-ph-apirow .ip-row-sub { white-space: normal; overflow-wrap: anywhere; }
html.tp-ios-app .nw-ph-apirow .ip-row-trail { flex: none; }
html.tp-ios-app .nw-ph-apirow .nw-ph-btn { flex: none; padding: 0 16px; color: #9C2219; }
html.tp-ios-app .nw-ph-apirow .ip-row-main { min-width: 0; }