/* ATHRTY X4100 / Shared application-language convergence.
 * Scoped to the canonical Genesis app only. No styles penetrate customer previews,
 * third-party checkout, embedded media, or unrelated hosted products.
 * Do not replace role/permission state with presentation state. */
:root{
 --x4100-font:var(--athrty-ui-font,"Manrope","DM Sans",system-ui,sans-serif);
 --x4100-radius-control:999px;
 --x4100-radius-panel:18px;
 --x4100-focus:var(--athrty-focus,var(--obsidian-mint,#c8e4d0));
 --x4100-button-height:44px;
 --x4100-space-section:clamp(22px,3vw,44px);
}
#main[data-x4100-view] :is(
 .x5-config-head h1,.x5-config-head h2,.x1111-office h1,.x1111-office h2,
 .x1115-work-office h1,.x1115-work-office h2,.intro h1,.intro h2,
 .xauth-studio-gateway h1,.xauth-studio-gateway h2,
 .x119-work-ways h2,.x1141-access-state h2
){font-family:var(--x4100-font)!important;font-synthesis:none;letter-spacing:-.055em;line-height:1.1}
#main[data-x4100-view] :is(
 .x5-config-head p,.x1115-work-office p,.intro p,
 .xauth-studio-gateway p,.x1141-access-state p
){line-height:1.65;max-width:70ch}
#main[data-x4100-view] :is(button,a,summary,input,textarea,select):focus-visible{outline:2px solid var(--x4100-focus);outline-offset:3px}
/* Plain-language customer entry and existing source-bound configure controls. */
#main[data-x4100-view="configure"]>.x5-config{--x4100-control-border:var(--athrty-ui-border);width:100%;max-width:none}
#main[data-x4100-view="configure"] .x5-config-head{padding-bottom:clamp(18px,3vw,35px)}
#main[data-x4100-view="configure"] .x5-config-head h1{font-weight:660!important;font-size:clamp(34px,5vw,61px)}
#main[data-x4100-view="configure"] .x5-config-head p{color:var(--athrty-ui-muted);font-size:clamp(14px,1.15vw,16px)}
#main[data-x4100-view="configure"] .x1111-office :is(button,[role="button"]),
#main[data-x4100-view="configure"] .x900-generation button,
#main[data-x4100-view="configure"] .x5-spec :is(button,input,select,textarea){
 font-family:var(--x4100-font);
}
#main[data-x4100-view="configure"] .x1111-office :is(button,[role="button"]),
#main[data-x4100-view="configure"] .x900-generation button{
 border-radius:var(--x4100-radius-control);
 min-height:var(--x4100-button-height);
}
#main[data-x4100-view="configure"] .x1111-office :is(details,section) {
 scroll-margin-top:86px;
}
#main[data-x4100-view="configure"] :is(.x1111-conversation,.x900-generation,.x5-spec,.x800-blueprint){
 min-width:0;
}
#main[data-x4100-view="configure"] :is(.x5-field input,.x5-field textarea,.x5-field select){
 border-radius:12px;
 min-height:44px;
}
/* Existing work, sell, network, Studio gateways: harmonized without creating a second shell. */
#main[data-x4100-view="work"]>.x1115-work-office,
#main[data-x4100-view="sell"]>.intro,
#main[data-x4100-view="network"]>.intro,
#main[data-x4100-view="build"]>.xauth-studio-gateway{
 padding-block:clamp(27px,4.2vw,65px);
}
#main[data-x4100-view="work"]>.x1115-work-office h1,
#main[data-x4100-view="sell"]>.intro h1,
#main[data-x4100-view="network"]>.intro h1,
#main[data-x4100-view="build"]>.xauth-studio-gateway h1{
 font-weight:650!important;
 font-size:clamp(34px,4.9vw,61px)!important;
}
#main[data-x4100-view] .x1141-access-state{
 border-radius:var(--x4100-radius-panel);
 border-color:var(--athrty-ui-border);
}
#main[data-x4100-view] .x1141-access-state :is(button,a){
 border-radius:var(--x4100-radius-control);
 min-height:var(--x4100-button-height);
}
#main[data-x4100-view="work"] .x119-work-ways-grid{
 gap:14px;
}
#main[data-x4100-view="work"] .x119-work-way{
 border-radius:var(--x4100-radius-panel);
 border:1px solid var(--athrty-ui-border);
 box-shadow:inset 0 1px rgba(255,255,255,.025);
}
#main[data-x4100-view="work"] .x119-work-way button{
 border-radius:var(--x4100-radius-control);
}
#main[data-x4100-view="work"] .x1115-project-rows .project-row{
 border-radius:14px;
}
/* App navigation controls use one focus/shape language while honoring native permission gating. */
.global-header :is(button,[role="button"]):focus-visible,
#workspace-drawer :is(button,a,select):focus-visible,
#x1113-nav-panel :is(button,a):focus-visible{
 outline:2px solid var(--x4100-focus);
 outline-offset:3px;
}
#workspace-drawer :is(a,button){min-height:44px}
#workspace-drawer a{border-radius:12px}
#x1113-nav-panel a{border-radius:12px}
/* No broad typography rule targets customer previews or generated pages. */
/* Product identity is consistent through canonical Work and Studio. */
#main[data-x4100-view="work"] .x4100-work-product-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:color-mix(in srgb,var(--athrty-ui-accent) 11%,transparent);border:1px solid var(--athrty-ui-border);color:var(--athrty-ui-accent);flex:none}
#main[data-x4100-view="work"] .x4100-work-product-icon svg{display:block;max-width:22px;max-height:22px}
#main[data-x4100-view="build"] .x4100-studio-product-identity{display:inline-flex;align-items:center;gap:9px}
#main[data-x4100-view="build"] .x4100-studio-product-icon{display:inline-grid;place-items:center;width:29px;height:29px;border:1px solid var(--athrty-ui-border);border-radius:9px;color:var(--athrty-ui-accent)}
#main[data-x4100-view="build"] .x4100-studio-product-icon svg{width:19px;height:19px}
@media(max-width:650px){
 #main[data-x4100-view="configure"] .x5-config-head h1{font-size:clamp(32px,8vw,44px)}
 #main[data-x4100-view] .x1141-access-state{max-width:100%;min-width:0}
 #main[data-x4100-view="work"]>.x1115-work-office,
 #main[data-x4100-view="sell"]>.intro,
 #main[data-x4100-view="network"]>.intro,
 #main[data-x4100-view="build"]>.xauth-studio-gateway{padding-block:27px}
}
@media(prefers-reduced-motion:reduce){
 #main[data-x4100-view] :is(.x1111-office,.x119-work-ways,.x1141-access-state) *{
  transition:none!important;animation:none!important;scroll-behavior:auto!important
 }
}