/* MAD reference materials. Only interface surfaces are affected. Typography is
   supplied by the licensed web-font sheet; system fallbacks remain explicit. */
html.mi-mad-experience {
  --mad-font-sans:'helvetica-neue-lt-pro','Helvetica Neue',Helvetica,Arial,'PingFang SC','Microsoft YaHei',sans-serif;
  --mad-font-mono:'BB Manual Mono','Courier New','PingFang SC','Microsoft YaHei',monospace;
  --mad-radius-control:8px;
  --mad-radius-card:12px;
  --mad-radius-panel:12px;
  --mad-glass-nav:rgba(230,230,230,.12);
  --mad-glass-panel:rgba(1,1,1,.4);
  --mad-glass-solid:#191919;
  --mad-glass-nav-solid:#292929;
  --mad-glass-line:rgba(255,255,255,.16);
  --mad-card-surface:linear-gradient(135deg,rgba(45,45,45,.9),rgba(24,24,24,.92));
  --mad-glass-shadow:0 12px 36px rgba(0,0,0,.12);
  --sans:var(--mad-font-sans);
  --font:var(--mad-font-sans);
  --font-ui:var(--mad-font-sans);
  text-rendering:optimizeLegibility;
}
html.mi-mad-experience[data-mi-theme="light"] {
  --mad-glass-nav:rgba(230,230,230,.5);
  --mad-glass-panel:rgba(245,245,245,.68);
  --mad-glass-solid:#f5f5f5;
  --mad-glass-nav-solid:#e6e6e6;
  --mad-glass-line:rgba(0,0,0,.1);
  --mad-card-surface:linear-gradient(135deg,rgba(250,250,250,.94),rgba(235,235,235,.92));
  --mad-glass-shadow:0 12px 36px rgba(0,0,0,.07);
}

/* Existing responsive type sizes and column widths remain authoritative. */
html.mi-mad-experience body,
html.mi-mad-experience body.wm-secondary,
html.mi-mad-experience body.wemeld-workspace.wm-secondary,
html.mi-mad-experience :is(.wm-shell,.site-header,.auth-header,.legal-header,.reading-theme-header) {
  --sans:var(--mad-font-sans);
  --font:var(--mad-font-sans);
  --font-ui:var(--mad-font-sans);
  font-family:var(--mad-font-sans)!important;
}
html.mi-mad-experience body.wemeld-workspace.wm-secondary.canvas-fullscreen {
  --chrome-type:var(--mad-font-sans);
}
html.mi-mad-experience :is(.hero-copy h1,.chapter-copy h2,.collaboration h2,.section-heading h2,.closing h2,.hub-intro h1,.page-heading h1,.g-intro h1,.g-detail-heading h1,.publish-intro h1,.team-intro h1,.team-step h2,.team-section-head h2,.auth-story h1,.auth-card h2,.legal-main h1,main>h1[data-copy]) {
  font-family:var(--mad-font-sans);
  font-weight:300;
}
/* Brand lettering is an existing identity, not a heading to restyle. Keep
   its previous face; the vector/image symbol itself is never transformed. */
html.mi-mad-experience :is(.story-home .wordmark strong,.wm-wordmark strong,.auth-brand>span,.brand-intro__name,.pc-brand strong) {
  font-family:Urbanist,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif!important;
}
html.mi-mad-experience body:has(>.legal-header) .wordmark strong {
  font-family:Arial,'Microsoft YaHei',sans-serif!important;
}
html.mi-mad-experience .reading-theme-header>.brand {
  font-family:system-ui,'Microsoft YaHei',sans-serif!important;
}
html.mi-mad-experience :is(.site-nav>a,.wm-nav>a,.header-billing,.header-projects,.wm-billing,.wm-projects,.language-toggle,.wm-language-toggle,.auth-home,.legal-header>div>a) {
  font-family:var(--mad-font-mono)!important;
  font-weight:500;
  letter-spacing:0;
}
html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog,.auth-card,.legal-main,.reading-theme-header),
html.mi-mad-experience body.wemeld-workspace :is(#design-assistant,.library-dialog,.credits-dialog,.cst-panel,.studio-popover) {
  font-family:var(--mad-font-sans);
}

/* MAD's compact corner treatment: 8px controls, 12px media and panels.
   Circle controls, avatars, connection ports and actual drawing pixels are excluded. */
html.mi-mad-experience :is(.button,.primary-button,.secondary-button,.dark-button,.header-projects,.wm-projects,.language-toggle,.wm-language-toggle,.auth-submit,.support-submit,.support-close,.support-open,.project-search,.gallery-search,.account-tab,.billing-tab) {
  border-radius:var(--mad-radius-control)!important;
}
html.mi-mad-experience :is(.mini-card,.glass-card,.mini-media,.project-card,.profile-card,.recent-project,.credits-card,.wallet-panel,.plan-card,.pack-card,.g-card,.team-step,.publish-panel,.publish-preview-panel,.auth-card,.pc-feature,.pc-steps li,.map-details,.map-project-index) {
  border-radius:var(--mad-radius-card)!important;
}
html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog,.library-dialog,.credits-dialog,.dialog,.cst-panel,.studio-popover) {
  border-radius:var(--mad-radius-panel)!important;
}
html.mi-mad-experience body.wemeld-workspace.wm-secondary :is(#design-assistant,.assistant-composer,.assistant-suggestion,.assistant-popover,.canvas-project-pod,#canvas-settings-menu,#canvas-project-menu,#canvas-members-menu,#canvas-navigator,#canvas-tool-menu) {
  border-radius:var(--mad-radius-panel)!important;
}
html.mi-mad-experience body.wemeld-workspace #world .studio-card,
html.mi-mad-experience body.wemeld-workspace #world .studio-card>:is(.node-body,.node-composer),
html.mi-mad-experience body.wemeld-workspace #world .studio-card :is(.node-output-area,.model-viewport,.webpage-stage,.drawing-paper-wrap,.image-panel) {
  border-radius:var(--mad-radius-card)!important;
}
html.mi-mad-experience body.wemeld-workspace.wm-secondary.canvas-fullscreen .canvas-collab-pod>:is(button,#credits-toggle),
html.mi-mad-experience :is(.pc-dialog,.cst-panel,.studio-popover) button:not(.assistant-send):not(.theme-choice) {
  border-radius:var(--mad-radius-control)!important;
}

/* Screen-space glass. Blur lives in a separate background layer, never in a
   transformed text container. The opaque base is the no-blur fallback. */
html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-header,.wm-shell,.auth-header,.legal-header,.reading-theme-header) {
  isolation:isolate;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.mi-mad-experience :is(.auth-header,.legal-header,.reading-theme-header) {position:relative;z-index:31}
html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-header,.wm-shell,.auth-header,.legal-header,.reading-theme-header)::before {
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:var(--mad-glass-solid);border-radius:inherit;
}
html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog,.auth-card),
html.mi-mad-experience body.wemeld-workspace.wm-secondary :is(#design-assistant,.library-dialog,.credits-dialog,.dialog,.cst-panel,#canvas-settings-menu,#canvas-project-menu,#canvas-members-menu,#canvas-navigator,#canvas-tool-menu) {
  isolation:isolate;background:transparent!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  border-color:var(--mad-glass-line)!important;box-shadow:var(--mad-glass-shadow);
}
html.mi-mad-experience body.wemeld-workspace .dialog {position:relative}
html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog,.auth-card)::before,
html.mi-mad-experience body.wemeld-workspace.wm-secondary :is(#design-assistant,.library-dialog,.credits-dialog,.dialog,.cst-panel,#canvas-settings-menu,#canvas-project-menu,#canvas-members-menu,#canvas-navigator,#canvas-tool-menu)::before {
  content:'';display:block!important;position:absolute;inset:0;z-index:-1;pointer-events:none;
  border-radius:inherit;background:var(--mad-glass-solid)!important;box-shadow:inset 0 1px rgba(255,255,255,.05);
  transform:none!important;filter:none!important;opacity:1;
}
/* Menus remain independently positioned by their existing controllers. */
html.mi-mad-experience :is(#language-menu,.wm-language-menu,.assistant-popover,.studio-popover) {
  isolation:isolate;background:transparent!important;border-radius:var(--mad-radius-panel)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  border-color:var(--mad-glass-line)!important;
}
html.mi-mad-experience :is(#language-menu,.wm-language-menu,.assistant-popover,.studio-popover)::before {
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  border-radius:inherit;background:var(--mad-glass-solid);
}
html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-nav>a,.wm-nav>a,.header-billing,.wm-billing,.header-projects,.wm-projects,.language-toggle,.wm-language-toggle) {
  border-radius:var(--mad-radius-control);
}
html.mi-mad-experience :is(.site-nav>a,.wm-nav>a,.header-billing,.wm-billing,.language-toggle,.wm-language-toggle):hover,
html.mi-mad-experience :is(.site-nav>a,.wm-nav>a,.header-projects,.wm-projects)[aria-current="page"],
html.mi-mad-experience :is(#language-menu,.wm-language-menu) button[aria-checked="true"] {
  background:#999!important;color:#fff!important;border-color:transparent;
}
html.mi-mad-experience :is(.pc-sidebar nav button,.cst-tabs button)[aria-pressed="true"] {
  background:#999!important;color:#fff!important;border-color:transparent;
}
html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog)::backdrop {
  background:rgba(1,1,1,.4);
}
html.mi-mad-experience body.wemeld-workspace :is(.dialog-backdrop,.library-backdrop,.credits-backdrop) {background:rgba(1,1,1,.4)}

@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-header,.wm-shell,.auth-header,.legal-header,.reading-theme-header)::before {
    background:var(--mad-glass-nav);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  }
  html.mi-mad-experience .auth-card::before,
  html.mi-mad-experience body.wemeld-workspace.wm-secondary :is(#design-assistant,.cst-panel,#canvas-settings-menu,#canvas-project-menu,#canvas-members-menu,#canvas-navigator,#canvas-tool-menu)::before,
  html.mi-mad-experience :is(#language-menu,.wm-language-menu,.assistant-popover,.studio-popover)::before {
    background:var(--mad-glass-panel)!important;
    backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
  }
  /* Gallery-style modals blur the background, while their form/content plane
     stays opaque and crisp in either theme. */
  html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog)::backdrop,
  html.mi-mad-experience body.wemeld-workspace :is(.dialog-backdrop,.library-backdrop,.credits-backdrop) {
    backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
  }
}

/* Moving or zoomed cards retain the stable matte texture. This is deliberate:
   a backdrop filter here reintroduces the earlier fuzzy-text regression. */
html.mi-mad-experience .story-home :is(.mini-card,.glass-card),
html.mi-mad-experience body.wm-secondary :is(.project-card,.profile-card,.recent-project,.credits-card,.wallet-panel,.plan-card,.pack-card,.g-card,.team-step,.publish-panel,.publish-preview-panel) {
  background-image:var(--canvas-grain,var(--wm-page-grain,none)),var(--mad-card-surface);
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
html.mi-mad-experience .story-home :is(.travelling-reference,.card-flight,.flight-copy),
html.mi-mad-experience body.wemeld-workspace #world :is(.canvas-node,.node-composer),
html.mi-mad-experience body.wemeld-workspace #world .canvas-node::before,
html.mi-mad-experience :is(.project-map-page .map-node,.g-canvas-node) {
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none;
}
html.mi-mad-experience :is(.theme-switch,.theme-choice,.wm-avatar,.profile-entry-avatar,.member-picture,.avatar-preview,.node-port,.node-input-port) {
  border-radius:999px!important;
}

/* Seven masked layers progressively soften content approaching the top edge.
   The navbar is above this layer; the overlay cannot intercept any pointer. */
html.mi-mad-experience .mad-frost-edge {
  position:fixed;inset:0 0 auto;height:112px;z-index:20;pointer-events:none;
  isolation:isolate;overflow:hidden;
  background:linear-gradient(to bottom,rgba(8,8,8,.12),transparent);
}
html.mi-mad-experience[data-mi-theme="light"] .mad-frost-edge {
  background:linear-gradient(to bottom,rgba(250,250,250,.18),transparent);
}
html.mi-mad-experience .mad-frost-edge>span {position:absolute;inset:0;pointer-events:none}
html.mi-mad-experience .mad-frost-edge>[data-layer="0"] {backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);mask-image:linear-gradient(#000 0%,#000 8%,transparent 25%);-webkit-mask-image:linear-gradient(#000 0%,#000 8%,transparent 25%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="1"] {backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);mask-image:linear-gradient(transparent 0%,#000 13%,#000 22%,transparent 38%);-webkit-mask-image:linear-gradient(transparent 0%,#000 13%,#000 22%,transparent 38%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="2"] {backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);mask-image:linear-gradient(transparent 15%,#000 28%,#000 35%,transparent 52%);-webkit-mask-image:linear-gradient(transparent 15%,#000 28%,#000 35%,transparent 52%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="3"] {backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);mask-image:linear-gradient(transparent 29%,#000 42%,#000 49%,transparent 65%);-webkit-mask-image:linear-gradient(transparent 29%,#000 42%,#000 49%,transparent 65%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="4"] {backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);mask-image:linear-gradient(transparent 43%,#000 56%,#000 63%,transparent 78%);-webkit-mask-image:linear-gradient(transparent 43%,#000 56%,#000 63%,transparent 78%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="5"] {backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);mask-image:linear-gradient(transparent 57%,#000 70%,#000 77%,transparent 91%);-webkit-mask-image:linear-gradient(transparent 57%,#000 70%,#000 77%,transparent 91%)}
html.mi-mad-experience .mad-frost-edge>[data-layer="6"] {backdrop-filter:blur(.5px);-webkit-backdrop-filter:blur(.5px);mask-image:linear-gradient(transparent 72%,#000 85%,transparent 100%);-webkit-mask-image:linear-gradient(transparent 72%,#000 85%,transparent 100%)}

@media(min-width:2400px) {
  html.mi-mad-experience {--mad-radius-control:10px;--mad-radius-card:15px;--mad-radius-panel:15px}
}
@media(min-width:3200px) {
  html.mi-mad-experience {--mad-radius-control:12px;--mad-radius-card:18px;--mad-radius-panel:18px}
}
@media(max-width:760px) {
  html.mi-mad-experience .mad-frost-edge {height:80px}
  html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-nav,.wm-nav) {
    background:var(--mad-glass-solid);border-radius:var(--mad-radius-panel);
  }
}
@media(prefers-reduced-transparency:reduce) {
  html.mi-mad-experience .mad-frost-edge {display:none}
  html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog)::backdrop,
  html.mi-mad-experience body.wemeld-workspace :is(.dialog-backdrop,.library-backdrop,.credits-backdrop) {
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
  html.mi-mad-experience body:not(.wemeld-workspace) :is(.site-header,.wm-shell,.auth-header,.legal-header,.reading-theme-header)::before,
  html.mi-mad-experience :is(.project-dialog,.account-dialog,.checkout-dialog,.support-dialog,.pc-dialog,.g-dialog,.auth-card)::before,
  html.mi-mad-experience body.wemeld-workspace.wm-secondary :is(#design-assistant,.library-dialog,.credits-dialog,.dialog,.cst-panel,#canvas-settings-menu,#canvas-project-menu,#canvas-members-menu,#canvas-navigator,#canvas-tool-menu)::before,
  html.mi-mad-experience :is(#language-menu,.wm-language-menu,.assistant-popover,.studio-popover)::before {
    background:var(--mad-glass-solid)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
}
@media(prefers-reduced-motion:reduce) {
  html.mi-mad-experience .mad-frost-edge>span {transition:none;animation:none}
}