/* ==========================================================================
   ALLANDRICH / CM ZONE — UNIFIED THEME TOKENS
   Single source of truth for the global Black · Gold · White theme.
   --------------------------------------------------------------------------
   Values here are DEFAULTS ONLY. They are overridden at runtime by
   em_custom_css() (em-app/models.php) using the values stored in
   em-app/public/config.json -> style.theme.*  which are editable from
   Admin > Settings > Styling. Never hardcode a colour in a page again:
   use the tokens below.
   ========================================================================== */

:root{
  /* ---- BASE (true neutral black) ---------------------------------------- */
  --t-bg:            #0a0a0a;   /* page background            */
  --t-bg-2:          #0f0f0f;   /* alternate page background  */
  --t-panel:         #141414;   /* cards / panels             */
  --t-panel-2:       #1a1a1a;   /* raised panel / hover       */
  --t-panel-3:       #232323;   /* input / well / table head  */
  --t-panel-4:       #2e2e2e;   /* borders on solid surfaces  */

  /* ---- GOLD ramp -------------------------------------------------------- */
  --t-ink:           #14100a;   /* dark text ON gold surfaces */
  --t-gold-deep:     #8a6a12;   /* shadows, pressed states    */
  --t-gold-dark:     #b8912a;   /* borders, secondary accent  */
  --t-gold:          #d4af37;   /* PRIMARY accent             */
  --t-gold-bright:   #f0c94a;   /* hover / active accent      */
  --t-gold-soft:     #ffe08a;   /* headings, highlight text   */
  --t-gold-pale:     #fff3cd;   /* faint gold wash            */

  /* ---- WHITE / text ---------------------------------------------------- */
  --t-white:         #ffffff;
  --t-text:          #f2f2f2;   /* primary body text          */
  --t-text-2:        #d2d2d2;   /* secondary text — readable  */
  --t-text-3:        #aaaaaa;   /* muted / labels — readable  */
  --t-text-4:        #858585;   /* disabled / faint           */

  /* ---- STATUS (muted to sit inside the theme) -------------------------- */
  --t-success:       #2fbf71;
  --t-success-soft:  #7fe0ab;
  --t-success-deep:  #1b8b4f;   /* gradient 2nd stop / pressed */
  --t-error:         #e05561;
  --t-error-soft:    #ff98a1;
  --t-error-deep:    #a3323c;   /* gradient 2nd stop / pressed */
  --t-warn:          #e8a33d;
  --t-info:          #d4af37;
  --t-black-deep:    #000000;   /* absolute black for depth    */

  /* ---- LINES & SHADOW -------------------------------------------------- */
  --t-line:          rgba(212,175,55,.20);  /* gold hairline   */
  --t-line-strong:   rgba(212,175,55,.42);
  --t-line-soft:     rgba(255,255,255,.07); /* neutral hairline*/
  --t-shadow:        0 10px 30px rgba(0,0,0,.55);
  --t-shadow-lg:     0 22px 60px rgba(0,0,0,.65);
  --t-glow:          0 0 22px rgba(212,175,55,.28);

  /* ---- RGB TRIPLETS (for rgba(var(--x-rgb), a) usage) ------------------ */
  --t-gold-rgb:      212,175,55;
  --t-gold-soft-rgb: 255,224,138;
  --t-white-rgb:     255,255,255;
  --t-black-rgb:     0,0,0;
  --t-bg-rgb:        10,10,10;
  --t-panel-rgb:     20,20,20;
  --t-success-rgb:   47,191,113;
  --t-error-rgb:     224,85,97;

  /* ---- GRADIENTS ------------------------------------------------------- */
  --t-grad-gold:     linear-gradient(135deg,var(--t-gold-bright),var(--t-gold) 45%,var(--t-gold-deep));
  --t-grad-panel:    linear-gradient(180deg,var(--t-panel-2),var(--t-panel));
  --t-grad-bg:       linear-gradient(180deg,var(--t-bg-2),var(--t-bg));

  /* ---- SHAPE ----------------------------------------------------------- */
  --t-radius:        12px;
  --t-radius-sm:     8px;
  --t-radius-lg:     18px;
  --t-trans:         .18s ease;
}

/* ==========================================================================
   LEGACY BRIDGE
   Older markup uses --col_* (from em_custom_css) and --cmz-* (from head.php).
   Point them all at the unified tokens so untouched code inherits the theme.
   ========================================================================== */
:root,
#emerel-cms{
  --col_primary:       var(--t-gold);
  --col_primary_sup:   var(--t-gold-bright);
  --col_primary_text:  #14100a;
  --col_second:        var(--t-panel-3);
  --col_second_sup:    var(--t-panel-4);
  --col_second_text:   var(--t-text);
  --col_success:       var(--t-success);
  --col_success_sup:   #1e8f52;
  --col_success_text:  #04180d;
  --col_error:         var(--t-error);
  --col_error_sup:     #a5323c;
  --col_error_text:    #1a0509;

  --cmz-bg:            var(--t-bg);
  --cmz-panel:         var(--t-panel);
  --cmz-panel2:        var(--t-panel-2);
  --cmz-gold:          var(--t-gold);
  --cmz-gold2:         var(--t-gold-soft);
  --cmz-text:          var(--t-text);
  --cmz-muted:         var(--t-text-3);
  --cmz-line:          var(--t-line);
  --cmz-green:         var(--t-success);
}

/* ==========================================================================
   GLOBAL BASE
   ========================================================================== */
html{background:var(--t-bg);}
body,
body[em-theme="dark"],
body[em-theme="light"]{
  background:var(--t-bg);
  color:var(--t-text);
}

::selection{background:rgba(var(--t-gold-rgb),.32);color:var(--t-white);}

/* Scrollbars ------------------------------------------------------------- */
*{scrollbar-width:thin;scrollbar-color:var(--t-gold-dark) var(--t-bg-2);}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:var(--t-bg-2);}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--t-gold-dark),var(--t-gold-deep));
  border-radius:20px;border:2px solid var(--t-bg-2);
}
::-webkit-scrollbar-thumb:hover{background:var(--t-gold);}

/* Form controls ---------------------------------------------------------- */
input,select,textarea{
  background:var(--t-panel-3);
  color:var(--t-text);
  border-color:var(--t-line-soft);
}
input::placeholder,textarea::placeholder{color:var(--t-text-4);}
input:focus,select:focus,textarea:focus{
  border-color:var(--t-gold);
  outline:none;
  box-shadow:0 0 0 3px rgba(var(--t-gold-rgb),.16);
}
/* Native dropdown lists render on white in some browsers without this */
select option{background:var(--t-panel-2);color:var(--t-text);}

/* Autofill would otherwise force a white box on our black inputs */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--t-text);
  -webkit-box-shadow:0 0 0 1000px var(--t-panel-3) inset;
  caret-color:var(--t-text);
}

a{color:var(--t-gold);}
a:hover{color:var(--t-gold-bright);}
hr{border-color:var(--t-line-soft);}

/* ==========================================================================
   ACCENT UTILITIES  (opt-in classes for a consistent gold treatment)
   ========================================================================== */
.t-gold-text{
  background:var(--t-grad-gold);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.t-panel{
  background:var(--t-grad-panel);
  border:1px solid var(--t-line);
  border-radius:var(--t-radius);
  box-shadow:var(--t-shadow);
}
.t-btn-gold{
  background:var(--t-grad-gold);
  color:#14100a;
  border:1px solid var(--t-gold-dark);
  border-radius:var(--t-radius-sm);
  font-weight:800;
  transition:var(--t-trans);
}
.t-btn-gold:hover{
  filter:brightness(1.08);
  box-shadow:var(--t-glow);
  color:#14100a;
}
.t-divider{height:1px;background:linear-gradient(90deg,transparent,var(--t-line-strong),transparent);border:0;}


/* ==========================================================================
   CRYPTOJAR GLOBAL TYPOGRAPHY — AUTHORITATIVE EXECUTION LAYER
   One readable type system for public, member and admin interfaces.
   Module layouts keep their intentional hero/KPI scale, while ordinary text,
   controls, labels and tables inherit a consistent site font and minimum size.
   ========================================================================== */
:root{
  --t-type-micro:11px;
  --t-type-label:12px;
  --t-type-small:13px;
  --t-type-body:14px;
  --t-type-section:17px;
  --t-type-title:22px;
  --t-type-value:24px;
  --t-leading-tight:1.25;
  --t-leading-ui:1.4;
  --t-leading-body:1.6;
}

#emerel-cms{
  font-family:var(--site_font, "Inter"), "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:var(--t-type-body);
  line-height:var(--t-leading-body);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-synthesis:none;
}

/* Make the configured site font actually propagate into all ordinary UI. */
#emerel-cms :where(div,section,article,aside,header,footer,nav,main,p,span,small,label,a,h1,h2,h3,h4,h5,h6,strong,b,em,li,dt,dd,table,thead,tbody,tfoot,tr,th,td,form,fieldset,legend,button,input,select,textarea,optgroup,option){
  font-family:inherit;
}

/* Preserve purpose-built monospace data/code surfaces. */
#emerel-cms :where(code,pre,kbd,samp,.money,.mono,.acops-code,.ct-code,.payout-id-list){
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}

/* Headings: shared hierarchy without flattening hero-specific display type. */
#emerel-cms .em_main .ma_title h2,
#emerel-cms .em_main h1.ma_title,
#emerel-cms .cm-admin-v2 .em_main .ma_title h2{
  font-size:var(--t-type-title)!important;
  line-height:var(--t-leading-tight);
}
#emerel-cms .em_main .ma_title h3,
#emerel-cms .em_main .section-title,
#emerel-cms .em_main [class$="-title"]:is(h2,h3,h4){
  font-size:var(--t-type-section)!important;
  line-height:1.3;
}

/* Navigation: readable at a compact dashboard density. */
#emerel-cms .em_head .h_menu .hm_item a.hmi_link,
#emerel-cms .em_head .eh_menu .ehm_item a.ehmi_link{
  font-size:var(--t-type-small)!important;
  line-height:var(--t-leading-ui);
}
#emerel-cms .em_head .h_menu .hm_group span,
#emerel-cms .em_head .eh_menu .ehm_group span{
  font-size:var(--t-type-label)!important;
  line-height:1.3;
}

/* Body/supporting text: never collapse into 8–10px microcopy. */
#emerel-cms :where(small,label,.meta,.muted,.helper,.subtext,[class$="-meta"],[class$="-sub"],[class$="-hint"]){
  font-size:var(--t-type-label)!important;
  line-height:var(--t-leading-ui);
}
#emerel-cms :where(.em_main span.ma_hi,.em_infobox > *,.em_form_msg ul li,.em_alert .msg){
  font-size:var(--t-type-body)!important;
  line-height:1.5;
}

/* Actions and form values use the same readable UI scale. */
#emerel-cms :where(input,select,textarea,button){
  font-size:var(--t-type-small)!important;
  line-height:var(--t-leading-ui);
}
#emerel-cms :where(.em_form .f_input .fi_title,.em_form .f_input .fi_inp,.em_form .f_select select,.em_form .f_check .fc_box span,.em_form .f_submit button){
  font-size:var(--t-type-small)!important;
}
#emerel-cms :where(.em_form .f_input.fi_foc .fi_title,.em_form .f_select .fs_title,.em_form .f_check .fc_title,.em_form .f_upload .fu_title,.em_form .f_upload span.fu_text){
  font-size:var(--t-type-label)!important;
}

/* Tables: dense but legible on both member and admin screens. */
#emerel-cms table{font-size:var(--t-type-small);}
#emerel-cms table th{
  font-size:var(--t-type-label)!important;
  line-height:1.35;
}
#emerel-cms table td{
  font-size:var(--t-type-small)!important;
  line-height:1.5;
}

/* Status text can be compact, but not below 11px. */
#emerel-cms :where(.badge,.status,.chip,.pill,[class$="-badge"],[class$="-status"],[class$="-chip"],[class$="-pill"]){
  font-size:var(--t-type-micro)!important;
  line-height:1.3;
}

/* Legacy wallet/dashboard components now follow the same rhythm. */
#emerel-cms .em_balance .eb_item .ebi_coin .ebic_info h3.ebici_name,
#emerel-cms .em_balance .eb_item .ebi_coin .ebic_info .ebici_value span{
  font-size:var(--t-type-body)!important;
}
#emerel-cms .em_balance .eb_item .ebi_coin .ebic_info h3.ebici_name label,
#emerel-cms .em_balance .eb_item .ebi_acts .ebia_btn,
#emerel-cms .em_main .ma_title a,
#emerel-cms .em_pagenav span.count,
#emerel-cms .em_form_msg .info{
  font-size:var(--t-type-small)!important;
}

/* KPI/value emphasis remains intentionally larger than surrounding copy. */
#emerel-cms :where(.kpi-value,.stat-value,.balance-value,[class$="-value"]):is(h1,h2,h3,strong,b){
  font-size:min(var(--t-type-value),1.5rem);
  line-height:1.15;
  font-variant-numeric:tabular-nums;
}

@media(max-width:760px){
  :root{
    --t-type-micro:11px;
    --t-type-label:12px;
    --t-type-small:13px;
    --t-type-body:14px;
    --t-type-section:17px;
    --t-type-title:21px;
    --t-type-value:22px;
  }
  #emerel-cms .em_head .h_menu .hm_item a.hmi_link,
  #emerel-cms .em_head .eh_menu .ehm_item a.ehmi_link{font-size:var(--t-type-small)!important;}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;}
}

/* CRYPTOJAR GLOBAL USER ACTION EXPERIENCE */
.em-ux-processing{margin-left:7px}.em-ux-busy{position:relative}.em-ux-busy:after{content:"";position:absolute;inset:-3px;border-radius:12px;pointer-events:none;border:1px solid rgba(var(--t-gold-rgb),.30);box-shadow:0 0 0 0 rgba(var(--t-gold-rgb),.20);animation:emUxBusyPulse 1.15s ease-out infinite}.em-ux-action-success{animation:emUxActionSuccess .9s ease}.em-ux-action-updated{animation:emUxMainPulse .8s ease}.em-ux-refreshed{animation:emUxPageFresh 1.05s ease}.em-ux-value-refresh{animation:emUxValueFresh 1.35s ease!important}
.em-ux-toast-stack{position:fixed;right:18px;top:78px;z-index:9999999;display:grid;gap:9px;width:min(380px,calc(100vw - 24px));pointer-events:none}.em-ux-toast{position:relative;display:grid;grid-template-columns:28px 1fr 24px;gap:10px;align-items:start;padding:12px 12px 14px;border:1px solid rgba(var(--t-gold-rgb),.25);border-radius:14px;background:linear-gradient(145deg,rgba(var(--t-panel-rgb),.98),rgba(var(--t-bg-rgb),.98));box-shadow:0 18px 45px rgba(var(--t-bg-rgb),.48),inset 0 1px rgba(var(--t-white-rgb),.035);color:var(--t-text-2);opacity:0;transform:translateX(22px) scale(.98);transition:.22s ease;pointer-events:auto;overflow:hidden}.em-ux-toast.show{opacity:1;transform:none}.em-ux-toast.hide{opacity:0;transform:translateX(16px) scale(.98)}.em-ux-toast>i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(var(--t-gold-rgb),.10);color:var(--t-gold-soft);font-size:15px}.em-ux-toast.error>i{color:var(--t-error);background:rgba(var(--t-error-rgb),.10)}.em-ux-toast.warning>i{color:var(--t-warn)}.em-ux-toast b{display:block;color:var(--t-white);font-size:12px;line-height:1.3}.em-ux-toast p{margin:3px 0 0;color:var(--t-text-3);font-size:12px;line-height:1.45}.em-ux-toast button{border:0;background:transparent;color:var(--t-text-4);font-size:19px;line-height:1;cursor:pointer}.em-ux-toast-life{position:absolute;left:0;bottom:0;height:2px;width:100%;transform-origin:left;background:linear-gradient(90deg,var(--t-gold),var(--t-gold-soft));animation:emUxToastLife 6.2s linear forwards}.em-ux-toast.error .em-ux-toast-life{animation-duration:9s}
.em-ux-refresh{position:fixed;right:18px;bottom:18px;z-index:80;display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 12px;border:1px solid rgba(var(--t-gold-rgb),.25);border-radius:999px;background:rgba(var(--t-bg-rgb),.90);backdrop-filter:blur(10px);box-shadow:0 10px 28px rgba(var(--t-bg-rgb),.34);color:var(--t-gold-soft);font-size:12px;font-weight:850;cursor:pointer;transition:.18s ease}.em-ux-refresh:hover{transform:translateY(-2px);border-color:rgba(var(--t-gold-rgb),.55);background:var(--t-panel)}.em-ux-refresh i{transition:transform .35s ease}.em-ux-refresh:hover i{transform:rotate(160deg)}
.em_alert{display:none!important}
@keyframes emUxBusyPulse{0%{box-shadow:0 0 0 0 rgba(var(--t-gold-rgb),.22)}100%{box-shadow:0 0 0 10px rgba(var(--t-gold-rgb),0)}}@keyframes emUxActionSuccess{0%{box-shadow:0 0 0 0 rgba(var(--t-success-rgb),.26)}100%{box-shadow:0 0 0 12px rgba(var(--t-success-rgb),0)}}@keyframes emUxMainPulse{0%,100%{filter:none}45%{filter:drop-shadow(0 0 8px rgba(var(--t-gold-rgb),.12))}}@keyframes emUxPageFresh{0%{opacity:.78;transform:translateY(3px)}100%{opacity:1;transform:none}}@keyframes emUxValueFresh{0%{color:var(--t-gold-soft);text-shadow:0 0 14px rgba(var(--t-gold-rgb),.55)}100%{text-shadow:none}}@keyframes emUxToastLife{to{transform:scaleX(0)}}
@media(max-width:700px){.em-ux-toast-stack{top:12px;right:12px}.em-ux-refresh{right:12px;bottom:12px}.em-ux-refresh span{display:none}.em-ux-refresh{width:38px;padding:0;justify-content:center}}
@media(prefers-reduced-motion:reduce){.em-ux-busy:after,.em-ux-action-success,.em-ux-action-updated,.em-ux-refreshed,.em-ux-value-refresh,.em-ux-toast-life{animation:none!important}.em-ux-toast,.em-ux-refresh{transition:none!important}}

/* ========================================================================== 
   GLOBAL CONTENT FOCUS — ALLANDRICH
   Desktop/pointer users: focus only the card/panel under the pointer.
   No layout shift, no page-wide dimming, no mobile hover dependency.
   ========================================================================== */
#emerel-cms :is(
  .t-panel,.cmz-panel,.box,.card,.panel,
  .rp-card,.rp-panel,.rp-table-card,
  .tr-panel,.tr-card,.tr-mini-panel,.tr-market-card,.tr-order-panel,
  .ct-card,.ct-module,
  .cj-card,.cj-panel,
  .ga-panel,.ga-step,.ga-mod,.ga-action,.ga-how-item,
  .ap-panel,.ap-kpi,.ap-module,
  .wc5-card,.wc5-stat,.wc5-history-item,
  .cpp-card,.cpp-stat,.cpp-compare-card,
  .ent-panel,.wdc-panel,
  .action-panel,.action-form,
  .tier-panel,.tier-stat,.tier-action-panel,
  .dc-hero-card,
  .rain-data-panel,.rain-tab-panel,.pool-live-card,.pool-rank-item,
  .acshop-card,.acshop-subpanel,.acshop-tab-panel,
  .ow3-card,.eh-stat,
  .cm-ready-card,.completed-card,.active-card,.level-card
){
  transition:border-color .20s ease,box-shadow .20s ease,filter .20s ease,outline-color .20s ease!important;
  outline:1px solid transparent;
  outline-offset:-1px;
}

@media (hover:hover) and (pointer:fine){
  #emerel-cms :is(
    .t-panel,.cmz-panel,.box,.card,.panel,
    .rp-card,.rp-panel,.rp-table-card,
    .tr-panel,.tr-card,.tr-mini-panel,.tr-market-card,.tr-order-panel,
    .ct-card,.ct-module,
    .cj-card,.cj-panel,
    .ga-panel,.ga-step,.ga-mod,.ga-action,.ga-how-item,
    .ap-panel,.ap-kpi,.ap-module,
    .wc5-card,.wc5-stat,.wc5-history-item,
    .cpp-card,.cpp-stat,.cpp-compare-card,
    .ent-panel,.wdc-panel,
    .action-panel,.action-form,
    .tier-panel,.tier-stat,.tier-action-panel,
    .dc-hero-card,
    .rain-data-panel,.rain-tab-panel,.pool-live-card,.pool-rank-item,
    .acshop-card,.acshop-subpanel,.acshop-tab-panel,
    .ow3-card,.eh-stat,
    .cm-ready-card,.completed-card,.active-card,.level-card
  ):hover{
    outline-color:rgba(var(--t-gold-rgb),.72);
    border-color:rgba(var(--t-gold-rgb),.66)!important;
    box-shadow:0 0 0 1px rgba(var(--t-gold-rgb),.10),0 10px 28px rgba(0,0,0,.28),0 0 18px rgba(var(--t-gold-rgb),.10)!important;
    filter:brightness(1.055);
  }
}

/* Keyboard users receive the same local focus language when a card contains a control. */
#emerel-cms :is(
  .t-panel,.cmz-panel,.box,.card,.panel,.rp-card,.rp-panel,.tr-panel,.tr-card,
  .ct-card,.ct-module,.cj-card,.cj-panel,.ga-panel,.ga-mod,.ap-panel,.ap-module,
  .wc5-card,.cpp-card,.ent-panel,.action-panel,.tier-panel,.dc-hero-card,
  .rain-data-panel,.pool-live-card,.acshop-card,.ow3-card
):focus-within{
  outline-color:rgba(var(--t-gold-rgb),.62);
}

@media (hover:none), (pointer:coarse){
  #emerel-cms :is(
    .t-panel,.cmz-panel,.box,.card,.panel,.rp-card,.rp-panel,.rp-table-card,
    .tr-panel,.tr-card,.ct-card,.ct-module,.cj-card,.cj-panel,.ga-panel,.ga-step,
    .ga-mod,.ga-action,.ap-panel,.ap-kpi,.ap-module,.wc5-card,.wc5-stat,.cpp-card,
    .cpp-stat,.ent-panel,.action-panel,.tier-panel,.dc-hero-card,.rain-data-panel,
    .rain-tab-panel,.pool-live-card,.acshop-card,.acshop-subpanel,.ow3-card
  ){
    filter:none!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #emerel-cms :is(
    .t-panel,.cmz-panel,.box,.card,.panel,.rp-card,.rp-panel,.tr-panel,.tr-card,
    .ct-card,.cj-card,.ga-panel,.ga-step,.ga-mod,.ga-action,.ap-panel,.ap-kpi,
    .wc5-card,.cpp-card,.ent-panel,.action-panel,.tier-panel,.dc-hero-card,
    .rain-data-panel,.pool-live-card,.acshop-card,.ow3-card
  ){transition:none!important;}
}


/* ==========================================================================
   ALLANDRICH GLOBAL LAYOUT CONTAINMENT
   Desktop and tablet safety: prevent individual modules from forcing the
   shared shell wider than the viewport while preserving intentional table
   scrolling and module-specific layouts.
   ========================================================================== */
#emerel-cms .em_main,
#emerel-cms .em_main > *,
#emerel-cms .ma_col,
#emerel-cms .ma_row,
#emerel-cms .ma_content{
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
}
#emerel-cms .em_main :is(
  .em_table,.history-wrap,[class*="-table-wrap"],[class*="-table-scroll"],
  [class*="-scroll"],[class$="-table-wrap"]
){
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
#emerel-cms .em_main :is(img,video,canvas){
  max-width:100%;
  height:auto;
}
#emerel-cms .em_main :is(
  [class*="-grid"],[class$="-grid"],[class*="-row"],[class$="-row"],
  [class*="-cards"],[class$="-cards"]
) > *{
  min-width:0;
}

/* ==========================================================================
   ALLANDRICH GLOBAL TYPOGRAPHY V2 — READABLE COMPACT
   Project-wide readability standard at 100% browser zoom.
   Keeps compact layouts while removing 6–11px readable UI copy.
   ========================================================================== */
:root,
#emerel-cms{
  --ar-font-body:16px;
  --ar-font-secondary:14px;
  --ar-font-small:12px;
  --ar-font-control:14px;
  --ar-font-card-title:16px;
  --ar-font-section:20px;
  --ar-font-page:28px;
  --ar-text-primary:var(--t-white);
  --ar-text-body:var(--t-text);
  --ar-text-secondary:var(--t-text-2);
  --ar-text-muted:var(--t-text-3);
}

#emerel-cms{
  font-size:var(--ar-font-body);
  line-height:1.55;
  color:var(--ar-text-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Real reading copy: descriptions, help text and explanatory paragraphs. */
#emerel-cms :is(p,.description,.desc,.help,.helper,.hint,.note,.notice,.instructions,.instruction,.how-text,.how-copy,[class*="-desc"],[class*="-description"],[class*="-help"],[class*="-hint"],[class*="-copy"],[class*="-subtext"]){
  font-size:var(--ar-font-secondary)!important;
  line-height:1.55!important;
  color:var(--ar-text-secondary);
}

/* Compact metadata remains compact, but never microscopic. */
#emerel-cms :is(.meta,.muted,.small,.caption,.eyebrow,.overline,.kicker,[class*="-meta"],[class*="-label"],[class*="-eyebrow"],[class*="-kicker"],[class*="-caption"]){
  font-size:var(--ar-font-small)!important;
  line-height:1.4!important;
}
#emerel-cms :is(.muted,[class*="-muted"]){color:var(--ar-text-muted)!important;}

/* Controls must be comfortably readable on desktop and touch screens. */
#emerel-cms :is(button,.btn,[class*="btn-"],[class$="-btn"],.tab,[class*="-tab"],input,select,textarea){
  font-size:var(--ar-font-control)!important;
  line-height:1.35;
}
#emerel-cms :is(label,th,td){font-size:13px;line-height:1.45;}

/* Common card/section title patterns. */
#emerel-cms :is(.card-title,.panel-title,.section-title,[class*="-card-title"],[class*="-panel-title"],[class*="-section-title"]){
  font-size:var(--ar-font-card-title)!important;
  line-height:1.3!important;
  color:var(--ar-text-primary);
}
#emerel-cms :is(h1,h2,h3,h4,h5,h6){color:var(--ar-text-primary);line-height:1.25;}
#emerel-cms h1{font-size:var(--ar-font-page);}
#emerel-cms h2{font-size:22px;}
#emerel-cms h3{font-size:18px;}

/* Never let actual visible UI copy fall below 12px, even in old page CSS. */
#emerel-cms :is(span,strong,b,em,a,div,li,dt,dd,code,time){
  min-font-size:12px; /* documentation marker; explicit legacy sizes were normalized in build */
}

@media (max-width:620px){
  :root,#emerel-cms{
    --ar-font-body:15px;
    --ar-font-secondary:14px;
    --ar-font-control:14px;
    --ar-font-card-title:15px;
    --ar-font-section:18px;
    --ar-font-page:24px;
  }
  #emerel-cms{line-height:1.52;}
  #emerel-cms :is(label,th,td){font-size:13px;}
}

