/* One Gate System · Yura V14.3 layout guard
   Final layer: fixes navbar collision, text overflow and icon visibility across browsers/zoom levels. */
@media screen {
  body.y9-body{overflow-x:hidden!important}

  /* Keep the Yura navbar compact. The landing navbar is intentionally wider in its own stylesheet. */
  body.y9-body .y9-nav.y121-nav{
    width:min(1400px,calc(100% - 44px))!important;
    height:74px!important;
    overflow:visible!important;
  }
  body.y9-body .y121-nav-inner{
    width:100%!important;
    max-width:none!important;
    padding:0 17px!important;
    gap:14px!important;
    min-width:0!important;
  }
  body.y9-body .y121-nav .y9-brand{
    flex:0 1 245px!important;
    min-width:205px!important;
    max-width:245px!important;
    gap:10px!important;
  }
  body.y9-body .y121-nav .y9-brand img{width:43px!important;height:43px!important;flex:0 0 43px!important}
  body.y9-body .y121-nav .y9-brand strong{font-size:16px!important}
  body.y9-body .y121-nav .y9-brand small{font-size:11px!important;letter-spacing:.075em!important}
  body.y9-body .y121-nav nav{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:1 1 auto!important;
    min-width:0!important;
    gap:16px!important;
  }
  body.y9-body .y121-nav nav a{font-size:13.2px!important;padding:27px 0 24px!important;flex:0 0 auto!important}
  body.y9-body .y121-nav nav .y121-beta{font-size:7.5px!important}
  body.y9-body .y121-nav .y9-nav-actions{gap:8px!important;min-width:0!important}
  body.y9-body .y121-nav .y9-nav-actions .y9-link,
  body.y9-body .y121-nav .y9-nav-actions .y9-btn{font-size:12.8px!important;min-height:42px!important;padding:0 13px!important}

  /* Three intentional headline lines on large desktops. */
  body.y9-body .y9-hero.y121-hero{
    width:min(1580px,calc(100% - 44px))!important;
    max-width:1580px!important;
    padding-top:101px!important;
    column-gap:30px!important;
  }
  body.y9-body .y121-hero .y9-hero-copy h1{
    max-width:790px!important;
    font-size:clamp(38px,2.5vw,48px)!important;
    line-height:1.06!important;
    letter-spacing:-.04em!important;
  }
  body.y9-body .y121-hero .y9-hero-copy h1 .y142-line{display:block!important;white-space:nowrap!important}
  body.y9-body .y121-hero .y9-hero-copy>p{font-size:16.5px!important;line-height:1.67!important}

  /* Raise the proof row and give small copy enough room to breathe. */
  body.y9-body .y121-hero-footer{margin-top:-7px!important;gap:10px!important}
  body.y9-body .y121-proof,
  body.y9-body .y121-creator{min-height:92px!important;padding:14px 15px!important;overflow:hidden!important}
  body.y9-body .y121-proof small,
  body.y9-body .y121-creator small{font-size:11.2px!important;line-height:1.34!important}
  body.y9-body .y121-proof span{font-size:12.1px!important;line-height:1.42!important}
  body.y9-body .y121-creator strong{font-size:13px!important;line-height:1.3!important}
  body.y9-body .y121-creator span{font-size:11.5px!important;line-height:1.4!important}

  /* Console micro typography: readable, but constrained to its own column. */
  body.y9-body .y121-hero .y9-ai-mark small{font-size:12px!important}
  body.y9-body .y121-hero .y9-context-card>small{font-size:11.2px!important}
  body.y9-body .y121-hero .y9-context-card b{font-size:12.2px!important}
  body.y9-body .y121-hero .y9-context-card em{font-size:11.2px!important}
  body.y9-body .y121-hero .y9-signal{font-size:11.6px!important}
  body.y9-body .y121-hero .y9-chat-head strong{font-size:13.5px!important}
  body.y9-body .y121-hero .y9-chat-head small{font-size:11.8px!important}
  body.y9-body .y121-hero .y9-bubble{font-size:13.4px!important;line-height:1.56!important}
  body.y9-body .y121-hero .y12-relevant>span,
  body.y9-body .y121-hero .y12-relevant b,
  body.y9-body .y121-hero .y9-thinking,
  body.y9-body .y121-hero .y9-thinking em{font-size:11.3px!important}
  body.y9-body .y121-hero .y9-compose span{font-size:12px!important}

  /* Universal card containment: text may wrap, cards may grow, nothing may escape. */
  body.y9-body :where(
    .y9-hero-copy,.y9-demo-shell,.y9-demo-body,.y9-demo-side,.y9-chat-stage,
    .y121-hero-footer,.y121-proof,.y121-creator,
    .y14-visual-grid,.y14-visual-card,.y14-visual-copy,.y14-thinking-strip,
    .y9-context,.y9-context-copy,.y9-context-list,.y9-context-list>div,
    .y9-flow-board,.y9-flow-top,.y9-flow-help,.y13-flow-modules,
    .y9-live-section,.y9-live-copy,.y9-live-card,.y9-live-messages,
    .y9-security-card,.y9-security-copy,.y11-security-grid,.y11-security-grid>span,
    .y9-security-console,.y9-cta,.y9-footer
  ){min-width:0!important;max-width:100%!important}

  body.y9-body :where(
    .y9-trust small,.y14-visual-copy p,.y14-thinking-strip small,
    .y9-context-copy p,.y9-context-list b,.y9-context-list small,
    .y9-flow-step b,.y9-flow-step small,.y9-flow-help p,
    .y13-flow-modules span,.y9-live-copy p,.y9-live-intro p,.y9-live-message,
    .y9-live-note,.y11-security-grid b,.y11-security-grid small,
    .y9-security-console span,.y9-footer p,.y9-footer small,.y9-footer a
  ){
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  body.y9-body .y14-visual-card,
  body.y9-body .y9-context-list>div,
  body.y9-body .y11-security-grid>span{height:auto!important;min-height:0!important;overflow:hidden!important}
  body.y9-body .y14-visual-copy p{font-size:15px!important}
  body.y9-body .y14-thinking-strip small{font-size:13px!important}
  body.y9-body .y9-context-list small{font-size:13.2px!important}
  body.y9-body .y9-flow-step small{font-size:12.5px!important}
  body.y9-body .y9-flow-help p{font-size:13.7px!important}
  body.y9-body .y9-live-note{font-size:13px!important}

  /* Security icons: explicit dimensions so a valid Tabler glyph never renders as an empty slot. */
  body.y9-body .y11-security-grid>span>i{
    width:39px!important;height:39px!important;min-width:39px!important;
    display:grid!important;place-items:center!important;
    font-size:20px!important;line-height:1!important;
    color:#7ed6ff!important;
    border:1px solid rgba(108,191,255,.24)!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,rgba(56,137,255,.13),rgba(112,83,255,.08))!important;
  }
  body.y9-body .y11-security-grid>span b{font-size:14px!important}
  body.y9-body .y11-security-grid>span small{font-size:12.8px!important}

  /* Workflow must remain intact at browser zoom / Windows text scaling. */
  body.y9-body .y9-flow-track{min-width:0!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important;padding-bottom:7px!important}
  body.y9-body .y9-flow-step{flex:1 0 136px!important;min-width:136px!important;max-width:210px!important}
  body.y9-body .y9-arrow{flex:0 0 auto!important}
}

/* Collapse before the desktop layout becomes crowded. This covers 125%/150% browser zoom reliably. */
@media(max-width:1540px){
  body.y9-body .y9-nav.y121-nav{width:min(1360px,calc(100% - 30px))!important;top:9px!important}
  body.y9-body .y121-nav .y9-menu{display:grid!important;place-items:center!important;margin-left:2px!important;flex:0 0 42px!important;width:42px!important;height:42px!important;border:1px solid rgba(126,181,239,.24)!important;border-radius:12px!important;background:rgba(255,255,255,.04)!important}
  body.y9-body .y121-nav nav{
    position:absolute!important;left:14px!important;right:14px!important;top:79px!important;
    padding:12px!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;margin:0!important;opacity:0!important;visibility:hidden!important;
    transform:translateY(-8px)!important;background:rgba(8,29,55,.985)!important;
    border:1px solid rgba(126,181,239,.25)!important;border-radius:16px!important;
    box-shadow:0 26px 70px rgba(0,0,0,.38)!important;transition:.24s ease!important;
  }
  body.y9-body .y121-nav nav a{padding:11px 10px!important;text-align:center!important;border-radius:10px!important;font-size:13.2px!important}
  body.y9-body .y121-nav nav a:after{display:none!important}
  body.y9-body .y121-nav.menu-open nav{opacity:1!important;visibility:visible!important;transform:none!important}
  body.y9-body .y121-nav .y9-nav-actions{margin-left:auto!important}

  body.y9-body .y9-hero.y121-hero{width:min(1220px,calc(100% - 34px))!important;grid-template-columns:1fr!important;row-gap:20px!important}
  body.y9-body .y121-hero .y9-hero-copy{max-width:930px!important;margin:0 auto 0 0!important}
  body.y9-body .y121-hero .y9-hero-copy h1{max-width:900px!important;font-size:clamp(39px,4vw,49px)!important}
  body.y9-body .y121-hero .y9-demo-shell{width:100%!important;max-width:1080px!important;margin:0 auto!important}
  body.y9-body .y121-hero-footer{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:980px){
  body.y9-body .y9-nav.y121-nav{width:calc(100% - 22px)!important}
  body.y9-body .y121-nav .y9-brand{min-width:0!important;max-width:225px!important;flex-basis:225px!important}
  body.y9-body .y121-nav .y9-nav-actions .y9-link{display:none!important}
  body.y9-body .y121-nav nav{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-height:calc(100dvh - 105px)!important;overflow:auto!important}
  body.y9-body .y121-hero .y9-hero-copy h1 .y142-line{white-space:normal!important}
  body.y9-body .y121-hero .y9-demo-body{grid-template-columns:190px minmax(0,1fr)!important}
  body.y9-body .y121-hero-footer{grid-template-columns:1fr 1fr!important}
  body.y9-body .y14-thinking-strip{grid-template-columns:1fr!important;gap:10px!important}
  body.y9-body .y14-thinking-strip>i{transform:rotate(90deg)!important;justify-self:center!important}
}

@media(max-width:680px){
  body.y9-body .y9-nav.y121-nav{width:calc(100% - 12px)!important;height:66px!important;top:5px!important}
  body.y9-body .y121-nav-inner{padding:0 7px!important;gap:7px!important}
  body.y9-body .y121-nav .y9-brand{max-width:190px!important;flex-basis:190px!important}
  body.y9-body .y121-nav .y9-brand strong{font-size:14px!important}
  body.y9-body .y121-nav nav{top:71px!important;left:7px!important;right:7px!important}
  body.y9-body .y9-hero.y121-hero{width:calc(100% - 18px)!important;padding-top:84px!important}
  body.y9-body .y121-hero-footer{grid-template-columns:1fr!important}
  body.y9-body .y121-proof,
  body.y9-body .y121-creator{min-height:0!important}
}

@media(max-width:440px){
  body.y9-body .y121-nav .y9-brand span{display:none!important}
  body.y9-body .y121-nav .y9-brand{flex:0 0 44px!important}
  body.y9-body .y121-nav .y9-nav-actions .y9-btn-primary{font-size:11.5px!important;padding:0 10px!important}
}
