:root{--ink:#203358;--paper:#f7f5ef;--red:#e7392d;--muted:#647692}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif;overflow:hidden}header{position:fixed;top:0;left:0;width:100%;padding:28px 4vw;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:2px;pointer-events:none;z-index:3}.brand{font-size:15px;letter-spacing:3px}.brand b{font-weight:400;color:var(--red)}#stage{height:100dvh;outline:none}.layout{display:grid;grid-template-columns:45% 55%;height:100%;padding:95px 4vw 95px;gap:0}.copy{display:flex;flex-direction:column;justify-content:center;padding-right:3vw}.eyebrow{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--red);margin-bottom:24px}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(38px,5.4vw,86px);line-height:1.05;letter-spacing:-2px;margin:0 0 25px}p{font-size:18px;line-height:1.6;color:#526480;margin:0}.tag{margin-top:24px;font-size:12px;letter-spacing:2px;text-transform:uppercase}.mapbox{position:relative;display:flex;align-items:center;justify-content:center;background:#e8eff6;border-radius:50% 50% 44% 44%;overflow:hidden}.map{width:100%;height:100%;max-height:650px}.map text{font-family:Arial,sans-serif;font-size:16px;fill:var(--ink);paint-order:stroke;stroke:#e8eff6;stroke-width:5px;stroke-linejoin:round}.map .small{font-size:12px}.map .water{font-size:13px;letter-spacing:5px;fill:#7997b5;stroke:none}.photo{height:100%;min-height:0;position:relative;background:#e8eff6;overflow:hidden;border-radius:3px}.photo img{width:100%;height:100%;object-fit:cover}.placeholder{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:35px;background:radial-gradient(circle at 70% 30%,#f5dcd5,transparent 50%),linear-gradient(145deg,#e8eff6,#bdd8ed)}.placeholder svg{width:140px;height:140px;opacity:.6}.placeholder strong{font:30px Georgia;margin:20px 0}.placeholder code{font-size:12px;line-height:1.8;word-break:break-all}.photo-caption{position:absolute;bottom:20px;left:22px;color:white;background:#203358b0;padding:10px 15px;font-size:11px;letter-spacing:2px}.day-number{font:180px Georgia;color:#d2deeb;position:absolute;bottom:60px;right:60px}.travel-status{margin-top:25px;display:flex;gap:12px;align-items:center;font-size:14px}.dot{width:7px;height:7px;background:var(--red);border-radius:50%}nav{position:fixed;bottom:25px;right:4vw;display:flex;align-items:center;gap:9px;z-index:5;background:#f7f5efed;border:1px solid #d2deeb;padding:8px;border-radius:40px}button{font:14px Arial;color:var(--ink);border:0;background:transparent;padding:10px 14px;border-radius:30px;cursor:pointer}button:hover{background:#dceaf5}button:focus-visible{outline:2px solid var(--red)}button:disabled{opacity:.3;cursor:default}#next{background:var(--ink);color:white}#counter{font-size:11px;min-width:50px;text-align:center}#progress{position:fixed;bottom:0;left:0;height:3px;background:var(--red);z-index:4}dialog{border:0;border-radius:12px;background:var(--paper);color:var(--ink);width:min(700px,90vw);max-height:85vh;padding:30px}dialog::backdrop{background:#20335870}dialog h2{font:32px Georgia}#days{display:grid;grid-template-columns:1fr 1fr;gap:6px}#days button{text-align:left;border-radius:6px;background:#e8eff6;line-height:1.5}#days small{display:block;color:var(--red)}.hint{position:fixed;bottom:40px;left:4vw;font-size:11px;letter-spacing:1px;color:#647692}.route{fill:none;stroke:var(--red);stroke-width:3;stroke-linecap:round}.route-base{fill:none;stroke:#e7392d45;stroke-width:2;stroke-dasharray:5 7}@media(max-width:800px){header{padding:18px;font-size:9px}.layout{padding:80px 24px 100px;grid-template-columns:40% 60%}h1{font-size:36px}.copy p{font-size:14px}.hint{display:none}nav{bottom:15px;right:15px}#days{grid-template-columns:1fr}}

/* Más espacio para el mapa y encuadres de ruta regionales. */
.layout:has(.mapbox){grid-template-columns:35% 65%}.layout:has(.mapbox) h1{font-size:clamp(34px,4.4vw,70px)}.mapbox{border-radius:18px}.map{max-height:none}.map .water{opacity:.65}

/* Carrusel manual: una fotografía ocupa todo el espacio original. */
.photo-panel{position:absolute;inset:0;}
.photo-panel[hidden]{display:none;}
.photo-controls{position:absolute;bottom:18px;right:18px;display:flex;align-items:center;gap:6px;background:#f7f5efed;border-radius:30px;padding:4px;z-index:2;}
.photo-controls button{font-size:24px;padding:4px 12px;}
.photo-controls span{font-size:12px;}
.photo-carousel .photo-caption{max-width:calc(100% - 180px);}

.brand-logo{display:block;width:290px;height:auto;flex-shrink:0;}
@media(max-width:800px){.brand-logo{width:195px;}}

/* Identidad Cocktail Tours: azul principal, celeste y rojo de marca. */
h1,h2{color:#203358;}p{color:#526480;}.tag{color:#388fce;}.eyebrow{color:#e7392d;}.brand-logo{max-width:40vw;}

/* Controles estables: repetir conserva su casilla en todas las escenas. */
nav{display:grid;grid-template-columns:44px 94px 64px 44px 44px 44px;gap:8px;width:390px;height:62px;padding:8px;}
nav button{width:100%;height:44px;padding:0;white-space:nowrap;}
nav #counter{min-width:0;width:64px;white-space:nowrap;font-variant-numeric:tabular-nums;}
nav #replay[hidden]{display:block!important;visibility:hidden;pointer-events:none;}
@media(max-width:440px){nav{grid-template-columns:36px 82px 52px 36px 36px 36px;gap:5px;width:321px;height:58px;padding:8px;}nav button{height:40px;}nav #counter{width:52px;}}

/* Indicador del día al doble de su tamaño original (12 → 24 px). */
.eyebrow.day-counter{font-size:24px;}

/* Portada: bandera japonesa detrás del título, contenida en la sección de texto. */
.cover-layout .copy{position:relative;isolation:isolate;}
.cover-layout .copy::before{content:"";position:absolute;z-index:-1;left:-1.2vw;right:1.5vw;top:18%;bottom:18%;border-radius:8px;background:radial-gradient(circle at 50% 50%,rgba(231,57,45,.15) 0 32%,transparent 32.3%),#ffffffa6;}
.layout.cover-layout h1{font-size:clamp(80px,8.5vw,150px);line-height:1;letter-spacing:-4px;}
.cover-layout .tag{line-height:1.6;}
@media(max-width:800px){.layout.cover-layout h1{font-size:clamp(58px,10vw,80px);letter-spacing:-2px;}}

.support-photo{height:auto;flex-shrink:0;aspect-ratio:16 / 9;width:100%;max-height:28dvh;margin-top:24px;}
.support-photo .placeholder{padding:16px;}.support-photo .placeholder strong{font-size:22px;margin:8px 0;}.support-photo .placeholder code{font-size:11px;}

/* Trayectos: cada línea indicada permanece completa dentro de la columna. */
.copy:has(.route-heading){container-type:inline-size;}
.layout .route-heading{font-size:clamp(18px,7.6cqw,70px);letter-spacing:-.03em;line-height:1.2;}
.route-heading .title-line{white-space:nowrap;}

/* Prioridad sobre el tamaño general de títulos del mapa. */
.layout:has(.mapbox) .copy h1.route-heading{font-size:clamp(16px,7.6cqw,70px);letter-spacing:-.03em;line-height:1.2;max-width:100%;}
.layout .copy{min-width:0;}

/* Día 09: trayectos cortos permiten un título más grande. */
.layout.day-nine-layout:has(.mapbox) .copy h1.route-heading{font-size:clamp(24px,12cqw,86px);}

/* Le message provisoire ne paraît que si JPG et PNG sont réellement absents. */
.photo .placeholder{visibility:hidden;}
.photo .placeholder.photo-missing{visibility:visible;}

.photo-loader{position:fixed;inset:0;z-index:100;background:#f7f5ef;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:#203358;text-align:center;padding:24px;}.photo-loader strong{font:clamp(28px,4vw,48px) Georgia,serif;}.photo-loader p{font-size:18px;}