

:root{
  /* Typography */
  --ircc-font-sans:"Inter",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ircc-font-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;

  --ircc-text-2xs:10px;
  --ircc-text-xs:11px;
  --ircc-text-sm:12px;
  --ircc-text-md:13px;
  --ircc-text-lg:14px;
  --ircc-text-xl:16px;
  --ircc-text-2xl:18px;
  --ircc-text-3xl:22px;
  --ircc-text-4xl:26px;

  --ircc-weight-regular:400;
  --ircc-weight-medium:500;
  --ircc-weight-semibold:600;
  --ircc-weight-bold:700;
  --ircc-weight-extrabold:800;

  --ircc-leading-tight:1.15;
  --ircc-leading-ui:1.35;
  --ircc-leading-body:1.55;

  /* Brand */
  --ircc-brand-50:#f7f5ff;
  --ircc-brand-100:#f0ecff;
  --ircc-brand-200:#e0d8ff;
  --ircc-brand-300:#cbbdff;
  --ircc-brand-400:#a98fff;
  --ircc-brand-500:#8064f5;
  --ircc-brand-600:#6c4cf5;
  --ircc-brand-700:#5638e7;
  --ircc-brand-800:#4830c2;
  --ircc-brand-900:#3c2a98;

  /* Neutral surfaces and text */
  --ircc-app-bg:#f5f4fb;
  --ircc-workspace-bg:#f9f9fc;
  --ircc-surface:#ffffff;
  --ircc-surface-soft:#fafafe;
  --ircc-surface-muted:#f5f5fa;
  --ircc-surface-hover:#f7f5ff;
  --ircc-text:#252739;
  --ircc-text-secondary:#5f6377;
  --ircc-text-muted:#858a9d;
  --ircc-text-faint:#a0a4b3;
  --ircc-border:#e6e7ef;
  --ircc-border-soft:#eff0f5;
  --ircc-border-strong:#d9dbe6;

  /* Semantic */
  --ircc-success:#1d9770;
  --ircc-success-soft:#eaf8f2;
  --ircc-warning:#bf7d19;
  --ircc-warning-soft:#fff6e6;
  --ircc-danger:#cb5266;
  --ircc-danger-soft:#fff0f2;
  --ircc-info:#4f75d8;
  --ircc-info-soft:#edf3ff;

  /* Spacing — 2/4 based, with 8px as the main rhythm */
  --ircc-space-0:0;
  --ircc-space-1:2px;
  --ircc-space-2:4px;
  --ircc-space-3:6px;
  --ircc-space-4:8px;
  --ircc-space-5:10px;
  --ircc-space-6:12px;
  --ircc-space-7:14px;
  --ircc-space-8:16px;
  --ircc-space-9:20px;
  --ircc-space-10:24px;
  --ircc-space-11:28px;
  --ircc-space-12:32px;
  --ircc-space-13:40px;
  --ircc-space-14:48px;

  /* Radius */
  --ircc-radius-xs:6px;
  --ircc-radius-md:10px;
  --ircc-radius-lg:12px;
  --ircc-radius-xl:14px;
  --ircc-radius-2xl:16px;
  --ircc-radius-3xl:20px;
  --ircc-radius-shell:24px;
  --ircc-radius-pill:999px;

  /* Shadows */
  --ircc-shadow-xs:0 1px 2px rgba(43,38,79,.04);
  --ircc-shadow-sm:0 4px 14px rgba(55,47,105,.055);
  --ircc-shadow-md:0 10px 28px rgba(55,47,105,.08);
  --ircc-shadow-lg:0 20px 52px rgba(48,40,95,.13);
  --ircc-shadow-modal:0 28px 78px rgba(35,30,72,.22);
  --ircc-focus-ring:0 0 0 3px rgba(108,76,245,.13);

  /* Controls */
  --ircc-control-xs:28px;
  --ircc-control-sm:32px;
  --ircc-control-md:36px;
  --ircc-control-lg:40px;
  --ircc-control-xl:44px;
  --ircc-control-radius:10px;

  /* Icons — Lucide is the application icon family */
  --ircc-icon-lg:18px;
  --ircc-icon-xl:20px;
  --ircc-icon-stroke:1.8;

  /* Cards */
  --ircc-card-padding-compact:14px;
  --ircc-card-padding:16px;
  --ircc-card-padding-comfortable:18px;
  --ircc-card-gap:14px;

  /* Modal / drawer sizing */
  --ircc-modal-sm:420px;
  --ircc-modal-md:560px;
  --ircc-modal-lg:720px;
  --ircc-modal-xl:920px;
  --ircc-modal-2xl:1120px;
  --ircc-modal-max-h:86dvh;
  --ircc-modal-radius:18px;
  --ircc-drawer-sm:360px;
  --ircc-drawer-md:420px;
  --ircc-drawer-lg:520px;

  /* Layout */
  --ircc-page-gutter-x:24px;
  --ircc-page-gutter-y:18px;
  --ircc-sidebar-expanded:222px;
  --ircc-sidebar-collapsed:74px;
  --ircc-section-gap:16px;
  --ircc-toolbar-gap:8px;
  --ircc-table-row-h:42px;
  --ircc-table-head-h:34px;

  /* Motion */
  --ircc-ease:cubic-bezier(.2,.8,.2,1);
  --ircc-duration-fast:120ms;
  --ircc-duration:170ms;
  --ircc-duration-slow:240ms;

  /* Z-index */
  --ircc-z-dropdown:400;
  --ircc-z-sticky:500;
  --ircc-z-drawer:1200;
  --ircc-z-modal-backdrop:1800;
  --ircc-z-modal:1810;
  --ircc-z-toast:2200;

  /* Compatibility aliases for the existing shell */
  --bg:var(--ircc-app-bg);
  --bg-2:var(--ircc-brand-50);
  --surface:var(--ircc-surface);
  --surface-soft:var(--ircc-surface-soft);
  --text:var(--ircc-text);
  --muted:var(--ircc-text-muted);
  --line:var(--ircc-border);
  --primary:var(--ircc-brand-600);
  --primary-2:var(--ircc-brand-400);
  --primary-3:var(--ircc-brand-700);
  --success:var(--ircc-success);
  --warning:var(--ircc-warning);
  --danger:var(--ircc-danger);
  --card-shadow:var(--ircc-shadow-sm);
}

/* ----------------------------------------------------------------------
   Responsive density tokens
   ---------------------------------------------------------------------- */


@media (max-width:480px){
  :root{
    --ircc-page-gutter-x:14px;
    --ircc-page-gutter-y:12px;
  }
}

/* ----------------------------------------------------------------------
   Global application typography + interaction baseline
   ---------------------------------------------------------------------- */
body{
  font-family:var(--ircc-font-sans);
  color:var(--ircc-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

button,input,select,textarea{font-family:inherit;}

:where(button,a,input,select,textarea,[tabindex]):focus-visible{
  outline:none;
  box-shadow:var(--ircc-focus-ring);
}

:where(button,[role="button"]):disabled,
:where(button,[role="button"])[aria-disabled="true"]{
  opacity:.48;
  cursor:not-allowed;
  pointer-events:none;
}

/* Lucide is the canonical application icon style. */
:where(svg.lucide,[data-lucide]){
  stroke-width:var(--ircc-icon-stroke);
}

/* ----------------------------------------------------------------------
   Module token bridges — unify colour and typography without rebuilding
   individual page layouts. These become the migration bridge while each
   page is refined.
   ---------------------------------------------------------------------- */
.ido-page{
  --bg:var(--ircc-app-bg);
  --surface:var(--ircc-surface);
  --surface-2:var(--ircc-surface-soft);
  --border:var(--ircc-border);
  --border-strong:var(--ircc-border-strong);
  --text:var(--ircc-text);
  --muted:var(--ircc-text-muted);
  --muted-2:var(--ircc-text-faint);
  --purple:var(--ircc-brand-600);
  --purple-2:var(--ircc-brand-500);
  --purple-3:var(--ircc-brand-300);
  --purple-soft:var(--ircc-brand-100);
  --green:var(--ircc-success);
  --green-soft:var(--ircc-success-soft);
  --orange:var(--ircc-warning);
  --orange-soft:var(--ircc-warning-soft);
  --red:var(--ircc-danger);
  --red-soft:var(--ircc-danger-soft);
  font-family:var(--ircc-font-sans);
}

.contacts-module{
  --ct-purple:var(--ircc-brand-600);
  --ct-purple-2:var(--ircc-brand-500);
  --ct-purple-soft:var(--ircc-brand-100);
  --ct-text:var(--ircc-text);
  --ct-muted:var(--ircc-text-muted);
  --ct-line:var(--ircc-border);
  --ct-soft:var(--ircc-surface-soft);
  font-family:var(--ircc-font-sans);
}

.cm-dashboard{
  --cm-purple:var(--ircc-brand-600);
  --cm-purple-2:var(--ircc-brand-500);
  --cm-line:var(--ircc-border);
  --cm-muted:var(--ircc-text-muted);
  --cm-text:var(--ircc-text);
  font-family:var(--ircc-font-sans);
}

.calendar-module{
  --ec-purple:var(--ircc-brand-600);
  --ec-purple-dark:var(--ircc-brand-700);
  --ec-purple-soft:var(--ircc-brand-100);
  --ec-text:var(--ircc-text);
  --ec-muted:var(--ircc-text-muted);
  --ec-line:var(--ircc-border);
  --ec-soft:var(--ircc-surface-soft);
  font-family:var(--ircc-font-sans);
}

.earnings-module{
  --em-purple:var(--ircc-brand-600);
  --em-purple-dark:var(--ircc-brand-700);
  --em-purple-soft:var(--ircc-brand-100);
  --em-text:var(--ircc-text);
  --em-muted:var(--ircc-text-muted);
  --em-line:var(--ircc-border);
  --em-soft:var(--ircc-surface-soft);
  --em-green:var(--ircc-success);
  --em-green-soft:var(--ircc-success-soft);
  --em-red:var(--ircc-danger);
  --em-amber:var(--ircc-warning);
  font-family:var(--ircc-font-sans);
}

.et-module{
  --et-purple:var(--ircc-brand-600);
  --et-purple-2:var(--ircc-brand-500);
  --et-soft:var(--ircc-brand-100);
  --et-text:var(--ircc-text);
  --et-muted:var(--ircc-text-muted);
  --et-line:var(--ircc-border);
  --et-card:var(--ircc-surface);
  font-family:var(--ircc-font-sans);
}

.ik-app{
  --ik-purple:var(--ircc-brand-600);
  --ik-purple-2:var(--ircc-brand-500);
  --ik-purple-3:var(--ircc-brand-300);
  --ik-purple-soft:var(--ircc-brand-100);
  --ik-purple-soft-2:var(--ircc-brand-50);
  --ik-lilac:var(--ircc-brand-200);
  --ik-text:var(--ircc-text);
  --ik-muted:var(--ircc-text-muted);
  --ik-border:var(--ircc-border);
  --ik-shadow:var(--ircc-shadow-md);
  font-family:var(--ircc-font-sans);
}

.ps-app{
  --ps-purple:var(--ircc-brand-600);
  --ps-purple-2:var(--ircc-brand-500);
  --ps-soft:var(--ircc-brand-100);
  --ps-line:var(--ircc-border);
  --ps-text:var(--ircc-text);
  --ps-muted:var(--ircc-text-muted);
  --ps-green:var(--ircc-success);
  --ps-green-soft:var(--ircc-success-soft);
  --ps-red:var(--ircc-danger);
  --ps-red-soft:var(--ircc-danger-soft);
  --ps-amber:var(--ircc-warning);
  --ps-amber-soft:var(--ircc-warning-soft);
  font-family:var(--ircc-font-sans);
}

.ra-app{
  --ra-purple:var(--ircc-brand-600);
  --ra-purple2:var(--ircc-brand-500);
  --ra-soft:var(--ircc-brand-100);
  --ra-line:var(--ircc-border);
  --ra-text:var(--ircc-text);
  --ra-muted:var(--ircc-text-muted);
  --ra-green:var(--ircc-success);
  --ra-green-soft:var(--ircc-success-soft);
  --ra-red:var(--ircc-danger);
  --ra-red-soft:var(--ircc-danger-soft);
  --ra-amber:var(--ircc-warning);
  --ra-amber-soft:var(--ircc-warning-soft);
  font-family:var(--ircc-font-sans);
}

.sha-page{
  --purple:var(--ircc-brand-600);
  --ink:var(--ircc-text);
  --muted:var(--ircc-text-muted);
  --line:var(--ircc-border);
  --soft:var(--ircc-surface-soft);
  font-family:var(--ircc-font-sans);
}

.valai-page,
.vai-widget-admin,
.ragdoc-page{
  font-family:var(--ircc-font-sans);
}

/* ----------------------------------------------------------------------
   Existing shared component compatibility
   ---------------------------------------------------------------------- */
.card{
  border-color:var(--ircc-border-soft);
  border-radius:var(--ircc-card-radius);
  box-shadow:var(--ircc-shadow-sm);
}

.primary-btn,.soft-btn,.icon-btn{
  border-radius:var(--ircc-control-radius);
  transition:
    background var(--ircc-duration) var(--ircc-ease),
    border-color var(--ircc-duration) var(--ircc-ease),
    color var(--ircc-duration) var(--ircc-ease),
    box-shadow var(--ircc-duration) var(--ircc-ease),
    transform var(--ircc-duration) var(--ircc-ease);
}

.field label{
  color:var(--ircc-text-secondary);
  font-size:var(--ircc-text-xs);
  font-weight:var(--ircc-weight-bold);
}

.field input,.field select,.field textarea{
  border-color:var(--ircc-border);
  border-radius:var(--ircc-control-radius);
  color:var(--ircc-text);
  background:var(--ircc-surface);
}

.dropdown{
  border-color:var(--ircc-border);
  border-radius:var(--ircc-radius-xl);
  box-shadow:var(--ircc-shadow-lg);
}

.alert{
  border-radius:var(--ircc-radius-lg);
}

/* Existing modal surfaces: normalize visual treatment only. Width is left
   to the page until that modal is migrated to an explicit root size. */
:where(
  .em-modal,.ps-modal,.ec-modal,.ik-modal-dialog,.cm-peer-modal-card,
  .ct-bulk-modal,.ct-bulk-modal-v62,.ct-email-compose-modal,
  .ra-upload-modal,.sha-upload-modal,.sha-upload-modal-v17,.sha-delete-modal,
  .vai-api-modal,.vai-widget-modal
){
  border-color:var(--ircc-border)!important;
  border-radius:var(--ircc-modal-radius)!important;
  box-shadow:var(--ircc-shadow-modal)!important;
}

:where(
  .em-modal-backdrop,.ps-modal-backdrop,.ec-modal-backdrop,.ik-modal-backdrop,
  .cm-peer-modal-backdrop,.ct-drawer-backdrop,.ra-drawer-backdrop,
  .sha-modal-backdrop
){
  background:rgba(28,27,43,.38)!important;
  backdrop-filter:blur(4px);
}

/* ----------------------------------------------------------------------
   Canonical component API for all new/refined pages
   ---------------------------------------------------------------------- */
.ircc-page{
  width:100%;
  min-width:0;
  color:var(--ircc-text);
  font-family:var(--ircc-font-sans);
}

.ircc-page-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--ircc-space-9);
  margin:0 0 var(--ircc-section-gap);
}
.ircc-page-header__copy{min-width:0;}
.ircc-page-header__eyebrow{
  display:flex;
  align-items:center;
  gap:var(--ircc-space-4);
  margin-bottom:var(--ircc-space-3);
  color:var(--ircc-brand-600);
  font-size:var(--ircc-text-2xs);
  font-weight:var(--ircc-weight-extrabold);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ircc-page-header h1{
  margin:0;
  color:var(--ircc-text);
  font-size:var(--ircc-text-4xl);
  line-height:var(--ircc-leading-tight);
  font-weight:var(--ircc-weight-extrabold);
  letter-spacing:-.035em;
}
.ircc-page-header p{
  margin:var(--ircc-space-3) 0 0;
  color:var(--ircc-text-muted);
  font-size:var(--ircc-text-sm);
  line-height:var(--ircc-leading-body);
}
.ircc-page-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--ircc-toolbar-gap);
  flex-wrap:wrap;
}

.ircc-toolbar{
  display:flex;
  align-items:center;
  gap:var(--ircc-toolbar-gap);
  min-width:0;
}
.ircc-toolbar--wrap{flex-wrap:wrap;}
.ircc-toolbar__spacer{flex:1 1 auto;}

.ircc-card{
  min-width:0;
  padding:var(--ircc-card-padding);
  border:1px solid var(--ircc-border);
  border-radius:var(--ircc-card-radius);
  background:var(--ircc-surface);
  box-shadow:var(--ircc-shadow-xs);
}
.ircc-card--compact{padding:var(--ircc-card-padding-compact);}
.ircc-card--comfortable{padding:var(--ircc-card-padding-comfortable);}
.ircc-card--flat{box-shadow:none;}
.ircc-card__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--ircc-space-6);
  margin-bottom:var(--ircc-space-7);
}
.ircc-card__title{
  margin:0;
  color:var(--ircc-text);
  font-size:var(--ircc-text-lg);
  font-weight:var(--ircc-weight-extrabold);
  line-height:var(--ircc-leading-ui);
}
.ircc-card__subtitle{
  margin:var(--ircc-space-2) 0 0;
  color:var(--ircc-text-muted);
  font-size:var(--ircc-text-xs);
  line-height:var(--ircc-leading-body);
}

.ircc-btn{
  min-width:0;
  height:var(--ircc-control-md);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--ircc-space-4);
  padding:0 var(--ircc-space-6);
  border:1px solid transparent;
  border-radius:var(--ircc-control-radius);
  background:var(--ircc-surface);
  color:var(--ircc-text-secondary);
  font-size:var(--ircc-text-xs);
  font-weight:var(--ircc-weight-bold);
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:all var(--ircc-duration) var(--ircc-ease);
}
.ircc-btn svg{width:var(--ircc-icon-sm);height:var(--ircc-icon-sm);}
.ircc-btn:hover{transform:translateY(-1px);}
.ircc-btn--primary{
  color:#fff;
  background:linear-gradient(135deg,var(--ircc-brand-600),var(--ircc-brand-500));
  box-shadow:0 6px 16px rgba(108,76,245,.18);
}
.ircc-btn--secondary{
  border-color:var(--ircc-border);
  background:var(--ircc-surface);
}
.ircc-btn--secondary:hover{border-color:var(--ircc-brand-200);background:var(--ircc-brand-50);color:var(--ircc-brand-700);}
.ircc-btn--soft{border-color:var(--ircc-brand-200);background:var(--ircc-brand-50);color:var(--ircc-brand-700);}
.ircc-btn--ghost{border-color:transparent;background:transparent;color:var(--ircc-text-secondary);}
.ircc-btn--danger{border-color:#f0cdd4;background:#fff7f8;color:var(--ircc-danger);}
.ircc-btn--sm{height:var(--ircc-control-sm);padding-inline:var(--ircc-space-5);font-size:var(--ircc-text-2xs);}
.ircc-btn--lg{height:var(--ircc-control-lg);padding-inline:var(--ircc-space-7);font-size:var(--ircc-text-sm);}

.ircc-icon-btn{
  width:var(--ircc-control-md);
  height:var(--ircc-control-md);
  display:inline-grid;
  place-items:center;
  padding:0;
  border:1px solid var(--ircc-border);
  border-radius:var(--ircc-control-radius);
  background:var(--ircc-surface);
  color:var(--ircc-text-muted);
  cursor:pointer;
  transition:all var(--ircc-duration) var(--ircc-ease);
}
.ircc-icon-btn svg{width:var(--ircc-icon-md);height:var(--ircc-icon-md);}
.ircc-icon-btn:hover{border-color:var(--ircc-brand-200);background:var(--ircc-brand-50);color:var(--ircc-brand-700);}

.ircc-field{display:flex;flex-direction:column;gap:var(--ircc-space-3);min-width:0;}
.ircc-label{color:var(--ircc-text-secondary);font-size:var(--ircc-text-xs);font-weight:var(--ircc-weight-bold);}
.ircc-control{
  width:100%;
  min-width:0;
  height:var(--ircc-control-md);
  padding:0 var(--ircc-space-6);
  border:1px solid var(--ircc-border);
  border-radius:var(--ircc-control-radius);
  background:var(--ircc-surface);
  color:var(--ircc-text);
  font-size:var(--ircc-text-sm);
  outline:none;
  transition:border-color var(--ircc-duration) var(--ircc-ease),box-shadow var(--ircc-duration) var(--ircc-ease);
}
textarea.ircc-control{height:auto;min-height:92px;padding-block:var(--ircc-space-5);resize:vertical;}
.ircc-control::placeholder{color:var(--ircc-text-faint);font-weight:var(--ircc-weight-regular);}
.ircc-control:hover{border-color:var(--ircc-border-strong);}
.ircc-control:focus{border-color:var(--ircc-brand-300);box-shadow:var(--ircc-focus-ring);}
.ircc-help{color:var(--ircc-text-muted);font-size:var(--ircc-text-2xs);line-height:var(--ircc-leading-body);}

.ircc-tabs{
  display:flex;
  align-items:center;
  gap:var(--ircc-space-2);
  width:max-content;
  max-width:100%;
  padding:var(--ircc-space-2);
  border:1px solid var(--ircc-border);
  border-radius:var(--ircc-radius-lg);
  background:var(--ircc-surface);
  overflow-x:auto;
  scrollbar-width:none;
}
.ircc-tabs::-webkit-scrollbar{display:none;}
.ircc-tab{
  height:var(--ircc-control-sm);
  display:inline-flex;
  align-items:center;
  gap:var(--ircc-space-3);
  padding:0 var(--ircc-space-5);
  border:0;
  border-radius:var(--ircc-radius-sm);
  background:transparent;
  color:var(--ircc-text-muted);
  font-size:var(--ircc-text-xs);
  font-weight:var(--ircc-weight-bold);
  white-space:nowrap;
}
.ircc-tab:hover{background:var(--ircc-surface-muted);color:var(--ircc-text-secondary);}
.ircc-tab.is-active,.ircc-tab[aria-selected="true"]{background:var(--ircc-brand-100);color:var(--ircc-brand-700);}

.ircc-badge{
  min-height:22px;
  display:inline-flex;
  align-items:center;
  gap:var(--ircc-space-2);
  padding:2px var(--ircc-space-4);
  border-radius:var(--ircc-radius-pill);
  background:var(--ircc-surface-muted);
  color:var(--ircc-text-secondary);
  font-size:var(--ircc-text-2xs);
  font-weight:var(--ircc-weight-bold);
  line-height:1;
  white-space:nowrap;
}
.ircc-badge--brand{background:var(--ircc-brand-100);color:var(--ircc-brand-700);}
.ircc-badge--success{background:var(--ircc-success-soft);color:var(--ircc-success);}
.ircc-badge--warning{background:var(--ircc-warning-soft);color:var(--ircc-warning);}
.ircc-badge--danger{background:var(--ircc-danger-soft);color:var(--ircc-danger);}
.ircc-badge--info{background:var(--ircc-info-soft);color:var(--ircc-info);}
.ircc-count-badge{
  min-width:22px;
  height:22px;
  display:inline-grid;
  place-items:center;
  padding:0 6px;
  border-radius:var(--ircc-radius-pill);
  background:var(--ircc-brand-100);
  color:var(--ircc-brand-700);
  font-size:var(--ircc-text-2xs);
  font-weight:var(--ircc-weight-extrabold);
}

.ircc-table-wrap{width:100%;min-width:0;overflow:auto;}
.ircc-table{width:100%;border-collapse:collapse;color:var(--ircc-text);font-size:var(--ircc-text-xs);}
.ircc-table th{
  height:var(--ircc-table-head-h);
  padding:0 var(--ircc-space-5);
  border-bottom:1px solid var(--ircc-border);
  color:var(--ircc-text-muted);
  font-size:var(--ircc-text-2xs);
  font-weight:var(--ircc-weight-extrabold);
  letter-spacing:.035em;
  text-align:left;
  text-transform:uppercase;
  white-space:nowrap;
}
.ircc-table td{
  height:var(--ircc-table-row-h);
  padding:var(--ircc-space-4) var(--ircc-space-5);
  border-bottom:1px solid var(--ircc-border-soft);
  vertical-align:middle;
}
.ircc-table tbody tr:hover{background:var(--ircc-surface-soft);}

.ircc-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:var(--ircc-z-modal-backdrop);
  display:grid;
  place-items:center;
  padding:var(--ircc-space-8);
  background:rgba(28,27,43,.38);
  backdrop-filter:blur(4px);
}
.ircc-modal{
  width:min(var(--ircc-modal-md),calc(100vw - 32px));
  max-height:var(--ircc-modal-max-h);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--ircc-border);
  border-radius:var(--ircc-modal-radius);
  background:var(--ircc-surface);
  box-shadow:var(--ircc-shadow-modal);
}
.ircc-modal--sm{width:min(var(--ircc-modal-sm),calc(100vw - 32px));}
.ircc-modal--lg{width:min(var(--ircc-modal-lg),calc(100vw - 32px));}
.ircc-modal--xl{width:min(var(--ircc-modal-xl),calc(100vw - 32px));}
.ircc-modal--2xl{width:min(var(--ircc-modal-2xl),calc(100vw - 32px));}
.ircc-modal__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--ircc-space-7);
  padding:var(--ircc-space-8);
  border-bottom:1px solid var(--ircc-border-soft);
}
.ircc-modal__header h2{margin:0;font-size:var(--ircc-text-xl);font-weight:var(--ircc-weight-extrabold);line-height:var(--ircc-leading-ui);}
.ircc-modal__header p{margin:var(--ircc-space-2) 0 0;color:var(--ircc-text-muted);font-size:var(--ircc-text-xs);line-height:var(--ircc-leading-body);}
.ircc-modal__body{min-height:0;overflow:auto;padding:var(--ircc-space-8);}
.ircc-modal__footer{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--ircc-space-4);
  padding:var(--ircc-space-6) var(--ircc-space-8);
  border-top:1px solid var(--ircc-border-soft);
  background:var(--ircc-surface-soft);
}

.ircc-drawer-backdrop{
  position:fixed;
  inset:0;
  z-index:var(--ircc-z-drawer);
  background:rgba(28,27,43,.32);
  backdrop-filter:blur(3px);
}
.ircc-drawer{
  position:absolute;
  top:0;
  right:0;
  width:min(var(--ircc-drawer-md),100vw);
  height:100%;
  display:flex;
  flex-direction:column;
  border-left:1px solid var(--ircc-border);
  background:var(--ircc-surface);
  box-shadow:-20px 0 52px rgba(40,34,78,.14);
}
.ircc-drawer--sm{width:min(var(--ircc-drawer-sm),100vw);}
.ircc-drawer--lg{width:min(var(--ircc-drawer-lg),100vw);}
.ircc-drawer__header{padding:var(--ircc-space-8);border-bottom:1px solid var(--ircc-border-soft);}
.ircc-drawer__body{min-height:0;overflow:auto;padding:var(--ircc-space-8);}
.ircc-drawer__footer{padding:var(--ircc-space-6) var(--ircc-space-8);border-top:1px solid var(--ircc-border-soft);}

.ircc-empty{
  min-height:220px;
  display:grid;
  place-items:center;
  padding:var(--ircc-space-10);
  text-align:center;
  color:var(--ircc-text-muted);
}
.ircc-empty__icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin:0 auto var(--ircc-space-6);
  border-radius:var(--ircc-radius-xl);
  background:var(--ircc-brand-100);
  color:var(--ircc-brand-700);
}
.ircc-empty__icon svg{width:var(--ircc-icon-xl);height:var(--ircc-icon-xl);}
.ircc-empty h3{margin:0;color:var(--ircc-text);font-size:var(--ircc-text-lg);font-weight:var(--ircc-weight-extrabold);}
.ircc-empty p{max-width:460px;margin:var(--ircc-space-3) auto 0;font-size:var(--ircc-text-xs);line-height:var(--ircc-leading-body);}

.ircc-skeleton{
  position:relative;
  overflow:hidden;
  border-radius:var(--ircc-radius-sm);
  background:#eeedf4;
}
.ircc-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:irccSkeleton 1.35s infinite;
}
@keyframes irccSkeleton{to{transform:translateX(100%)}}

/* ----------------------------------------------------------------------
   Responsive component behavior
   ---------------------------------------------------------------------- */


@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}


:root{
  /* Semantic typography scale */

  /* Semantic font weights */
  --ircc-weight-display:700;
  --ircc-weight-title:700;
  --ircc-weight-card-title:700;
  --ircc-weight-row-title:650;
  --ircc-weight-body:400;
  --ircc-weight-meta:500;
  --ircc-weight-label:700;

  /* Semantic line heights */
  --ircc-leading-display:1.04;
  --ircc-leading-title:1.18;
  --ircc-leading-card:1.3;
  --ircc-leading-copy:1.5;
  --ircc-leading-meta:1.35;

  /* Tracking */
  --ircc-tracking-display:-.045em;
  --ircc-tracking-title:-.025em;
  --ircc-tracking-overline:.12em;
}

/* 1280×720-class Windows keeps readable typography. Compactness comes
   from gutters, padding, card heights and layout — not 5–8px text. */
/* =========================================================
   CANONICAL RESPONSIVE PROFILE — (min-width:821px) and (max-width:1366px) and (max-height:800px)
   All rules for this exact condition are grouped here.
   ========================================================= */
@media (min-width:821px) and (max-width:1366px) and (max-height:800px){
  /* Component group 1 */
  :root{
    --ircc-page-gutter-x:18px;
    --ircc-page-gutter-y:14px;
    /* 1280x720-class Windows: keep sidebar proportionally narrow. */
    --ircc-sidebar-expanded:178px;
    --ircc-sidebar-collapsed:60px;
    --ircc-section-gap:12px;
    --ircc-card-padding-compact:12px;
    --ircc-card-padding:14px;
    --ircc-card-padding-comfortable:16px;
    --ircc-control-sm:30px;
    --ircc-control-md:34px;
    --ircc-control-lg:38px;
    --ircc-table-row-h:38px;
    --ircc-table-head-h:32px;
  }

  /* Component group 2 */
  .sidebar .nav-item,
  .sidebar .nav-subitem{
    column-gap:7px;
  }
  .sidebar .nav-item[data-nav-text="shareholding analysis"] span{
    white-space:nowrap;
    font-size:10px;
    letter-spacing:-.018em;
  }

  /* Component group 3 */
  :root{
    --ircc-type-display:28px;
    --ircc-type-page-title:23px;
    --ircc-type-section-title:15px;
    --ircc-type-card-title:12px;
    --ircc-type-row-title:11px;
    --ircc-type-body:11.5px;
    --ircc-type-body-sm:10.5px;
    --ircc-type-control:11px;
    --ircc-type-meta:10px;
    --ircc-type-overline:10px;
    --ircc-type-badge:10px;
    --ircc-type-metric-lg:21px;
    --ircc-type-metric:16px;
  }

}


/* Mobile increases reading sizes instead of compressing desktop text. */
/* =========================================================
   CANONICAL RESPONSIVE PROFILE — (max-width:820px)
   All rules for this exact condition are grouped here.
   ========================================================= */
@media (max-width:820px){
  /* Component group 1 */
  :root{
    --ircc-page-gutter-x:16px;
    --ircc-page-gutter-y:14px;
    --ircc-section-gap:14px;
    --ircc-control-md:40px;
    --ircc-control-lg:44px;
    --ircc-control-xl:48px;
    --ircc-table-row-h:44px;
    --ircc-modal-max-h:92dvh;
  }

  /* Component group 2 */
  .ircc-page-header{align-items:flex-start;flex-direction:column;gap:var(--ircc-space-6);}
  .ircc-page-header h1{font-size:var(--ircc-text-3xl);}
  .ircc-page-actions{width:100%;justify-content:flex-start;}
  .ircc-card{padding:var(--ircc-card-padding);}
  .ircc-modal-backdrop{padding:12px;}
  .ircc-modal,.ircc-modal--sm,.ircc-modal--lg,.ircc-modal--xl,.ircc-modal--2xl{
    width:100%;
    max-width:none;
  }
  .ircc-modal__header,.ircc-modal__body{padding:var(--ircc-space-7);}
  .ircc-modal__footer{padding:var(--ircc-space-6) var(--ircc-space-7);}

  /* Component group 3 */
  :root{
    --ircc-type-display:30px;
    --ircc-type-page-title:25px;
    --ircc-type-section-title:17px;
    --ircc-type-card-title:14px;
    --ircc-type-row-title:13px;
    --ircc-type-body:13px;
    --ircc-type-body-sm:12px;
    --ircc-type-control:13px;
    --ircc-type-meta:11px;
    --ircc-type-overline:10px;
    --ircc-type-badge:10.5px;
    --ircc-type-metric-lg:24px;
    --ircc-type-metric:18px;
  }

}


/* Canonical typography utilities / component hooks for future modules. */
.ircc-type-display,.ircc-display{
  font-size:var(--ircc-type-display);
  line-height:var(--ircc-leading-display);
  font-weight:var(--ircc-weight-display);
  letter-spacing:var(--ircc-tracking-display);
  color:var(--ircc-text);
}
.ircc-type-page-title,.ircc-page-title,.ircc-page-header h1{
  font-size:var(--ircc-type-page-title);
  line-height:var(--ircc-leading-title);
  font-weight:var(--ircc-weight-title);
  letter-spacing:var(--ircc-tracking-title);
  color:var(--ircc-text);
}
.ircc-type-section-title,.ircc-section-title{
  font-size:var(--ircc-type-section-title);
  line-height:var(--ircc-leading-title);
  font-weight:var(--ircc-weight-title);
  letter-spacing:var(--ircc-tracking-title);
  color:var(--ircc-text);
}
.ircc-type-card-title,.ircc-card-title{
  font-size:var(--ircc-type-card-title);
  line-height:var(--ircc-leading-card);
  font-weight:var(--ircc-weight-card-title);
  color:var(--ircc-text);
}
.ircc-type-row-title,.ircc-row-title{
  font-size:var(--ircc-type-row-title);
  line-height:var(--ircc-leading-card);
  font-weight:var(--ircc-weight-row-title);
  color:var(--ircc-text);
}
.ircc-type-body,.ircc-body{
  font-size:var(--ircc-type-body);
  line-height:var(--ircc-leading-copy);
  font-weight:var(--ircc-weight-body);
  color:var(--ircc-text-secondary);
}
.ircc-type-body-sm,.ircc-body-sm{
  font-size:var(--ircc-type-body-sm);
  line-height:var(--ircc-leading-copy);
  font-weight:var(--ircc-weight-body);
  color:var(--ircc-text-muted);
}
.ircc-type-meta,.ircc-meta{
  font-size:var(--ircc-type-meta);
  line-height:var(--ircc-leading-meta);
  font-weight:var(--ircc-weight-meta);
  color:var(--ircc-text-muted);
}
.ircc-type-label,.ircc-label{
  font-size:var(--ircc-type-meta);
  line-height:var(--ircc-leading-meta);
  font-weight:var(--ircc-weight-label);
  color:var(--ircc-text-secondary);
}
.ircc-type-overline,.ircc-overline{
  font-size:var(--ircc-type-overline);
  line-height:var(--ircc-leading-meta);
  font-weight:var(--ircc-weight-label);
  letter-spacing:var(--ircc-tracking-overline);
  text-transform:uppercase;
  color:var(--ircc-text-muted);
}
.ircc-type-badge,.ircc-badge-text{
  font-size:var(--ircc-type-badge);
  line-height:1;
  font-weight:var(--ircc-weight-label);
}
.ircc-type-control,.ircc-control-text{
  font-size:var(--ircc-type-control);
  line-height:1.2;
  font-weight:var(--ircc-weight-medium);
}
.ircc-type-metric-lg,.ircc-metric-lg{
  font-size:var(--ircc-type-metric-lg);
  line-height:1;
  font-weight:var(--ircc-weight-bold);
  letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;
}
.ircc-type-metric,.ircc-metric{
  font-size:var(--ircc-type-metric);
  line-height:1;
  font-weight:var(--ircc-weight-bold);
  letter-spacing:-.025em;
  font-variant-numeric:tabular-nums;
}

/* Dashboard module bridge. */
.ido-ref-dashboard{
  --ido-text:var(--ircc-text);
  --ido-muted:var(--ircc-text-muted);
  --ido-line:var(--ircc-border);
  --ido-purple:var(--ircc-brand-600);
  --ido-purple-2:var(--ircc-brand-500);
  --ido-purple-soft:var(--ircc-brand-100);
  --ido-red:var(--ircc-danger);
  --ido-red-soft:var(--ircc-danger-soft);
  --ido-green:var(--ircc-success);
  --ido-green-soft:var(--ircc-success-soft);
  --ido-orange:var(--ircc-warning);
  --ido-orange-soft:var(--ircc-warning-soft);
  font-family:var(--ircc-font-sans);
}



:root{
  --ircc-title-color:var(--ircc-text);
  --ircc-title-accent:var(--ircc-brand-600);
}
.ircc-title-primary{color:var(--ircc-title-color);}
.ircc-title-accent{color:var(--ircc-title-accent);}



:root{
  --ircc-screen-profile:laptop-standard-15;

  /* canvas */
  --ircc-content-max:1480px;
  --ircc-page-gutter-x:22px;
  --ircc-page-gutter-y:14px;
  --ircc-section-gap:12px;
  --ircc-card-gap:12px;
  --ircc-card-padding:14px;
  --ircc-row-padding-y:7px;

  /* feature/navigation card geometry */
  --ircc-feature-card-size:124px;
  --ircc-feature-card-pad-top:10px;
  --ircc-feature-card-pad-x:10px;
  --ircc-feature-card-pad-bottom:12px;

  /* lower dashboard row */
  --ircc-lower-row-h:214px;
  --ircc-lower-card-pad-bottom:14px;
  --ircc-lower-score-h:62px;
  --ircc-lower-row-gap:10px;

  /* radius */
  --ircc-radius-sm:8px;
  --ircc-radius-md:12px;
  --ircc-radius-lg:16px;
  --ircc-radius-xl:20px;
  --ircc-card-radius:16px;

  /* controls */
  --ircc-control-h-sm:30px;
  --ircc-control-h-md:36px;
  --ircc-control-h-lg:42px;
  --ircc-control-h:36px;

  /* typography — 15-inch visual master */
  --ircc-type-display:34px;
  --ircc-type-page-title:26px;
  --ircc-type-section-title:16px;
  --ircc-type-card-title:13px;
  --ircc-type-row-title:11.5px;
  --ircc-type-body:12px;
  --ircc-type-body-sm:11px;
  --ircc-type-control:12px;
  --ircc-type-meta:10px;
  --ircc-type-overline:10px;
  --ircc-type-badge:10px;
  --ircc-type-metric-lg:24px;
  --ircc-type-metric:18px;

  /* Val.AI promotional hierarchy */

  /* icons */
  --ircc-icon-xs:12px;
  --ircc-icon-sm:14px;
  --ircc-icon-md:16px;
  --ircc-icon-lg:20px;
  --ircc-icon-xl:28px;
  --ircc-icon-stroke:1.7;
  --ircc-nav-icon:14px;
  --ircc-inline-icon:12px;
  --ircc-action-icon:14px;
  --ircc-card-icon:14px;
  --ircc-feature-icon:20px;
  --ircc-icon-box-sm:28px;
  --ircc-icon-box-md:32px;
  --ircc-icon-box-lg:40px;

  /* shell */
  --ircc-sidebar-expanded:208px;
  --ircc-sidebar-collapsed:64px;
  --ircc-topbar-h:58px;
  --sidebar-expanded:var(--ircc-sidebar-expanded);
  --sidebar-collapsed:var(--ircc-sidebar-collapsed);

  /* aliases used by already-migrated components */
  --ircc-responsive-gutter-x:var(--ircc-page-gutter-x);
  --ircc-responsive-gutter-y:var(--ircc-page-gutter-y);
  --ircc-responsive-section-gap:var(--ircc-section-gap);
  --ircc-responsive-card-gap:var(--ircc-card-gap);
  --ircc-responsive-card-padding:var(--ircc-card-padding);
  --ircc-responsive-card-radius:var(--ircc-card-radius);
  --ircc-responsive-row-y:var(--ircc-row-padding-y);
  --ircc-responsive-control-h:var(--ircc-control-h);
  --ircc-responsive-icon:var(--ircc-icon-md);
  --ircc-responsive-icon-box:var(--ircc-icon-box-md);
}

/* ----------------------------------------------------------------------
   LAPTOP COMPACT 13 — 1280 x 720
   ----------------------------------------------------------------------
   Compared against the approved 1710 x 1107 MacBook screenshot:
   - shell width reduced to match the same visual proportion;
   - text/icon scale reduced independently from card geometry;
   - inner padding contracts more than outer whitespace;
   - card radii contract so tiles do not look oversized;
   - topbar remains compact and real, never zoomed.
   ---------------------------------------------------------------------- */


/* 15-inch master: identification only. Geometry is intentionally untouched. */
@media (min-width:1500px) and (max-width:1799px) and (min-height:820px){
  :root{--ircc-screen-profile:laptop-standard-15;}
}

/* 23-inch: same MacBook component geometry, centered fixed work canvas. */


/* Reusable root primitives for every module. */
.ircc-responsive-page{
  width:min(100%,var(--ircc-content-max));
  margin-inline:auto;
  padding:var(--ircc-page-gutter-y) var(--ircc-page-gutter-x);
}
.ircc-responsive-grid{gap:var(--ircc-card-gap);}
.ircc-responsive-card{padding:var(--ircc-card-padding);border-radius:var(--ircc-card-radius);}
.ircc-responsive-control{min-height:var(--ircc-control-h);font-size:var(--ircc-type-control);}
.ircc-responsive-icon{width:var(--ircc-icon-md);height:var(--ircc-icon-md);}
.ircc-icon-xs{width:var(--ircc-icon-xs)!important;height:var(--ircc-icon-xs)!important;}
.ircc-icon-sm{width:var(--ircc-icon-sm)!important;height:var(--ircc-icon-sm)!important;}
.ircc-icon-md{width:var(--ircc-icon-md)!important;height:var(--ircc-icon-md)!important;}
.ircc-icon-lg{width:var(--ircc-icon-lg)!important;height:var(--ircc-icon-lg)!important;}
.ircc-icon-xl{width:var(--ircc-icon-xl)!important;height:var(--ircc-icon-xl)!important;}


:root{
  --ircc-ai-copy-inset-x:14px;
  --ircc-ai-copy-bottom:52px;
  --ircc-ai-kicker-gap:7px;
  --ircc-ai-title-line-height:1.08;
  --ircc-ai-body-gap:9px;
  --ircc-ai-body-line-height:1.48;

  --ircc-ai-cta-inset-x:12px;
  --ircc-ai-cta-bottom:12px;
  --ircc-ai-cta-height:34px;
  --ircc-ai-cta-radius:11px;
}

/* laptop-compact-13 — 1280 x 720 */


:root{
  /* 15-inch / normal desktop baseline */
  --ircc-type-ai-kicker:10px;
  --ircc-type-ai-title:19px;
  --ircc-type-ai-body:12px;
  --ircc-type-ai-cta:12px;
}

/* laptop-compact-13 — 1280 x 720 */
/* =========================================================
   CANONICAL RESPONSIVE PROFILE — (min-width:1100px) and (max-width:1320px) and (max-height:760px)
   All rules for this exact condition are grouped here.
   ========================================================= */
@media (min-width:1100px) and (max-width:1320px) and (max-height:760px){
  /* Component group 1 */
  :root{
    --ircc-screen-profile:laptop-compact-13;

    /* canvas / rhythm */
    --ircc-content-max:none;
    --ircc-page-gutter-x:28px;
    --ircc-page-gutter-y:8px;
    --ircc-section-gap:10px;
    --ircc-card-gap:10px;
    --ircc-card-padding:9px;
    --ircc-row-padding-y:4px;

    
    --ircc-feature-card-size:124px;
    --ircc-feature-card-pad-top:8px;
    --ircc-feature-card-pad-x:8px;
    --ircc-feature-card-pad-bottom:8px;

    /* lower-row geometry: use the previously unused bottom viewport space */
    --ircc-lower-row-h:196px;
    --ircc-lower-card-pad-bottom:12px;
    --ircc-lower-score-h:56px;
    --ircc-lower-row-gap:8px;

    /* compact radii — visually equivalent to 15-inch after DPR */
    --ircc-radius-sm:5px;
    --ircc-radius-md:8px;
    --ircc-radius-lg:12px;
    --ircc-radius-xl:14px;
    --ircc-card-radius:12px;

    /* controls */
    --ircc-control-h-sm:23px;
    --ircc-control-h-md:29px;
    --ircc-control-h-lg:33px;
    --ircc-control-h:29px;

    /* compact hierarchy; intentionally not one uniform percentage */
    --ircc-type-display:24px;
    --ircc-type-page-title:19px;
    --ircc-type-section-title:13px;
    --ircc-type-card-title:10px;
    --ircc-type-row-title:9.6px;
    --ircc-type-body:9.4px;
    --ircc-type-body-sm:8.6px;
    --ircc-type-control:9.6px;
    --ircc-type-meta:8px;
    --ircc-type-overline:7.4px;
    --ircc-type-badge:8px;
    --ircc-type-metric-lg:17px;
    --ircc-type-metric:13.5px;

    --ircc-type-ai-title:13.3px;
    --ircc-type-ai-body:8.2px;
    --ircc-type-ai-kicker:7.2px;

    /* icons scale separately from text */
    --ircc-icon-xs:8px;
    --ircc-icon-sm:9.5px;
    --ircc-icon-md:11px;
    --ircc-icon-lg:14px;
    --ircc-icon-xl:16px;
    --ircc-icon-stroke:1.65;
    --ircc-nav-icon:10.5px;
    --ircc-inline-icon:9px;
    --ircc-action-icon:10.5px;
    --ircc-card-icon:11px;
    --ircc-feature-icon:15.5px;
    --ircc-icon-box-sm:19px;
    --ircc-icon-box-md:23px;
    --ircc-icon-box-lg:28px;

    /* 208/1710 ≈ 12.2%; 160/1280 = 12.5% */
    --ircc-sidebar-expanded:160px;
    --ircc-sidebar-collapsed:52px;
    --ircc-topbar-h:46px;
    --sidebar-expanded:var(--ircc-sidebar-expanded);
    --sidebar-collapsed:var(--ircc-sidebar-collapsed);

    /* keep aliases in sync */
    --ircc-responsive-gutter-x:var(--ircc-page-gutter-x);
    --ircc-responsive-gutter-y:var(--ircc-page-gutter-y);
    --ircc-responsive-section-gap:var(--ircc-section-gap);
    --ircc-responsive-card-gap:var(--ircc-card-gap);
    --ircc-responsive-card-padding:var(--ircc-card-padding);
    --ircc-responsive-card-radius:var(--ircc-card-radius);
    --ircc-responsive-row-y:var(--ircc-row-padding-y);
    --ircc-responsive-control-h:var(--ircc-control-h);
    --ircc-responsive-icon:var(--ircc-icon-md);
    --ircc-responsive-icon-box:var(--ircc-icon-box-md);
  }

  body:not(.auth-page),body.page-dashboard{
    width:auto!important;
    zoom:1!important;
    transform:none!important;
  }

  .app-shell{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:calc(100dvh - 12px)!important;
    grid-template-columns:var(--ircc-sidebar-expanded) minmax(0,1fr)!important;
    zoom:1!important;
    transform:none!important;
  }
  .app-shell.sidebar-collapsed{
    grid-template-columns:var(--ircc-sidebar-collapsed) minmax(0,1fr)!important;
  }

  /* Sidebar: same visual share as the 15-inch master. */
  .sidebar{
    width:var(--ircc-sidebar-expanded)!important;
    padding:0 7px 6px!important;
  }
  .sidebar-head{min-height:44px!important;padding:6px 0 4px!important;}
  .sidebar .brand{gap:5px!important;padding-left:2px!important;align-items:center!important;}
  .sidebar .brand img{width:18px!important;height:18px!important;flex:0 0 18px!important;}
  .brand-copy{font-size:9.2px!important;line-height:1.1!important;}
  .sidebar .brand small{font-size:6.8px!important;line-height:1.1!important;}
  .sidebar .nav-label,
  .sidebar .nav-section-title,
  .sidebar .sidebar-section-title{
    padding:0 6px 3px!important;
    font-size:7.2px!important;
    line-height:1.15!important;
    letter-spacing:.09em!important;
  }
  .sidebar .nav-item,
  .sidebar .nav-subitem,
  .sidebar .nav-group .nav-subitem{
    min-height:27px!important;
    padding:4px 6px!important;
    margin:1px 0!important;
    border-radius:8px!important;
    column-gap:7px!important;
    grid-template-columns:13px minmax(0,1fr)!important;
    align-items:center!important;
    font-size:9.2px!important;
    line-height:1.15!important;
  }
  .sidebar .nav-item>span,
  .sidebar .nav-subitem>span,
  .sidebar .nav-item .nav-text,
  .sidebar .nav-subitem .nav-text{
    min-width:0!important;
    font-size:9.2px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .sidebar .nav-item :is(svg.lucide,[data-lucide]),
  .sidebar .nav-subitem :is(svg.lucide,[data-lucide]){
    width:var(--ircc-nav-icon)!important;
    height:var(--ircc-nav-icon)!important;
    min-width:var(--ircc-nav-icon)!important;
    flex:0 0 var(--ircc-nav-icon)!important;
    justify-self:center!important;
    align-self:center!important;
  }
  .sidebar-bottom{padding-top:4px!important;}
  .user-mini{gap:5px!important;padding:5px!important;border-radius:9px!important;}
  .avatar{width:23px!important;height:23px!important;font-size:8px!important;}
  .user-mini strong{font-size:8.2px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .user-mini span{font-size:6.9px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}

  /* Topbar */
  .topbar{height:var(--ircc-topbar-h)!important;padding:6px 11px 5px!important;gap:8px!important;}
  .topbar .search,.topbar .nav-search{
    height:29px!important;
    max-width:440px!important;
    border-radius:8px!important;
    padding-inline:8px!important;
  }
  .topbar .search input,.topbar .nav-search input{font-size:9.4px!important;}
  .topbar .search kbd,.topbar .nav-search kbd{font-size:7px!important;padding:2px 4px!important;}
  .topbar .search :is(svg.lucide,[data-lucide]),
  .topbar .nav-search :is(svg.lucide,[data-lucide]),
  .topbar .icon-btn :is(svg.lucide,[data-lucide]),
  .topbar button :is(svg.lucide,[data-lucide]){
    width:var(--ircc-action-icon)!important;
    height:var(--ircc-action-icon)!important;
    min-width:var(--ircc-action-icon)!important;
  }
  .content{min-width:0!important;}

  /* Component group 2 */
  :root{
    /* Keep the MacBook rhythm rather than compressing all text together. */
    --ircc-ai-copy-inset-x:10px;
    --ircc-ai-copy-bottom:44px;

    --ircc-ai-kicker-gap:5px;
    --ircc-ai-title-line-height:1.08;

    --ircc-ai-body-gap:6px;
    --ircc-ai-body-line-height:1.36;

    --ircc-ai-cta-inset-x:7px;
    --ircc-ai-cta-bottom:8px;
    --ircc-ai-cta-height:29px;
    --ircc-ai-cta-radius:8px;
  }

  /* Component group 3 */
  :root{
    /* Slightly increased from the previous compact values:
       kicker 7.6 -> 8.4
       title  14  -> 15.5
       body   8.8 -> 9.7
       CTA    10  -> 10.5
    */
    --ircc-type-ai-kicker:8.2px;
    --ircc-type-ai-title:15px;
    --ircc-type-ai-body:9.5px;
    --ircc-type-ai-cta:10.5px;
  }

}


/* =========================================================
   CANONICAL RESPONSIVE PROFILE — (min-width:1800px) and (min-height:820px)
   All rules for this exact condition are grouped here.
   ========================================================= */
@media (min-width:1800px) and (min-height:820px){
  /* Component group 1 */
  :root{
    --ircc-content-max:1480px;
  }

  /* Component group 2 */
  :root{
    --ircc-screen-profile:desktop-large-23;

    /* 1480px was leaving the dashboard visually too narrow.
       1580px is a modest expansion, not a stretched full-width canvas. */
    --ircc-desktop-large-content-max:1620px;

    /* Monitor-specific dashboard edge rhythm. */
    --ircc-desktop-large-page-top:8px;
    --ircc-desktop-large-page-bottom:18px;
    --ircc-desktop-large-page-gutter-x:16px;
  }

  /* Component group 3 */
  :root{
    /* Base icon scale: +~7–12% vs the 15-inch master */
    --ircc-icon-xs:13px;
    --ircc-icon-sm:15px;
    --ircc-icon-md:17px;
    --ircc-icon-lg:21px;
    --ircc-icon-xl:29px;

    /* Semantic icon roles */
    --ircc-nav-icon:15px;
    --ircc-inline-icon:13px;
    --ircc-action-icon:15px;
    --ircc-card-icon:15.5px;
    --ircc-feature-icon:22px;

    /* Containers grow only a little so cards themselves do not stretch */
    --ircc-icon-box-sm:30px;
    --ircc-icon-box-md:34px;
    --ircc-icon-box-lg:42px;
  }

}


.sidebar-mobile-close{display:none;}


/* =========================================================
   CANONICAL RESPONSIVE PROFILE — (max-width:600px)
   All rules for this exact condition are grouped here.
   ========================================================= */
@media (max-width:600px){
  /* Component group 1 */


  /* Component group 2 */
  :root{
    --ircc-screen-profile:phone-6;
    --ircc-mobile-shell-gap:8px;
    --ircc-mobile-page-gutter-x:14px;
    --ircc-mobile-page-gutter-y:14px;
    --ircc-mobile-section-gap:14px;
    --ircc-mobile-card-gap:12px;

    --ircc-mobile-card-padding:14px;
    --ircc-mobile-card-radius:18px;
    --ircc-mobile-inner-radius:13px;

    --ircc-mobile-display-accent:28px;
    --ircc-mobile-display-primary:25px;
    --ircc-mobile-section-title:17px;
    --ircc-mobile-card-title:14px;
    --ircc-mobile-row-title:13px;
    --ircc-mobile-body:12.5px;
    --ircc-mobile-meta:11px;
    --ircc-mobile-overline:10px;
    --ircc-mobile-control:13px;
    --ircc-mobile-metric:18px;

    --ircc-mobile-icon-inline:17px;
    --ircc-mobile-icon-row:17px;
    --ircc-mobile-icon-feature:20px;
    --ircc-mobile-icon-action:19px;
    --ircc-mobile-icon-box:34px;

    --ircc-mobile-topbar-h:56px;
    --ircc-mobile-control-h:42px;
    --ircc-mobile-touch-target:44px;
    --ircc-mobile-drawer-w:min(84vw,320px);
  }

  html,body{
    max-width:100%;
    overflow-x:hidden!important;
  }

  body:not(.auth-page){
    padding:var(--ircc-mobile-shell-gap)!important;
    background:#f5f5fb!important;
    overflow-x:hidden!important;
  }

  .app-shell,
  .app-shell.sidebar-collapsed{
    width:100%!important;
    min-width:0!important;
    min-height:calc(100dvh - (var(--ircc-mobile-shell-gap) * 2))!important;
    height:auto!important;
    display:block!important;
    border-radius:20px!important;
    overflow:clip!important;
  }

  .main{
    width:100%!important;
    min-width:0!important;
    min-height:calc(100dvh - (var(--ircc-mobile-shell-gap) * 2))!important;
    height:auto!important;
    overflow:visible!important;
  }

  /* compact mobile topbar */
  .topbar{
    position:sticky!important;
    top:0!important;
    z-index:40!important;
    width:100%!important;
    height:var(--ircc-mobile-topbar-h)!important;
    min-height:var(--ircc-mobile-topbar-h)!important;
    padding:7px 10px!important;
    gap:8px!important;
    background:rgba(250,250,253,.96)!important;
    backdrop-filter:blur(18px)!important;
    border-bottom:1px solid #efedf5!important;
  }

  .mobile-toggle{
    display:inline-grid!important;
    place-items:center!important;
    flex:0 0 var(--ircc-mobile-control-h)!important;
    width:var(--ircc-mobile-control-h)!important;
    height:var(--ircc-mobile-control-h)!important;
    padding:0!important;
    border-radius:13px!important;
    background:#fff!important;
    border:1px solid #e6e4ed!important;
    box-shadow:0 3px 10px rgba(45,39,82,.04)!important;
  }
  .mobile-toggle :is(svg.lucide,[data-lucide]){
    width:20px!important;
    height:20px!important;
    stroke-width:1.9!important;
  }

  .topbar .search,
  .topbar .nav-search{
    min-width:0!important;
    max-width:none!important;
    height:var(--ircc-mobile-control-h)!important;
    flex:1 1 auto!important;
    padding:0 11px!important;
    border-radius:13px!important;
    box-shadow:none!important;
  }
  .topbar .search :is(svg.lucide,[data-lucide]),
  .topbar .nav-search :is(svg.lucide,[data-lucide]){
    width:19px!important;
    height:19px!important;
    min-width:19px!important;
  }
  .topbar .search input,
  .topbar .nav-search input{
    min-width:0!important;
    padding:0 8px!important;
    font-size:14px!important;
    line-height:1!important;
  }
  .topbar .search kbd,
  .topbar .nav-search kbd{display:none!important;}

  .topbar .top-actions{
    margin-left:0!important;
    gap:0!important;
    flex:0 0 var(--ircc-mobile-control-h)!important;
  }
  .topbar .top-actions>.icon-btn{
    display:grid!important;
    place-items:center!important;
    width:var(--ircc-mobile-control-h)!important;
    height:var(--ircc-mobile-control-h)!important;
    border-radius:13px!important;
  }
  .topbar .top-actions>.icon-btn :is(svg.lucide,[data-lucide]){
    width:18px!important;
    height:18px!important;
  }
  .topbar .account-menu{display:none!important;}

  .topbar .nav-search-suggestions{
    position:fixed!important;
    top:calc(var(--ircc-mobile-shell-gap) + var(--ircc-mobile-topbar-h) + 4px)!important;
    left:12px!important;
    right:12px!important;
    width:auto!important;
    max-height:min(56dvh,420px)!important;
    border-radius:16px!important;
  }

  /* mobile navigation drawer */

  .sidebar .brand,
  .app-shell.sidebar-collapsed .sidebar .brand{
    justify-content:flex-start!important;
  }
  .sidebar .nav-label,
  .app-shell.sidebar-collapsed .nav-label{
    pointer-events:auto!important;
  }
  .sidebar .nav-item :is(svg.lucide,[data-lucide]),
  .sidebar .nav-subitem :is(svg.lucide,[data-lucide]){
    justify-self:center!important;
  }
  .sidebar .user-mini .meta,
  .sidebar .user-mini-chevron,
  .app-shell.sidebar-collapsed .user-mini .meta,
  .app-shell.sidebar-collapsed .user-mini-chevron{
    display:block!important;
  }

  .sidebar-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:70!important;
    display:block!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .2s ease,visibility .2s ease!important;
  }
  body.sidebar-open .sidebar-backdrop{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  .content:has(> .ido-ref-dashboard){
    width:100%!important;
    min-width:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  /* Component group 3 */
  :root{
    --ircc-mobile-drawer-w:min(78vw,296px);
    --ircc-mobile-sidebar-head-h:56px;
    --ircc-mobile-sidebar-row-h:38px;
    --ircc-mobile-sidebar-icon:17px;
    --ircc-mobile-sidebar-font:12.5px;
    --ircc-mobile-sidebar-section-font:8.5px;
  }

  .sidebar-mobile-close:hover,
  .sidebar-mobile-close:focus-visible{
    background:#f4f2f8!important;
    color:#1f1d28!important;
  }

  .sidebar .nav-item,
  .sidebar .nav-subitem,
  .app-shell.sidebar-collapsed .nav-item,
  .app-shell.sidebar-collapsed .nav-subitem{
    gap:8px!important;
  }

  .sidebar .nav-item :is(svg.lucide,[data-lucide]),
  .sidebar .nav-subitem :is(svg.lucide,[data-lucide]){
    width:var(--ircc-mobile-sidebar-icon)!important;
    height:var(--ircc-mobile-sidebar-icon)!important;
    min-width:var(--ircc-mobile-sidebar-icon)!important;
  }

  .sidebar .nav-item.active{
    box-shadow:0 6px 14px rgba(112,82,228,.16)!important;
  }

  .sidebar .user-mini,
  .app-shell.sidebar-collapsed .user-mini{
    margin-top:3px!important;
  }

  /* Component group 4 */
  :root{
    --ircc-mobile-drawer-w:min(71vw,272px);
    --ircc-mobile-drawer-head-h:52px;
    --ircc-mobile-drawer-row-h:36px;
    --ircc-mobile-drawer-row-radius:9px;
    --ircc-mobile-drawer-font:12px;
    --ircc-mobile-drawer-section-font:8px;
    --ircc-mobile-drawer-icon:16px;
    --ircc-mobile-drawer-x-pad:10px;
    --ircc-mobile-drawer-item-x-pad:8px;
  }

  .sidebar,
  .app-shell.sidebar-collapsed .sidebar{
    position:fixed!important;
    z-index:80!important;
    top:0!important;
    bottom:0!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:0 var(--ircc-mobile-drawer-x-pad) 8px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#fff!important;
    border:0!important;
    border-right:1px solid #ebe8f1!important;
    border-radius:0 18px 18px 0!important;
    box-shadow:18px 0 42px rgba(30,25,55,.18)!important;
    transition:left .20s ease!important;
  }

  .sidebar-head,
  .app-shell.sidebar-collapsed .sidebar-head{
    flex:0 0 var(--ircc-mobile-drawer-head-h)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:6px!important;
    padding:5px 0!important;
    border-bottom:1px solid #efedf4!important;
  }

  .sidebar .brand,
  .app-shell.sidebar-collapsed .sidebar .brand{
    min-width:0!important;
    width:auto!important;
    flex:1 1 auto!important;
    display:flex!important;
    align-items:center!important;
    padding:0!important;
  }

  .sidebar .brand-copy,
  .app-shell.sidebar-collapsed .brand-copy{
    display:block!important;
    position:static!important;
    min-width:0!important;
    width:auto!important;
    opacity:1!important;
    pointer-events:auto!important;
    transform:none!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .sidebar .brand small{
    display:block!important;
  }

  .sidebar-mobile-close{
    display:grid!important;
    place-items:center!important;
    flex:0 0 28px!important;
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    outline:0!important;
    border-radius:50%!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#545361!important;
    cursor:pointer!important;
  }

  .sidebar-mobile-close:active{
    background:#f0eef5!important;
  }

  .sidebar-mobile-close :is(svg.lucide,[data-lucide]){
    width:17px!important;
    height:17px!important;
    min-width:17px!important;
    stroke-width:1.9!important;
  }

  .sidebar-collapse{display:none!important;}

  .sidebar .nav-scroll,
  .app-shell.sidebar-collapsed .nav-scroll{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:4px 0 2px!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }

  .sidebar .nav-scroll::-webkit-scrollbar{
    width:0!important;
    height:0!important;
  }

  .sidebar .nav-group,
  .app-shell.sidebar-collapsed .nav-group{
    margin:0 0 4px!important;
    padding:0!important;
  }

  .sidebar .nav-label,
  .app-shell.sidebar-collapsed .nav-label{
    height:18px!important;
    min-height:18px!important;
    display:flex!important;
    align-items:flex-end!important;
    margin:0!important;
    padding:0 6px 3px!important;
    opacity:1!important;
    font-size:var(--ircc-mobile-drawer-section-font)!important;
    line-height:1!important;
    letter-spacing:.105em!important;
    font-weight:800!important;
    color:#a09eac!important;
  }

  .sidebar .nav-item,
  .sidebar .nav-subitem,
  .app-shell.sidebar-collapsed .nav-item,
  .app-shell.sidebar-collapsed .nav-subitem{
    width:100%!important;
    min-height:var(--ircc-mobile-drawer-row-h)!important;
    height:var(--ircc-mobile-drawer-row-h)!important;
    margin:0!important;
    padding:4px var(--ircc-mobile-drawer-item-x-pad)!important;
    display:grid!important;
    grid-template-columns:17px minmax(0,1fr)!important;
    align-items:center!important;
    justify-content:initial!important;
    column-gap:7px!important;
    border-radius:var(--ircc-mobile-drawer-row-radius)!important;
    font-size:var(--ircc-mobile-drawer-font)!important;
    line-height:1.05!important;
  }

  .sidebar .nav-item span,
  .sidebar .nav-subitem span,
  .app-shell.sidebar-collapsed .nav-item span,
  .app-shell.sidebar-collapsed .nav-subitem span{
    display:block!important;
    min-width:0!important;
    font-size:var(--ircc-mobile-drawer-font)!important;
    line-height:1.05!important;
    font-weight:500!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .sidebar .nav-item :is(svg.lucide,[data-lucide]),
  .sidebar .nav-subitem :is(svg.lucide,[data-lucide]),
  .app-shell.sidebar-collapsed .nav-item :is(svg.lucide,[data-lucide]),
  .app-shell.sidebar-collapsed .nav-subitem :is(svg.lucide,[data-lucide]){
    width:var(--ircc-mobile-drawer-icon)!important;
    height:var(--ircc-mobile-drawer-icon)!important;
    min-width:var(--ircc-mobile-drawer-icon)!important;
    justify-self:center!important;
    stroke-width:1.75!important;
  }

  .sidebar .nav-item.active,
  .app-shell.sidebar-collapsed .nav-item.active{
    background:linear-gradient(135deg,#6b43ef,#9574f6)!important;
    color:#fff!important;
    box-shadow:0 5px 13px rgba(105,73,231,.20)!important;
  }

  .sidebar .nav-item.active span{font-weight:700!important;}

  .sidebar-bottom{
    flex:0 0 auto!important;
    padding-top:4px!important;
    border-top:1px solid #efedf4!important;
  }

  .sidebar .user-mini,
  .app-shell.sidebar-collapsed .user-mini{
    width:100%!important;
    min-height:42px!important;
    height:42px!important;
    margin:2px 0 0!important;
    padding:5px 6px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    border-radius:9px!important;
  }

  .sidebar .user-mini .avatar{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
    flex:0 0 27px!important;
    font-size:8.5px!important;
  }

  .sidebar .user-mini strong{
    font-size:10px!important;
    line-height:1.05!important;
  }

  .sidebar .user-mini span{
    font-size:7.8px!important;
    line-height:1!important;
  }

  .sidebar-backdrop{
    background:rgba(29,26,41,.30)!important;
    backdrop-filter:blur(1px)!important;
  }

  /* Component group 5 */
  :root{
    --ircc-mobile-drawer-w:min(66vw,252px);

    --ircc-mobile-drawer-logo:25px;
    --ircc-mobile-drawer-brand-title:12.6px;
    --ircc-mobile-drawer-brand-subtitle:8.8px;
  }

  /* Narrower drawer */
  .sidebar,
  .app-shell.sidebar-collapsed .sidebar{
    width:var(--ircc-mobile-drawer-w)!important;
    max-width:var(--ircc-mobile-drawer-w)!important;
    left:calc(var(--ircc-mobile-drawer-w) * -1)!important;
  }

  body.sidebar-open .sidebar,
  body.sidebar-open .app-shell.sidebar-collapsed .sidebar{
    left:0!important;
  }

  /* Slightly larger logo + brand copy */
  .sidebar .brand img{
    width:var(--ircc-mobile-drawer-logo)!important;
    height:var(--ircc-mobile-drawer-logo)!important;
    min-width:var(--ircc-mobile-drawer-logo)!important;
    flex:0 0 var(--ircc-mobile-drawer-logo)!important;
  }

  .sidebar .brand small{
    margin-top:2px!important;
    font-size:var(--ircc-mobile-drawer-brand-subtitle)!important;
    line-height:1!important;
    font-weight:600!important;
  }

  /* Preserve enough room for the slightly larger brand */

  /* BODY / PAGE SCROLL LOCK
     The drawer scrolls internally; the dashboard behind it does not move. */
  html:has(body.sidebar-open),
  body.sidebar-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }

  body.sidebar-open{
    height:100dvh!important;
    touch-action:none!important;
  }

  /* Re-enable touch/scroll only inside the drawer navigation itself. */
  body.sidebar-open .sidebar{
    touch-action:auto!important;
  }

  body.sidebar-open .sidebar .nav-scroll{
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
  }

  /* Keep the scrim fixed to the viewport at all times. */
  body.sidebar-open .sidebar-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
  }

  /* Component group 6 */
  :root{
    --ircc-mobile-drawer-logo-w:30px;
    --ircc-mobile-drawer-logo-h:27px;

    --ircc-mobile-drawer-brand-title:13.4px;
    --ircc-mobile-drawer-brand-subtitle:9.4px;
  }

  /* Give the logo a little more horizontal presence without stretching the header. */
  .sidebar .brand img,
  .app-shell.sidebar-collapsed .sidebar .brand img{
    width:var(--ircc-mobile-drawer-logo-w)!important;
    height:var(--ircc-mobile-drawer-logo-h)!important;
    min-width:var(--ircc-mobile-drawer-logo-w)!important;
    flex:0 0 var(--ircc-mobile-drawer-logo-w)!important;

    object-fit:contain!important;
    object-position:center!important;
  }

  .sidebar .brand,
  .app-shell.sidebar-collapsed .sidebar .brand{
    gap:7px!important;
  }

  .sidebar .brand-copy,
  .app-shell.sidebar-collapsed .brand-copy{
    font-size:var(--ircc-mobile-drawer-brand-title)!important;
    line-height:1.04!important;
    font-weight:800!important;
    letter-spacing:-.015em!important;
  }

  .sidebar .brand small,
  .app-shell.sidebar-collapsed .brand small{
    margin-top:2px!important;
    font-size:var(--ircc-mobile-drawer-brand-subtitle)!important;
    line-height:1.05!important;
    font-weight:600!important;
  }

  /* Slightly more breathing room for the enlarged brand only. */
  .sidebar-head,
  .app-shell.sidebar-collapsed .sidebar-head{
    min-height:56px!important;
    height:56px!important;
    flex-basis:56px!important;
  }

}


