/* GENIX SKY FORCE — Premium Excel Grid v3 (presentation ONLY)
   Load LAST after all existing CSS, including any previous responsive patch.
   No application logic, fields, calculations, data, API requests or forms changed.
*/
:root {
  --genix-pro-navy: #102d50;
  --genix-pro-blue: #225fd0;
  --genix-pro-blue-2: #356fe3;
  --genix-pro-ink: #18324f;
  --genix-pro-line: #dfe8f3;
  --genix-pro-muted: #687c96;
  --genix-pro-surface: #ffffff;
  --genix-pro-product-width: 178px;
  --genix-pro-pack-width: 60px;
}
html, body { width:100%; max-width:100%; }
body { background: #f2f6fb; color:var(--genix-pro-ink); }
.shell, .app, main, .panel, .tablewrap { min-width:0; }
main { width:100%; max-width:1580px; padding-bottom:90px; }
.sidebar { background:linear-gradient(176deg,#0b2240 0%,#143a61 100%); }
.brandmark { background:linear-gradient(145deg,#397df0,#2351ba); box-shadow:0 4px 14px #2053c34a; }
.topbar { background:#fff; border-bottom:1px solid #e4eaf3; }
.topbar h1 { letter-spacing:-.025em; color:#122d4e; }
.hero { background:linear-gradient(112deg,#102b4e 0%,#174d87 57%,#2767d0 100%); box-shadow:0 9px 26px #142f6a15; }
.panel { border-color:#dfe8f3; box-shadow:0 3px 14px #16314b09; }
.panel h3 { color:#193b60; letter-spacing:-.015em; }
.kpi { background:#fff; box-shadow:0 2px 12px #19386106; }
.kpi.featured { background:linear-gradient(135deg,#eaf3ff,#f5f9ff); border-color:#c6d9fc; }
.kpi strong { font-variant-numeric:tabular-nums; }
.distcard { box-shadow:0 3px 12px #172e5109; }
button,.buttonlike,.heroaction { transition:box-shadow .18s ease,filter .18s ease; }
button:hover,.buttonlike:hover,.heroaction:hover { filter:brightness(.97); }
.primary { background:#255fcf; border-color:#255fcf; }
:focus-visible { outline:3px solid #78a6f8 !important; outline-offset:2px; }
/* Attractive spreadsheet presentation on ALL screens */
.tablewrap, .panel .tablewrap {
  position:relative; display:block !important; max-width:100% !important; width:100% !important;
  overflow-x:auto !important; overflow-y:auto !important;
  overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch;
  scrollbar-color:#93add2 #eef4fc; scrollbar-width:thin;
  border:1px solid #dce7f4; border-radius:12px; background:#fff;
}
.tablewrap::-webkit-scrollbar { width:8px; height:8px; }
.tablewrap::-webkit-scrollbar-thumb { background:#a4b9d6; border-radius:12px; }
.tablewrap::-webkit-scrollbar-track { background:#f0f5fb; }
/* Undo the old "huge cards" mobile patch in a non-destructive way. */
.tablewrap table, .panel table, table.genix-ui-cards, .tablewrap table.genix-ui-cards {
  display:table !important; width:100%; min-width:750px; max-width:none;
  border-collapse:separate !important; border-spacing:0 !important;
  table-layout:auto; font-size:12px; font-variant-numeric:tabular-nums;
  background:#fff;
}
.tablewrap table thead, .tablewrap table.genix-ui-cards thead { display:table-header-group !important; }
.tablewrap table.genix-ui-cards thead { position:static !important; clip-path:none !important; overflow:visible !important; width:auto !important; height:auto !important; white-space:normal !important; }
.tablewrap table tbody, .tablewrap table.genix-ui-cards tbody { display:table-row-group !important; }
.tablewrap table tfoot, .tablewrap table.genix-ui-cards tfoot { display:table-footer-group !important; }
.tablewrap table tr, .tablewrap table.genix-ui-cards tr,
.tablewrap table.genix-ui-cards tbody tr {
  display:table-row !important; width:auto !important; min-width:0 !important;
  box-shadow:none !important; border:0 !important; border-radius:0 !important;
  margin:0 !important; padding:0 !important;
}
.tablewrap table :is(th,td), .tablewrap table.genix-ui-cards tbody tr > :is(th,td) {
  display:table-cell !important; flex-direction:initial !important; order:initial !important;
  grid-column:auto !important; vertical-align:middle !important;
  width:auto !important; min-width:0 !important; max-width:none !important;
  border:0 !important; border-bottom:1px solid #e8edf5 !important;
  white-space:normal !important; text-align:left; overflow-wrap:normal !important;
  padding:10px 12px !important; font-size:12px !important; line-height:1.38 !important;
  color:#213b58; box-shadow:none !important;
}
.tablewrap table :is(th,td)::before,
.tablewrap table.genix-ui-cards tbody tr > :is(th,td)::before { content:none !important; display:none !important; }
.tablewrap table thead th, .tablewrap table.genix-ui-cards thead th {
  position:sticky; top:0; z-index:3; background:#173f70 !important; color:#f9fcff !important;
  white-space:nowrap !important; font-weight:800 !important;
  padding:11px 12px !important; font-size:10px !important;
  letter-spacing:.035em; border-bottom:2px solid #4c91ff !important;
}
.tablewrap table tbody tr:nth-child(even) :is(td,th) { background:#f7faff !important; }
.tablewrap table tbody tr:hover :is(td,th) { background:#eaf2ff !important; }
.tablewrap table tbody tr.genix-ui-total :is(td,th),
.tablewrap table tbody tr.genix-premium-total :is(td,th) {
  background:#e8f1ff !important; color:#153d6b; font-weight:800 !important;
  border-top:1px solid #c5d8f5 !important;
}
.tablewrap table tbody tr[hidden], .tablewrap table tbody tr[style*="display: none"] { display:none !important; }
.tablewrap table td.negative, .tablewrap table td.negative * { color:#bf2942 !important; font-weight:800 !important; }
.tablewrap table td.number, .tablewrap table th.number { text-align:right !important; white-space:nowrap !important; }
.tablewrap table .code { background:#e7f0ff; color:#1e59ba; border-radius:5px; }
.tablewrap table :is(td,th) strong { font-weight:750; }
.tablewrap table td small { color:#6c829a; white-space:normal; }
.tablewrap table.genix-premium-matrix { min-width:850px !important; }
.tablewrap table.genix-premium-matrix :is(th,td) { white-space:nowrap !important; text-align:center !important; padding:9px 10px !important; }
.tablewrap table.genix-premium-matrix thead :is(th,td) { text-align:center !important; }
.tablewrap table.genix-premium-matrix :is(th,td):first-child {
  min-width:var(--genix-pro-product-width) !important;
  width:var(--genix-pro-product-width) !important; max-width:var(--genix-pro-product-width) !important;
  text-align:left !important; white-space:normal !important; overflow-wrap:anywhere !important;
  position:sticky !important; left:0 !important; z-index:2;
  font-weight:730 !important;
  box-shadow:2px 0 4px -3px #173b6380 !important;
}
.tablewrap table.genix-premium-matrix :is(th,td):nth-child(2) {
  min-width:var(--genix-pro-pack-width) !important;
  width:var(--genix-pro-pack-width) !important; max-width:var(--genix-pro-pack-width) !important;
  position:sticky !important; left:var(--genix-pro-product-width) !important;
  z-index:2; box-shadow:3px 0 6px -5px #173b6380 !important;
  font-weight:650 !important;
}
.tablewrap table.genix-premium-matrix thead :is(th,td):first-child,
.tablewrap table.genix-premium-matrix thead :is(th,td):nth-child(2) {
  z-index:5; background:#123865 !important; color:#fff !important;
}
.tablewrap table.genix-premium-matrix tbody tr:nth-child(odd) :is(td,th):nth-child(-n+2) { background:#fff !important; }
.tablewrap table.genix-premium-matrix tbody tr:nth-child(even) :is(td,th):nth-child(-n+2) { background:#f7faff !important; }
.tablewrap table.genix-premium-matrix tbody tr:hover :is(td,th):nth-child(-n+2) { background:#eaf2ff !important; }
.tablewrap table.genix-premium-matrix tbody tr.genix-premium-total :is(td,th):nth-child(-n+2) { background:#e8f1ff !important; }
.tablewrap table.genix-premium-matrix :is(th,td):last-child { font-weight:800 !important; color:#2259ba; }
.tablewrap table.genix-premium-matrix thead :is(th,td):last-child { color:#fff !important; }
.tablewrap table.genix-premium-matrix td.negative,
.tablewrap table.genix-premium-matrix td.negative:last-child { color:#c12b45 !important; }
.genix-premium-swipe {
  display:none; align-items:center; gap:6px; margin:0 0 7px;
  color:#567394; font-size:11px; font-weight:650;
}
.genix-premium-swipe svg { width:13px; height:13px; }
/* Chat icon never masks the right-most totals */
.chat-root:not(.is-open) { right:14px !important; bottom:15px !important; }
.chat-root:not(.is-open) .chat-toggle {
  display:flex !important; align-items:center; justify-content:center;
  width:48px !important; min-width:48px !important; height:48px !important; min-height:48px !important;
  border-radius:50% !important; padding:0 !important;
  background:linear-gradient(135deg,#2058c5,#306de3) !important;
  box-shadow:0 8px 22px #183d7540 !important;
  overflow:hidden; white-space:nowrap;
}
.chat-root:not(.is-open) .chat-toggle > span:not(:first-child) { display:none !important; }
.chat-root:not(.is-open) .chat-toggle > span:first-child { font-size:22px !important; }
.chat-root.is-open .chat-toggle { display:none !important; }
@media(min-width:1001px){
  .sidebar { width:clamp(202px,17vw,238px); }
  .topbar { padding:17px 27px; }
  main { padding:21px 25px 70px; }
  .panel { padding:19px 21px; margin-bottom:16px; }
  .panelbar { gap:13px; align-items:center; }
  .kpis { gap:12px; }
  .kpi { padding:18px; }
  .distgrid { gap:12px; }
}
@media(max-width:1000px){
  .sidebar { min-height:unset; width:100%; position:relative; }
  main { padding:15px 13px 85px; }
  .topbar { padding:14px 16px; }
  .panel { padding:15px 13px; margin-bottom:13px; }
  .hero { padding:20px; }
  .kpis, .distgrid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px; }
  .kpi, .distcard { padding:14px !important; }
  .kpi strong, .distamount { overflow-wrap:anywhere; font-size:clamp(17px,3.1vw,23px); }
  .filterrow { gap:10px; }
  .filterrow input, .filterrow select { width:100%; max-width:100%; }
  .panelbar { flex-wrap:wrap; gap:10px; }
  .tablewrap table :is(th,td), .tablewrap table.genix-ui-cards tbody tr > :is(th,td) { padding:9px 10px !important; }
  .genix-premium-swipe { display:flex; }
}
@media(max-width:600px){
  :root { --genix-pro-product-width:164px; --genix-pro-pack-width:54px; }
  .sidebar { display:flex; flex-flow:row wrap; padding:12px 14px; align-items:center; gap:0 9px; }
  .sidebar .brand { margin:0 auto 0 0; }
  .sidebar .divider,.sidebar .navtitle,.sidebar .sidefoot { display:none; }
  .mobile-nav-toggle { display:block !important; min-width:70px; padding:8px 11px; }
  .sidebar .nav { display:none; flex:0 0 100%; margin:5px 0; }
  .sidebar.nav-expanded .nav { display:block; }
  main { padding:12px 10px 92px; }
  .topbar { padding:11px 13px; flex-wrap:wrap; }
  .topbar h1 { font-size:18px; }
  .topright { gap:7px; }
  .topright .username { display:none; }
  .hero { padding:17px 16px; border-radius:12px; }
  .hero h2 { font-size:21px; }
  .panel { padding:14px 11px; border-radius:13px; }
  .panel h3 { font-size:15px; }
  .filterrow { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px !important; }
  .filterrow > *, .filterrow label { min-width:0; max-width:100%; width:100%; }
  .filterrow :is(button,.buttonlike,select,input) { width:100%; min-width:0; }
  .filterrow button { padding:10px 7px; }
  .kpis,.distgrid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; }
  .kpi { padding:12px 10px !important; }
  .kpi span { font-size:10px; }
  .kpi strong { font-size:clamp(16px,4.3vw,20px); }
  .kpi small { font-size:10px; }
  .distcard { padding:11px !important; }
  .distamount { font-size:clamp(16px,4.2vw,20px); }
  .tablewrap { border-radius:9px; }
  .tablewrap table { min-width:690px !important; }
  .tablewrap table.genix-premium-matrix { min-width:840px !important; }
  .tablewrap table.genix-premium-matrix :is(th,td) { font-size:11px !important; padding:9px 8px !important; }
  .tablewrap table.genix-premium-matrix :is(th,td):first-child { line-height:1.24 !important; font-size:10.7px !important; }
  .tablewrap table.genix-premium-matrix thead :is(th,td) { font-size:10px !important; }
  .chat-root:not(.is-open) { right:10px !important; bottom:max(10px,env(safe-area-inset-bottom)) !important; }
  .chat-root:not(.is-open) .chat-toggle { width:42px !important; min-width:42px !important; height:42px !important; min-height:42px !important; }
  .chat-root:not(.is-open) .chat-toggle > span:first-child { font-size:20px !important; }
  footer { margin:10px 12px 18px; }
}
@media(max-width:330px){
  .kpis,.distgrid { grid-template-columns:minmax(0,1fr) !important; }
  :root { --genix-pro-product-width:148px; --genix-pro-pack-width:50px; }
}
@media(prefers-reduced-motion:reduce){ button,.buttonlike,.heroaction { transition:none; } }


/* v3.6.17: responsive grouped comparison cards for mobile + laptop. */
.prev-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}
.prev-group-box{min-width:0;border:1px solid #ccdbef;border-radius:18px;padding:18px;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%);box-shadow:0 10px 22px rgba(16,53,105,.07);display:flex;flex-direction:column;gap:14px}
.prev-group-box-2{border-color:#d8deee;background:linear-gradient(180deg,#f7f8fd 0%,#ffffff 100%)}
.prev-group-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#123962}
.prev-group-titlewrap{display:flex;flex-direction:column;gap:2px;min-width:0}
.prev-group-titlewrap strong{font-size:16px;font-weight:900;letter-spacing:.01em;color:#153f70}
.prev-group-titlewrap small{font-size:12px;font-weight:650;color:#6a819c}
.prev-group-tag{display:inline-flex;align-items:center;justify-content:center;padding:7px 11px;border-radius:10px;background:#19539a;color:#fff;font-size:11px;font-weight:900;letter-spacing:.05em;box-shadow:0 6px 14px rgba(25,83,154,.18)}
.prev-group-box-2 .prev-group-tag{background:#4b69a2}
.prev-group-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.prev-group-kpis>article,.prev-group-kpis>div{min-width:0;display:flex;flex-direction:column;gap:6px;padding:14px 15px;border:1px solid #dfebf7;border-radius:14px;background:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}
.prev-group-kpis>.prev-group-current{border-color:#bfd8fb;background:linear-gradient(180deg,#eef6ff 0%,#ffffff 100%)}
.prev-group-kpis span{font-size:12px;font-weight:800;color:#56708b;line-height:1.35}
.prev-group-kpis>.prev-group-current span{color:#164f92}
.prev-group-kpis strong{display:block;font-size:clamp(22px,2vw,32px);font-weight:900;line-height:1.15;color:#173e68;font-variant-numeric:tabular-nums;letter-spacing:-.01em;overflow-wrap:anywhere;word-break:break-word;white-space:normal}
.prev-group-kpis>.prev-group-current strong{color:#0e4276}
.prev-group-kpis small{font-size:11px;line-height:1.45;color:#70839a}
.prev-group-differences{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.prev-group-difference{min-width:0;border:1px solid #d8e4f0;border-radius:14px;background:#f8fbff;padding:14px 15px;display:flex;flex-direction:column;gap:7px}
.prev-group-difference>span{font-size:12px;font-weight:850;color:#4f6b8a;line-height:1.35}
.prev-group-difference>strong{font-size:clamp(17px,1.6vw,22px);font-weight:900;line-height:1.25;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;word-break:break-word}
.prev-group-direction{display:inline-block;white-space:nowrap;font-size:11px;margin-right:5px;font-weight:950;letter-spacing:.02em}
.prev-group-difference>small{font-size:11px;font-weight:750;font-variant-numeric:tabular-nums;line-height:1.45}
.prev-group-difference.up{background:#eefaf1;border-color:#bfe5ca}
.prev-group-difference.up>strong,.prev-group-difference.up>small,.prev-group-difference.up .prev-group-direction{color:#147a3d}
.prev-group-difference.down{background:#fff1f2;border-color:#f0c4cb}
.prev-group-difference.down>strong,.prev-group-difference.down>small,.prev-group-difference.down .prev-group-direction{color:#bc263b}
.prev-group-difference.flat{background:#f4f7fc;border-color:#d9e2ef}
.prev-group-difference.flat>strong,.prev-group-difference.flat>small{color:#425b79}
.prev-group-difference.pending{background:#f7f8fb;border-color:#e1e6ef}
.prev-group-difference.pending>strong{color:#65758a}
.prev-group-difference.pending>small{color:#6a7c93;font-weight:500}
.prev-group-members{display:flex;gap:8px;flex-wrap:wrap}
.prev-group-members span{display:inline-flex;align-items:center;justify-content:center;font-size:11px;padding:6px 11px;border-radius:999px;background:#e7f0fd;color:#1e5087;font-weight:850;border:1px solid #d7e5fa}
@media(max-width:930px){.prev-group-grid{grid-template-columns:1fr}}
@media(max-width:1100px){.prev-group-grid{grid-template-columns:1fr}}
@media(max-width:640px){.prev-group-box{padding:15px;border-radius:16px}.prev-group-kpis,.prev-group-differences{grid-template-columns:1fr}.prev-group-kpis strong{font-size:clamp(19px,6vw,25px)}.prev-group-difference>strong{font-size:clamp(16px,4.8vw,20px)}.prev-group-members span{font-size:10px;padding:5px 10px}}
@media(max-width:430px){.prev-group-grid{gap:12px}.prev-group-box{padding:13px}.prev-group-heading{align-items:flex-start;gap:10px}.prev-group-titlewrap strong{font-size:15px}.prev-group-titlewrap small{font-size:11px}.prev-group-kpis>article,.prev-group-kpis>div,.prev-group-difference{padding:12px}.prev-group-kpis span,.prev-group-difference>span{font-size:11px}.prev-group-kpis small,.prev-group-difference>small{font-size:10px}}

