/* Identidad oficial Simple Taller. Recursos locales, sin dependencias externas. */
:root { --st-azul-profundo:#03172b; --st-cian:#00d9e9; }
html, body, #root { min-height:100%; }
body { background:#03172b url('/assets/brand/fondo-desktop.webp') center center / cover fixed no-repeat; }
/* Pantalla inicial: visible incluso antes de que se descargue y ejecute React. */
.brand-splash {
  position:relative; isolation:isolate; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:clamp(28px,5vh,65px);
  width:100%; min-height:100vh; min-height:100dvh;
  padding:clamp(28px,5vw,55px) 22px;
  background:#03172b url('/assets/brand/fondo-desktop.webp') center / cover no-repeat;
  color:#f7fbff; text-align:center; font-family:system-ui,-apple-system,'Segoe UI',sans-serif;
}
.brand-splash-inner { display:flex;flex-direction:column;align-items:center;gap:clamp(45px,8vh,100px);width:min(100%,580px); }
.brand-splash-identity { display:flex;flex-direction:column;align-items:center;gap:12px; }
.brand-splash-emblem { display:block;width:clamp(135px,19vw,192px);height:auto;max-height:27vh;object-fit:contain;filter:drop-shadow(0 14px 32px rgba(0,0,0,.23)); }
.brand-splash-title { margin-top:4px;font-size:clamp(30px,4vw,54px);font-weight:800;line-height:1.15;letter-spacing:-.035em;text-shadow:0 3px 15px rgba(0,0,0,.34); }
.brand-splash-tagline { font-size:clamp(11px,1.8vw,18px);font-weight:500;letter-spacing:clamp(.14em,.55vw,.35em);color:#d4e8f4; }
.brand-splash-rule { width:70px;height:5px;margin-top:12px;background:#00dfed;border-radius:20px;box-shadow:0 0 12px rgba(0,232,245,.43); }
.brand-splash-status { display:flex;flex-direction:column;align-items:center;gap:16px; }
.brand-splash-ring { width:65px;height:65px;border:7px solid rgba(0,205,230,.28);border-top-color:#13f0f6;border-right-color:#00b7d9;border-radius:50%;animation:st-spin 1.15s linear infinite; }
.brand-splash-label { font-size:clamp(18px,2.3vw,27px);font-weight:500;letter-spacing:.01em; }
@keyframes st-spin { to {transform:rotate(360deg);} }
/* Fondos de la aplicación, tanto paneles como autenticación y vista pública. */
.workshop.app-shell { background:linear-gradient(180deg,rgba(1,13,29,.29),rgba(1,13,29,.52)),url('/assets/brand/fondo-desktop.webp') center / cover fixed no-repeat; }
.brand-login, .brand-public-landing { background:linear-gradient(180deg,rgba(1,12,27,.22),rgba(1,12,27,.42)),url('/assets/brand/fondo-desktop.webp') center / cover fixed no-repeat !important; }
.brand-login { min-height:100vh; min-height:100dvh; }
.brand-login-panel { background:rgba(3,19,37,.91)!important;border:1px solid rgba(52,195,223,.38)!important;border-radius:14px!important;box-shadow:0 22px 65px rgba(0,0,0,.38);backdrop-filter:blur(12px); }
.brand-login-identity { display:flex;justify-content:center;align-items:center;padding:0 0 19px;border-bottom:1px solid rgba(122,158,180,.27); }
.brand-login-imagotipo { display:block;width:min(100%,340px);max-height:122px;object-fit:contain;margin:auto; }
/* El footer se utiliza también en login, donde no se importa workshop.css. */
.simpletaller-footer { width:100%;display:flex;justify-content:center;align-items:center;gap:10px;min-height:54px;padding:10px 16px max(10px,env(safe-area-inset-bottom));background:rgba(2,15,30,.85);border-top:1px solid rgba(88,170,194,.30);font-size:13px;letter-spacing:.02em;color:#c7e8f4; }
.simpletaller-footer-mark { display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;background:transparent!important;border:0!important; }
.simpletaller-footer-mark img { display:block;width:30px;height:30px;object-fit:contain; }
.simpletaller-footer strong { font-weight:700; }
.workshop-logo .logo-placeholder { border:0;background:transparent; }
.workshop-logo .st-header-mark { display:block;width:48px;height:48px;max-width:100%;object-fit:contain; }
.workshop-header:has(.st-header-mark) .workshop-logo { flex-shrink:0; }
/* Preservar legibilidad de paneles encima de los fondos. */
.workshop.app-shell .workspace { position:relative; }
.brand-public-landing { min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;color:#edf8ff; }
.brand-public-landing main { flex:1;max-width:1080px;width:100%;margin:auto;padding:clamp(40px,10vh,110px) 22px 55px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:25px; }
.brand-public-landing .public-brand-img { width:min(85vw,620px);height:auto;max-height:180px;object-fit:contain; }
.brand-public-landing h1 { font-size:clamp(25px,4vw,46px);line-height:1.18;margin:0;max-width:720px;font-weight:750; }
.brand-public-landing p { font-size:clamp(16px,2vw,20px);line-height:1.6;max-width:750px;margin:0;color:#d3e5f1; }
.brand-public-landing .public-features { list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:820px;padding:0;margin:10px 0 0; }
.brand-public-landing .public-features li { padding:10px 15px;background:rgba(3,29,49,.72);border:1px solid rgba(81,201,223,.35);border-radius:999px;font-weight:600;font-size:14px; }
.brand-public-landing .public-login-link { display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 27px;background:#00c5d2;color:#021926;text-decoration:none;font-size:17px;font-weight:800;border-radius:8px;border:1px solid #6df4f7;transition:background .15s,transform .15s; }
.brand-public-landing .public-login-link:hover { background:#50f2f4;transform:translateY(-1px); }
.brand-public-landing .public-login-link:focus-visible { outline:3px solid white;outline-offset:4px; }
@media (max-width:767px) {
  body { background-image:url('/assets/brand/fondo-mobile.webp');background-position:center center;background-attachment:scroll; }
  .brand-splash {background-image:url('/assets/brand/fondo-mobile.webp');gap:8vh;}
  .brand-splash-inner { gap:clamp(45px,9vh,105px); }
  .brand-splash-emblem { width:clamp(132px,38vw,185px);max-height:24vh; }
  .brand-splash-title { font-size:clamp(32px,9vw,48px); }
  .brand-splash-tagline { font-size:clamp(11px,3.6vw,16px);letter-spacing:.19em; }
  .workshop.app-shell { background-image:linear-gradient(180deg,rgba(1,13,29,.22),rgba(1,13,29,.45)),url('/assets/brand/fondo-mobile.webp');background-attachment:scroll; }
  .brand-login,.brand-public-landing { background-image:linear-gradient(180deg,rgba(1,13,29,.16),rgba(1,13,29,.33)),url('/assets/brand/fondo-mobile.webp')!important;background-attachment:scroll!important; }
  .brand-login-panel { padding:24px!important; }
  .brand-login-imagotipo { width:min(100%,320px);max-height:105px; }
  .brand-public-landing main {padding-top:10vh;gap:21px;}
  .brand-public-landing .public-brand-img {max-height:128px;}
}
@media (prefers-reduced-motion: reduce) {
  .brand-splash-ring { animation:none;border-color:#00c9d9; }
  .brand-public-landing .public-login-link {transition:none;}
}

/* 2026-11-07: pantalla de inicio ajustada al alto visible, incluso en PWA y apaisado. */
.brand-splash {
  position:fixed; inset:0; z-index:9999;
  width:100%; height:100vh; height:100dvh; min-height:0;
  padding:clamp(12px,3dvh,28px) 18px;
  overflow:hidden; box-sizing:border-box;
  gap:0;
}
.brand-splash-inner { width:min(100%,440px);max-height:100%;gap:clamp(16px,4dvh,36px);justify-content:center; }
.brand-splash-identity { gap:clamp(4px,1dvh,10px); }
.brand-splash-emblem {width:clamp(86px, min(24vw,19dvh),155px);max-height:20dvh;}
.brand-splash-title {font-size:clamp(24px,min(6vw,5dvh),42px);margin-top:0;}
.brand-splash-tagline {font-size:clamp(10px, min(2vw,2.1dvh),15px);}
.brand-splash-rule {margin-top:6px;height:4px;width:54px;}
.brand-splash-status {gap:9px;}
.brand-splash-ring {width:40px;height:40px;border-width:4px;}
.brand-splash-label {font-size:clamp(14px,min(3.3vw,2.8dvh),18px);}
@media (max-height:520px) {
  .brand-splash-inner {gap:10px;}
  .brand-splash-emblem {width:70px;max-height:16dvh;}
  .brand-splash-identity {gap:3px;}
  .brand-splash-title {font-size:22px;}
  .brand-splash-tagline {font-size:10px;}
  .brand-splash-rule {margin-top:3px;height:3px;}
  .brand-splash-ring {width:28px;height:28px;border-width:3px;}
  .brand-splash-status {gap:4px;}
}
