/* IYABOKO Global UI & Contrast System v1.1
 * Site-wide readability rule:
 *   dark rendered surfaces -> white/light text
 *   light rendered surfaces -> black/dark text
 * Runtime contrast repair is performed by iyaboko-contrast-guard.js only when needed.
 */
:root{
  --iyb-ink:#08131b;
  --iyb-ink-soft:#334a5b;
  --iyb-paper:#ffffff;
  --iyb-paper-soft:#f5f8fa;
  --iyb-night:#061523;
  --iyb-night-2:#0b2436;
  --iyb-line:#d5e1e8;
  --iyb-line-dark:rgba(255,255,255,.18);
  --iyb-blue:#1769d2;
  --iyb-cyan:#72dcff;
  --iyb-focus:#00a7e1;
  --iyb-success:#117a55;
  --iyb-warning:#8a5a00;
  --iyb-danger:#a12626;
}

/* Explicit authoring utilities. Unlike auto classes, explicit surface classes own background. */
.iyb-surface-dark{background-color:var(--iyb-night)!important;color:#fff!important}
.iyb-surface-light{background-color:var(--iyb-paper)!important;color:var(--iyb-ink)!important}

/* Auto classes never repaint the surface: they only repair foreground/readability. */
.iyb-auto-dark{color:#fff!important}
.iyb-auto-light{color:var(--iyb-ink)!important}
.iyb-surface-dark :where(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,legend,small,strong,em,b,i,blockquote,figcaption,caption,td,th,summary){color:#fff}
.iyb-surface-light :where(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,legend,small,strong,em,b,i,blockquote,figcaption,caption,td,th,summary){color:var(--iyb-ink)}

/* Runtime repair classes use !important because they are only applied after computed-style failure. */
body.iyb-global-contrast .iyb-contrast-force-light{color:#fff!important}
body.iyb-global-contrast .iyb-contrast-force-dark{color:#05080b!important}
body.iyb-global-contrast a.iyb-contrast-force-light{color:#fff!important;text-decoration-color:currentColor!important;text-decoration-thickness:.1em;text-underline-offset:.16em}
body.iyb-global-contrast a.iyb-contrast-force-dark{color:#05080b!important;text-decoration-color:currentColor!important;text-decoration-thickness:.1em;text-underline-offset:.16em}
body.iyb-global-contrast :where(.iyb-contrast-force-light,.iyb-contrast-force-dark)::before,
body.iyb-global-contrast :where(.iyb-contrast-force-light,.iyb-contrast-force-dark)::after{color:inherit!important}

/* Form controls are deliberately normalized for readability. */
body.iyb-global-contrast :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),select,textarea){
  background-color:#fff;
  color:#05080b;
  border-color:#7c8b96;
}
body.iyb-global-contrast :where(input,textarea)::placeholder{color:#4e5d68;opacity:1}
body.iyb-global-contrast :where(input,select,textarea):disabled{background:#e8edf0;color:#394852;opacity:1}

/* Common WordPress/Gutenberg explicit palette helpers. */
body.iyb-global-contrast :where(.has-black-background-color,.has-contrast-background-color,.has-foreground-background-color){color:#fff}
body.iyb-global-contrast :where(.has-white-background-color,.has-base-background-color,.has-background-background-color){color:var(--iyb-ink)}
body.iyb-global-contrast :where(.has-black-background-color,.has-contrast-background-color,.has-foreground-background-color) a{color:#fff}
body.iyb-global-contrast :where(.has-white-background-color,.has-base-background-color,.has-background-background-color) a{color:#05080b}

/* Table and message surfaces often inherit the wrong theme colour. Runtime still verifies computed contrast. */
body.iyb-global-contrast :where(table,thead,tbody,tfoot,tr,td,th,caption){border-color:currentColor}
body.iyb-global-contrast :where(.notice,.alert,.message,.wp-block-table,.wp-block-quote,.wp-block-pullquote){overflow-wrap:anywhere}

/* Focus treatment across customer-facing UI. */
body.iyb-global-contrast :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--iyb-focus)!important;
  outline-offset:3px!important;
}

/* Accessibility escape hatch for deliberately authored special surfaces. */
body.iyb-global-contrast [data-iyb-contrast-skip],
body.iyb-global-contrast .iyb-contrast-skip{--iyb-contrast-skip:1}

/* Global trust/customer-experience page. */
.iyb-trust{max-width:1180px;margin:32px auto;padding:0 18px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--iyb-ink)}
.iyb-trust *{box-sizing:border-box}
.iyb-trust-hero{padding:48px;border-radius:28px;background:linear-gradient(135deg,#061523,#0d4262);color:#fff;box-shadow:0 28px 70px rgba(6,21,35,.16)}
.iyb-trust-hero .eyebrow{margin:0;color:#84e5ff;font-weight:850;letter-spacing:.14em;text-transform:uppercase;font-size:.76rem}
.iyb-trust-hero h1{margin:.18em 0;font-size:clamp(2.3rem,5vw,4.7rem);line-height:1.02;color:#fff}
.iyb-trust-hero>p:not(.eyebrow){max-width:820px;color:#eef8fc;font-size:1.08rem}
.iyb-trust-boundary{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.iyb-trust-boundary span{padding:8px 11px;border:1px solid rgba(255,255,255,.26);border-radius:999px;color:#fff;background:rgba(0,0,0,.12);font-size:.78rem;font-weight:750}
.iyb-trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:22px 0}
.iyb-trust-card,.iyb-trust-panel{padding:22px;border:1px solid var(--iyb-line);border-radius:18px;background:#fff;color:var(--iyb-ink);box-shadow:0 10px 30px rgba(11,31,45,.05)}
.iyb-trust-card h2,.iyb-trust-panel h2{margin-top:0;color:var(--iyb-ink)}
.iyb-trust-card p,.iyb-trust-panel p,.iyb-trust-card li,.iyb-trust-panel li{color:#31495a}
.iyb-trust-kicker{color:#0d638e;font-size:.72rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.iyb-trust-status{display:inline-flex;padding:6px 9px;border-radius:999px;background:#e9f7ef;color:#0c6042;font-weight:850;font-size:.72rem}
.iyb-trust-status.hold{background:#fff3d6;color:#6b4700}
.iyb-trust-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.iyb-trust-links a{display:inline-flex;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:800;background:#0e5d8d;color:#fff}
.iyb-trust-links a.secondary{background:#fff;color:#0e5d8d;border:1px solid #0e5d8d}
.iyb-trust-notice{margin-top:22px;padding:18px 20px;border-left:5px solid var(--iyb-blue);border-radius:12px;background:#f4f8fb;color:var(--iyb-ink)}
.iyb-company-strip{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}
.iyb-company-strip span{padding:7px 10px;border:1px solid #c8dbe5;border-radius:999px;background:#f8fbfc;color:#18384c;font-size:.76rem;font-weight:750}

@media(max-width:700px){
  .iyb-trust-hero{padding:34px 24px}
  .iyb-trust-grid{grid-template-columns:1fr}
}

/* Administrator-only visual audit mode, enabled by ?iyb_contrast_audit=1. */
body.iyb-contrast-debug :where(.iyb-contrast-force-light,.iyb-contrast-force-dark){outline:2px dashed #ff2fa4!important;outline-offset:2px}
#iyb-contrast-debug-panel{position:fixed;z-index:2147483647;right:14px;bottom:14px;max-width:min(460px,calc(100vw - 28px));padding:10px 13px;border:2px solid #fff;border-radius:10px;background:#061523;color:#fff;font:700 13px/1.35 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 12px 35px rgba(0,0,0,.35)}

/* IYABOKO Safe Workspace Geometry v1.4
 * WordPress workspace pages use the full content area but never use viewport-breakout
 * math. This avoids the classic 100vw + scrollbar/theme-padding overflow that can cut
 * the right edge of nested Device/C3/Enterprise rooms.
 */
:root{
  --iyb-workspace-max:1520px;
  --iyb-workspace-gutter:clamp(12px,2vw,28px);
  --iyb-workspace-gutter-mobile:10px;
}
body.iyb-workspace-fullwidth-page{
  overflow-x:visible;
}
body.iyb-workspace-fullwidth-page :where(.site-content,.content-area,.site-main,main#primary,.entry-content,.wp-block-post-content,.page-content){
  box-sizing:border-box;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  float:none!important;
}
body.iyb-workspace-fullwidth-page :where(.entry-content,.wp-block-post-content,.page-content){
  padding-left:0!important;
  padding-right:0!important;
}
body.iyb-workspace-fullwidth-page :where(
  .iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iyb-c3-machine,.iybci,.iyb-itm,.iyb-bgn,
  .iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-rwl,.iyb-ss,.iyb-bwe,.iyb-production-jobs
){
  box-sizing:border-box!important;
  width:calc(100% - (2 * var(--iyb-workspace-gutter)))!important;
  max-width:var(--iyb-workspace-max)!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
/* Nested workspaces must respect their parent panel instead of attempting a second page breakout. */
body.iyb-workspace-fullwidth-page :where(.iyb-phy-room,.iyb-ess,.iyb-elc,.iyb-c3b) :where(.iyb-dw,.iyb-c3b,.iyb-project-demo){
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
}
body.iyb-workspace-fullwidth-page :where(
  .iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iyb-c3-machine,.iybci,.iyb-itm,.iyb-bgn,
  .iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-rwl,.iyb-ss,.iyb-bwe,.iyb-production-jobs
) :where(main,section,article,aside,form,div,nav,table,fieldset){
  min-width:0;
  max-width:100%;
}
body.iyb-workspace-fullwidth-page :where(img,svg,video,iframe,canvas){
  max-width:100%;
  height:auto;
}
body.iyb-workspace-fullwidth-page :where(pre,code,kbd,samp){
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
@media(max-width:782px){
  body.iyb-workspace-fullwidth-page :where(.site-main,main#primary,.content-area,.entry-content,.wp-block-post-content,.page-content){
    margin-left:0!important;
    margin-right:0!important;
  }
  body.iyb-workspace-fullwidth-page :where(
    .iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iyb-c3-machine,.iybci,.iyb-itm,.iyb-bgn,
    .iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-rwl,.iyb-ss,.iyb-bwe,.iyb-production-jobs
  ){
    width:calc(100% - (2 * var(--iyb-workspace-gutter-mobile)))!important;
  }
  body.iyb-workspace-fullwidth-page :where(input:not([type=checkbox]):not([type=radio]),select,textarea,button){
    font-size:16px;
  }
}
@media(max-width:420px){
  :root{--iyb-workspace-gutter-mobile:6px}
}

/* IYABOKO Global Business Interface v1.4
 * Unified typography, contrast, width and mobile-readability layer for all
 * IYABOKO customer/workspace surfaces. No remote font dependency is required.
 */
:root{
  --iyb-font-business:"Inter","Aptos","Segoe UI Variable Text","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --iyb-font-mono:"SFMono-Regular","Cascadia Code","Roboto Mono",Consolas,"Liberation Mono",monospace;
  --iyb-business-text:#090f14;
  --iyb-business-muted:#43515d;
  --iyb-business-white:#ffffff;
  --iyb-business-max-reading:78ch;
}
body.iyb-global-contrast :where(
  .iyb-trust,.iyb-itm,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-elc,.iyb-ess,
  .iyb-bgn,.iyb-c3-machine,.iyb-partner-portal,.iyb-phy-room,.iyb-rwl,.iyb-saas,
  .iyb-ss,.iyb-svc,.iyb-bwe,.iyb-production-jobs
){
  font-family:var(--iyb-font-business)!important;
  font-kerning:normal;
  font-optical-sizing:auto;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body.iyb-global-contrast :where(
  .iyb-trust,.iyb-itm,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-elc,.iyb-ess,
  .iyb-bgn,.iyb-c3-machine,.iyb-partner-portal,.iyb-phy-room,.iyb-rwl,.iyb-saas,
  .iyb-ss,.iyb-svc,.iyb-bwe,.iyb-production-jobs
) :where(button,input,select,textarea){
  font:inherit;
}
body.iyb-global-contrast :where(
  .iyb-trust,.iyb-itm,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-elc,.iyb-ess,
  .iyb-bgn,.iyb-c3-machine,.iyb-partner-portal,.iyb-phy-room,.iyb-rwl,.iyb-saas,
  .iyb-ss,.iyb-svc,.iyb-bwe
) :where(h1,h2,h3,h4,h5,h6){
  font-family:var(--iyb-font-business)!important;
  font-weight:760;
  letter-spacing:-.018em;
  text-wrap:balance;
}
body.iyb-global-contrast :where(
  .iyb-trust,.iyb-itm,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-elc,.iyb-ess,
  .iyb-bgn,.iyb-c3-machine,.iyb-partner-portal,.iyb-phy-room,.iyb-rwl,.iyb-saas,
  .iyb-ss,.iyb-svc,.iyb-bwe
) :where(p,li,dd,td,th,label,figcaption){
  line-height:1.58;
}
body.iyb-global-contrast :where(code,kbd,samp,pre,.iyb-dw-code){
  font-family:var(--iyb-font-mono)!important;
}

/* Explicit surface contract: dark ink is white, light/white ink is black.
 * Runtime contrast guard still wins on nested controls/cards with their own background.
 */
.iyb-surface-dark{color:var(--iyb-business-white)!important}
.iyb-surface-light{color:var(--iyb-business-text)!important}
.iyb-auto-dark{color:var(--iyb-business-white)!important}
.iyb-auto-light{color:var(--iyb-business-text)!important}
.iyb-auto-dark > :where(h1,h2,h3,h4,h5,h6,p,span,li,dt,dd,label,legend,small,strong,em,b,i,blockquote,figcaption,caption,td,th,summary){
  color:var(--iyb-business-white);
}
.iyb-auto-light > :where(h1,h2,h3,h4,h5,h6,p,span,li,dt,dd,label,legend,small,strong,em,b,i,blockquote,figcaption,caption,td,th,summary){
  color:var(--iyb-business-text);
}

/* Workspace reading geometry: full-width application shell, comfortable content rhythm. */
body.iyb-workspace-page{
  font-family:var(--iyb-font-business);
  text-rendering:optimizeLegibility;
}
body.iyb-workspace-fullwidth-page :where(
  .iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iybci,.iyb-itm,.iyb-bgn,
  .iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-c3-machine,.iyb-rwl,.iyb-ss,.iyb-bwe
){
  min-width:0;
}
body.iyb-workspace-page :where(p,li,dd,figcaption){
  overflow-wrap:anywhere;
}
body.iyb-workspace-page :where(table){
  width:100%;
  max-width:100%;
}
body.iyb-workspace-page :where(img,svg,video,iframe,canvas){
  max-width:100%;
}
body.iyb-workspace-page :where(video,iframe){
  border-radius:14px;
}
body.iyb-workspace-page :where(button,[role="button"],input,select,textarea,a){
  -webkit-tap-highlight-color:transparent;
}
body.iyb-workspace-page :where(button,[role="button"]){
  min-height:44px;
}
body.iyb-workspace-page :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-height:44px;
}
body.iyb-workspace-page :where(nav){
  max-width:100%;
}

/* Professional reading and panel density. Long project/device copy should not become a wall of text
 * across a large monitor, while operational tables/grids can still use the available canvas. */
body.iyb-workspace-page :where(.iyb-dw-step p,.iyb-dw-card p,.iyb-c3b p,.iyb-ess p,.iyb-elc p,.iyb-phy-room p){
  max-width:88ch;
}
body.iyb-workspace-page :where(.iyb-dw-head p,.iyb-ess-hero p,.iyb-c3b-hero p,.iyb-phy-hero p){
  max-width:76ch;
}
body.iyb-workspace-page :where(.iyb-dw-table-wrap,.iyb-c3b-table-wrap,.wp-block-table){
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-inline:contain;
}
body.iyb-workspace-page :where(.iyb-dw-tabs,.iyb-ess-nav,.iyb-c3b-tabs){
  max-width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-gutter:stable;
}

/* Project-specific demo media. */
.iyb-project-demo{
  width:100%;
  max-width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.8fr);
  gap:18px;
  align-items:start;
  margin:16px 0;
}
.iyb-project-demo__stage{
  min-width:0;
  overflow:hidden;
  border:1px solid currentColor;
  border-color:color-mix(in srgb,currentColor 20%,transparent);
  border-radius:18px;
  background:#050b12;
  color:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,.12);
}
.iyb-project-demo__stage :where(h2,h3,p,span,strong){color:#fff}
.iyb-project-demo__media{
  width:100%;
  aspect-ratio:16/9;
  display:block;
  border:0;
  background:#02070b;
}
.iyb-project-demo__stage video.iyb-project-demo__media{
  object-fit:contain;
}
.iyb-project-demo__copy{
  padding:16px 18px 18px;
}
.iyb-project-demo__copy h3{margin:.1em 0 .35em}
.iyb-project-demo__copy p{margin:.35em 0;color:#e8f2f8}
.iyb-project-demo__placeholder{
  min-height:clamp(210px,32vw,420px);
  display:grid;
  place-items:center;
  padding:28px;
  text-align:center;
  background:linear-gradient(135deg,#071725,#0b3650);
  color:#fff;
}
.iyb-project-demo__placeholder strong{display:block;font-size:1.2rem;color:#fff}
.iyb-project-demo__placeholder span{display:block;margin-top:7px;color:#d7e7f2}
.iyb-project-demo__panel{
  min-width:0;
}
.iyb-project-demo__external{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:240px;
  padding:24px;
  background:#071725;
  color:#fff!important;
  font-weight:750;
  text-align:center;
}
.iyb-project-demo__badge{
  display:inline-flex;
  margin-top:8px;
  padding:5px 9px;
  border-radius:999px;
  background:#e8f2f8;
  color:#09131b!important;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

@media(max-width:820px){
  body.iyb-workspace-page :where(table){
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
  }
  body.iyb-workspace-page :where(nav){
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
  }
  .iyb-project-demo{grid-template-columns:1fr}
}
@media(max-width:600px){
  body.iyb-workspace-fullwidth-page :where(
    .iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iybci,.iyb-itm,.iyb-bgn,
    .iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-c3-machine,.iyb-rwl,.iyb-ss,.iyb-bwe
  ){
    border-radius:0!important;
  }
  body.iyb-workspace-page :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea,button){
    font-size:16px!important;
  }
  body.iyb-workspace-page :where(h1){font-size:clamp(1.9rem,10vw,3rem)!important}
  body.iyb-workspace-page :where(h2){font-size:clamp(1.35rem,7vw,2rem)!important}
  body.iyb-workspace-page :where(h3){font-size:clamp(1.08rem,5.4vw,1.45rem)!important}
  .iyb-project-demo__copy{padding:14px}
}


/* IYABOKO Workspace Readability & Container Resilience v1.5
 * Keeps enterprise rooms professional inside Gutenberg, Elementor and narrow theme columns.
 * Viewport media queries remain as fallbacks; container queries respond to the actual room width.
 */
:root{
  --iyb-workspace-reading:76ch;
  --iyb-workspace-title-max:3rem;
}
:where(.iyb-ess,.iyb-elc,.iyb-phy-room,.iyb-dw,.iyb-c3b,.iyb-c3-machine,.iybci,.iyb-itm,.iyb-bgn,.iyb-saas,.iyb-svc,.iyb-partner-portal,.iybc3-app,.iyb-rwl,.iyb-ss,.iyb-bwe,.iyb-production-jobs){
  box-sizing:border-box;
  max-inline-size:100%;
  min-inline-size:0;
}
body.iyb-global-contrast :where(.iyb-ess,.iyb-elc,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-c3-machine,.iyb-phy-room) h1{
  font-size:clamp(1.85rem,3.2vw,var(--iyb-workspace-title-max))!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}
body.iyb-global-contrast :where(.iyb-ess,.iyb-elc,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-c3-machine,.iyb-phy-room) :where(p,li,dd){
  text-wrap:pretty;
}
body.iyb-global-contrast :where(.iyb-ess-hero,.iyb-elc header,.iyb-c3b-hero,.iyb-dw-head,.iybc3-hero) p{
  max-inline-size:var(--iyb-workspace-reading);
}
:where(.iyb-ess,.iyb-elc,.iyb-c3b,.iyb-dw,.iyb-phy-room,.iybc3-app){
  container-type:inline-size;
}
@media(max-width:600px){
  body.iyb-global-contrast :where(.iyb-ess,.iyb-elc,.iyb-c3b,.iybc3-app,.iybci,.iyb-dw,.iyb-c3-machine,.iyb-phy-room) h1{
    font-size:clamp(1.65rem,8vw,2.35rem)!important;
  }
}
