/* Shared arrival and route transitions; the music dock stays mounted outside them. */
.entry-dialog{width:min(980px,calc(100vw - 48px));max-width:980px;max-height:calc(100dvh - 48px);padding:0;border:0;border-radius:24px;background:#fff8ec;color:#32231f;overflow:auto;box-shadow:0 26px 100px #27100e40}
.entry-dialog[open]{display:grid;grid-template-columns:.83fr 1.17fr;animation:welcome-arrive .32s ease both}
.entry-dialog::backdrop{background:#331e1dc7;backdrop-filter:blur(9px)}
.entry-brand{background:#bd162a;min-height:570px;position:relative;overflow:hidden;display:flex;align-items:center;flex-direction:column;padding:60px 28px 28px;isolation:isolate;color:#fff4df}
.entry-brand:before{content:'';position:absolute;width:370px;height:370px;border:1px solid #fff4df26;border-radius:50%;top:155px;z-index:-1}
.entry-logo{width:210px;height:55px;object-fit:contain;flex-shrink:0}
.entry-since{font-size:10px;font-weight:700;letter-spacing:2px;margin:17px 0 22px}
.entry-characters{position:relative;width:100%;height:300px;margin:auto 0}
.entry-characters img{position:absolute;object-fit:contain;filter:drop-shadow(0 12px 0 #64001918)}
.entry-dom{height:260px;width:57%;left:0;bottom:12px;animation:welcome-dom 3.6s ease-in-out infinite}
.entry-dim{height:216px;width:58%;right:-2%;bottom:13px;animation:welcome-dim 4.2s ease-in-out infinite}
.entry-signature{font-size:12px;letter-spacing:1px;opacity:.85}
.entry-main{padding:36px 38px;align-self:center;min-width:0}
.entry-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:27px}
#entry-welcome{font-size:9px;font-weight:800;letter-spacing:1.5px;max-width:110px}
.entry-languages{display:flex;gap:2px;border:1px solid #dccfc1;border-radius:30px;padding:3px;margin:0;flex-shrink:0}
.entry-languages button{padding:8px 12px;border:0;border-radius:30px;color:#5e4b42;background:transparent;font-size:12px;font-weight:600;min-height:36px}
.entry-languages button[aria-pressed=true]{background:#bd162a;color:#fff8ec;box-shadow:none}
.entry-main h2{font-family:Outfit,sans-serif;font-size:clamp(28px,3.3vw,40px);font-weight:700;letter-spacing:-1.6px;line-height:1.06;margin:0 0 12px;max-width:400px}
#entry-subtitle{font-size:14px;line-height:1.5;color:#776157;margin:0 0 24px;max-width:330px}
#entry-options{display:grid;gap:10px;margin:0}
#entry-options .entry-option{display:flex;align-items:center;text-align:left;gap:14px;background:#fffdf7;border:1px solid #ddcfc0;border-radius:13px;padding:13px 15px;color:#32231f;font-weight:600;font-size:15px;min-height:64px;transition:background .16s,transform .16s,border-color .16s}
#entry-options .entry-option:first-child{background:#bd162a;color:#fff8ec;border-color:#bd162a}
#entry-options .entry-option:hover{transform:translateX(3px);border-color:#bd162a}
.entry-option-icon{width:30px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.entry-option-icon svg{width:25px;height:25px}
.entry-option-arrow{margin-left:auto;font-size:20px;font-weight:400;opacity:.6}
#entry-explore{display:block;background:none;border:0;color:#725d52;font-size:12px;padding:16px 0 0;text-decoration:underline;text-underline-offset:4px;margin:0}
.entry-dialog button:focus-visible{outline:3px solid #ae6c2d;outline-offset:3px}
body.welcome-open{overflow:hidden}
body.welcome-open .music-dock,body.welcome-open .assistant-launch{visibility:hidden}
.menu-teaser{position:relative;cursor:pointer}
.menu-teaser #open-menu-teaser:after{content:'';position:absolute;inset:0;border-radius:inherit}
.menu-teaser:has(#open-menu-teaser:focus-visible){outline:3px solid #a36b2d;outline-offset:4px}
.menu-teaser:has(#open-menu-teaser:focus-visible) #open-menu-teaser{outline:0}
body.menu-focused #menu .menu-products-scroll{animation:menu-arrive .25s ease both}
.brand-loading{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:#fff8ec;gap:18px}
.loading-logo{width:178px;height:46px;object-fit:contain}
.loading-characters{display:flex;align-items:flex-end;justify-content:center;height:135px;width:190px}
.loading-characters img{width:95px;height:135px;object-fit:contain;animation:welcome-dom 1.3s ease-in-out infinite}
.loading-characters img+img{height:110px;animation-delay:.3s}
.loading-line{width:92px;height:3px;border-radius:6px;background:#fff8ec35;position:relative;overflow:hidden}
.loading-line:after{content:'';width:34px;height:3px;background:#fff8ec;display:block;border-radius:6px;animation:loading-slide 1.3s ease-in-out infinite}
.brand-loading p{font-size:12px;letter-spacing:.7px;margin:0}
.route-loading,#home-boot{position:fixed;inset:0;z-index:220;background:#bd162a;display:grid;place-content:center;animation:welcome-arrive .2s ease both}
.route-slow{text-align:center;color:#fff8ec;max-width:350px;margin-top:20px}
.route-slow button{padding:10px 15px;border:1px solid #fff8ec;border-radius:12px;background:transparent;color:inherit;margin:4px}
/* `backwards` y no `both` a propósito (6 de octubre de 2026). Una animacion de `opacity` que
   RELLENA HACIA DELANTE deja el elemento como contexto de apilamiento para siempre, aunque ya
   haya terminado y aunque acabe en `opacity:1`. Con `both`, `#dimdom-app` era ese contexto: todo
   lo de dentro —cabecera, menu a pantalla completa, sus hojas— quedaba encerrado, y cualquier
   `position:fixed` de FUERA (la pildora del reproductor, el timbre) se pintaba encima por mucho
   z-index que se le pusiera al menu. Era la causa real de que el reproductor tapara los modales.
   Con `backwards` la entrada se ve igual —arranca en .5 y sube a 1, que es el valor natural— pero
   al terminar no deja rastro y la escala de z-index de `site.css` vuelve a mandar. Lo fija
   `test:css-reproductor`. */
#dimdom-app,body>main{animation:page-arrive .25s ease backwards}
@keyframes welcome-dom{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(2deg)}}
@keyframes welcome-dim{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-6px) rotate(-2deg)}}
@keyframes welcome-arrive{from{opacity:0}to{opacity:1}}
@keyframes page-arrive{from{opacity:.5;}to{opacity:1;}}
@keyframes menu-arrive{from{opacity:.6;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes loading-slide{0%,100%{transform:translateX(-34px)}50%{transform:translateX(92px)}}
@media(max-width:680px){
 .entry-dialog{width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;border-radius:0;overscroll-behavior:contain}
 .entry-dialog[open]{display:flex;flex-direction:column}
 .entry-brand{min-height:200px;height:200px;flex-shrink:0;padding:24px 20px 12px;display:block}
 .entry-logo{position:absolute;left:24px;top:43px;width:150px;height:40px}
 .entry-since{position:absolute;left:24px;top:80px;font-size:8px;letter-spacing:1px;margin-top:14px}
 .entry-signature{position:absolute;left:24px;bottom:28px;font-size:10px}
 .entry-characters{position:absolute;width:175px;height:170px;right:8px;bottom:0;margin:0}
 .entry-dom{height:155px;bottom:5px;width:54%}.entry-dim{height:123px;bottom:7px;width:54%;right:0}
 .entry-brand:before{width:240px;height:240px;top:-15px;right:-28px}
 .entry-main{padding:25px 24px 30px;width:100%;box-sizing:border-box;align-self:auto}
 .entry-topline{margin-bottom:22px}.entry-main h2{font-size:31px;max-width:330px}
 #entry-subtitle{font-size:13px;margin-bottom:18px}#entry-options{gap:9px}
 #entry-options .entry-option{min-height:59px;padding:11px 14px;font-size:14px}
}
@media(max-width:360px){.entry-logo{width:125px;left:18px}.entry-since,.entry-signature{left:18px}.entry-characters{width:150px}.entry-main{padding:20px 18px}.entry-languages button{padding:7px 10px}}
@media(prefers-reduced-motion:reduce){.entry-dialog[open],.entry-characters img,.loading-characters img,.loading-line:after,.route-loading,#home-boot,#dimdom-app,body>main,body.menu-focused #menu .menu-products-scroll{animation:none}#entry-options .entry-option{transition:none}html{scroll-behavior:auto!important}}
.no-mascot-motion .entry-characters img{animation:none}

#home-boot[hidden]{display:none}#entry-dialog{padding:0!important}#entry-dialog h2{margin:0 0 12px;line-height:1.06}#entry-dialog .entry-languages{gap:2px;margin:0}#entry-dialog .entry-languages button{border:0;padding:8px 12px}#entry-dialog .entry-languages button[aria-pressed=true]{background:#bd162a;color:#fff8ec}body:not(.menu-focused) #menu{cursor:pointer}

.entry-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}#entry-dialog #entry-explore{padding:0;margin:0}#entry-music-toggle{display:flex;align-items:center;gap:7px;border:1px solid #ddcfc0;color:#725d52;background:transparent;min-height:40px;border-radius:30px;padding:8px 12px;font-size:10px;flex-shrink:0}#entry-music-toggle span:first-child{font-size:13px}@media(max-width:360px){.entry-footer{gap:8px}#entry-explore{font-size:10px}#entry-music-toggle{font-size:9px;padding:7px 9px}}
@media(max-width:760px){body.menu-focused .sound-toggle{bottom:max(81px,calc(env(safe-area-inset-bottom) + 73px))}}
/* Final welcome action remains visible and separate from the quick shortcuts. */
#entry-dialog .entry-footer{flex-direction:column;align-items:stretch;gap:12px;margin-top:18px}
#entry-dialog #entry-music-toggle{align-self:flex-start;font-size:12px}
#entry-dialog #entry-explore{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:52px;padding:14px 16px;margin:0;border:1px solid #c9ac96;border-radius:14px;background:#f6e8da;color:#742c24;font-size:15px;font-weight:700;line-height:1.4;text-align:left;text-decoration:none;white-space:normal}
#entry-dialog #entry-explore::after{content:'→';flex:none;font-size:22px}
#entry-dialog #entry-explore:hover{border-color:#b11126;background:#efddcc}
/* Compact error notice and entry panel. */
.route-slow{color:#38221e;background:#fff5e9;border:1px solid #dac5b4;border-radius:14px;padding:16px;font-size:15px;margin-top:12px}.route-slow button{color:#a91025;border-color:#b11126;min-height:44px;font-size:15px}#entry-subtitle[hidden]{display:none}#entry-dialog .entry-main{padding-top:28px;padding-bottom:28px}#entry-dialog .entry-topline{margin-bottom:18px}
@media(max-width:620px){#entry-dialog .entry-brand{min-height:130px;height:130px}.entry-logo{top:26px}.entry-since{top:65px}.entry-signature{display:none}.entry-characters{height:125px;width:140px}.entry-dom{height:118px}.entry-dim{height:96px}#entry-dialog .entry-main{padding:22px}#entry-options .entry-option{min-height:52px}#entry-dialog h2{font-size:28px}}
