/* INFOTECH LAB — Tools Compatibility PASS1
   Escopo: páginas Ferramentas em qualquer resolução/dispositivo.
   Regra: não alterar motores, rotas ou identidade; somente proteção de layout/UX. */

:root{
  --it-compat-vh:100vh;
  --it-compat-vw:100vw;
  --it-compat-safe-x:max(12px, env(safe-area-inset-left));
  --it-compat-safe-r:max(12px, env(safe-area-inset-right));
  --it-compat-safe-b:max(12px, env(safe-area-inset-bottom));
  --it-compat-card-radius:clamp(16px, 4vw, 26px);
  --it-compat-touch:44px;
}

html.it-tools-compat-ready,
html.it-tools-compat-ready body.it-tools-bg{
  max-width:100%;
  overflow-x:hidden;
}

html.it-tools-compat-ready body.it-tools-bg{
  min-width:0;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body.it-tools-bg *,
body.tools-context-page *{
  min-width:0;
}

body.it-tools-bg img,
body.it-tools-bg svg,
body.it-tools-bg video,
body.it-tools-bg canvas,
body.tools-context-page img,
body.tools-context-page svg,
body.tools-context-page video,
body.tools-context-page canvas{
  max-width:100%;
}

body.it-tools-bg input,
body.it-tools-bg select,
body.it-tools-bg textarea,
body.tools-context-page input,
body.tools-context-page select,
body.tools-context-page textarea{
  max-width:100%;
  font-size:max(16px, 1rem);
}

body.it-tools-bg button,
body.it-tools-bg .btn,
body.it-tools-bg a[role="button"],
body.tools-context-page button,
body.tools-context-page .btn,
body.tools-context-page a[role="button"]{
  min-height:var(--it-compat-touch);
  max-width:100%;
  touch-action:manipulation;
}

body.it-tools-bg .report-box,
body.it-tools-bg pre,
body.it-tools-bg code,
body.tools-context-page .report-box,
body.tools-context-page pre,
body.tools-context-page code{
  max-width:100%;
  overflow-x:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

body.it-tools-bg .card,
body.it-tools-bg .tools-card,
body.it-tools-bg .metric,
body.it-tools-bg .panel-map,
body.it-tools-bg .led-pixelmap-studio,
body.it-tools-bg .led-pixelmap-panel,
body.it-tools-bg .led-pixelmap-preview-card,
body.it-tools-bg .fixture-panel,
body.it-tools-bg .stage-card,
body.tools-context-page .card,
body.tools-context-page .tools-card{
  border-radius:var(--it-compat-card-radius);
  max-width:100%;
}

body.it-tools-bg .panel-map,
body.it-tools-bg .led-pixelmap-preview,
body.it-tools-bg .led-pixelmap-export-stage,
body.it-tools-bg .led-pixelmap-screen,
body.it-tools-bg .dmx-table-wrap,
body.it-tools-bg .table-wrap,
body.tools-context-page .tool-grid,
body.tools-context-page .tools-grid{
  max-width:100%;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}

body.it-tools-bg .out-btn,
body.it-tools-bg [class*="out"] button,
body.it-tools-bg .led-output-chip,
body.it-tools-bg .led-output-row{
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
}

body.it-tools-bg .it-global-header.it-sidebar-upgraded,
body.tools-context-page .it-global-header.it-sidebar-upgraded{
  max-width:100%;
}

@media (max-width: 1180px){
  body.it-tools-bg header,
  body.it-tools-bg main,
  body.it-tools-bg footer,
  body.tools-context-page header,
  body.tools-context-page main,
  body.tools-context-page footer{
    width:min(1180px, calc(100vw - 24px));
  }

  body.it-tools-bg .tools,
  body.it-tools-bg .row,
  body.it-tools-bg .row.three,
  body.it-tools-bg .result-grid,
  body.it-tools-bg .led-pixelmap-layout,
  body.it-tools-bg .led-pixelmap-form-grid,
  body.it-tools-bg .led-pixelmap-actions,
  body.tools-context-page .tools,
  body.tools-context-page .tool-grid,
  body.tools-context-page .tools-grid{
    grid-template-columns:minmax(0,1fr) !important;
  }

  body.it-tools-bg .card,
  body.it-tools-bg .card.wide,
  body.it-tools-bg .led-pixelmap-panel,
  body.it-tools-bg .led-pixelmap-preview-card,
  body.tools-context-page .card{
    grid-column:auto !important;
  }
}

@media (max-width: 760px){
  :root{
    --it-compat-touch:46px;
  }

  body.it-tools-bg,
  body.tools-context-page{
    background-size:cover !important;
    background-position:center top !important;
  }

  body.it-tools-bg header,
  body.it-tools-bg main,
  body.it-tools-bg footer,
  body.tools-context-page header,
  body.tools-context-page main,
  body.tools-context-page footer{
    width:calc(100vw - 20px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.it-tools-bg .top,
  body.tools-context-page .top{
    gap:12px;
  }

  body.it-tools-bg .card,
  body.it-tools-bg .note,
  body.it-tools-bg .status-card,
  body.it-tools-bg .led-pixelmap-panel,
  body.it-tools-bg .led-pixelmap-preview-card,
  body.tools-context-page .card{
    padding:clamp(14px, 4.2vw, 18px) !important;
  }

  body.it-tools-bg .actions,
  body.it-tools-bg .preset-grid,
  body.it-tools-bg .tool-nav,
  body.it-tools-bg .led-pixelmap-actions,
  body.tools-context-page .actions,
  body.tools-context-page .tool-nav{
    display:flex !important;
    gap:10px !important;
    flex-wrap:wrap !important;
  }

  body.it-tools-bg .actions > *,
  body.it-tools-bg .preset-grid > *,
  body.it-tools-bg .tool-nav > *,
  body.it-tools-bg .led-pixelmap-actions > *,
  body.tools-context-page .actions > *,
  body.tools-context-page .tool-nav > *{
    flex:1 1 min(100%, 146px);
    justify-content:center;
    text-align:center;
  }

  body.it-tools-bg .panel-map{
    min-height:150px !important;
    padding:12px !important;
  }

  body.it-tools-bg .panel-map span{
    min-width:6px;
    min-height:6px;
  }

  body.it-tools-bg .led-pixelmap-preview-card,
  body.it-tools-bg .led-pixelmap-preview{
    overflow:hidden;
  }

  body.it-tools-bg .led-pixelmap-screen{
    min-height:150px;
  }

  body.it-tools-bg .infotech-support-float,
  body.it-tools-bg .fixture-ava,
  body.it-tools-bg .fixturebuilder-ava,
  body.it-tools-bg .ava-dog,
  body.it-tools-bg .avadog{
    max-width:calc(100vw - 24px) !important;
  }

  body.it-tools-bg .it-pwa-toast,
  body.it-tools-bg .pwa-install-prompt,
  body.it-tools-bg .install-prompt,
  body.it-tools-bg .app-install-popup{
    max-width:calc(100vw - 24px) !important;
    left:12px;
    right:12px;
  }
}

@media (max-width: 430px){
  body.it-tools-bg h1,
  body.tools-context-page h1{
    font-size:clamp(2rem, 13vw, 3.15rem) !important;
    line-height:.96 !important;
  }

  body.it-tools-bg h2,
  body.tools-context-page h2{
    font-size:clamp(1.25rem, 6.5vw, 1.7rem) !important;
  }

  body.it-tools-bg .kicker,
  body.tools-context-page .kicker{
    letter-spacing:.12em !important;
  }

  body.it-tools-bg .btn,
  body.it-tools-bg button,
  body.it-tools-bg input,
  body.it-tools-bg select,
  body.tools-context-page .btn,
  body.tools-context-page button,
  body.tools-context-page input,
  body.tools-context-page select{
    border-radius:14px !important;
  }

  body.it-tools-bg .out-btn{
    min-width:76px;
    padding-inline:10px;
  }
}

@media (max-width: 360px){
  body.it-tools-bg header,
  body.it-tools-bg main,
  body.it-tools-bg footer,
  body.tools-context-page header,
  body.tools-context-page main,
  body.tools-context-page footer{
    width:calc(100vw - 14px) !important;
  }

  body.it-tools-bg .card,
  body.it-tools-bg .led-pixelmap-panel,
  body.it-tools-bg .led-pixelmap-preview-card,
  body.tools-context-page .card{
    padding:12px !important;
  }

  body.it-tools-bg .actions > *,
  body.it-tools-bg .tool-nav > *,
  body.it-tools-bg .led-pixelmap-actions > *,
  body.tools-context-page .actions > *,
  body.tools-context-page .tool-nav > *{
    flex-basis:100%;
  }
}

@media (max-width: 960px){
  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open{
    overflow:hidden !important;
    overscroll-behavior:none;
  }

  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded{
    position:fixed !important;
    top:max(8px, env(safe-area-inset-top)) !important;
    left:var(--it-compat-safe-x) !important;
    right:auto !important;
    width:min(390px, calc(100vw - var(--it-compat-safe-x) - var(--it-compat-safe-r))) !important;
    max-height:calc(var(--it-compat-vh) - max(18px, env(safe-area-inset-top)) - var(--it-compat-safe-b)) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }

  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded .it-global-nav,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded .it-global-nav{
    max-height:none !important;
    overflow:visible !important;
  }

  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open main,
  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open footer,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open main,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open footer{
    pointer-events:none;
  }
}

@media (max-height: 520px) and (orientation: landscape){
  body.it-tools-bg.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded,
  body.tools-context-page.it-sidebar-mobile.it-sidebar-open > header.it-global-header.it-sidebar-upgraded{
    top:6px !important;
    max-height:calc(100vh - 12px) !important;
  }

  body.it-tools-bg .infotech-support-float,
  body.it-tools-bg .fixture-ava,
  body.it-tools-bg .fixturebuilder-ava,
  body.it-tools-bg .it-pwa-toast{
    display:none !important;
  }
}

@supports not ((backdrop-filter: blur(8px)) or (-webkit-backdrop-filter: blur(8px))){
  body.it-tools-bg .card,
  body.it-tools-bg .visual,
  body.it-tools-bg .metric,
  body.it-tools-bg .led-pixelmap-panel,
  body.it-tools-bg .led-pixelmap-preview-card,
  body.tools-context-page .card,
  body.tools-context-page .it-global-header.it-sidebar-upgraded{
    background-color:rgba(7,15,32,.94) !important;
  }
}

@supports not (overflow: clip){
  html.it-tools-compat-ready,
  html.it-tools-compat-ready body.it-tools-bg{
    overflow-x:hidden;
  }
}

@media (prefers-reduced-motion: reduce){
  body.it-tools-bg *,
  body.tools-context-page *{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}