/* Paleta editorial y tratamientos de lectura. El color bajo cada texto es opaco. */
.experience{--surface:#07131e;--text:#f4e9cf;--soft:#c3c9ca;--accent:#e4c59c;--line:#d8c39b55;background:var(--surface);color:var(--text);transition:none}
.experience[data-tone="paper"]{--surface:#f2e7d0;--text:#262825;--soft:#53594d;--accent:#8b3426;--line:#79674c55;color-scheme:light}
.experience[data-tone="charcoal"]{--surface:#211e1a;--text:#f4e9cf;--soft:#cfcbc4;--accent:#e6bf88;--line:#d3b28b55;color-scheme:dark}
.experience[data-tone="wine"]{--surface:#491d24;--text:#fff0db;--soft:#e8cfd0;--accent:#ffd6a1;--line:#efc8b955;color-scheme:dark}
.experience[data-tone="pine"]{--surface:#16352e;--text:#f1ead3;--soft:#cdd9cb;--accent:#e4c99c;--line:#d7ccab55;color-scheme:dark}
.experience .app-header,.experience .app-footer{background:var(--surface);color:var(--text);transition:none}
.app-header{padding-top:calc(12px + env(safe-area-inset-top,0px));padding-bottom:10px}
.journey-meta{gap:18px}
.experience .secondary,.experience .back-button{background:var(--surface);color:var(--text);backdrop-filter:none;-webkit-backdrop-filter:none}
.experience .secondary:hover,.experience .back-button:hover{background:var(--surface);border-color:var(--accent)}
.experience .screen-content{padding:20px 20px 24px;justify-content:flex-start;min-height:100%;gap:0}
.experience .reading-surface{width:100%;min-width:0;position:relative;isolation:isolate;background:var(--surface);padding:26px 20px;border-radius:0;box-shadow:none;overflow:visible;overflow-wrap:anywhere;flex-shrink:0}
.reading-surface>:last-child{margin-bottom:0}
.reading-surface .eyebrow{color:var(--accent);font-size:.8125rem;line-height:1.6;margin-bottom:15px}
.reading-surface h1{position:relative;max-width:100%}
.reading-surface .scene-index{font-size:2.75rem;line-height:1.1;display:block;margin-bottom:14px;opacity:1}
.screen-content .reading-surface{animation:reading-arrive .5s var(--ease) both}
.screen-content.leaving .reading-surface{animation:reading-leave .16s ease forwards}
.screen-content.backwards .reading-surface{animation:reading-back .5s var(--ease) both}
.screen-content .paragraphs>p{animation:none}
.experience .screen-content:after{content:none!important;display:none!important}
.scene-reveal{min-height:156px;flex:1;flex-shrink:0;width:100%;pointer-events:none}
.experience .scene-art{opacity:1;filter:none;mix-blend-mode:normal}
.experience .art-shade{background:linear-gradient(180deg,transparent 0%,transparent 78%,#07131e18)}
.experience .art-layer{background-position:50% 78%;animation:scene-drift 16s ease-in-out infinite alternate;transition:opacity .45s ease}
.experience .art-preview{opacity:1;filter:blur(3px)}
.experience .orbit,.experience .sparkles{display:none}
.experience .content-scroll{mask-image:none;-webkit-mask-image:none}
.experience .desktop-caption{background:var(--surface);color:var(--soft);padding:10px 14px;border-radius:0}
.reading-surface .mystery-mark{display:none}
.experience .reading-surface .closing{color:var(--accent)}
.reading-surface .connection-list{padding-top:16px}
.reading-surface .connection-list li{animation:none}
.experience h1{padding-top:0}

/* Apertura sin caja: una zona de lectura continua que se desvanece solo después del texto. */
.experience[data-treatment="open"] .reading-surface{padding:18px 6px 24px;background:transparent}
.experience[data-treatment="open"] .reading-surface:before{content:"";position:absolute;z-index:-1;inset:-24px -40px -70px;background:linear-gradient(to bottom,var(--surface) 0,var(--surface) calc(100% - 70px),transparent 100%);pointer-events:none}
.experience[data-treatment="open"] .scene-reveal{min-height:190px}

/* Preguntas centradas, con remate arqueado y aire a ambos lados. */
.experience[data-treatment="arch"] .reading-surface{border-radius:76px 76px 8px 8px;padding:38px 22px 28px;text-align:center;border:1px solid var(--line)}
.experience[data-treatment="arch"] .kinetic{margin-left:auto;margin-right:auto}
.experience[data-treatment="arch"] h1,.experience[data-treatment="arch"] .paragraphs{margin-left:auto;margin-right:auto}

/* Una línea lateral y una hoja editorial, con estructuras diferentes. */
.experience[data-treatment="edge"] .reading-surface{border-left:3px solid var(--accent);padding-left:24px;border-radius:0 22px 22px 0}
.experience[data-treatment="edge"] .eyebrow{letter-spacing:.12em}
.experience[data-treatment="sheet"] .reading-surface{border-top:5px solid var(--accent);box-shadow:7px 8px 0 -1px var(--line);padding-top:25px}
.experience[data-treatment="sheet"] .reading-surface:after{content:"";position:absolute;right:0;top:0;width:18px;height:18px;background:linear-gradient(45deg,transparent 49%,#d7c5a5 50%);pointer-events:none}

/* Franjas independientes: la ilustración permanece visible entre los bloques. */
.experience[data-treatment="ribbons"] .reading-surface,.experience[data-treatment="split"] .reading-surface{padding:0;background:transparent;display:flex;flex-direction:column;gap:12px}
.experience[data-treatment="ribbons"] .reading-surface>*,.experience[data-treatment="split"] .reading-surface>*{margin:0}
.experience[data-treatment="ribbons"] .reading-surface>h1,.experience[data-treatment="ribbons"] .paragraphs,.experience[data-treatment="ribbons"] .standout,.experience[data-treatment="ribbons"] .closing,.experience[data-treatment="split"] h1{padding:22px 20px;background:var(--surface)}
.experience[data-treatment="ribbons"] .reading-surface>h1{border-left:3px solid var(--accent)}
.experience[data-treatment="ribbons"] .paragraphs{margin-left:14px;border:0}
.experience[data-treatment="ribbons"] .paragraphs p:last-child{margin-bottom:0}
.experience[data-treatment="ribbons"] .eyebrow,.experience[data-treatment="ribbons"] .kinetic,.experience[data-treatment="split"] .eyebrow,.experience[data-treatment="split"] .tap-hint{align-self:flex-start;background:var(--surface);padding:10px 16px}
.experience[data-treatment="ribbons"] .kinetic{box-sizing:content-box;width:200px;max-width:calc(100% - 32px)}
.experience[data-treatment="split"] .choice-grid{background:transparent;gap:14px}
.experience[data-treatment="split"] .choice{background:var(--surface);color:var(--text);border:0;border-left:3px solid var(--accent);border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.experience[data-treatment="split"] .choice:nth-child(2){background:#16352e;color:#f1ead3;border-color:#e4c99c}
.experience[data-treatment="split"] .choice:nth-child(2) span{color:#e4c99c}
.experience[data-treatment="split"] .tap-hint{align-self:center}

/* Marcos y manifiestos conservan una zona opaca completa bajo la tipografía. */
.experience[data-treatment="frame"] .reading-surface{border:4px double var(--accent);padding:24px 20px}
.experience[data-treatment="poster"] .screen-content{padding-left:0;padding-right:0}
.experience[data-treatment="poster"] .reading-surface{text-align:center;border-top:1px solid var(--accent);border-bottom:1px solid var(--accent);padding:28px}
.experience[data-treatment="poster"] .kinetic,.experience[data-treatment="poster"] .paragraphs{margin-left:auto;margin-right:auto}
.experience[data-treatment="poster"] .closing{padding-top:18px;border-top:1px solid var(--line)}

/* La portada se muestra completa sobre la ilustración; solo los rótulos llevan fondo. */
.experience[data-treatment="book"] .reading-surface{display:flex;flex-direction:column;align-items:center;text-align:center;background:transparent;padding:0}
.experience[data-treatment="book"] .reading-surface>.eyebrow,.experience[data-treatment="book"] h1,.experience[data-treatment="book"] .book-subtitle{background:var(--surface);padding:12px 18px;max-width:100%}
.experience[data-treatment="book"] h1{border-bottom:1px solid var(--accent);margin-bottom:6px}
.book-figure{padding:24px 22px;min-height:240px;flex:0 0 auto;overflow:visible}
.book-cover{animation:book-presence 4.8s ease-in-out infinite;max-height:34vh;max-height:34dvh;max-width:78%;height:auto;width:auto;aspect-ratio:601 / 911}
.experience[data-treatment="book"] .scene-reveal{min-height:70px}

/* Reseñas como correspondencia: cuatro hojas claras, sin caja exterior. */
.experience[data-treatment="letters"] .reading-surface{background:transparent;padding:0}
.experience[data-treatment="letters"] h1,.experience[data-treatment="letters"] .eyebrow,.experience[data-treatment="letters"] .kinetic{background:var(--surface);padding:12px 18px}
.experience[data-treatment="letters"] .eyebrow{display:table}
.experience[data-treatment="letters"] .kinetic{width:220px;max-width:100%;height:102px}
.review-stack{gap:20px}
.reading-surface .review-card{width:calc(100% - 12px);padding:23px 20px;background:#f2e7d0;border:0;border-top:2px solid #8b3426;border-radius:0;box-shadow:4px 5px 0 #07131e55;backdrop-filter:none;-webkit-backdrop-filter:none}
.reading-surface .review-card:nth-child(even){margin-left:12px;background:#e4dbc9;border-color:#315448}
.reading-surface .review-card blockquote{color:#262825}
.reading-surface .review-person cite{color:#53594d;font-size:.875rem}
.reading-surface .review-avatar{color:#8b3426;border-color:#8b342655;background:transparent;flex-shrink:0}
.experience[data-treatment="seal"] .reading-surface{border-radius:30px 0;border:1px solid var(--accent)}
.experience[data-layout="guarantee"] .ornament{display:none}
.guarantee-card{background:#16352e;border-color:#e4c99c66;color:#f1ead3;backdrop-filter:none;-webkit-backdrop-filter:none}
.guarantee-card svg{color:#e4c99c}

/* Elementos cinéticos: una composición diferente cada dos pantallas. */
.kinetic{position:relative;display:flex;align-items:center;justify-content:flex-start;flex:0 0 auto;width:220px;max-width:100%;height:94px;min-height:94px;margin:0 0 18px;overflow:visible;pointer-events:none;color:var(--accent);isolation:isolate}
.kinetic svg{display:block;width:100%;height:80px;flex-shrink:0;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kinetic i,.kinetic b{position:absolute;display:block}
.kinetic[data-effect="respiracion"]{width:96px}
.breath-core{left:38px;top:38px;width:16px;height:16px;border-radius:50%;background:var(--accent);animation:breath-core 3.6s ease-in-out infinite}
.breath-ring{width:42px;height:42px;left:25px;top:25px;border:1px solid var(--accent);border-radius:50%;animation:breath-ring 3.6s ease-in-out infinite}
.breath-ring.second{animation-delay:-1.8s}
.steps{display:flex;gap:26px;align-items:flex-end;height:48px;width:200px;padding-left:7px;padding-top:16px}
.steps i{position:relative;width:20px;background:var(--accent);opacity:.35;animation:step-light 3.4s ease-in-out infinite}
.steps i:nth-child(1){height:12px}.steps i:nth-child(2){height:22px;animation-delay:.65s}.steps i:nth-child(3){height:32px;animation-delay:1.3s}.steps i:nth-child(4){height:42px;animation-delay:1.95s}
.travelling-point{height:7px;width:7px;border-radius:50%;background:#dc6c48;left:14px;top:36px;animation:step-point 3.4s ease-in-out infinite}
.identity-y,.identity-o{position:absolute;font:italic 59px/1 var(--serif);top:15px}
.identity-y{left:15px;animation:identity-y 4.5s ease-in-out infinite}.identity-o{left:53px;animation:identity-o 4.5s ease-in-out infinite}
.identity-line{height:1px;width:145px;left:10px;bottom:12px;background:var(--line);transform-origin:left;animation:identity-line 4.5s ease-in-out infinite}
.elastic-line{opacity:.4;stroke-dasharray:3 6;animation:elastic-flow 3.2s linear infinite}
.reaction-dot{fill:currentColor;stroke:none;transform-origin:center;animation:reaction-hop 2.8s ease-in-out infinite}
.reaction-dot.dot-b{fill:#c85e3e;animation-delay:-.9s}.reaction-dot.dot-c{animation-delay:-1.8s}
.kinetic[data-effect="experiencias"] svg{height:96px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.kinetic[data-effect="repeticion"] svg{height:96px;overflow:visible}
.wave{stroke-width:1.3!important;animation:wave-travel 3.8s linear infinite}
.wave-b{opacity:.4;transform:translateY(8px);animation:wave-return 4.8s linear infinite}
.falling-grains{position:relative;height:68px;width:180px;overflow:hidden}
.falling-grains i{width:3px;height:9px;border-radius:5px;background:var(--accent);top:-10px;animation:grain-drop 2.4s linear infinite}
.falling-grains i:nth-child(1){left:13px;animation-delay:-.3s}.falling-grains i:nth-child(2){left:39px;animation-delay:-1.1s}.falling-grains i:nth-child(3){left:67px;animation-delay:-1.8s;background:#c55e40}.falling-grains i:nth-child(4){left:93px;animation-delay:-.7s}.falling-grains i:nth-child(5){left:119px;animation-delay:-1.4s}.falling-grains i:nth-child(6){left:145px;animation-delay:-2.1s}.falling-grains i:nth-child(7){left:170px;animation-delay:-.15s}
.time-base{position:absolute;bottom:12px;width:183px;height:1px;background:var(--line)}
.revealed-word{font:400 16px/1.7 var(--sans);letter-spacing:.24em;white-space:nowrap;clip-path:inset(0 100% 0 0);animation:word-reveal 5.4s steps(10,end) infinite}
.reveal-cursor{height:26px;width:1px;background:var(--accent);top:34px;left:0;animation:cursor-travel 5.4s steps(10,end) infinite}
.focus-frame{position:relative;margin-left:12px;width:112px;height:53px;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.focus-frame:before,.focus-frame:after{content:"";position:absolute;width:18px;height:18px;border-color:var(--accent);border-style:solid}.focus-frame:before{left:0;top:0;border-width:1px 0 0 1px}.focus-frame:after{right:0;bottom:0;border-width:0 1px 1px 0}
.focus-scan{height:51px;width:28px;left:0;top:0;background:linear-gradient(90deg,transparent,#e4c59c44);border-right:1px solid var(--accent);animation:focus-scan 3.7s ease-in-out infinite}
.focus-frame b{width:7px;height:7px;border-radius:50%;background:#c05a3e;left:53px;top:22px;animation:focus-point 3.7s ease-in-out infinite}
.loop-track{opacity:.24}.loop-light{stroke:#cf7752;stroke-width:3!important;stroke-dasharray:35 315;animation:loop-run 4.6s linear infinite}
.unfolding{position:relative;width:70px;height:62px;margin-left:31px;perspective:400px}
.unfolding i{width:27px;height:27px;border:1px solid var(--accent);background:#e4c59c0d;left:21px;top:16px;transform-origin:center;animation:unfold-shape 4.4s ease-in-out infinite;--angle:0deg;--ux:0px;--uy:-15px}
.unfolding i:nth-child(2){--angle:90deg;--ux:22px;--uy:0px;animation-delay:-.3s}.unfolding i:nth-child(3){--angle:180deg;--ux:0px;--uy:15px;animation-delay:-.6s}.unfolding i:nth-child(4){--angle:270deg;--ux:-22px;--uy:0px;animation-delay:-.9s;background:#b13b2544}
.connection-path{stroke-dasharray:14 220;animation:connection-thread 4s linear infinite;stroke:#d7734e}
.connection-points circle{fill:currentColor;stroke:none;animation:connection-glow 4s ease-in-out infinite}
.connection-points circle:nth-child(2){animation-delay:-.8s}.connection-points circle:nth-child(3){animation-delay:-1.6s}.connection-points circle:nth-child(4){animation-delay:-2.4s}.connection-points circle:nth-child(5){animation-delay:-3.2s}
.quote-open,.quote-close{position:absolute;font:88px/.85 var(--serif);top:9px;display:block}
.quote-open{left:6px;animation:quote-open 4.8s ease-in-out infinite}.quote-close{left:140px;animation:quote-close 4.8s ease-in-out infinite}
.quote-line{left:57px;top:32px;width:64px;height:1px;background:var(--accent);transform-origin:center;animation:quote-line 4.8s ease-in-out infinite}
.horizon-lines{position:relative;width:190px;height:62px}
.horizon-lines i{left:0;height:1px;width:180px;background:var(--accent);transform-origin:left;animation:horizon-expand 4.9s ease-in-out infinite}
.horizon-lines i:nth-child(1){top:13px;animation-delay:-.9s}.horizon-lines i:nth-child(2){top:31px;animation-delay:-1.8s;width:150px;background:#c46142}.horizon-lines i:nth-child(3){top:49px;animation-delay:-2.7s;width:120px}
.horizon-point{height:6px;width:6px;border-radius:50%;background:var(--accent);top:28px;left:5px;animation:horizon-travel 4.9s ease-in-out infinite}
.kinetic .trust-mark{width:62px;height:62px;margin-left:12px}.trust-outline{stroke-dasharray:190;animation:trust-outline 5s ease-in-out infinite}.trust-check{stroke-width:2.4;stroke-dasharray:36;animation:trust-check 5s ease-in-out infinite}
.pause-interval{position:relative;width:90px;height:58px;margin-left:15px}.pause-interval i{height:36px;width:3px;background:var(--accent);top:11px;left:20px;animation:pause-interval 4s ease-in-out infinite}.pause-interval i+i{left:48px;animation-delay:-2s}

@keyframes scene-drift{from{transform:scale(1.015) translate3d(-.4%,.3%,0)}to{transform:scale(1.06) translate3d(.4%,-.3%,0)}}
@keyframes reading-arrive{from{transform:translateY(12px)}to{transform:translateY(0)}}
@keyframes reading-back{from{transform:translateY(-12px)}to{transform:translateY(0)}}
@keyframes reading-leave{to{transform:translateY(-6px)}}
@keyframes breath-core{0%,100%{transform:scale(.75);opacity:.6}50%{transform:scale(1.2);opacity:1}}
@keyframes breath-ring{0%{transform:scale(.65);opacity:.8}100%{transform:scale(1.8);opacity:0}}
@keyframes step-light{0%,100%{opacity:.25}40%{opacity:1}}
@keyframes step-point{0%{transform:translate(0,0);opacity:0}8%{opacity:1}30%{transform:translate(46px,-10px)}55%{transform:translate(92px,-20px)}80%{transform:translate(138px,-30px);opacity:1}100%{transform:translate(145px,-32px);opacity:0}}
@keyframes identity-y{0%,100%{transform:translateX(0) rotate(0)}45%{transform:translateX(-8px) rotate(-15deg)}}
@keyframes identity-o{0%,100%{transform:translateX(0) rotate(0)}45%{transform:translateX(28px) rotate(19deg)}}
@keyframes identity-line{0%,100%{transform:scaleX(.55)}45%{transform:scaleX(1)}}
@keyframes elastic-flow{to{stroke-dashoffset:-36}}
@keyframes reaction-hop{0%,100%{transform:translateY(0)}25%{transform:translateY(-15px)}75%{transform:translateY(13px)}}
@keyframes wave-travel{from{transform:translateX(0)}to{transform:translateX(-100px)}}
@keyframes wave-return{from{transform:translate(-100px,8px)}to{transform:translate(0,8px)}}
@keyframes grain-drop{0%{transform:translateY(0);opacity:0}12%{opacity:1}85%{opacity:.8}100%{transform:translateY(68px);opacity:0}}
@keyframes word-reveal{0%,8%{clip-path:inset(0 100% 0 0)}55%,85%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
@keyframes cursor-travel{0%,8%{transform:translateX(0);opacity:1}55%,85%{transform:translateX(153px);opacity:1}100%{transform:translateX(0);opacity:0}}
@keyframes focus-scan{0%,100%{transform:translateX(-28px)}50%{transform:translateX(110px)}}
@keyframes focus-point{0%,100%{transform:scale(.8);opacity:.5}40%,60%{transform:scale(1.5);opacity:1}}
@keyframes loop-run{to{stroke-dashoffset:-350}}
@keyframes unfold-shape{0%,100%{transform:translate(0,0) rotate(45deg);opacity:.65}50%{transform:translate(var(--ux),var(--uy)) rotate(var(--angle));opacity:1}}
@keyframes connection-thread{to{stroke-dashoffset:-234}}
@keyframes connection-glow{0%,100%{opacity:.3}40%{opacity:1}}
@keyframes quote-open{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-8px) rotate(5deg)}}
@keyframes quote-close{0%,100%{transform:translateY(-8px) rotate(5deg)}50%{transform:translateY(0) rotate(-4deg)}}
@keyframes quote-line{0%,100%{transform:scaleX(.4);opacity:.4}50%{transform:scaleX(1);opacity:1}}
@keyframes horizon-expand{0%,100%{transform:scaleX(.65);opacity:.4}50%{transform:scaleX(1);opacity:1}}
@keyframes horizon-travel{0%,100%{transform:translateX(0)}50%{transform:translateX(142px)}}
@keyframes trust-outline{0%{stroke-dashoffset:190;opacity:.3}40%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.3}}
@keyframes trust-check{0%,35%{stroke-dashoffset:36}65%,100%{stroke-dashoffset:0}}
@keyframes pause-interval{0%,100%{transform:scaleY(.55);opacity:.45}50%{transform:scaleY(1);opacity:1}}
@keyframes book-presence{0%,100%{transform:rotateY(-12deg) rotateZ(-3deg) translateY(5px)}50%{transform:rotateY(5deg) rotateZ(2deg) translateY(-10px)}}

/* Conservar las dimensiones del dibujo en pantallas bajas: no comprimir su ventana. */
@media(min-width:600px) and (max-width:899px){.experience .screen-content{padding:24px 32px}.scene-reveal{min-height:220px}}
@media(min-width:900px){
  .experience .app-header{padding:24px 48px 12px}
  .experience .screen-content{padding:24px 38px 30px 24px;justify-content:center}
  .experience .scene-reveal{display:none}
  .experience .art-shade{background:linear-gradient(180deg,transparent,transparent 85%,#07131e44)}
  .experience .art-layer{background-position:50% 100%}
  .experience .scene-art:after{background:linear-gradient(90deg,transparent 88%,var(--surface))}
  .experience .app-footer{padding-top:20px}
  .experience[data-treatment="open"] .reading-surface:before{background:var(--surface)}
  .experience[data-treatment="poster"] .screen-content{padding:24px 30px}
  .experience[data-screen="misterio"] .screen-content{justify-content:center}
  .experience[data-treatment="book"] .book-cover{max-height:38vh}
}
@media(max-height:720px) and (max-width:899px){
  .experience .app-header{padding-top:calc(7px + env(safe-area-inset-top,0px));padding-bottom:6px}
  .experience .screen-content{padding-top:12px}
  .kinetic{margin-bottom:12px}
  .scene-reveal{min-height:110px}
  .experience[data-treatment="open"] .scene-reveal{min-height:160px}
}
@media(max-width:350px){
  .experience .app-header{padding-left:16px;padding-right:16px}
  .journey-meta{gap:7px}.brand{font-size:.8125rem;gap:6px}
  .page-counter{font-size:.75rem;letter-spacing:.06em}
  .experience .screen-content{padding-left:14px;padding-right:14px}
  .experience .reading-surface{padding-left:16px;padding-right:16px}
  .experience[data-treatment="ribbons"] .reading-surface,.experience[data-treatment="split"] .reading-surface,.experience[data-treatment="letters"] .reading-surface,.experience[data-treatment="book"] .reading-surface{padding:0}
  .experience[data-treatment="arch"] .reading-surface{border-radius:54px 54px 6px 6px}
  .experience[data-treatment="open"] .reading-surface{padding-left:6px;padding-right:6px}
  .footer-caption{align-items:flex-start;flex-wrap:wrap;gap:4px 10px}
  .connection-list li:last-child{margin:0}
}
@media(max-height:480px){
  .experience{height:auto!important;min-height:100vh;display:flex;flex-direction:column;overflow:visible}
  .experience .content-scroll{overflow:visible;flex:1}
  .experience .screen-content{min-height:0;justify-content:flex-start}
  .experience .app-header,.experience .app-footer{flex-shrink:0}
  .experience .app-footer{position:relative}
  .experience .scene-reveal{min-height:90px}
}
.nav-row .primary,.nav-row .secondary{overflow-wrap:anywhere}