/* UNITOP B/S 0.5.1 — restore the V0.4 desktop presentation only.
 * The V0.5 mobile presentation and business components remain unchanged.
 * Desktop baseline below is copied from the retained V0.4 style.css.
 */
.desktop-sidebar, .desktop-topbar { display: none; }

@media (min-width: 721px) {
:root{--navy:#122b45;--blue:#2366b1;--bg:#f5f7fa;--text:#1c2d41;--muted:#788696;--line:#e7ecf1;--mint:#e8f5f0;--green:#248569}

*{box-sizing:border-box}
body{margin:0;font-family:Inter,"Segoe UI","Microsoft YaHei",Arial,sans-serif;color:var(--text);font-size:14px;background:var(--bg)}
[v-cloak]{display:none}
.symbols{position:absolute;width:0;height:0;overflow:hidden}
button,a,input,select,textarea{font:inherit}
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:37px;border:1px solid #dbe2ea;background:#fff;border-radius:7px;padding:8px 14px;color:#405064;cursor:pointer;text-decoration:none;white-space:nowrap}
button:hover,.button:hover{border-color:#9ab0c8;background:#f7f9fc}
button:disabled{opacity:.5;cursor:not-allowed}
button.primary{background:var(--blue);color:white;border-color:var(--blue);font-weight:600}
button.primary:hover{background:#1b579b}
.primary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
button.small{min-height:33px;padding:5px 12px}
button.link,.link{border:0;min-height:0;background:none;padding:0;color:var(--blue);text-decoration:none;cursor:pointer}
button.link:hover,a.link:hover{text-decoration:underline;background:none}
.subtle{color:var(--muted)}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
.danger{color:#b94949!important}

input,select,textarea{width:100%;min-height:39px;padding:9px 11px;border:1px solid #dbe3eb;border-radius:6px;color:var(--text);background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:#4b86c7;box-shadow:0 0 0 3px #e9f1fb}
input:disabled,select:disabled,.read-only{background:#f4f6f9;color:#768396}
input[type=checkbox]{width:15px;height:15px;min-height:0;accent-color:var(--blue);box-shadow:none}
input[type=file]{padding:9px;background:#fafbfd}
textarea{min-height:83px;resize:vertical}
label{display:block;font-weight:500;line-height:1.5}
label input,label select,label textarea,label .country-field{margin-top:6px}
small,label small{font-size:12px;color:var(--muted);font-weight:400;display:block;margin-top:5px;line-height:1.5}
em{color:#c85151;font-style:normal}
p{line-height:1.65}
h1{font-size:27px;letter-spacing:-.4px;line-height:1.3;margin:6px 0 8px}
h2{font-size:21px;margin:5px 0}
h3{font-size:15px;margin:0 0 17px}
svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;color:#8290a0}
.boot{display:flex;height:100vh;align-items:center;justify-content:center;color:var(--muted)}

.sidebar{position:fixed;width:225px;inset:0 auto 0 0;background:var(--navy);color:#b7c7d8;display:flex;flex-direction:column;padding:27px 15px 18px;z-index:10}
.brand{display:flex;align-items:center;gap:12px;padding:0 15px 35px;color:#fff}
.brand-mark{height:36px;width:36px;background:#377bbb;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:25px;font-weight:750;flex-shrink:0}
.brand b{font-size:19px;letter-spacing:2px}
.brand span{display:block;font-size:8px;letter-spacing:1.1px;margin-top:5px;color:#9eb2c9}
.nav-label{font-size:11px;color:#738da6;padding:0 16px;margin:8px 0 12px;letter-spacing:1px}
.settings-label{margin-top:37px}
.nav-item{justify-content:flex-start;height:45px;padding:10px 15px;border:0;border-radius:7px;margin:3px 0;background:none;color:#b4c5d6;gap:13px}
.nav-item svg{width:19px;height:19px}
.nav-item.active{background:#244c74;color:#fff}
.nav-item.active i{height:5px;width:5px;border-radius:50%;background:#64a5dd;margin-left:auto}
.nav-item:hover{background:#1d3d5d;color:#fff}
.sidebar-bottom{margin-top:auto;padding:16px 15px;font-size:11px;color:#7f9bb4;display:flex;align-items:center;gap:7px}
.dot{height:5px;width:5px;border-radius:50%;background:#6fc9b0}
.workspace{margin-left:225px;min-height:100vh}
.topbar{height:75px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 35px}
.breadcrumb{font-size:12px;color:#8290a1}
.breadcrumb span{margin:0 12px;color:#bac4d0}
.breadcrumb b{font-weight:500;color:#4e6175}
.top-actions{display:flex;align-items:center;gap:12px;font-size:12px}
.version-tag{font-size:10px;padding:4px 8px;border:1px solid #e4e9ef;color:#8a97a4;border-radius:5px;margin-right:8px}
.avatar{width:29px;height:29px;background:#eaf1f8;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#4c7199;font-weight:600}
.user-name{font-weight:600}
main{padding:32px 35px 40px;max-width:1750px;margin:auto}
.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px;gap:20px}
.page-heading p{margin:0;font-size:12px;color:var(--muted)}
.heading-actions{display:flex;gap:10px;flex-shrink:0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:25px}
.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:21px;display:flex;align-items:center;gap:16px;position:relative;min-height:108px}
.stat-icon{width:44px;height:44px;border-radius:11px;background:#eaf1fb;color:#527db5;display:flex;align-items:center;justify-content:center}
.stat-icon svg{width:23px;height:23px}
.stat-icon.mint{background:#eaf7f2;color:#419580}
.stat-icon.amber{background:#fcf3e8;color:#b38b48}
.stat span{font-size:12px;color:#7c8998;display:block}
.stat strong{font-size:28px;line-height:1.4;font-weight:650;display:block;margin-top:2px}
.stat>small{position:absolute;right:18px;bottom:24px;font-size:10px;color:#a1acb9}

.panel{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.panel-top{display:flex;align-items:center;justify-content:space-between;padding:0 21px;min-height:62px;border-bottom:1px solid var(--line);gap:15px;font-size:12px}
.tabline{display:flex;align-items:stretch;align-self:stretch;gap:25px}
.tabline button{background:none;border:0;border-radius:0;padding:15px 0;color:#87929f;position:relative}
.tabline button.selected{color:var(--blue);font-weight:600}
.tabline button.selected:after{content:"";height:3px;background:var(--blue);position:absolute;bottom:0;left:0;right:0;border-radius:3px}
.tabline button span{margin-left:3px;padding:2px 5px;background:#f0f4f9;border-radius:4px;font-size:10px}
.filters{padding:19px 21px;display:flex;align-items:center;gap:10px}
.search-box{position:relative;min-width:235px;max-width:410px;flex:1}
.search-box input{padding-left:34px;font-size:12px;background:#fafbfc}
.search-box svg{position:absolute;left:11px;top:12px;width:16px;height:16px;color:#93a0ae}
.filters>select{width:auto;max-width:210px;min-width:130px;font-size:12px}
.icon-button{padding:5px 11px;min-width:36px;color:#7d91a6}
.table-wrap{width:100%;overflow:auto}
table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap;font-size:12px}
th{font-size:11px;color:#8a97a6;font-weight:500;background:#f8fafc;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 18px}
td{padding:18px;border-bottom:1px solid #edf1f5;vertical-align:middle;max-width:380px;overflow-wrap:anywhere}
td small{font-size:10px;margin-top:6px}
tbody tr:last-child td{border-bottom:0}
.customer-table tbody tr{cursor:pointer}
.customer-table tbody tr:hover{background:#fafcff}
.customer-table{min-width:880px}
.company-cell b{font-size:13px;font-weight:600}
.code-pill{display:inline-block;padding:6px 10px;border:1px solid #e3eaf4;background:#f4f7fc;border-radius:5px;font-weight:700;color:#496b96;font-size:12px;letter-spacing:.5px}
.code{font-weight:700;letter-spacing:.4px}
.badge{display:inline-flex;align-items:center;font-size:10px;color:#47769e;background:#edf4fb;border-radius:4px;padding:4px 8px;white-space:nowrap}
.badge.green{color:#31866c;background:#e9f6f0}
.badge.amber{color:#ab8450;background:#fcf3e6}
.badge.muted{color:#8995a3;background:#f0f2f5}
.count-chip{color:#607184;font-size:11px}
.row-arrow{width:14px;height:14px;color:#aab6c4}
.table-footer{display:flex;justify-content:space-between;align-items:center;padding:16px 21px;border-top:1px solid var(--line);font-size:11px;color:#92a0af;gap:15px}
.pagination{display:flex;gap:12px;align-items:center}
.pagination button{font-size:10px;min-height:28px;padding:5px 9px}
.empty{text-align:center;padding:55px 20px;color:#8d9aab;font-size:13px}
.footnote{font-size:11px;color:#95a0ae;margin-top:18px}
.back-link{border:0;background:none;color:#8b97a4;padding:0;font-size:12px;margin-bottom:22px}
.detail-heading{display:flex;align-items:center;gap:21px;margin:5px 0 28px}
.detail-code{width:70px;height:70px;background:#e4edf8;border:1px solid #d5e3f3;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#4e76a6;font-weight:700;font-size:19px}
.detail-heading h1{margin:0 0 6px;font-size:25px}
.detail-heading p{font-size:12px;color:#8591a0;margin:0 0 9px}
.detail-heading .heading-actions{margin-left:auto}
.detail-summary{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:9px;margin-bottom:25px;padding:22px 25px;gap:20px}
.detail-summary span{color:#8b98a8;font-size:11px;display:block}
.detail-summary b{font-size:12px;display:block;margin-top:9px;font-weight:500}
.info-content{padding:28px}
.info-section+.info-section{margin-top:30px;border-top:1px solid var(--line);padding-top:26px}
.info-grid{margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:23px 35px}
.info-grid dt{color:#8a97a8;font-size:11px;margin-bottom:7px}
.info-grid dd{margin:0;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
.brand-content,.location-content{padding:25px}
.section-line{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.section-line h3,.section-line p{margin:0}
.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.brand-card,.location-card{border:1px solid var(--line);border-radius:8px;padding:22px}
.brand-card h3{margin:15px 0 10px}
.brand-card p{font-size:12px;color:#8b97a8;white-space:pre-wrap;margin:0}
.location-card+.location-card{margin-top:15px}
.location-card p{margin:6px 0;font-size:13px;white-space:pre-wrap}
.location-card .badge{margin-left:10px}
.location-card .section-line{margin-bottom:15px}

.dictionary-tabs{display:flex;flex-wrap:wrap;gap:2px;padding:15px 16px;border-bottom:1px solid var(--line)}
.dictionary-tabs button{border:0;font-size:12px;background:none;min-height:32px;padding:6px 11px}
.dictionary-tabs button.selected{background:#edf3fa;color:var(--blue)}
.country-table{max-height:550px}
.country-table th{position:sticky;top:0;z-index:1}
.country-table td{padding:12px 18px}

.auth-shell{min-height:100vh;background:radial-gradient(ellipse at top right,#e6edf6,transparent 60%),#f5f7fa;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:35px}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:30px}
.auth-brand b{font-size:23px;letter-spacing:2px}
.auth-brand span{border-left:1px solid #d7e0e9;padding-left:15px;color:#90a0b0;font-size:12px}
.auth-card{width:420px;max-width:100%;padding:37px;background:#fff;border:1px solid #e4eaf1;border-radius:14px;box-shadow:0 8px 32px #18355106}
.auth-card h1{font-size:24px;margin-top:10px}
.auth-card p{color:#8390a0;font-size:12px;margin-bottom:24px}
.auth-card label{margin-bottom:18px;font-size:12px}
.full{width:100%;margin-top:5px}
.auth-note{font-size:10px;color:#9aa7b5;margin-top:23px;line-height:1.6}
.auth-footer{margin-top:28px;font-size:9px;color:#99a9b9;letter-spacing:1px}

.modal-backdrop{position:fixed;inset:0;background:#11233966;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:25px;z-index:100}
.modal{width:680px;max-width:100%;max-height:92vh;overflow:hidden;border-radius:11px;background:#fff;box-shadow:0 20px 90px #142c4933;display:flex;flex-direction:column}
.modal.wide{width:860px}
.modal-header{padding:21px 26px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.modal-header .eyebrow{font-size:9px}
.close{border:0;background:none;font-size:26px;color:#95a2b0;padding:0;width:30px;min-height:30px}
.modal form{overflow:auto;display:flex;flex-direction:column;min-height:0}
.modal-tabs{display:flex;gap:6px;padding:15px 24px 0}
.modal-tabs button{border:0;font-size:12px;color:#8b99a9}
.modal-tabs button.selected{color:#2b6eb4;background:#edf3fa}
.modal-body{padding:24px 26px;overflow:auto;min-height:170px}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 22px}
.span2{grid-column:span 2}
.modal-body label{font-size:12px}
.modal-body>.form-grid+p{margin:0}
.modal-body>div>label{margin-bottom:17px}
.modal-body .form-grid>label{margin:0}
.check{display:flex;align-items:center;gap:9px;min-height:37px}
.check input{margin:0}
.checkbox-list{display:flex;flex-wrap:wrap;gap:8px 13px;margin:7px 0 10px}
.checkbox-list label{display:flex;align-items:center;gap:6px;background:#f5f8fc;border:1px solid #e5edf4;border-radius:6px;padding:7px 10px}
.checkbox-list label input{margin:0}
.checkbox-list label small{margin:0;font-size:10px}
.field-block>small{font-size:10px}
.brand-form{border:1px solid var(--line);padding:19px;border-radius:8px;margin-top:15px}
.brand-form>.link{margin-top:15px;font-size:11px}
.modal-footer{padding:17px 26px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;background:#fafbfd}
.modal-footer>.subtle{font-size:10px}
.footer-actions{margin-left:auto;display:flex;gap:10px}
.form-error{background:#fff2f0;border:1px solid #f6ddd8;color:#b14a3f!important;border-radius:6px;padding:10px 13px;font-size:12px;line-height:1.7;margin:19px 0 0!important}
.import-note{background:#eef4fc;padding:15px;border-radius:6px;color:#617a97;font-size:12px;line-height:1.7;margin-bottom:20px}
.import-preview{margin-top:22px;border:1px solid var(--line);padding:17px;border-radius:7px}
.import-preview p{font-size:12px}
.preview-stats{display:flex;gap:25px;color:#54779d;margin-bottom:15px}
.toast{position:fixed;top:24px;left:50%;transform:translateX(-50%);background:#163a56;color:#fff;box-shadow:0 5px 20px #0b2a4130;padding:12px 23px;border-radius:8px;z-index:200;max-width:90vw;font-size:13px}
pre{font-size:11px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;color:#64798e}


  /* Retain the V0.5 mobile DOM and hide it only on desktop. */
  .app-shell { padding-left: 225px; }

  .app-shell > .site-header { display: none; }

  .desktop-sidebar { display: flex; }

  .desktop-topbar { display: flex; }

  main { min-height: calc(100vh - 75px); }

  main > .breadcrumb { display: none; }

  .desktop-table { display: block; }

  .mobile-customer-list { display: none; }

  .desktop-topbar .breadcrumb { margin: 0; }

  .desktop-topbar .version-tag { display: inline-block; }

  .desktop-topbar .user-name { display: inline; }

  .desktop-sidebar .brand b { line-height: 1.2; }

  .desktop-sidebar .brand span { font-weight: 400; }

  .desktop-sidebar .brand-mark { border: 0; }

  .desktop-sidebar .nav-item { width: 100%; font-weight: 400; min-height: 45px; }

  .desktop-topbar .top-actions button { font-size: 12px; }

  .desktop-sidebar .nav-item.active { background: #244c74; color: #fff; }

  .desktop-sidebar .nav-item:hover { background: #1d3d5d; color: #fff; }

  .desktop-sidebar .brand { margin: 0; }

  .workspace-footer { padding: 26px 0 3px; color: #95a0ae; }


  /* Map the preserved V0.5 customer-detail and approval DOM to V0.4 density. */
  .panel, .stat { box-shadow: none; }

  .panel-top h2 { font-size: 15px; margin: 0; }

  .panel-top small { font-size: 11px; }

  .count { font-size: 10px; border-radius: 4px; background: #f0f4f9; }

  .list-controls { padding: 0 21px; }

  .list-controls .filters { padding: 19px 0; }

  .list-controls .tabline { border-bottom: 1px solid var(--line); }

  .tabline button { min-height: 45px; font-size: 12px; }

  .filters > select { font-size: 12px; }

  .filters .reset-button { font-size: 12px; min-height: 37px; }

  .filters input { min-height: 39px; }

  input:not([type=checkbox]), select, textarea { border-color: #dbe3eb; border-radius: 6px; padding: 9px 11px; min-height: 39px; line-height: normal; }

  .search-box input { padding-left: 34px; }

  button, .button { font-weight: 400; line-height: normal; }

  button.primary, .button.primary { font-weight: 600; }

  h1, h2, h3 { color: var(--text); font-weight: 700; }

  .page-heading h1 { font-size: 27px; }

  .page-heading p { margin-top: 0; }

  .eyebrow { margin-bottom: 0; }

  .stat span:not(.stat-icon) { font-size: 12px; }

  .stat-icon { flex-shrink: 0; }

  .stat-icon.contacts { background: #eaf7f2; color: #419580; }

  .stat-icon.locations { background: #fcf3e8; color: #b38b48; }

  .customer-table { min-width: 1000px; }

  .company-name { font-size: 13px; font-weight: 600; display: block; }

  .customer-table td small { display: block; }

  .customer-table td { line-height: 1.65; }

  .badge { font-weight: 400; line-height: normal; }

  .badge.red { color: #a32e42; background: #fceef0; }

  .status-notice { border-radius: 8px; font-size: 12px; margin-bottom: 15px; }

  .approval-bar { border-radius: 8px; padding: 16px 21px; margin-bottom: 25px; }

  .approval-bar small { font-size: 11px; }

  .detail-heading { flex-wrap: wrap; }

  .detail-heading .heading-actions { flex-wrap: wrap; }

  .detail-title h1 { font-size: 25px; }

  .detail-title p { font-size: 12px; margin: 0 0 9px; }

  .detail-tabs { gap: 25px; padding: 0 21px; }

  .detail-tabs button { min-height: 62px; padding: 15px 0; font-size: 12px; border-radius: 0; }

  .detail-tabs button.selected::after { left: 0; right: 0; }

  .detail-body { padding: 28px; }

  .detail-body h2 { font-size: 15px; }

  .detail-body .info-grid { margin-top: 20px; }

  .info-grid dd { line-height: 1.75; }

  .section-heading { margin-bottom: 18px; }

  .section-heading p { font-size: 12px; }

  .section-line > small { font-size: 11px; }

  .detail-search { margin-bottom: 18px; }

  .contact-grid, .location-grid, .group-grid { gap: 15px; }

  .brand-card, .contact-card, .location-card, .group-card { border-radius: 8px; padding: 22px; }

  .location-card + .location-card { margin-top: 0; }

  .brand-card h3 { font-size: 15px; }

  .brand-card-top { margin-bottom: 15px; }

  .brand-card-top img, .image-placeholder { border-radius: 6px; }

  .name-link { min-height: 0; font-size: 15px; }

  .scope-caption, .contact-card > p, .contact-channels, .address-text { font-size: 12px; }

  .linked-section { padding-top: 15px; margin-top: 18px; }

  .linked-section > small { display: block; }

  .staff-summary { padding: 20px; border-radius: 8px; }

  .staff-summary dt, .group-card dt { font-size: 11px; }

  .staff-summary dd, .group-card dd { font-size: 12px; }

  .group-card h3 { margin-bottom: 18px; }

  .card-actions { margin-top: 18px; padding-top: 15px; }

  .card-actions button { font-size: 11px; min-height: 33px; }

  .link-chips button { min-height: 30px; padding: 6px 9px; border-radius: 6px; font-size: 11px; }

  .review-note, .sop-card, .group-form, .scope-picker, .success-panel { border-radius: 8px; }

  .file-list { font-size: 12px; }

  .file-list li { padding: 9px; }

  .dictionary-nav { gap: 2px; padding: 15px 16px; }

  .dictionary-nav button { min-height: 32px; padding: 6px 11px; font-size: 12px; }

  .dictionary-nav button.selected { background: #edf3fa; }

  .modal-header h2 { font-size: 21px; }

  .modal-tabs { border-bottom: 1px solid var(--line); overflow-x: auto; flex-shrink: 0; }

  .modal-tabs button { min-height: 40px; white-space: nowrap; }

  .modal-tabs button.selected::after { display: none; }

  .modal-body .info-grid { margin-top: 0; }

  .modal-body h3 { margin-bottom: 17px; }

  .modal-body input:not([type=checkbox]), .modal-body select, .modal-body textarea { min-height: 39px; }

  .modal-body textarea { min-height: 83px; }

  .modal-body label + label { margin-top: 0; }

  .field-block { margin: 20px 0; }

  .form-grid > .field-block { margin: 0; }

  .scope-picker legend, .scope-picker .check { font-size: 12px; }

  .checkbox-list > label { font-size: 11px; min-height: 33px; }

  .checkbox-list label:has(input:checked) { background: #edf4ff; border-color: #b6cef0; color: #24558f; }

  .form-grid .inline-note { margin: 0; }

  .inline-note, .issues, .confirmation, .upload-zone { border-radius: 6px; }

  .preview-stats { margin: 18px 0; }

  .preview-stats b { font-size: 12px; padding: 7px 10px; border-radius: 6px; }

  .toast { bottom: auto; line-height: normal; min-width: 0; text-align: left; }

  pre { margin: 0; padding: 15px; border-radius: 6px; }


  /* V0.4 samples/quotes CSS is unchanged. Preserve its original panel spacing. */
  .sample-controls .filters, .sample-workspace > .panel > .filters { padding: 19px 21px; }

  .sample-workspace .sample-tag-filter button { border-radius: 20px; min-height: 30px; padding: 6px 12px; }

  .sample-workspace .sample-card-image { padding: 0; border-radius: 0; }

  .sample-workspace .sample-feature-grid button { padding: 11px 12px; }

  .sample-workspace .sample-card-copy h2 { margin: 12px 0 7px; }

  .sample-workspace .sample-card-copy p { margin: 0 0 20px; }

  .sample-workspace .sample-main-photo, .sample-workspace .sample-thumbnails button { border-radius: 8px; }

  .sample-workspace .sample-thumbnails button { padding: 2px; min-height: 64px; }

  .sample-workspace .quote-tiers input { width: 125px; }

  .sample-workspace .quote-attachments { font-size: 11px; }

  .sample-workspace .quote-form .info-grid { margin-top: 0; }


}

@media (min-width: 1500px) {
  main { padding: 38px 45px; }

  .desktop-topbar { padding: 0 45px; }

  .stat { padding: 25px; }

}

@media (min-width: 721px) and (max-width: 1150px) {
  .desktop-sidebar { width: 190px; }
  .app-shell { padding-left: 190px; }
  main { padding: 25px 22px; }

  .desktop-topbar { padding: 0 22px; }

  .filters { flex-wrap: wrap; }

  .search-box { max-width: none; }

  .stat { padding: 17px; gap: 10px; }

  .tabline { gap: 18px; }

  .brand-grid, .contact-grid, .location-grid, .group-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .detail-summary { grid-template-columns: repeat(2, 1fr); }

}

@media (min-width: 721px) and (max-width: 900px) {
  .page-heading { flex-wrap: wrap; }

  .page-heading .heading-actions { flex-wrap: wrap; }

  .desktop-topbar .top-actions { gap: 8px; }

  .desktop-topbar .version-tag { margin-right: 0; }

  .desktop-topbar .user-name { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .brand-grid, .contact-grid, .location-grid, .group-grid { grid-template-columns: 1fr; }

}