/* movil.css · Pangea OS diseño-27 · el teléfono primero (25-sep-2026, encargo «app bonita, móvil e instalable»). Capa que va DESPUÉS de marco.css. Todo lo que cambia el teléfono vive aquí, para que se pueda leer y revertir de una vez. Reglas de la casa: colores solo por token; sin datos; sin !important salvo para anular un !important previo. Tres piezas: 1) la barra de pestañas abajo (al alcance del pulgar), 2) la cabecera compacta y pegajosa con zona segura, 3) los ajustes de cada familia de pantalla a 375–430 px. Fuera del teléfono (>760 px) esta hoja casi no actúa. */ /* ---------- 0 · base de teléfono (vale en cualquier ancho) ---------- */ html{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none} body{min-height:100dvh} button,a.os-btn,.os-tile,.os-fila,.os-chip,.p27-tabbar a{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none} @media(prefers-reduced-motion:no-preference){ .os-btn,button.os-fila,.os-tile,.p27-tabbar a,.p27-tabbar button,.p27-pax,.p27-theme,.p27-back{transition:transform var(--os-duration-press) var(--os-ease-out),background-color var(--os-duration-press) var(--os-ease-out),border-color var(--os-duration-press) var(--os-ease-out),opacity var(--os-duration-press) var(--os-ease-out)} .os-btn:active:not(:disabled),button.os-fila:active,.os-tile:active{transform:scale(var(--os-pressScale))} .p27-tabbar a:active,.p27-tabbar button:active,.p27-pax:active,.p27-theme:active,.p27-back:active{transform:scale(.92)} } /* El estado «ok» de una acción se confirma con un tic que se dibuja una vez. */ .os-estado.ok{display:flex;align-items:center;gap:8px} .os-estado.ok::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:var(--os-accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23000'/%3E%3Cpath d='M7 12.5l3 3 7-7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23000'/%3E%3Cpath d='M7 12.5l3 3 7-7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat} @media(prefers-reduced-motion:no-preference){.os-estado.ok::before{animation:p27-tic 360ms var(--os-ease-out) both}} @keyframes p27-tic{from{transform:scale(.4);opacity:0}60%{transform:scale(1.15)}to{transform:scale(1);opacity:1}} /* Texturina (OFL) en los títulos (h1 y héroe) y en el rótulo, peso 700–800 (elección de Carlos, 25-sep). */ .os-h1,.p27-hero h1,.t3-intro__titulo{font-family:'Texturina',var(--os-font-heading),Georgia,serif;font-weight:750;letter-spacing:-.01em;font-variation-settings:'opsz' 48} /* Accesos: un icono por tile sobre la pastilla de acento (vale en todos los anchos). */ .os-tile{position:relative} .os-tile::before{width:36px;height:36px;border-radius:11px;background:var(--os-selected);-webkit-mask:none;mask:none} .os-tile .p27-ico{position:absolute;left:24px;top:24px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--os-accent);pointer-events:none} .os-tile .p27-ico svg{width:22px;height:22px} @media(max-width:760px){.os-tile .p27-ico{left:14px;top:14px}} .p27-cuenta{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin:24px 0 8px} .p27-cuenta .os-salir,.p27-cuenta .os-ajuste{font-size:14px;color:var(--os-secondary);min-height:44px;display:inline-flex;align-items:center;border:0;background:transparent;padding:0;text-decoration:underline;text-underline-offset:4px;cursor:pointer} /* Desplegables: Safari de iPhone pinta un