/* Mobile presentation only. Existing routes, actions, data and services stay intact. */
html { scroll-padding-top: 86px; }
body { min-width: 0; }
:where(.estructura, main, main > section, .lateral, .assistant-rail, .rail-panel,
  .code-desk, .code-files, .code-document-list, .vida-espacio, .bandeja > *,
  .conectores > article, .motion-gallery, .galeria, .galeria figure) { min-width: 0; }
:where(img, video, iframe) { max-width: 100%; }
:where(.code-document-list, .code-timeline, .vida-lista, .conectores, .rail-tasks,
  .news-source-controls, .actualizacion, .galeria figcaption) { overflow-wrap: anywhere; }
dialog { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
dialog .dialogo-cab { align-items: flex-start; }
dialog .dialogo-cab h2 { min-width: 0; overflow-wrap: anywhere; }
dialog .dialogo-cab button { flex: 0 0 auto; min-width: 44px; }

@media (max-width: 1000px) {
  .cabecera { height: auto; min-height: 78px; flex-wrap: wrap; gap: 10px 16px; }
  .cabecera .marca { flex: 1 1 auto; min-width: 0; }
  .cabecera .header-tools { flex: 0 0 auto; }
  .cabecera .casas { order: 3; flex: 1 0 100%; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 4px; border-radius: 14px; }
  .cabecera .casas a { min-width: 0; min-height: 44px; padding: 8px 5px; font-size: 12px; }
}

@media (max-width: 900px) {
  body { padding-bottom: env(safe-area-inset-bottom, 0px); }
  .cabecera { position: relative; padding: 12px max(12px,env(safe-area-inset-right,0px)) 10px max(12px,env(safe-area-inset-left,0px)); }
  .marca { font-size: 25px; }
  .marca small { font-size: 9px; }
  .marca .emblema { width: 44px; height: 44px; }
  .icon-button { width: 44px; height: 44px; min-height: 44px; }
  .estado { padding: 10px 14px; font-size: 12px; line-height: 1.6; text-align: left; }
  .estructura { display: flex; flex-direction: column; gap: 16px; padding: 12px; }
  .lateral { position: sticky; top: 0; z-index: 9; order: 0; height: auto; padding: 5px; overflow: visible; border: 1px solid #b3714a70; border-radius: 14px; background: #200b0bf5; }
  .lateral > .ceja, .lateral-bottom, .lateral > .volver { display: none; }
  .lateral nav { display: flex; gap: 5px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding: 2px 2px 5px; }
  .lateral nav a { display: flex; flex: 0 0 auto; flex-direction: column; justify-content: center; gap: 5px; min-width: 76px; min-height: 58px; padding: 8px 10px; font-size: 12px; line-height: 1.35; white-space: nowrap; border-radius: 10px; scroll-snap-align: start; }
  .lateral nav a .ui-icon { width: 20px; height: 20px; }
  main { order: 1; width: 100%; padding: 0 !important; }
  main > section { scroll-margin-top: 94px; }
  .assistant-rail { order: 2; position: static; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; max-height: none; overflow: visible; }
  .assistant-rail .ismael { display: block; grid-row: auto; }
  .assistant-rail .rail-quick, .assistant-rail .colmena-details { grid-column: 1/-1; }
  .rail-panel { padding: 18px; }
  .rail-panel h2 { font-size: 21px; }
  .rail-head { flex-wrap: wrap; }
  .rail-head .tiny-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; }
  .rail-full, .quick-tools button { min-height: 44px; font-size: 12px; }
  .colmena-details > summary { min-height: 44px; display: flex; align-items: center; font-size: 13px; }
  .enlace-colmena p, .enlace-colmena label, .enlace-colmena .miembro-colmena { font-size: 12px; line-height: 1.65; }
  .enlace-colmena button, .enlace-colmena select { min-height: 44px; font-size: 14px; }
  .code-heading { display: flex; flex-direction: column; gap: 12px; }
  .code-local-tag, .vida-sello { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .code-workbench { grid-template-columns: minmax(0,1fr); }
  .code-files { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; border-right: 0; border-bottom: 1px solid #b04d3438; }
  .code-files > .ceja { flex-basis: 100%; margin: 0; }
  .code-file { width: auto; max-width: 100%; margin: 0; min-height: 44px; font-size: 14px; overflow-wrap: anywhere; }
  .code-file > span { min-width: 0; }
  .code-files .pequeno { display: block; flex-basis: 100%; margin: 8px 0; font-size: 12px; }
  .code-open-cli { display: inline-flex; gap: 12px; min-height: 44px; margin: 0; padding: 10px 8px; font-size: 13px; }
  .code-tabs { flex-wrap: wrap; padding: 8px; }
  .code-tabs button { flex: 1 1 75px; min-height: 44px; font-size: 14px; }
  .code-editor-panel, .code-preview-panel, .code-document-list { padding: 16px; }
  .code-editor-panel textarea { min-height: min(340px,55dvh); padding: 14px; font-size: 16px; line-height: 1.7; }
  .code-toolbar { padding-inline: 16px; }
  .code-toolbar button { flex: 1 1 125px; min-height: 44px; font-size: 13px; }
  .code-save-state { padding-inline: 16px; font-size: 12px; overflow-wrap: anywhere; }
  .code-document-list article { flex-wrap: wrap; }
  .code-document-list article > div { flex: 1 1 160px; min-width: 0; }
  .code-document-list article > button { min-height: 44px; }
  .code-console-header { flex-wrap: wrap; padding: 18px; }
  .code-console-header span { max-width: none; font-size: 12px; }
  .code-cli-intro { align-items: flex-start; padding: 20px 18px; }
  .code-cli-intro p, .code-console-foot { font-size: 12px; line-height: 1.7; }
  .code-timeline { padding-inline: 18px; }
  .code-timeline li { grid-template-columns: 26px minmax(0,1fr); gap: 10px; }
  .code-timeline pre { font-size: 13px; }
  .code-command-form { padding: 20px 18px 12px; }
  .code-command-form label { font-size: 14px; }
  .code-command-input { flex-wrap: wrap; padding: 10px 12px; }
  .code-command-input input { flex: 1 1 calc(100% - 42px); min-height: 44px; font-size: 16px; }
  .code-command-input button { width: 100%; min-height: 46px; font-size: 14px; }
  .code-command-buttons { padding-inline: 18px; }
  .code-command-buttons button { flex: 1 1 100px; min-height: 44px; font-size: 13px; }
  .conectores button, .acciones-noticia button, .acciones-preferencias button { min-height: 44px; font-size: 13px; }
  .conectores p, .bandeja p { font-size: 14px; line-height: 1.7; }
  .conectores .etiqueta { font-size: 11px; }
  .bandeja { grid-template-columns: minmax(0,1fr); }
  .bandeja > aside { border-right: 0; border-bottom: 1px solid #ba744754; }
  .bandeja label { font-size: 14px; }
  .bandeja textarea, .bandeja select, .vida-campo input, .vida-campo textarea, .vida-campo select,
  .preferencias input:not([type=checkbox]):not([type=range]), dialog input:not([type=checkbox]), dialog select, dialog textarea { font-size: 16px; }
  .vida-cabecera, .vida-titulo { flex-wrap: wrap; }
  .vida-formulario-agenda, .vida-formulario-gastos { grid-template-columns: minmax(0,1fr); }
  .vida-formulario-gastos .vida-campo-ancho { grid-column: auto; }
  .vida-pestanas { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; overflow: visible; }
  .vida-pestanas button { white-space: normal; font-size: 13px; padding: 10px 7px; min-height: 48px; }
  .vida-pie, .vida-total { flex-wrap: wrap; }
  .vida-total strong { overflow-wrap: anywhere; }
  .vida-botones button { flex: 1 1 135px; min-height: 44px; }
  dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 20px; }
  dialog p, dialog label { font-size: 14px; line-height: 1.7; }
  .galeria { padding-inline: 16px !important; padding-block: 28px !important; }
  .galeria nav a { display: flex; align-items: center; min-height: 44px; font-size: 14px; }
  .galeria figcaption { padding: 18px; }
  .galeria figcaption a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
  .galeria figure { scroll-margin-top: 24px; }
}

@media (max-width: 600px) {
  .cabecera .casas a { flex-direction: column; gap: 5px; font-size: 12px; min-height: 52px; padding: 7px 2px; line-height: 1.2; }
  .cabecera .casas a:before { width: 5px; height: 5px; }
  .saludo { min-height: 0; display: grid; grid-template-columns: 1fr; padding: 14px 16px 24px; }
  .saludo .retrato { position: relative; inset: auto; justify-self: center; width: min(100%,340px); height: auto; aspect-ratio: 1392/1130; overflow: hidden; }
  .saludo .retrato img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; }
  .saludo .retrato video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; mask-image: none; border-radius: 12px; }
  .saludo > .hero-copy { padding: 14px 3px 0; text-align: center; }
  .hero-copy h1 { font-size: clamp(36px,10vw,48px); }
  .hero-copy p { margin-inline: auto; font-size: 17px; line-height: 1.6; }
  .hero-copy .ceja { font-size: 10px; }
  .hero-copy .hero-small { font-size: 12px; letter-spacing: .04em; }
  .seccion-titulo { display: block; margin: 24px 0 14px; }
  .seccion-titulo h2 { font-size: 24px; }
  .seccion-titulo span { max-width: none; display: block; margin-top: 7px; text-align: left; font-size: 12px; }
  .tarjetas { gap: 12px; }
  .tarjeta { padding: 0; min-height: 0; }
  .tile-art { min-height: 0; height: auto; aspect-ratio: 16/10; }
  .tile-copy { padding: 15px 12px; gap: 10px; }
  .tile-copy strong { font-size: 24px; line-height: 1.12; }
  .tile-copy > span { font-size: 13px; line-height: 1.6; }
  .tile-copy .tile-cta { min-height: 36px; font-size: 11px; line-height: 1.4; padding: 8px 9px; }
  .home-shortcuts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  .home-shortcuts button { min-width: 0; flex-direction: column; min-height: 70px; padding: 10px 5px; font-size: 12px; line-height: 1.35; }
  .conversacion { padding: 18px 16px; }
  .conversacion .entrada { flex-wrap: wrap; }
  .conversacion .entrada input { flex-basis: 100%; width: 100%; min-height: 48px; font-size: 16px; }
  .conversacion .entrada button { width: 100%; min-height: 46px; font-size: 14px; }
  .conversacion p { font-size: 12px; line-height: 1.7; }
  .assistant-rail, .conectores { grid-template-columns: minmax(0,1fr); }
  .assistant-rail .rail-quick, .assistant-rail .colmena-details { grid-column: auto; }
  .assistant-rail .ismael, .assistant-rail .rail-day { padding: 20px; }
  .orb-stage { height: 185px; }
  .orb-stage img { max-width: 100%; width: 215px; height: 185px; }
  .orb-stage video { object-fit: contain; }
  .orb-status { font-size: 13px !important; padding: 10px; }
  .ismael .pequeno, .rail-tasks li, .task-stages span { font-size: 12px; }
  .rail-tasks .empty-tasks { font-size: 16px; }
  .quick-tools { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .quick-tools button { min-height: 64px; }
  .conectores article { padding: 22px; }
  .conectores h2 { font-size: 27px; }
  .conectores button { width: 100%; }
  body[data-vista=chisme] main { padding: 18px 14px !important; }
  .chisme-banner { min-height: 130px; }
  .chisme-banner .revista-cab { padding-right: 84px; }
  .chisme-banner h1 { font-size: clamp(34px,9vw,48px); white-space: normal; }
  .chisme-banner .revista-cab span { max-width: none; font-size: 12px; }
  .chisme-banner > img { width: 105px; height: 115px; right: -15px; bottom: -4px; }
  .chisme-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; overflow: visible; }
  .chisme-tabs button { min-height: 44px; padding: 9px 5px; font-size: 13px; }
  .preferencias { padding: 15px; }
  .preferencias summary, .preferencias label { font-size: 14px; line-height: 1.6; }
  .preferencias .pequeno, .news-source-controls > p, .actualizacion { font-size: 12px; line-height: 1.7; }
  .news-source-controls > button { width: 100%; min-height: 46px; font-size: 14px; }
  .actualizacion { padding: 14px; }
  .actualizacion strong, .actualizacion span { flex-basis: 100%; }
  .noticia, .noticia:first-child { padding: 20px !important; }
  .noticia h3 { font-size: 25px; line-height: 1.2; }
  .noticia .pequeno { font-size: 12px; line-height: 1.6; }
  .noticia > a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; }
  .acciones-noticia { gap: 8px; }
  .acciones-noticia button { flex: 1 1 110px; min-height: 44px; font-size: 12px; }
  .motion-gallery { padding: 18px 14px; }
  .motion-gallery #motion-videos { grid-template-columns: minmax(0,1fr); }
  .motion-gallery > p, .motion-gallery figcaption { font-size: 13px; line-height: 1.7; }
  footer { display: flex; flex-wrap: wrap; font-size: 12px; line-height: 1.6; }
  footer a { display: inline-flex; align-items: center; min-height: 44px; margin: 0; }
}

@media (max-width: 359px) {
  .estructura { padding: 10px; }
  .tarjetas { grid-template-columns: minmax(0,1fr); }
  .tarjeta { display: grid; grid-template-columns: 38% minmax(0,1fr); }
  .tile-art { height: 100%; aspect-ratio: auto; min-height: 190px; }
  .tile-copy { padding: 16px 12px; }
  .tile-copy strong { font-size: 24px; }
  .vida-pestanas { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vida-espacio { padding: 16px; }
  .code-command-form, .code-cli-intro { padding-inline: 14px; }
  .code-timeline { padding-inline: 14px; }
  .chisme-banner .revista-cab { padding-right: 65px; }
  .chisme-banner > img { width: 90px; opacity: .7; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}
