/* Approved V1 dense list / V2 phone surfaces. No application-shell rules. */
@media screen {
  body:has(#vendors-content:not(.hidden)) { zoom:1!important; }
  #vendors-content, #vnd-density-layout, #vnd-density-detail, #vnd-density-row-menu {
    --vnd-bg:var(--ui-bg,#f5f5f7); --vnd-surface:var(--ui-surface,#fff);
    --vnd-field:var(--ui-fill-subtle,#f7f7f9); --vnd-text:var(--ui-text-1,#242426);
    --vnd-secondary:var(--ui-text-2,#65656b); --vnd-line:var(--ui-line,#d2d2d7);
    --vnd-selected:var(--ui-accent-tint,#e8f2ff); --vnd-link:var(--ui-accent,#005ec4);
    --vnd-action:var(--ui-accent,#0071e3); --vnd-danger:var(--ui-danger,#b42318);
    --vnd-scrim:var(--ui-scrim,rgba(28,28,30,.32));
    font-family:var(--ui-font,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif);
    color:var(--vnd-text);
  }
  #vendors-content>.container { max-width:none!important; }
  #vendors-content>.container>div { background:transparent!important; box-shadow:none!important; border:0!important; }
  #vendors-content>.container>div>div:first-child { padding:12px 0!important; background:transparent!important; border-bottom:0!important; gap:8px!important; }
  #vendors-content>.container>div>div:first-child h2 { font-size:17px!important; line-height:24px!important; font-weight:600!important; }
  #vendors-content>.container>div>.p-6 { padding:0!important; }
  #vendor-search-input, #vendor-type-filter { height:28px!important; min-height:28px!important; padding-block:0!important; font-size:13px!important; }
  #vendors-content button[onclick="openVendorModal()"], #vnd-density-view-toggle { min-height:28px; padding-block:0!important; }
  #vnd-density-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; align-items:start; min-width:0; font-size:13px; line-height:1.4; }
  #vnd-density-layout.has-detail { grid-template-columns:minmax(0,1fr) 320px; }
  #vnd-density-card { min-width:0; border:1px solid var(--vnd-line); border-radius:8px; overflow:hidden; background:var(--vnd-surface); }
  #vnd-density-scroll { overflow:auto; max-width:100%; overscroll-behavior-x:contain; }
  #vnd-density-table { border-collapse:separate; border-spacing:0; width:100%; min-width:1094px; table-layout:fixed; font:inherit; }
  #vnd-density-table th, #vnd-density-table td { height:28px!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; box-sizing:border-box; border:0!important; padding:0 8px!important; box-shadow:inset 0 -1px var(--vnd-line); font:inherit; background:var(--vnd-surface); color:var(--vnd-text); }
  #vnd-density-table th { height:30px!important; background:var(--vnd-field)!important; font-size:12px!important; font-weight:500!important; color:var(--vnd-secondary)!important; text-align:left; }
  #vnd-density-table tr[data-vnd-id] { cursor:pointer; outline-offset:-2px; }
  #vnd-density-table tr[aria-selected="true"] td { background:var(--vnd-selected); }
  #vnd-density-table .vnd-name { font-weight:500; }
  #vnd-density-table .vnd-secondary { color:var(--vnd-secondary); font-size:12px; }
  #vnd-density-table button { width:30px; height:24px; min-height:24px; padding:0; border:1px solid var(--vnd-line); border-radius:5px; line-height:16px; background:var(--vnd-surface); font-size:18px; color:var(--vnd-secondary); box-shadow:none; }
  #vnd-density-card .vnd-density-count { padding:8px 10px; color:var(--vnd-secondary); font-size:12px; }
  #vnd-density-detail { min-width:0; background:var(--vnd-surface); border:1px solid var(--vnd-line); border-radius:8px; overflow-y:auto; max-height:calc(100dvh - 170px); position:sticky; top:112px; font-size:13px; line-height:1.4; }
  #vnd-density-detail .vnd-detail-head { padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:8px; border-bottom:1px solid var(--vnd-line); position:sticky; top:0; background:var(--vnd-surface); z-index:1; }
  #vnd-density-detail .vnd-detail-head strong, #vnd-density-detail .vnd-detail-head h3 { margin:0; font-weight:600; font-size:14px; overflow-wrap:anywhere; }
  #vnd-density-detail :is(button,a) { font:inherit; }
  #vnd-density-detail .vnd-detail-head button { flex-shrink:0; border:0; background:var(--vnd-field); border-radius:6px; min-width:28px; height:28px; font-size:18px; color:var(--vnd-secondary); }
  #vnd-density-detail .vnd-detail-body { min-width:0; }
  #vnd-density-detail dl { margin:0; padding:0 12px; }
  #vnd-density-detail dl>div { padding:8px 0; border-bottom:1px solid var(--vnd-line); }
  #vnd-density-detail dt { font-size:11px; color:var(--vnd-secondary); margin-bottom:3px; }
  #vnd-density-detail dd { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
  #vnd-density-detail dl>dt { padding-top:8px; }
  #vnd-density-detail dl>dd { padding-bottom:8px; border-bottom:1px solid var(--vnd-line); }
  #vnd-density-detail .vnd-detail-body button { min-height:28px; padding:0 8px; border:1px solid var(--vnd-line); border-radius:6px; color:var(--vnd-link); background:var(--vnd-surface); }
  #vnd-density-detail a { color:var(--vnd-link); text-decoration:underline; }
  #vnd-density-detail .vnd-detail-foot { padding:10px 12px; }
  #vnd-density-detail .vnd-detail-foot button { width:100%; height:30px; border:1px solid var(--vnd-line); background:var(--vnd-field); border-radius:6px; color:var(--vnd-text); }
  #vnd-density-row-menu { position:fixed; z-index:51000; min-width:144px; max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); overflow-y:auto; padding:4px; border:1px solid var(--vnd-line); border-radius:8px; background:var(--vnd-surface); box-shadow:0 8px 24px #0002; font-size:13px; line-height:1.4; }
  #vnd-density-row-menu button { display:block; width:100%; height:30px; text-align:left; border:0; border-radius:4px; background:transparent; color:var(--vnd-text); padding:0 9px; font:inherit; }
  #vnd-density-row-menu button.vnd-menu-danger { color:var(--vnd-danger); border-top:1px solid var(--vnd-line); border-radius:0; margin-top:3px; }
  #vnd-density-detail-scrim { display:none; }
  #vnd-density-layout[hidden], #vnd-density-layout [hidden], #vnd-density-detail[hidden], #vnd-density-detail [hidden], #vnd-density-row-menu[hidden], #vnd-density-detail-scrim[hidden] { display:none!important; }
  #vnd-density-layout :focus-visible, #vnd-density-detail :focus-visible, #vnd-density-row-menu :focus-visible { outline:2px solid var(--vnd-link); outline-offset:-2px; }
  #vnd-density-row-menu button:disabled, #vnd-density-row-menu button[aria-disabled="true"], #vnd-density-detail button:disabled, #vnd-density-table button:disabled { opacity:.5; cursor:not-allowed; }
}
@media screen and (hover:hover) {
  #vnd-density-table tr:not([aria-selected="true"]):hover td { background:var(--vnd-field); }
  #vnd-density-row-menu button:not(:disabled):not([aria-disabled="true"]):hover { background:var(--vnd-action); color:#fff; }
  #vnd-density-row-menu button.vnd-menu-danger:not(:disabled):not([aria-disabled="true"]):hover { background:var(--vnd-danger); color:#fff; }
}
@media screen and (max-width:768px) {
  #vendors-content, #vnd-density-layout, #vnd-density-detail, #vnd-density-row-menu { --vnd-bg:#f2f2f7; --vnd-surface:#fff; --vnd-field:#f2f2f7; --vnd-text:#1c1c1e; --vnd-secondary:#636369; --vnd-line:#d1d1d6; --vnd-selected:#e9e9ef; --vnd-link:#005ec4; --vnd-action:#0071e3; -webkit-text-size-adjust:100%; }
  #vendors-content>.container>div>div:first-child { padding:8px 0!important; }
  #vendors-content>.container>div>div:first-child>div { width:100%; gap:6px!important; flex-wrap:wrap; }
  #vendors-content>.container>div>div:first-child>div>.relative { flex:1 1 100%; }
  #vendor-search-input { width:100%!important; }
  #vendor-search-input, #vendor-type-filter { height:44px!important; min-height:44px!important; font-size:16px!important; border-radius:10px!important; background:var(--vnd-surface)!important; color:var(--vnd-text)!important; border-color:var(--vnd-line)!important; }
  #vendors-content button[onclick="openVendorModal()"], #vnd-density-view-toggle { min-height:44px!important; }
  #vnd-density-card { border-radius:12px; }
  #vnd-density-table th { height:32px!important; }
  #vnd-density-table td { height:44px!important; font-size:14px!important; }
  #vnd-density-table .vnd-name, #vnd-density-table th:first-child { position:sticky; left:0; z-index:1; box-shadow:inset 0 -1px var(--vnd-line),inset -1px 0 var(--vnd-line); }
  #vnd-density-table :is(td,th):last-child { padding:0 5px!important; }
  #vnd-density-table button { width:44px; height:44px; min-height:44px; border:0; background:transparent; color:var(--vnd-link); font-size:24px; border-radius:10px; touch-action:manipulation; }
  #vnd-density-layout.has-detail { grid-template-columns:minmax(0,1fr); }
  #vnd-density-detail-scrim:not([hidden]) { display:block; position:fixed; inset:0; background:var(--ui-scrim,rgba(28,28,30,.32)); z-index:49000; }
  #vnd-density-detail { position:fixed; z-index:49001; inset:auto 8px calc(8px + env(safe-area-inset-bottom,0px)); top:auto; max-height:70dvh; background:var(--vnd-bg); box-shadow:0 8px 32px #0003; border-radius:20px; padding-bottom:env(safe-area-inset-bottom,0px); }
  #vnd-density-detail .vnd-detail-head strong, #vnd-density-detail .vnd-detail-head h3 { font-size:17px; }
  #vnd-density-detail .vnd-detail-head button { width:44px; height:44px; border-radius:50%; background:var(--vnd-selected); }
  #vnd-density-detail dl { padding:10px; }
  #vnd-density-detail dl>div { padding:9px 10px; background:var(--vnd-surface); }
  #vnd-density-detail dl>dt { margin:0; padding:9px 10px 3px; background:var(--vnd-surface); }
  #vnd-density-detail dl>dd { padding:0 10px 9px; background:var(--vnd-surface); }
  #vnd-density-detail .vnd-detail-body button { min-height:44px; min-width:44px; touch-action:manipulation; }
  #vnd-density-detail .vnd-detail-foot button { height:44px; background:var(--vnd-action); color:#fff; border:0; border-radius:12px; font-size:16px; }
  #vnd-density-row-menu { border-radius:14px; }
  #vnd-density-row-menu button { height:44px; border-radius:8px; touch-action:manipulation; }
}
@media screen and (max-width:768px) and (prefers-color-scheme:dark) {
  #vendors-content, #vnd-density-layout, #vnd-density-detail, #vnd-density-row-menu { --vnd-bg:#000; --vnd-surface:#1c1c1e; --vnd-field:#252528; --vnd-text:#f2f2f7; --vnd-secondary:#b1b1b6; --vnd-line:#45454a; --vnd-selected:#303035; --vnd-link:#8abdff; --vnd-danger:#ff6961; }
}
@media screen and (max-width:768px) and (hover:none) {
  #vnd-density-table tr:not([aria-selected="true"]):hover td { background:var(--vnd-surface); }
  #vnd-density-row-menu button:not(:disabled):not([aria-disabled="true"]):active { background:var(--vnd-selected); }
}
@media screen and (prefers-reduced-transparency:reduce) {
  #vnd-density-detail-scrim:not([hidden]) { background:#343438; }
}
@media screen and (prefers-reduced-motion:reduce) {
  #vnd-density-layout, #vnd-density-layout *, #vnd-density-detail, #vnd-density-detail *, #vnd-density-row-menu, #vnd-density-row-menu * { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
}