/* MASTERLAW® V30.5.9 · Portal calm hierarchy
   70/20/10 system: neutral light surfaces / graphite structure / emerald action.
   Color is intentionally restrained: graphite structure, neutral content, emerald only for meaningful action/status, gold only for micro-brand accents. */
:root{
  --ml-graphite:#252a2b;
  --ml-graphite-2:#303637;
  --ml-emerald:#0f5a4a;
  --ml-emerald-2:#0b493d;
  --ml-emerald-soft:#e8f1ed;
  --ml-gold:#b58a42;
  --ml-gold-soft:#f3ead9;
  --ml-ivory:#f7f4ed;
  --ml-paper:#ffffff;
  --ml-soft:#f2f0ea;
  --ml-line:#dedbd2;
  --ml-ink:#25292c;
  --ml-text:#454b4d;
  --ml-muted:#717776;
  --ml-danger:#8e3f3f;
  --ml-shadow:0 14px 34px rgba(32,36,37,.08);

  /* map legacy tokens to the restrained system */
  --ink:#25292c;--ink-2:#373e3f;--text:#454b4d;--muted:#717776;
  --paper:#f7f4ed;--paper-2:#f2f0ea;--white:#fff;
  --sage:#d9e5df;--sage-2:#c8d8d0;--sage-soft:#edf3f0;--sage-deep:#0f5a4a;
  --blue:#f1f3f2;--blue-2:#e8ecea;--peach:#f5eee4;--rose:#f5eded;--sand:#f3eee4;--lav:#f2f0f3;--mint:#edf3f0;
  --line:#dedbd2;--line-2:#d0cdc4;--ok-bg:#e9f3ee;--ok:#245b49;
  --shadow-sm:0 7px 22px rgba(32,36,37,.055);--shadow:0 16px 42px rgba(32,36,37,.085);

  --ml-bg:#f7f4ed;--ml-bg-soft:#f2f0ea;--ml-bg-blue:#f2f4f2;--ml-bg-peach:#f5eee4;
  --ml-card:#fff;--ml-card-soft:#fbfaf7;--ml-line:#dedbd2;--ml-line-strong:#cfcbc1;
  --ml-sage:#d7e4de;--ml-sage-strong:#b9cfc5;--ml-sage-deep:#0f5a4a;
  --ml-blue:#e9eeeb;--ml-peach:#eee0cf;--ml-yellow:#eee2c8;--ml-rose:#f0e1e1;
  --ml-shadow:0 12px 30px rgba(32,36,37,.075);--ml-shadow-soft:0 6px 18px rgba(32,36,37,.05);
  --mlun-ink:#25292c;--mlun-muted:#6d7372;--mlun-line:#dedbd2;--mlun-paper:#fff;
  --mlun-soft:#f2f0ea;--mlun-accent:#0f5a4a;--mlun-accent2:#0b493d;--mlun-shadow:0 18px 48px rgba(32,36,37,.12);
}

html,body{background:var(--ml-ivory)}
body{color:var(--ml-text)}
a{color:var(--ml-emerald)}
:focus-visible{outline-color:rgba(15,90,74,.34)!important}
::selection{background:#dfeae5!important;color:#1f2825!important}

/* Public chrome: neutral first, color only on actions */
#ml-universal-header{background:rgba(255,255,255,.975)!important;border-bottom-color:var(--ml-line)!important;box-shadow:0 4px 18px rgba(32,36,37,.045)!important}
#ml-universal-header .mlun-cta,#ml-universal-drawer .mlun-drawer-cta{background:var(--ml-emerald)!important;color:#fff!important;box-shadow:0 8px 20px rgba(15,90,74,.16)!important}
#ml-universal-header .mlun-cta:hover,#ml-universal-drawer .mlun-drawer-cta:hover{background:var(--ml-emerald-2)!important}
#ml-universal-header a.mlun-current,#ml-universal-drawer a.mlun-current{background:#f1f3f0!important;color:#29433a!important}
#ml-universal-header .mlun-register{color:var(--ml-emerald)!important}
#ml-universal-header .mlun-panel{border-color:var(--ml-line)!important;box-shadow:0 22px 46px rgba(32,36,37,.12)!important}
#ml-universal-drawer{background:#fff!important;box-shadow:-22px 0 64px rgba(32,36,37,.16)!important}

.site-header,.mlv14-flow-header,.ml-session-rolebar{background:rgba(255,255,255,.975)!important;border-color:var(--ml-line)!important}
.header-talk,.mlv14-cta,.ml-session-actions [data-ml-session-main]{background:var(--ml-emerald-soft)!important;color:#184d40!important;border-color:#cadbd3!important}
.nav a:hover,.nav a[aria-current=page],.mlv14-nav>a:hover,.mlv14-nav details[open]>summary,.mlv14-nav summary:hover{background:#f0f2ef!important}
.drawer{background:#fff!important;box-shadow:-22px 0 64px rgba(32,36,37,.14)!important}
.promo-bar{background:#f3efe6!important;color:#554a39!important}

/* Public content */
.hero{background:#f4f1ea!important}
.hero:before{background:rgba(232,237,232,.62)!important}
.hero:after{background:linear-gradient(90deg,#faf8f3 0%,rgba(250,248,243,.985) 35%,rgba(250,248,243,.83) 62%,rgba(250,248,243,.30) 100%)!important}
.hero-photo{filter:saturate(.72) brightness(1.06) contrast(.97)!important;opacity:.56!important}
.eyebrow,.tiny{color:#94703a!important}
.btn,.ml-primary-cta{background:var(--ml-emerald)!important;color:#fff!important;border-color:var(--ml-emerald)!important;box-shadow:0 8px 20px rgba(15,90,74,.15)!important}
.btn:hover,.ml-primary-cta:hover{background:var(--ml-emerald-2)!important;filter:none!important}
.btn.outline,.ml-secondary-cta{background:#fff!important;color:#31403c!important;border-color:#ccc9c0!important;box-shadow:none!important}
.micro-trust span{background:rgba(255,255,255,.88)!important;border-color:#dedbd2!important;color:#606664!important}
.section.pastel{background:linear-gradient(180deg,#f2f0ea 0%,#faf9f6 58%,#f3f1ec 100%)!important}
.section.tint-blue{background:linear-gradient(180deg,#f0f3f0,#fff)!important}
.section.soft{background:#fff!important}
.area-card:hover,.service-card:hover{border-color:#c7d5cf!important;box-shadow:0 16px 36px rgba(32,36,37,.085)!important}
.service-card:nth-child(6n+1),.area-card:nth-child(6n+1),.intent-grid .area-card:nth-child(1){background:#f0f4f1!important}
.intent-grid .area-card:nth-child(2){background:#f6f4ef!important}
.intent-grid .area-card:nth-child(3){background:#f6efef!important}
.intent-grid .area-card:nth-child(4){background:#f5efe5!important}
.service-icon,.area-card .price,.text-cta{color:var(--ml-emerald)!important}
.how-step b{background:#e8f1ed!important;color:var(--ml-emerald)!important;border-color:#cadbd3!important}
.sales-strip,.consult-band{background:#f4f1ea!important;border-color:#dfdbd1!important}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#6d9b8b!important;box-shadow:0 0 0 4px rgba(15,90,74,.10)!important}
.check-row input{accent-color:var(--ml-emerald)!important}
.legal-note{border-left-color:var(--ml-gold)!important}
.site-footer,.mlv14-footer{background:#292e2f!important;color:#eef0ed!important;border-color:#292e2f!important}
.site-footer a,.site-footer h3,.site-footer .wordmark-main,.site-footer .wordmark-sub,.mlv14-footer a{color:#f6f3eb!important}
.site-footer p,.site-footer span{color:#c8cdca!important}

.ml-package-card,.form-card,.side-card,.resource-card,.service-card,.area-card,.how-step,.decision-card,.sales-card{border-color:#e0ddd5!important;box-shadow:0 9px 26px rgba(32,36,37,.06)!important}
.ml-package-main{border-top:3px solid var(--ml-emerald)!important}
.card-link,.text-cta{font-weight:850!important}

/* AUTHENTICATED PORTAL — structure is graphite, interaction is emerald, gold is tiny */
body:has(.portal){
  --ink:#25292c!important;--muted:#6f7673!important;--line:#dedbd2!important;--line-2:#cfcbc1!important;--soft:#f2f0ea!important;
  background:var(--ml-ivory)!important;color:var(--ml-ink)!important;
}
body:has(.portal) .portal{background:var(--ml-ivory)!important;color:var(--ml-ink)!important}
body:has(.portal) .portal-nav,
body:has(.broker-os) .portal-nav{
  background:#272c2d!important;color:#f5f5f1!important;border-right:1px solid #3a4041!important;
  box-shadow:8px 0 28px rgba(24,27,28,.10)!important;
}
body:has(.portal) .portal-nav .wordmark-main{color:#f7f4ed!important;text-shadow:none!important;font-weight:900!important}
body:has(.portal) .portal-nav .wordmark-sub{color:#b8bfbb!important;text-shadow:none!important}
body:has(.portal) .portal-nav .brand-icon{background:#fff!important;border:1px solid rgba(255,255,255,.55)!important;box-shadow:0 5px 16px rgba(0,0,0,.16)!important}
body:has(.portal) .portal-nav .os2-session{background:#fff!important;border:1px solid #e4e1da!important;border-radius:14px!important;box-shadow:0 5px 16px rgba(0,0,0,.10)!important}
body:has(.portal) .portal-nav .os2-session strong{color:#29302e!important}
body:has(.portal) .portal-nav .os2-session small{color:#66706c!important}
body:has(.portal) .portal-nav .os2-role-dot{background:var(--ml-gold)!important;box-shadow:0 0 0 4px rgba(181,138,66,.14)!important}
body:has(.portal) .portal-nav .os2-nav-label{color:#aeb6b2!important;opacity:1!important;letter-spacing:.13em!important}
body:has(.portal) .portal-nav .os2-nav-group{background:transparent!important;border-color:transparent!important}
body:has(.portal) .portal-nav .os2-nav-group:hover{background:transparent!important;border-color:transparent!important}
body:has(.portal) .portal-nav .os2-nav-group nav a,
body:has(.portal) .portal-nav .os2-nav-group.tone-focus nav a,
body:has(.portal) .portal-nav .os2-nav-group.tone-focus nav a:first-child{
  color:#d5dbd7!important;background:transparent!important;border:1px solid transparent!important;
  box-shadow:none!important;font-weight:760!important;
}
body:has(.portal) .portal-nav .os2-nav-group nav a:hover{background:#343a3b!important;color:#fff!important;border-color:#414849!important}
body:has(.portal) .portal-nav .os2-nav-group nav a.is-active{
  background:#f8f6f0!important;color:#24342f!important;border-color:#f8f6f0!important;
  box-shadow:inset 4px 0 0 var(--ml-emerald),0 5px 15px rgba(0,0,0,.12)!important;font-weight:900!important;
}
body:has(.portal) .portal-nav .nav-icon{color:#d7e1dc!important;background:#343a3b!important;border:1px solid #434a4b!important}
body:has(.portal) .portal-nav a.is-active .nav-icon{color:#fff!important;background:var(--ml-emerald)!important;border-color:var(--ml-emerald)!important}
body:has(.portal) .portal-nav .nav-badge{background:#ece9e1!important;color:#313736!important;border:1px solid #d8d4ca!important;box-shadow:none!important}
body:has(.portal) .portal-nav .btn.outline.full{background:transparent!important;color:#e2e6e3!important;border-color:#555d5e!important}
body:has(.portal) .portal-nav .btn.outline.full:hover{background:#343a3b!important;border-color:#697172!important}
body:has(.portal) .portal-nav .os2-nav-footer{border-top-color:#444b4c!important}

body:has(.portal) .portal-main{background:linear-gradient(180deg,#f7f4ed 0,#fbfaf7 300px,#f7f4ed 100%)!important;color:var(--ml-ink)!important}
body:has(.portal) .portal-page{color:var(--ml-ink)!important}
body:has(.portal) .portal-page h1,body:has(.portal) .portal-page h2,body:has(.portal) .portal-page h3,body:has(.portal) .profile-page h1,body:has(.portal) .profile-page h2{color:#25292c!important;opacity:1!important}
body:has(.portal) .tiny{color:#6f7673!important;opacity:1!important;font-weight:900!important;letter-spacing:.14em!important}
body:has(.portal) .panel-card,body:has(.portal) .metric,body:has(.portal) .card{background:#fff!important;color:#2d3233!important;border-color:#dedbd2!important;box-shadow:0 8px 22px rgba(32,36,37,.055)!important}
body:has(.portal) .metric{border-top:1px solid #dedbd2!important}
body:has(.portal) .metric strong,body:has(.portal) .kpi strong{color:#25292c!important}
body:has(.portal) .muted,body:has(.portal) small,body:has(.portal) .sub,body:has(.portal) .hint{color:#707674!important;opacity:1!important}
body:has(.portal) input,body:has(.portal) select,body:has(.portal) textarea{background:#fff!important;color:#25292c!important;border-color:#cfcac0!important}
body:has(.portal) input:focus,body:has(.portal) select:focus,body:has(.portal) textarea:focus{outline:none!important;border-color:#6b9a89!important;box-shadow:0 0 0 3px rgba(15,90,74,.10)!important}
body:has(.portal) button.btn,body:has(.portal) .btn:not(.outline),body:has(.portal) button.primary,body:has(.portal) .btn.primary,body:has(.portal) .primarybtn{background:var(--ml-emerald)!important;color:#fff!important;border-color:var(--ml-emerald-2)!important;box-shadow:0 6px 16px rgba(15,90,74,.13)!important}
body:has(.portal) .btn.outline{background:#fff!important;color:#34423d!important;border-color:#cbc7bd!important;box-shadow:none!important}
body:has(.portal) .role-pill{background:#e8f1ed!important;color:#245144!important;border-color:#cadbd3!important}
body:has(.portal) .bar{background:#e8e5de!important}
body:has(.portal) .bar i{background:var(--ml-emerald)!important}
body:has(.portal) .upgrade,body:has(.portal) .activate{background:var(--ml-emerald)!important;color:#fff!important;border-color:var(--ml-emerald-2)!important}
body:has(.portal) table{background:#fff!important;color:#2e3334!important}
body:has(.portal) th{background:#f2f0ea!important;color:#474d4c!important}
body:has(.portal) td{color:#454b4d!important}
body:has(.portal) .os2-account-footer{border-top-color:#ddd9d0!important;color:#747a78!important}
body:has(.portal) .os2-account-footer strong{color:#303536!important}

/* Embedded tools should feel native, not like another colored application inside the portal */
body:has(.portal) .embedded-tool{padding:22px 20px 0!important}
body:has(.portal) .embedded-tool>header{margin-bottom:14px!important}
body:has(.portal) .embedded-tool .frame-wrap{background:#fff!important;border-color:#ddd9d0!important;border-radius:18px!important;box-shadow:0 7px 20px rgba(32,36,37,.045)!important}


/* V30.5.7 — strict color containment inside authenticated experience */
body:has(.portal) .portal-page h1 strong,
body:has(.portal) .portal-page h1 span,
body:has(.portal) .embedded-tool h1 strong,
body:has(.portal) .embedded-tool h1 span{color:#25292c!important}
body:has(.portal) .portal-page .eyebrow,
body:has(.portal) .embedded-tool .tiny{color:#6f7673!important}
body:has(.portal) .portal-page a:not(.btn):not(.is-active){color:#315d51}
body:has(.portal) .portal-page .success,body:has(.portal) .portal-page .ok{color:#27614f}

/* When a legacy engine is embedded inside Mi cuenta, portal chrome is the only chrome. */
.ml-embed #ml-session-rolebar,
.ml-embed #ml-universal-header,
.ml-embed #ml-universal-drawer,
.ml-embed .site-header,
.ml-embed .mlv14-flow-header,
.ml-embed .site-footer,
.ml-embed .mlv14-footer,
.ml-embed #ml-footer{display:none!important}
html.ml-embed body,body.ml-embed{margin-top:0!important;padding-top:0!important;background:#fff!important}
html.ml-embed main,html.ml-embed .wrap,html.ml-embed .container,body.ml-embed main,body.ml-embed .wrap,body.ml-embed .container{max-width:none}

/* Embedded content: neutral by default; color communicates action, not decoration. */
.ml-embed .tiny,.ml-embed .eyebrow{color:#707674!important}
.ml-embed h1 span,.ml-embed h2 span{color:inherit!important}
.ml-embed .btn:not(.outline),.ml-embed button.primary,.ml-embed .primarybtn{background:var(--ml-emerald)!important;color:#fff!important;border-color:var(--ml-emerald-2)!important}
.ml-embed .btn.outline{background:#fff!important;color:#34423d!important;border-color:#cbc7bd!important}

/* Login / registration: trust via emerald, not broad color fields */
.social-btn:hover{background:#f7f7f4!important;border-color:#d2cec5!important}
.ml-login-next .create-account{background:#e8f1ed!important;color:#245144!important;border-color:#cadbd3!important}
.ml-login-next .create-account:hover{background:#dfeae5!important}
.ml-mobile-install{background:#292e2f!important}
.ml-mobile-install .btn{background:var(--ml-emerald)!important;color:#fff!important}

@media(max-width:980px){
  body:has(.portal) .portal-nav,body:has(.broker-os) .portal-nav{background:#272c2d!important;box-shadow:none!important}
}


/* V30.5.9 — portal calm hierarchy
   Client portal uses fewer navigation choices and neutral operational surfaces.
   Color communicates action/status only; large decorative color blocks are removed. */
body:has(.portal) .portal-main{padding-bottom:28px!important}
body:has(.portal) .portal-page{max-width:1280px!important}
body:has(.portal) .portal-page>header,
body:has(.portal) .embedded-tool>header{padding-bottom:4px!important}
body:has(.portal) .portal-page>header p,
body:has(.portal) .embedded-tool>header p{max-width:720px!important;color:#737976!important}

/* Client/home operational cards: white paper first, status second. */
body:has(.portal) .next-step,
body:has(.portal) .deal-card,
body:has(.portal) .op360-card,
body:has(.portal) .attention,
body:has(.portal) .contact-card{
  background:#fff!important;color:#2d3233!important;border:1px solid #dedbd2!important;
  box-shadow:0 8px 22px rgba(32,36,37,.055)!important;
}
body:has(.portal) .next-step{border-left:4px solid var(--ml-emerald)!important}
body:has(.portal) .deal-card{border-top:3px solid #c9c5bb!important}
body:has(.portal) .deal-card .deal-title h2,
body:has(.portal) .deal-card .deal-next strong,
body:has(.portal) .deal-card strong,
body:has(.portal) .op360-card h2,
body:has(.portal) .op360-card h3,
body:has(.portal) .op360-card strong{color:#2d3233!important}
body:has(.portal) .deal-card .deal-title p,
body:has(.portal) .deal-card .deal-next span,
body:has(.portal) .deal-card .deal-list span,
body:has(.portal) .op360-card p,
body:has(.portal) .op360-card span,
body:has(.portal) .op360-card small{color:#707674!important}
body:has(.portal) .deal-card .deal-next,
body:has(.portal) .deal-card .deal-list div,
body:has(.portal) .op360-section,
body:has(.portal) .op360-note,
body:has(.portal) .op360-pending,
body:has(.portal) .op360-activity{background:#faf9f6!important;border-color:#e3e0d8!important;color:#2d3233!important}
body:has(.portal) .btn.gold{background:#fff!important;color:#5b4a2b!important;border-color:#d9c8a7!important;box-shadow:none!important}
body:has(.portal) .dealmetric{border-top-color:#dedbd2!important}
body:has(.portal) .op360-badge,
body:has(.portal) .state{background:#f1f2ef!important;color:#4b5350!important;border-color:#dddcd6!important}
body:has(.portal) .op360-step.current{color:var(--ml-emerald)!important}
body:has(.portal) .op360-step.current i,
body:has(.portal) .activity-list i{background:var(--ml-emerald)!important}
body:has(.portal) .op360-step.done i{background:#719888!important}
body:has(.portal) .legal-alert,
body:has(.portal) .demo-alert{background:#fbf5e9!important;color:#6e572c!important;border-color:#eadfc8!important}
body:has(.portal) .op360-note.warning{background:#fbf7ee!important;border-color:#e7ddc9!important}
body:has(.portal) .op360-note.quote-state{background:#f4f5f2!important;border-color:#dedfd9!important}
body:has(.portal) .doc-open{background:#fff!important;color:#315d51!important;border-color:#d7d4cc!important}

/* Reduce visual chrome in the sidebar. */
body:has(.portal) .portal-nav .os2-session{padding:12px 13px!important}
body:has(.portal) .portal-nav .os2-session small{font-size:10px!important}
body:has(.portal) .portal-nav .os2-nav-group{margin-bottom:9px!important}
body:has(.portal) .portal-nav .os2-nav-group nav a{min-height:38px!important}
body:has(.portal) .portal-nav .os2-nav-footer{padding-top:12px!important}
body:has(.portal) .os2-account-footer{display:none!important}

/* Empty states should not look like large inactive products. */
body:has(.portal) .empty,
body:has(.portal) .empty-state{background:#faf9f6!important;border:1px dashed #ddd9d0!important;border-radius:14px!important;padding:18px!important;color:#777d7a!important}

/* MASTERLAW® V30.5.9 · Responsive application shell + calm utility surfaces */
.portal-mobilebar,.portal-scrim,.portal-nav-mobilehead{display:none}

body:has(.portal) .portal-page .hero{
  background:#fff!important;color:var(--ml-ink)!important;border:1px solid var(--ml-line)!important;
  box-shadow:0 8px 24px rgba(32,36,37,.055)!important;
}
body:has(.portal) .portal-page .hero h1,
body:has(.portal) .portal-page .hero h2,
body:has(.portal) .portal-page .hero h3{color:var(--ml-ink)!important}
body:has(.portal) .portal-page .hero p{color:var(--ml-muted)!important}
body:has(.portal) .portal-page .tiny.light{color:#8b6b37!important}
body:has(.portal) .portal-page .btn.ghost{background:#fff!important;color:var(--ml-ink)!important;border-color:var(--ml-line-strong)!important}

body:has(.portal) .panel-card,
body:has(.portal) .metric,
body:has(.portal) .module,
body:has(.portal) .detail-section,
body:has(.portal) .sheet,
body:has(.portal) .drawer{
  background:#fff!important;border-color:var(--ml-line)!important;color:var(--ml-ink)!important;
  box-shadow:0 8px 24px rgba(32,36,37,.055)!important;
}
body:has(.portal) .deal-card,
body:has(.portal) .op360-card,
body:has(.portal) .formalization-box{
  background:#fff!important;color:var(--ml-ink)!important;border:1px solid var(--ml-line)!important;
  box-shadow:0 8px 24px rgba(32,36,37,.055)!important;
}
body:has(.portal) .deal-card h1,body:has(.portal) .deal-card h2,body:has(.portal) .deal-card h3,
body:has(.portal) .op360-card h1,body:has(.portal) .op360-card h2,body:has(.portal) .op360-card h3{color:var(--ml-ink)!important}
body:has(.portal) .deal-card p,body:has(.portal) .deal-card span,
body:has(.portal) .op360-card p,body:has(.portal) .op360-card span{color:var(--ml-muted)!important}
body:has(.portal) .deal-next,body:has(.portal) .deal-list div,
body:has(.portal) .op360-section,body:has(.portal) .op360-note,body:has(.portal) .op360-pending,
body:has(.portal) .op360-activity{background:#fbfaf7!important;border-color:var(--ml-line)!important;color:var(--ml-ink)!important}

body:has(.portal) input:not([type=checkbox]):not([type=radio]),
body:has(.portal) select,
body:has(.portal) textarea{
  min-height:44px;background:#fff!important;color:var(--ml-ink)!important;border-color:#d5d1c7!important;
  box-shadow:none!important;
}
body:has(.portal) textarea{min-height:96px}
body:has(.portal) input:focus,body:has(.portal) select:focus,body:has(.portal) textarea:focus{
  outline:none!important;border-color:#6b9485!important;box-shadow:0 0 0 3px rgba(15,90,74,.09)!important;
}
body:has(.portal) input::placeholder,body:has(.portal) textarea::placeholder{color:#8b908d!important}
body:has(.portal) input[type=checkbox],body:has(.portal) input[type=radio]{accent-color:var(--ml-emerald)!important}
body:has(.portal) button:disabled,body:has(.portal) .btn:disabled{opacity:.52!important;cursor:not-allowed!important;box-shadow:none!important}

body:has(.portal) .badge,body:has(.portal) .pill,body:has(.portal) .state{
  background:#f1f0eb!important;color:#505654!important;border:1px solid #dfdcd3!important;box-shadow:none!important;
}
body:has(.portal) .status.on{background:#eef4f1!important;color:#31584d!important;border-color:#d3e2db!important}
body:has(.portal) .status.on.err,body:has(.portal) .err{background:#f8eeee!important;color:#7b3c3c!important;border-color:#ead1d1!important}
body:has(.portal) .danger,body:has(.portal) .alarm,body:has(.portal) .critical{color:#7b3c3c!important}
body:has(.portal) .empty{
  margin-top:10px;padding:18px!important;border:1px dashed #d7d3ca!important;border-radius:13px!important;
  background:#fbfaf7!important;color:#747a77!important;text-align:left!important;
}

body:has(.portal) .table-scroll{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch;border:1px solid var(--ml-line);border-radius:14px;background:#fff}
body:has(.portal) .table-scroll table{margin:0!important;border:0!important;min-width:720px}
body:has(.portal) table{background:#fff;color:var(--ml-ink)}
body:has(.portal) table th{background:#f5f3ed!important;color:#555c59!important;font-size:11px!important;letter-spacing:.045em;text-transform:uppercase}
body:has(.portal) table td,body:has(.portal) table th{border-color:#e5e2da!important}

/* Mobile shell: one compact bar, drawer only when requested. */
@media(max-width:980px){
  body:has(.portal.nav-open){overflow:hidden!important}
  body:has(.portal) .portal{display:block!important;min-height:100vh!important}
  body:has(.portal) .portal-mobilebar{
    display:flex;position:sticky;top:0;z-index:90;height:64px;padding:0 15px;align-items:center;justify-content:space-between;
    background:rgba(255,255,255,.97);border-bottom:1px solid var(--ml-line);backdrop-filter:blur(14px);
    box-shadow:0 5px 18px rgba(32,36,37,.055)
  }
  body:has(.portal) .portal-mobilebrand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ml-ink)}
  body:has(.portal) .portal-mobilebrand img{width:34px;height:34px;object-fit:contain;border-radius:9px;background:#fff;border:1px solid #e5e2da}
  body:has(.portal) .portal-mobilebrand span{display:grid;gap:1px}
  body:has(.portal) .portal-mobilebrand strong{font-size:14px;letter-spacing:.01em;color:var(--ml-ink)}
  body:has(.portal) .portal-mobilebrand small{font-size:10px;color:var(--ml-muted);font-weight:750}
  body:has(.portal) .portal-menu-button{display:grid;grid-template-columns:18px auto;column-gap:7px;row-gap:3px;align-items:center;padding:8px 10px;border:1px solid #d8d5cd;border-radius:10px;background:#fff;color:var(--ml-ink);font-weight:850}
  body:has(.portal) .portal-menu-button span{grid-column:1;width:18px;height:2px;background:#444a48;border-radius:2px}
  body:has(.portal) .portal-menu-button b{grid-column:2;grid-row:1/4;align-self:center;font-size:12px}
  body:has(.portal) .portal-scrim{display:block;position:fixed;inset:0;z-index:94;background:rgba(22,25,25,.42);border:0;opacity:0;pointer-events:none;transition:opacity .18s ease}
  body:has(.portal.nav-open) .portal-scrim{opacity:1;pointer-events:auto}
  body:has(.portal) .portal-nav{
    display:flex!important;position:fixed!important;top:0!important;left:0!important;bottom:0!important;z-index:95!important;
    width:min(86vw,340px)!important;height:100dvh!important;padding:16px!important;box-sizing:border-box!important;
    transform:translateX(-104%);transition:transform .2s ease!important;overflow:hidden!important;
    background:#272c2d!important;box-shadow:18px 0 48px rgba(18,21,21,.26)!important;
  }
  body:has(.portal.nav-open) .portal-nav{transform:translateX(0)}
  body:has(.portal) .portal-nav-mobilehead{display:flex;align-items:center;justify-content:space-between;padding:0 2px 12px;color:#dce1de;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.11em}
  body:has(.portal) .portal-nav-mobilehead button{width:36px;height:36px;border:1px solid #505758;border-radius:10px;background:#33393a;color:#fff;font-size:24px;line-height:1}
  body:has(.portal) .portal-nav .wordmark{margin:0 0 12px!important}
  body:has(.portal) .portal-nav .os2-session{margin-bottom:10px!important}
  body:has(.portal) .portal-nav .os2-nav-scroll{overflow-y:auto!important;overflow-x:hidden!important;padding-right:3px!important}
  body:has(.portal) .portal-nav .os2-nav-group{margin:0 0 12px!important}
  body:has(.portal) .portal-nav .os2-nav-group nav{display:grid!important;overflow:visible!important;margin:6px 0 0!important;gap:4px!important}
  body:has(.portal) .portal-nav .os2-nav-group nav a{min-width:0!important;white-space:normal!important;padding:10px 11px!important}
  body:has(.portal) .portal-nav .os2-nav-footer{display:grid!important;margin-top:8px!important;padding-top:10px!important}
  body:has(.portal) .portal-nav .os2-nav-footer .btn{display:flex!important;width:100%!important;min-width:0!important}
  body:has(.portal) .portal-main{min-width:0!important;background:var(--ml-ivory)!important}
  body:has(.portal) .portal-page{padding:22px 15px 36px!important;max-width:none!important}
  body:has(.portal) .portal-page h1{font-size:clamp(30px,8vw,40px)!important;line-height:1.03!important;margin-bottom:16px!important}
  body:has(.portal) .panel-card,body:has(.portal) .metric{border-radius:15px!important;padding:16px!important}
  body:has(.portal) .table-scroll{margin-left:-2px;margin-right:-2px}
}

@media(max-width:620px){
  body:has(.portal) .portal-page{padding:18px 12px 30px!important}
  body:has(.portal) .portal-page .hero{padding:16px!important;border-radius:15px!important}
  body:has(.portal) .portal-page .hero,.portal-page .head-row,.portal-page .panel-head{gap:10px!important}
  body:has(.portal) .portal-page .btn{min-height:42px!important}
  body:has(.portal) .metric-grid,body:has(.portal) .metrics,body:has(.portal) .metrics4,body:has(.portal) .metrics5{grid-template-columns:1fr!important}
  body:has(.portal) .row-actions,body:has(.portal) .head-actions,body:has(.portal) .actions{max-width:100%!important}
  body:has(.portal) .row-actions .btn,body:has(.portal) .head-actions .btn{flex:1 1 auto}
}

@media(prefers-reduced-motion:reduce){
  body:has(.portal) .portal-nav,body:has(.portal) .portal-scrim{transition:none!important}
}