/**
 * SPIDER / EDITH — Mobile universale tier 0–5
 * Includere dopo responsive.css
 */
:root {
  --tier-touch: 44px;
  --tier-pad-x: clamp(10px, 3.2vw, 20px);
  --tier-pad-y: clamp(8px, 2.4vw, 16px);
  --tier-font: clamp(0.85rem, 2.8vw, 1rem);
  --tier-vh: 100dvh;
}

html.spider-mobile-ready {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  height: 100%;
}

body.spider-mobile-ready {
  min-height: var(--spider-vh, var(--tier-vh));
  overflow-x: hidden;
  padding-left: max(0px, env(safe-area-inset-left));
  padding-right: max(0px, env(safe-area-inset-right));
}

body.spider-mobile-ready.spider-theme {
  max-width: 100vw;
  position: relative;
}

body.spider-mobile-ready.tier-micro { font-size: 0.88rem; }
body.spider-mobile-ready.tier-compact { font-size: 0.92rem; }
body.spider-mobile-ready.tier-standard { font-size: 0.96rem; }
body.spider-mobile-ready.tier-large { font-size: 1rem; }
body.spider-mobile-ready.tier-fold { font-size: 0.98rem; }

body.spider-mobile-ready a.btn,
body.spider-mobile-ready button.btn,
body.spider-mobile-ready .spider-btn,
body.spider-mobile-ready input[type="submit"],
body.spider-mobile-ready input[type="button"] {
  min-height: var(--tier-touch);
  min-width: var(--tier-touch);
}

body.spider-mobile-ready input,
body.spider-mobile-ready select,
body.spider-mobile-ready textarea {
  font-size: max(16px, 1em);
}

body.spider-mobile-ready .projects-grid,
body.spider-mobile-ready .hub-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: clamp(12px, 3vw, 22px);
  padding: var(--tier-pad-y) var(--tier-pad-x);
}

body.spider-mobile-ready .spider-topbar {
  flex-wrap: wrap;
  gap: 8px;
  padding: max(8px, env(safe-area-inset-top)) var(--tier-pad-x) 8px;
}

body.spider-mobile-ready .spider-shell-fit {
  display: flex;
  flex-direction: column;
  min-height: var(--tier-vh);
  max-height: var(--tier-vh);
  overflow: hidden;
}

body.spider-mobile-ready .spider-shell-fit > .spider-main-fit {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

body.spider-mobile-ready .spider-shell-fit .spider-composer-fit {
  flex-shrink: 0;
  padding-bottom: max(12px, env(safe-area-inset-bottom), var(--spider-kb-offset, 0px));
}

body.spider-mobile-ready.kb-open .spider-composer-fit {
  padding-bottom: max(12px, env(safe-area-inset-bottom), var(--spider-kb-offset, 0px));
}

@media (max-width: 359px) {
  body.spider-mobile-ready .brain-header { padding: max(8px, env(safe-area-inset-top)) 8px 8px; }
  body.spider-mobile-ready .pill { font-size: 0.5rem; padding: 3px 6px; }
}

@media (max-width: 980px) {
  body.spider-mobile-ready .brain-shell {
    grid-template-areas: "header" "main";
    grid-template-rows: auto minmax(0, 1fr);
    grid-template-columns: 1fr;
    height: var(--tier-vh);
    max-height: var(--tier-vh);
  }
  body.spider-mobile-ready .brain-sidebar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    height: 0; min-height: 0; max-height: 0;
    overflow: hidden;
    z-index: 260;
  }
  body.spider-mobile-ready .brain-shell.sidebar-open .brain-sidebar {
    height: auto;
    max-height: min(78dvh, 560px);
    overflow-y: auto;
  }
  body.spider-mobile-ready .brain-main { min-height: 0; overflow: hidden; }
  body.spider-mobile-ready .composer { flex-shrink: 0; }
}

@media (max-height: 500px) and (orientation: landscape) {
  body.spider-mobile-ready.tier-landscape .hub-header { padding: 12px 16px 8px; }
  body.spider-mobile-ready.tier-landscape .quick-actions { padding-bottom: 12px; }
}