:root{--blue:#2271b1;--red:#dc000c;--bg:#f5f7fb;--text:#1f2937;--muted:#6b7280;--card:#fff;--line:#d7dde8}*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}a{color:var(--blue);text-decoration:none}.top{display:flex;align-items:center;gap:18px;padding:12px 18px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.brand{font-weight:800;color:var(--blue);white-space:nowrap}.top nav{display:flex;gap:8px;flex-wrap:wrap}.top nav a{padding:7px 9px;border-radius:10px;color:#334155}.top nav a:hover{background:#eef6ff}.me{margin-left:auto;font-size:13px}.me span{color:var(--muted);display:block}.container{max-width:1280px;margin:24px auto;padding:0 18px}.login-card{max-width:420px;margin:8vh auto;background:#fff;padding:28px;border-radius:18px;box-shadow:0 10px 30px rgba(15,23,42,.08)}h1{font-size:26px;margin:0 0 18px}h2{font-size:19px;margin-top:28px}.headrow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.card,.panel,.alert{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 8px 22px rgba(15,23,42,.04)}.card b{font-size:32px;color:var(--blue);display:block}.card span{color:var(--muted)}.alert{margin-bottom:16px;border-left:5px solid var(--blue)}.alert.danger{border-left-color:var(--red)}table{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(15,23,42,.04)}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#eff6ff;font-size:13px;color:#334155}tr:hover td{background:#fbfdff}.btn,button{display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--blue);color:#fff;padding:9px 13px;border-radius:11px;font-weight:700;cursor:pointer}.btn.secondary{background:#475569}.btn.danger{background:var(--red)}button:hover,.btn:hover{filter:brightness(.96);color:#fff}.gridform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin:10px 0 18px}label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700}input,select,textarea{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:9px;font:inherit;background:#fff}textarea{min-height:96px}.wide{grid-column:1/-1}.inline{display:inline-flex;gap:6px;align-items:center}.inline input,.inline select{width:auto}.search{display:flex;gap:8px;margin-bottom:12px}.status{display:inline-block;background:#eef6ff;border:1px solid #bdd7f3;color:#1d4ed8;border-radius:999px;padding:3px 8px;font-size:12px}.muted{color:var(--muted);font-size:13px}pre{white-space:pre-wrap;max-width:520px}@media(max-width:800px){.top{align-items:flex-start;flex-direction:column}.me{margin-left:0}.cards,.gridform{grid-template-columns:1fr}.headrow{flex-direction:column;align-items:flex-start}table{display:block;overflow-x:auto}}
.logout-form{display:inline;margin-left:8px}.logout-form button{border:0;background:transparent;color:#fff;text-decoration:underline;cursor:pointer;font:inherit}.toolbar{display:flex;gap:8px;align-items:center;margin:10px 0 16px}.toolbar select,.toolbar input{max-width:260px}.draft-warning{border:2px dashed #dc000c;color:#9d0008;background:#fff4f4;font-weight:700;padding:12px;margin:12px 0;border-radius:12px;text-align:center}.actions form.inline,.inline{display:inline-block;margin:2px 4px 2px 0}.actions button,.inline button{vertical-align:middle}.danger{background:#dc000c!important;color:white!important}.secondary{background:#eef5fb!important;color:#174e79!important}.muted{color:#666}.status{display:inline-block;background:#eef5fb;border:1px solid #c6dceb;border-radius:999px;padding:4px 8px;font-size:12px}pre{white-space:pre-wrap;max-width:520px;overflow:auto}.panel code{background:#f5f5f5;padding:2px 4px;border-radius:4px}
.filterbar{display:flex;gap:10px;align-items:center;margin:12px 0 18px;background:#fff;padding:12px;border:1px solid #e3e8ef;border-radius:14px}.filterbar input,.filterbar select{max-width:260px}.mini-form{display:grid;grid-template-columns:70px 90px 70px auto;gap:6px;margin:8px 0}.mini-form input{padding:6px}.totals-card{margin:14px 0 20px auto;max-width:320px;background:#fff;border:1px solid #e3e8ef;border-radius:16px;padding:14px;text-align:right}.totals-card p{margin:4px 0}.danger{background:#dc000c!important;color:#fff!important}.secondary{background:#eef4fb!important;color:#174d78!important}.status{display:inline-block;border:1px solid #d6e3f0;background:#f5f9fd;border-radius:999px;padding:4px 9px;font-size:12px}details summary{cursor:pointer;color:#2271b1;font-weight:600}.print-actions{position:fixed;right:16px;top:16px;z-index:10}.print-actions button{box-shadow:0 8px 24px rgba(0,0,0,.18)}@media print{.print-actions{display:none}.sheet{box-shadow:none!important}}
.panel.success{border-left:5px solid #16a34a;background:#f0fdf4}.panel.danger{border-left:5px solid #dc000c;background:#fff1f2}.pill{display:inline-block;border-radius:999px;padding:4px 9px;background:#eef6ff;border:1px solid #bdd7f3}.warning-box{border:1px dashed #eab308;background:#fefce8;padding:12px;border-radius:12px}.table-actions form{display:inline-block}.top nav a[href="/portal"]{font-weight:700}.top nav a[href="/audit-logs"]{color:#64748b}


.badge{display:inline-block;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:700}.badge.ok{background:#e7f7ee;color:#126b35}.badge.bad{background:#fff2e5;color:#9a4b00}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:14px 0}.card{background:#fff;border:1px solid #dbe5ef;border-radius:16px;padding:16px;box-shadow:0 8px 22px rgba(15,55,90,.06)}.card strong{display:block;font-size:28px;margin:8px 0}.link{border:0;background:transparent;color:#2271b1;text-decoration:underline;padding:0;cursor:pointer}.link.danger{color:#dc000c}.toolbar label{display:inline-flex;gap:8px;align-items:center}.mini-form input{max-width:95px}

.conflict-card .diff{background:#fff7e6}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.card{display:block;padding:18px;border:1px solid #d7e2ef;border-radius:14px;background:#fff;text-decoration:none;color:#17324d;box-shadow:0 8px 24px rgba(0,0,0,.06)}.danger{background:#fff1f1;color:#9f1239}.toolbar input,.toolbar select{max-width:260px}.inline textarea{vertical-align:middle;min-width:240px;min-height:38px}.draft-warning{background:#fff2f2;border:1px solid #fecaca;color:#991b1b;padding:10px;border-radius:10px;margin:10px 0}.muted{color:#667085}.wide{grid-column:1/-1}

/* Excel click mapper */
.excel-mapper-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;align-items:start}.excel-targets{position:sticky;top:84px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:0 8px 22px rgba(15,23,42,.05);max-height:calc(100vh - 110px);overflow:auto}.excel-targets h2{font-size:16px;margin:14px 0 8px}.mapper-target{width:100%;display:flex;justify-content:space-between;gap:8px;margin:6px 0;text-align:left;background:#eef6ff;color:#174e79;border:1px solid #bdd7f3}.mapper-target span{background:#fff;border:1px solid #d7e7f7;border-radius:999px;padding:1px 7px;font-size:12px;color:#475569}.mapper-target.active{background:#2271b1!important;color:#fff!important}.mapper-target.active span{color:#174e79}.excel-grid-wrap{min-width:0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px;overflow:auto;box-shadow:0 8px 22px rgba(15,23,42,.04)}.excel-grid{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:12px;box-shadow:none}.excel-grid th{position:sticky;top:0;z-index:2;background:#eaf3ff;text-align:center;min-width:72px;padding:6px}.excel-grid th:first-child{left:0;z-index:3;min-width:44px}.excel-grid td{min-width:72px;max-width:220px;height:30px;padding:5px 7px;border-right:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:cell;background:#fff}.excel-grid tr th:first-child{position:sticky;left:0;background:#f8fafc;z-index:1}.excel-grid td:hover{outline:2px solid #2271b1;outline-offset:-2px;background:#f8fbff}.excel-grid td.mapped-column{background:#e8f7ff}.excel-grid td.mapped-cell{background:#dcfce7!important;outline:2px solid #16a34a;outline-offset:-2px}.excel-grid td.range-preview{background:#fff7d6!important;outline:1px solid #eab308;outline-offset:-1px}.excel-grid .corner{background:#dbeafe}@media(max-width:980px){.excel-mapper-layout{grid-template-columns:1fr}.excel-targets{position:static;max-height:none}}

/* V11 offline-first mobile-grade UI */
.offline-status-badge{position:fixed;right:14px;bottom:14px;z-index:9999;padding:10px 14px;border-radius:999px;background:#334155;color:#fff;font-size:12px;box-shadow:0 10px 30px rgba(15,23,42,.22)}
.offline-status-badge.online{background:#0f766e}.offline-status-badge.offline{background:#b45309}
.offline-app .offline-nav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.offline-app .offline-nav a{padding:9px 12px;border:1px solid #dbe3ef;border-radius:999px;background:#fff;text-decoration:none;color:#1f2937}.offline-app .offline-nav a:hover{border-color:#2271b1;color:#2271b1}
.offline-dashboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 18px}.offline-dashboard .metric{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #dbe3ef;border-radius:16px;padding:14px;box-shadow:0 8px 24px rgba(15,23,42,.06)}.offline-dashboard .metric b{display:block;font-size:18px;color:#0f172a;word-break:break-word}.offline-dashboard .metric span{display:block;color:#64748b;font-size:12px;margin-top:5px}
.sticky-actions{position:sticky;top:8px;z-index:20;background:rgba(248,250,252,.9);backdrop-filter:blur(10px);border:1px solid #e2e8f0;border-radius:16px;padding:10px;margin-bottom:16px}.sticky-actions button,.sticky-actions .button{margin:4px}
.mobile-table{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px}.offline-card{background:#fff;border:1px solid #dbe3ef;border-radius:18px;padding:14px;box-shadow:0 10px 28px rgba(15,23,42,.06);overflow:hidden}.offline-card code{display:block;background:#f1f5f9;padding:6px;border-radius:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.offline-card .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.offline-card .danger{background:#dc2626;color:white;border-color:#dc2626}.kv-grid{display:grid;grid-template-columns:110px minmax(0,1fr);gap:6px;margin-top:8px}.kv-grid span{color:#64748b;font-size:12px}.kv-grid code{font-size:12px}.sync-badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;font-size:12px;background:#e2e8f0;color:#334155;margin-right:6px}.sync-badge.synced{background:#dcfce7;color:#166534}.sync-badge.pending,.sync-badge.pending_delete{background:#fef3c7;color:#92400e}.sync-badge.conflict{background:#fee2e2;color:#991b1b}.sync-badge.error{background:#fecaca;color:#7f1d1d}.empty-state{padding:16px;border:1px dashed #cbd5e1;border-radius:16px;color:#64748b;background:#f8fafc}.error-text{margin-top:8px;color:#b91c1c;font-size:13px;background:#fef2f2;border:1px solid #fecaca;padding:8px;border-radius:10px}.offline-form{border:1px solid #dbe3ef;background:#fff;border-radius:18px;padding:16px;margin:12px 0 22px;box-shadow:0 10px 28px rgba(15,23,42,.05)}
@media(max-width:760px){.offline-dashboard{grid-template-columns:1fr 1fr}.mobile-table{grid-template-columns:1fr}.kv-grid{grid-template-columns:1fr}.offline-status-badge{left:10px;right:10px;text-align:center}.sticky-actions{position:static}}

/* V12 conflict resolution professional UX */
.conflict-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:14px 0 18px}.conflict-summary-grid .metric{background:#fff;border:1px solid #dbe3ef;border-radius:18px;padding:16px;box-shadow:0 8px 24px rgba(15,23,42,.06)}.conflict-summary-grid .metric b{display:block;font-size:26px;color:#0f172a}.conflict-summary-grid .metric span{font-size:12px;color:#64748b}.conflict-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid #dbe3ef;border-radius:18px;padding:12px;margin:12px 0 18px;position:sticky;top:6px;z-index:25;box-shadow:0 10px 30px rgba(15,23,42,.05)}.conflict-toolbar input[type=search]{min-width:280px}.conflict-card-v12{border-left:5px solid #2271b1;margin-bottom:18px}.conflict-card-v12[hidden]{display:none!important}.conflict-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.conflict-head h2{margin:0}.conflict-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.conflict-card-v12 details summary{padding:10px 0;font-weight:800;color:#174d78}.conflict-quick-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px}.conflict-table{font-size:13px}.conflict-table th{position:sticky;top:64px;z-index:2}.conflict-table tr.same{opacity:.65}.conflict-table tr.changed{background:#fffaf0}.conflict-table tr.severity-critical{background:#fff1f2}.conflict-table tr.severity-important{background:#fffbeb}.conflict-table .decision-cell{min-width:150px}.conflict-table .decision-cell label{display:block;margin:3px 0;white-space:nowrap}.conflict-table td code{display:block;margin-top:4px;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:7px;padding:2px 5px;width:max-content}.conflict-table td pre{max-width:360px;white-space:pre-wrap;margin:0;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:8px;max-height:120px;overflow:auto}.risk{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800}.risk.critical{background:#fee2e2;color:#991b1b}.risk.important{background:#fef3c7;color:#92400e}.risk.normal{background:#e0f2fe;color:#075985}.risk.same{background:#e5e7eb;color:#374151}.conflict-preview{margin:12px 0;padding:12px;border:1px dashed #93c5fd;background:#eff6ff;border-radius:14px}.conflict-preview h3{margin-top:0}.conflict-preview pre{max-width:none;max-height:280px;background:#fff}.conflict-submitbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid #e2e8f0}@media(max-width:800px){.conflict-head{display:block}.conflict-badges{justify-content:flex-start;margin-top:8px}.conflict-toolbar input[type=search]{min-width:0;width:100%}.conflict-table{display:block;overflow:auto}.conflict-table th{top:0}.conflict-table td pre{max-width:220px}}

/* V16 commercial offer management */
.offer-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;margin:14px 0 18px}.offer-summary-grid .metric{background:#fff;border:1px solid #dbe5ef;border-radius:15px;padding:13px;box-shadow:0 7px 18px rgba(15,23,42,.04)}.offer-summary-grid .metric span{display:block;color:#64748b;font-size:12px;margin-bottom:5px}.offer-summary-grid .metric b{display:block;color:#17324d;font-size:16px}.offer-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.offer-filter{flex-wrap:wrap}.offer-filter .check{display:inline-flex;flex-direction:row;align-items:center;gap:6px}.offer-filter .check input{width:auto}.table-scroll{overflow:auto}.offer-items-table{min-width:1040px}.offer-items-table small{color:#64748b}.row-warning td{background:#fff9e6}.danger-text{color:#b91c1c;font-weight:800}.two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:9px;margin:14px 0}.catalog-check{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:8px;border:1px solid #dbe5ef;background:#fff;border-radius:13px;padding:10px}.catalog-check input{width:auto;margin-top:3px}.catalog-check small{display:block;color:#64748b;margin-top:4px}.timeline{display:grid;gap:9px}.timeline-item{border-left:4px solid #2271b1;border-radius:10px;background:#f8fbff;padding:10px 12px}.timeline-item span{float:right;color:#64748b;font-size:12px}.timeline-item p{margin:6px 0}.timeline-item small{color:#64748b}.gridform.compact{grid-template-columns:repeat(3,minmax(140px,1fr));min-width:680px}.public-offer{max-width:1160px;margin:0 auto}.public-offer .offer-items-table{min-width:900px}.check{display:flex!important;flex-direction:row!important;align-items:center;gap:7px}.check input{width:auto}@media(max-width:850px){.two-col{grid-template-columns:1fr}.offer-actions{justify-content:flex-start}.gridform.compact{grid-template-columns:1fr;min-width:0}}

/* =========================================================
   V17 MODERN RESPONSIVE DESIGN SYSTEM
   Commercial mobile-first interface for Tetamet Platform
   ========================================================= */
:root{
  --primary:#075985;--primary-600:#0369a1;--primary-500:#0ea5e9;--primary-soft:#e0f2fe;
  --accent:#0f766e;--danger:#dc2626;--warning:#b45309;--success:#15803d;
  --surface:#ffffff;--surface-soft:#f8fafc;--surface-muted:#f1f5f9;--page:#f5f7fb;
  --ink:#0f172a;--ink-soft:#334155;--muted:#64748b;--line:#e2e8f0;--line-strong:#cbd5e1;
  --shadow-sm:0 5px 16px rgba(15,23,42,.055);--shadow-md:0 12px 32px rgba(15,23,42,.08);--shadow-lg:0 24px 55px rgba(15,23,42,.14);
  --radius-sm:10px;--radius:15px;--radius-lg:20px;--radius-xl:26px;
  --sidebar-width:286px;--topbar-height:74px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--page)}
body{min-height:100vh;background:radial-gradient(circle at top right,rgba(14,165,233,.055),transparent 28rem),var(--page);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;line-height:1.52;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--primary-600);transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease}a:hover{color:var(--primary)}
button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid rgba(14,165,233,.36);outline-offset:2px}
.ui-icon{width:18px;height:18px;flex:0 0 auto}

/* App frame */
.app-shell{min-height:100vh}.app-main{min-height:100vh;margin-left:var(--sidebar-width);transition:margin-left .24s ease}.sidebar{position:fixed;inset:0 auto 0 0;z-index:60;width:var(--sidebar-width);display:flex;flex-direction:column;background:linear-gradient(180deg,#082f49 0%,#0c4a6e 55%,#075985 100%);color:#e0f2fe;box-shadow:10px 0 32px rgba(2,40,64,.13);overflow:hidden}.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:76px;padding:15px 16px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-block{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;min-width:0}.brand-block:hover{color:#fff}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:linear-gradient(135deg,#38bdf8,#0ea5e9);box-shadow:0 9px 18px rgba(14,165,233,.27);font-size:21px;font-weight:900}.brand-block strong,.brand-block small{display:block}.brand-block strong{font-size:17px;letter-spacing:.1px}.brand-block small{color:#bae6fd;font-size:11px;margin-top:1px}.sidebar-scroll{flex:1;overflow:auto;padding:11px 10px 18px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}.sidebar-scroll::-webkit-scrollbar{width:5px}.sidebar-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:99px}.nav-section{padding:7px 0 5px}.nav-section-title{padding:8px 10px 5px;color:#7dd3fc;font-size:10px;font-weight:800;letter-spacing:.115em;text-transform:uppercase}.nav-link{display:flex;align-items:center;gap:10px;min-height:41px;margin:2px 0;padding:9px 10px;border-radius:11px;color:#dbeafe;font-size:13px;font-weight:600;text-decoration:none}.nav-link:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(2px)}.nav-link.active{color:#fff;background:linear-gradient(90deg,rgba(56,189,248,.31),rgba(255,255,255,.12));box-shadow:inset 3px 0 #7dd3fc}.nav-link .ui-icon{opacity:.94}.sidebar-foot{padding:12px;border-top:1px solid rgba(255,255,255,.1);background:rgba(2,32,52,.15)}.sidebar-user,.topbar-profile{display:flex;align-items:center;gap:9px;min-width:0}.sidebar-user strong,.sidebar-user small,.topbar-profile strong,.topbar-profile small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-user strong{color:#fff;font-size:12px}.sidebar-user small{color:#bae6fd;font-size:11px}.user-avatar{display:grid;place-items:center;flex:0 0 auto;width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,#e0f2fe,#bae6fd);color:#075985;font-size:11px;font-weight:900;border:1px solid rgba(255,255,255,.45)}
.sidebar-close{display:none!important;color:#e0f2fe!important;background:rgba(255,255,255,.1)!important}
.sidebar-overlay{display:none}

/* Topbar */
.app-topbar{position:sticky;top:0;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:var(--topbar-height);padding:11px clamp(14px,2.1vw,30px);background:rgba(255,255,255,.9);border-bottom:1px solid rgba(203,213,225,.8);backdrop-filter:blur(16px);box-shadow:0 3px 15px rgba(15,23,42,.035)}.topbar-left,.topbar-actions{display:flex;align-items:center;gap:12px;min-width:0}.topbar-kicker{color:var(--primary-600);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.topbar-title{margin:2px 0 0!important;color:var(--ink);font-size:20px!important;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-action{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:10px;color:var(--ink-soft);font-size:12px;font-weight:700}.topbar-action:hover{background:var(--primary-soft);color:var(--primary)}.topbar-profile{padding-left:11px;border-left:1px solid var(--line)}.profile-copy strong{font-size:12px}.profile-copy small{color:var(--muted);font-size:11px}.icon-button{display:inline-grid!important;place-items:center;width:40px;height:40px;padding:0!important;border:1px solid var(--line)!important;border-radius:11px!important;background:#fff!important;color:var(--ink-soft)!important;box-shadow:none!important}.icon-button:hover{background:var(--surface-muted)!important;color:var(--primary)!important;filter:none!important}.menu-toggle{display:none!important}.logout-form{display:block!important;margin:0!important}.logout-button{color:var(--danger)!important}

/* Page structure */
.container{width:min(100%,1500px);max-width:none;margin:0 auto;padding:clamp(16px,2.2vw,30px)}.app-content{padding-bottom:calc(30px + env(safe-area-inset-bottom))}.public-container{width:min(100%,1220px);padding:clamp(14px,3vw,32px)}.app-content>h1,.page-heading{margin:0 0 18px;color:var(--ink);font-size:clamp(23px,2vw,30px);letter-spacing:-.025em}.app-content>h2,h2{color:var(--ink);font-size:19px;letter-spacing:-.01em}.headrow{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px}.headrow h1{margin:0!important;color:var(--ink);font-size:clamp(23px,2vw,30px);letter-spacing:-.025em}.headrow p{margin:5px 0 0}.two-col{gap:16px}

/* Cards, panels and alerts */
.card,.panel,.alert,.gridform,.filterbar,.totals-card,.offline-form{border:1px solid var(--line)!important;border-radius:var(--radius-lg)!important;background:rgba(255,255,255,.97)!important;box-shadow:var(--shadow-sm)!important}.card,.panel{padding:17px}.panel{margin-bottom:15px}.card{position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--primary-500),var(--primary))}.cards{grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:13px;margin:14px 0 20px}.card b,.card strong{display:block;margin:4px 0;color:var(--primary);font-size:clamp(22px,2vw,30px);letter-spacing:-.04em}.card span{color:var(--muted);font-size:12px}.panel-heading{margin-top:0}.alert{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;padding:13px 15px;border-left:4px solid var(--primary-500)!important;color:var(--ink-soft)}.alert-icon{display:grid;place-items:center;flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-weight:900}.alert.danger,.panel.danger{border-left-color:var(--danger)!important;background:#fff7f7!important}.panel.success{border-left:4px solid var(--success)!important;background:#f4fff8!important}.draft-warning{border:1px dashed #fca5a5!important;border-radius:14px!important;background:#fff7f7!important}

/* Forms */
.gridform{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;padding:16px;margin:10px 0 18px}.gridform.compact{grid-template-columns:repeat(3,minmax(150px,1fr))}.gridform button:not(.icon-button){align-self:end}.offer-master-form{grid-template-columns:repeat(3,minmax(0,1fr))}.offline-form{padding:15px}.filterbar,.toolbar,.search{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:11px;margin:12px 0 16px}.toolbar{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}label{display:flex;flex-direction:column;gap:6px;color:var(--ink-soft);font-size:12px;font-weight:800}input,select,textarea{min-height:43px;padding:9px 11px;border:1px solid var(--line-strong);border-radius:11px;background:#fff;color:var(--ink);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}textarea{min-height:94px;resize:vertical}input:hover,select:hover,textarea:hover{border-color:#94a3b8}input:focus,select:focus,textarea:focus{border-color:var(--primary-500);outline:0;box-shadow:0 0 0 4px rgba(14,165,233,.13)}input[readonly],input:disabled,select:disabled,textarea:disabled{background:var(--surface-muted);color:var(--muted)}input[type=checkbox],input[type=radio]{min-height:auto;accent-color:var(--primary)}.wide{grid-column:1/-1}.inline{display:inline-flex!important;align-items:center;gap:7px;flex-wrap:wrap}.check{flex-direction:row!important;align-items:center!important;gap:8px!important;font-weight:700}.check input{width:auto}.mini-form{grid-template-columns:repeat(4,minmax(65px,1fr));gap:7px}.mini-form input{max-width:none}.muted{color:var(--muted)!important;font-size:12px}.panel code{border-radius:7px;background:#eef2f7;padding:3px 6px;color:#334155}

/* Buttons */
.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:9px 13px;border:1px solid transparent;border-radius:11px;background:linear-gradient(135deg,var(--primary-600),var(--primary));color:#fff;font-size:13px;font-weight:800;line-height:1.15;text-decoration:none;box-shadow:0 5px 11px rgba(3,105,161,.16);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease,color .16s ease}.btn:hover,button:hover{color:#fff;filter:none;transform:translateY(-1px);box-shadow:0 8px 15px rgba(3,105,161,.21)}.btn.secondary,.secondary{border-color:#cbd5e1!important;background:#fff!important;color:#0f4c74!important;box-shadow:none!important}.btn.secondary:hover,.secondary:hover{border-color:#7dd3fc!important;background:#eff9ff!important;color:#075985!important}.btn.danger,.danger{background:linear-gradient(135deg,#ef4444,#b91c1c)!important;color:#fff!important}.link{min-height:auto;padding:0;border:0;background:transparent!important;color:var(--primary-600)!important;box-shadow:none;text-decoration:underline}.link:hover{transform:none;color:var(--primary)!important}.offer-actions,.actions,.table-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.offer-actions{justify-content:flex-end}

/* Tables */
.responsive-table-wrap,.table-scroll{width:100%;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm);-webkit-overflow-scrolling:touch}.responsive-table-wrap table,.table-scroll table{border:0!important;border-radius:0!important;box-shadow:none!important}table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);font-size:13px}th,td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:linear-gradient(180deg,#f8fbff,#eff6ff);color:#334155;font-size:11px;font-weight:900;letter-spacing:.025em;text-transform:uppercase;white-space:nowrap}tbody tr:last-child td{border-bottom:0}tbody tr{transition:background .14s ease}tbody tr:hover td{background:#f8fcff}.status,.badge,.pill,.sync-badge{display:inline-flex;align-items:center;width:max-content;border:1px solid #bae6fd;border-radius:999px;background:#eff9ff;color:#075985;padding:4px 8px;font-size:11px;font-weight:800;line-height:1.1}.badge.ok{border-color:#bbf7d0;background:#f0fdf4;color:#166534}.badge.bad{border-color:#fed7aa;background:#fff7ed;color:#9a3412}.totals-card{max-width:370px;padding:15px}.totals-card p{display:flex;justify-content:space-between;gap:14px;margin:5px 0}.totals-card p:last-child{padding-top:8px;border-top:1px solid var(--line);font-size:16px}

/* Offer module */
.offer-summary-grid{grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:10px}.offer-summary-grid .metric{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;padding:14px;box-shadow:var(--shadow-sm)}.offer-summary-grid .metric:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--primary-500),var(--accent))}.offer-summary-grid .metric span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.offer-summary-grid .metric b{font-size:18px}.offer-items-table{min-width:1120px}.catalog-grid{grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:10px}.catalog-check{border-color:var(--line)!important;border-radius:14px!important;padding:11px!important;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.catalog-check:hover{border-color:#7dd3fc!important;box-shadow:0 7px 16px rgba(14,165,233,.09);transform:translateY(-1px)}.timeline-item{border-left-color:var(--primary-500);border-radius:12px;background:#f8fcff;padding:11px 13px}.public-offer{max-width:1160px}.public-offer>.panel,.public-offer .offer-summary-grid .metric{box-shadow:var(--shadow-sm)}

/* Login and public pages */
.app-public{display:grid;min-height:100vh;place-items:center;padding:16px;background:radial-gradient(circle at 15% 15%,rgba(14,165,233,.18),transparent 29rem),radial-gradient(circle at 85% 85%,rgba(15,118,110,.14),transparent 30rem),#f5f9fc}.app-public .public-container{width:min(100%,1220px)}.login-card{width:min(100%,440px);margin:7vh auto;padding:28px;border:1px solid rgba(186,230,253,.7);border-radius:24px;background:rgba(255,255,255,.94);box-shadow:var(--shadow-lg);backdrop-filter:blur(16px)}.login-card:before{content:"T";display:grid;place-items:center;width:53px;height:53px;margin:0 0 17px;border-radius:17px;background:linear-gradient(135deg,var(--primary-500),var(--primary));color:#fff;font-size:27px;font-weight:900;box-shadow:0 11px 20px rgba(3,105,161,.2)}.login-card h1{margin-bottom:15px;color:var(--ink);font-size:27px}.login-card form{display:grid;gap:13px}.login-card button{width:100%;margin-top:3px}.public-offer{padding-top:13px}.app-public:has(.public-offer),.app-public.public-offer-page{display:block}.app-public:has(.public-offer) .public-container,.app-public.public-offer-page .public-container{width:min(100%,1220px);margin:0 auto}

/* Existing special modules */
.offline-status-badge{bottom:max(14px,env(safe-area-inset-bottom));border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow-md)}.offline-dashboard,.conflict-summary-grid{gap:11px}.offline-card,.conflict-summary-grid .metric,.excel-targets,.excel-grid-wrap{border-color:var(--line)!important;border-radius:var(--radius-lg)!important;box-shadow:var(--shadow-sm)!important}.offline-card{padding:14px}.offline-nav a{border-color:var(--line)!important;border-radius:999px!important}.conflict-toolbar,.sticky-actions{top:calc(var(--topbar-height) + 8px);border-color:var(--line);box-shadow:var(--shadow-md)}.excel-targets{top:calc(var(--topbar-height) + 10px)}.excel-grid-wrap{padding:10px}.empty-state{border-radius:14px}.warning-box{border-radius:14px}

/* Scrollbar */
*{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{border-radius:99px;background:#cbd5e1}*::-webkit-scrollbar-thumb:hover{background:#94a3b8}

/* Tablet */
@media (max-width:1199px){
  :root{--sidebar-width:268px}.offer-master-form{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-copy{display:none}.topbar-profile{padding-left:4px;border-left:0}
}

/* Mobile drawer */
@media (max-width:1099px){
  .app-main{margin-left:0}.sidebar{width:min(88vw,318px);transform:translateX(-105%);transition:transform .24s ease;box-shadow:18px 0 50px rgba(2,40,64,.26)}.sidebar-open .sidebar{transform:translateX(0)}.sidebar-overlay{display:block;position:fixed;inset:0;z-index:55;background:rgba(15,23,42,.48);opacity:0;pointer-events:none;transition:opacity .24s ease}.sidebar-open .sidebar-overlay{opacity:1;pointer-events:auto}.sidebar-close,.menu-toggle{display:inline-grid!important}.app-topbar{min-height:66px}.topbar-kicker{display:none}.topbar-title{font-size:18px!important}.conflict-toolbar,.sticky-actions{top:74px}
}

/* Mobile controls and card tables */
@media (max-width:760px){
  :root{--topbar-height:65px}.container{padding:13px}.app-topbar{gap:8px;padding:9px 12px}.topbar-actions{gap:4px}.topbar-action{width:39px;height:39px;padding:0;justify-content:center}.topbar-action span{display:none}.topbar-profile{display:none}.topbar-title{max-width:52vw;font-size:16px!important}.icon-button{width:39px;height:39px}.app-content>h1,.page-heading,.headrow h1{font-size:23px}.headrow{align-items:stretch}.headrow>.btn,.headrow>form,.headrow>.offer-actions{width:100%}.headrow>.btn{justify-content:center}.cards{grid-template-columns:1fr 1fr;gap:9px}.card{padding:13px}.card b,.card strong{font-size:22px}.panel{padding:13px}.gridform,.gridform.compact,.offer-master-form{grid-template-columns:1fr!important;gap:11px;padding:13px}.filterbar,.toolbar,.search{align-items:stretch;padding:10px}.filterbar>* ,.toolbar>* ,.search>*{width:100%;max-width:none!important}.filterbar .check,.toolbar .check{width:auto}.offer-actions,.actions,.table-actions{width:100%;align-items:stretch}.offer-actions .btn,.offer-actions button,.actions .btn,.actions button,.table-actions .btn,.table-actions button{flex:1 1 auto}.btn,button{min-height:43px}.two-col{grid-template-columns:1fr}.offer-summary-grid{grid-template-columns:1fr 1fr}.offer-summary-grid .metric{padding:11px}.catalog-grid{grid-template-columns:1fr}.totals-card{max-width:none}.mini-form{grid-template-columns:1fr 1fr}.inline{display:flex!important;align-items:stretch}.inline>*{flex:1 1 auto}.responsive-table-wrap{overflow:visible;border:0;background:transparent;box-shadow:none}.responsive-table{display:block;border:0;background:transparent;box-shadow:none}.responsive-table thead,.responsive-table tr:first-child:has(th),.responsive-table .table-header-row{display:none}.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}.responsive-table tr{margin-bottom:11px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden}.responsive-table td{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line);text-align:right;word-break:break-word}.responsive-table td:last-child{border-bottom:0}.responsive-table td:before{content:attr(data-label);flex:0 0 41%;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.035em;text-align:left;text-transform:uppercase}.responsive-table td:empty{display:none}.responsive-table td form,.responsive-table td .inline{justify-content:flex-end}.table-scroll{border-radius:14px}.offer-items-table,.public-offer .offer-items-table{min-width:1020px}.timeline-item span{float:none;display:block;margin-bottom:4px}.offline-dashboard{grid-template-columns:1fr 1fr}.offline-status-badge{right:10px;left:10px}.conflict-toolbar{position:static}.conflict-table{min-width:850px}.excel-targets{position:static}.app-public{padding:8px}.login-card{margin:4vh auto;padding:21px;border-radius:20px}.login-card:before{width:47px;height:47px;border-radius:15px}.public-offer{padding:0}.public-offer .headrow{padding:2px 0}.public-offer .headrow .btn{width:auto}
}

@media (max-width:430px){
  .cards,.offer-summary-grid,.offline-dashboard{grid-template-columns:1fr}.topbar-title{max-width:47vw}.container{padding:11px}.panel,.gridform,.filterbar,.toolbar{border-radius:14px!important}.btn,button{width:100%}.icon-button,.topbar-action{width:39px!important}.logout-form{width:auto}.logout-button{width:39px!important}.inline{display:flex!important;flex-direction:column;align-items:stretch}.responsive-table td{flex-direction:column;gap:4px;text-align:left}.responsive-table td:before{flex-basis:auto}.public-offer .headrow .btn{width:100%}
}