.illustration-gallery{max-width:1500px;margin:auto;padding:58px 5% 80px;color:#e9e7f6}
.gallery-heading{display:flex;align-items:center;gap:32px;border-bottom:1px solid #b9b2ec40;padding-bottom:22px}.gallery-heading>span{font-size:34px;color:#d5c6ff;margin-left:auto}.gallery-heading h1{font:500 clamp(30px,4vw,52px)/1.2 var(--serif);letter-spacing:.13em;text-transform:uppercase;margin:12px 0 0}.gallery-heading .eyebrow{color:#a3b9d4}
.gallery-intro{color:#b5b5cb;line-height:1.7;margin:24px 0 42px}.art-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px 40px}.art-entry{min-width:0}.art-open{display:block;width:100%;border:0;padding:0;background:none;color:inherit;cursor:zoom-in;text-align:center}.art-frame{position:relative;display:block;width:100%;aspect-ratio:6/5;isolation:isolate;filter:drop-shadow(0 0 9px #9ebeff26);transition:filter .3s ease;transform-origin:top left}.art-open:hover .art-frame{filter:drop-shadow(0 0 14px #b3baff66)}.art-open:focus-visible{outline:2px solid #e9d5ff;outline-offset:12px}
.art-surface{position:absolute;inset:4.5% 4%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 45% 40%,#171d32,#050710 72%);clip-path:polygon(0 0,100% 0,100% 72%,78% 100%,0 100%)}
.art-surface img{display:block;width:100%;height:100%;object-fit:contain}.art-placeholder{display:flex;flex-direction:column;align-items:center;gap:14px;font:500 clamp(18px,2vw,27px)/1.3 var(--serif);color:#c4cbe1;padding:22px}.art-placeholder>span{font-size:65px;color:#b7dfff;text-shadow:0 0 24px #9b84ef88}.art-placeholder small{font:11px var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#7f8da6}
.art-rim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 25% 30%,transparent 20%,#fff 31%,#9cdfff 39%,transparent 53%),linear-gradient(125deg,#6c82cb 5%,#b6f5ff 17%,#fff 23%,#a8b6ed 31%,#f4c5f4 38%,#fff 44%,#628ed0 51%,#b7f4ff 62%,#fff 69%,#b8a0e4 77%,#f4d8ee 84%,#76cfff 95%);background-size:220% 240%,280% 200%;mask:url('assets/gallery-rim.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/gallery-rim.svg') center/100% 100% no-repeat;animation:gallery-nacre 7s ease-in-out infinite alternate}.art-entry:nth-child(2) .art-rim{animation-delay:-3s}
.art-gem{position:absolute;width:46px;height:72px;pointer-events:none;background:conic-gradient(from 30deg,#fff,#94dfff,#626fc1,#f6d0ff,#fff,#a8eaff,#8a75c9,#fff);clip-path:polygon(50% 0,62% 37%,100% 50%,62% 60%,50% 100%,37% 63%,0 50%,38% 38%);filter:brightness(1.2)}.gem-top{left:-12px;top:-12px;transform:rotate(25deg)}.gem-bottom{right:18%;bottom:-16px;width:28px;height:52px;transform:rotate(15deg)}
@keyframes gallery-nacre{from{background-position:0% 20%,0% 40%}to{background-position:100% 80%,100% 60%}}
.art-caption{padding:26px 10px 0}.art-index{font-size:10px;letter-spacing:.2em;color:#9baecb}.art-caption h2{font:500 25px var(--serif);margin:12px 0}.art-caption p{font-size:14px;color:#aaaec4;line-height:1.7}.art-hint{font-size:12px;color:#d0bbdf}.gallery-note{margin-top:60px;font-size:13px;color:#a9b1c7}.gallery-note a{color:#e9cde9;text-decoration:underline;text-underline-offset:4px}
.art-viewer{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;padding:64px 24px 44px;background:transparent;color:#eaf3ff;overflow:hidden}.art-viewer::backdrop{background:#02040bee;backdrop-filter:blur(10px)}.viewer-stage{height:100%;display:flex;align-items:center;justify-content:center}.viewer-stage .art-frame{width:min(100%,calc((100dvh - 120px)*1.2),1100px);flex:none}.viewer-stage .art-surface{clip-path:none;inset:6% 6% 10%;background:#050710}.viewer-stage .art-surface img{object-fit:contain}.viewer-close{position:absolute;right:28px;top:18px;border:1px solid #bdcced66;border-radius:30px;padding:10px 20px;background:#111627;color:#fff;cursor:pointer;z-index:10}.viewer-close:focus-visible{outline:2px solid #b8eaff;outline-offset:4px}.viewer-note{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:11px;color:#aab4cc;pointer-events:none}
@media(max-width:700px){.art-grid{grid-template-columns:1fr;gap:40px}.illustration-gallery{padding:36px 7% 60px}.gallery-heading h1{letter-spacing:.06em}.art-viewer{padding-inline:14px}.art-caption h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.art-rim{animation:none}.art-frame{transition:none}}

/* Silueta panorámica: borde inferior corto y diagonal larga a la derecha. */
.art-grid{grid-template-columns:1fr;gap:54px}
.art-frame{aspect-ratio:1600/440}
.art-surface,.viewer-stage .art-surface{inset:0;clip-path:polygon(3.9% 14.1%,96.1% 14.1%,96.1% 19.8%,59.6% 85.9%,3.9% 85.9%);background:radial-gradient(ellipse at 35% 40%,#121a2b,#04060d 78%)}
.art-placeholder{position:absolute;left:5%;top:16%;width:57%;height:66%;gap:9px;padding:8px;font-size:clamp(15px,2vw,27px)}
.art-placeholder>span{font-size:clamp(24px,4vw,48px)}
.art-placeholder small{font-size:clamp(8px,1vw,11px)}
.art-rim{background:#c5e3f5 url('assets/gallery-nacre.svg') center/100% 100% no-repeat;animation:none;filter:drop-shadow(0 0 2px #c5eaff)}
.art-rim:after{content:'';position:absolute;inset:0;background:linear-gradient(174deg,#ffffffa0,transparent 18%,#efffff40 46%,transparent 65%,#c4a0ef55);mix-blend-mode:screen;pointer-events:none}
.art-gem{display:none}
.art-caption{padding-top:16px}
.viewer-stage .art-frame{width:min(100%,calc((100dvh - 120px)*3.636),1500px)}
.art-surface img{position:absolute;left:5%;top:15%;width:55%;height:70%;object-fit:contain}
@media(prefers-reduced-motion:reduce){.art-rim{background-image:linear-gradient(120deg,#9bb7e4,#edffff 22%,#c6c0e6 40%,#f1d7eb 52%,#fff 65%,#a8dbf1 82%,#c1b2e3)}}

/* Piezas de cristal superpuestas, bisel interior y sombra de separación. */
.art-frame::before{content:'';position:absolute;inset:0;pointer-events:none;background:#01030c;mask:url('assets/gallery-rim.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/gallery-rim.svg') center/100% 100% no-repeat;transform:translate(1px,7px);filter:blur(3px);opacity:.85;z-index:1}
.art-rim{z-index:2}
.art-frame::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:url('assets/gallery-facets.svg') center/100% 100% no-repeat;filter:drop-shadow(0 2px 2px #01051890)}
.art-frame{filter:drop-shadow(0 8px 9px #0009) drop-shadow(0 0 5px #a1cfff35)}
.art-open:hover .art-frame{filter:drop-shadow(0 10px 12px #000a) drop-shadow(0 0 9px #afcaff70)}

/* Descripción independiente bajo la diagonal, fuera del área de la obra. */
.illustration-gallery .art-entry{position:relative;padding-bottom:120px}
.illustration-gallery .art-caption{position:absolute;left:auto;right:2%;bottom:0;top:auto;width:29%;padding:20px 22px;background:linear-gradient(135deg,#101626ed,#090d17f5);border:1px solid #a8c8ef38;border-radius:3px;box-shadow:0 8px 24px #0005;color:#e9e7f6;font-size:14px;line-height:1.6;letter-spacing:normal;font-weight:400}
.illustration-gallery .art-caption h2{font-size:clamp(18px,1.7vw,24px);margin:8px 0 12px;line-height:1.25}
.illustration-gallery .art-caption p{margin:0 0 14px;font-size:13px;line-height:1.65}
.illustration-gallery .art-caption .art-hint{font-size:11px;display:block}
.illustration-gallery .art-caption .art-index{font-size:9px}
@media(max-width:1000px){.illustration-gallery .art-entry{padding-bottom:0}.illustration-gallery .art-caption{position:relative;right:auto;bottom:auto;width: min(100%,380px);margin:16px 0 0 auto}}

/* Texto breve alojado en el hueco triangular exterior. */
.illustration-gallery .art-entry{padding-bottom:0}
.illustration-gallery .art-caption{position:absolute;top:auto;left:auto;right:3%;bottom:12%;width:23%;margin:0;padding:0 0 0 12px;border:0;border-right:1px solid #a8c8ef50;border-radius:0;background:none;box-shadow:none;text-align:right;padding-right:14px}
.illustration-gallery .art-caption h2{font-size:clamp(14px,1.6vw,22px);margin:5px 0 6px;line-height:1.15}
.illustration-gallery .art-caption p{font-size:clamp(10px,1.05vw,14px);line-height:1.4;margin:0}
.illustration-gallery .art-caption .art-index{font-size:8px;letter-spacing:.12em}
@media(max-width:700px){.illustration-gallery .art-caption{right:3%;bottom:11%;width:27%;padding:0 5px 0 0}.illustration-gallery .art-caption .art-index{display:none}.illustration-gallery .art-caption h2{font-size:10px;margin:0 0 3px}.illustration-gallery .art-caption p{font-size:8px;line-height:1.2}}
/* Rostros en la galería; obra original completa en el visor. */
.art-surface img{left:0;top:0;width:100%;height:100%;object-fit:cover;max-width:none}
.art-surface .portrait-mia{object-position:60% 11%}
.art-surface .portrait-den{object-position:42% 13%;transform:scale(1.55);transform-origin:42% 21%}
.viewer-stage .art-frame{width:var(--expanded-width);height:var(--expanded-height);aspect-ratio:auto;max-width:100%}
.viewer-stage .art-surface{inset:3.2%;clip-path:none;background:#060913}
.viewer-stage .art-surface img{position:static;display:block;width:100%;height:100%;object-fit:contain;object-position:center;transform:none}
.viewer-stage .art-rim,.viewer-stage .art-frame::before{-webkit-mask-image:url('assets/gallery-expanded.svg');mask-image:url('assets/gallery-expanded.svg')}
.viewer-stage .art-frame::after{inset:1.2%;background:none;border:2px solid #d8f5ff;border-radius:1px;box-shadow:inset 2px 2px 2px #fff9,inset -3px -3px 3px #292147,0 2px 5px #0008;outline:1px solid #8e9bd5;outline-offset:3px}

/* Recortes de rostro con escala uniforme y desplazamiento, sin estirar. */
.art-surface .portrait-mia{width:135%;height:auto;left:-32%;top:-40%;object-fit:initial;transform:none}
.art-surface .portrait-den{width:160%;height:auto;left:-24%;top:-32%;object-fit:initial;transform:none}
.viewer-stage .art-frame{overflow:visible}
.viewer-stage .art-surface{overflow:hidden}
.viewer-stage .art-surface img{position:absolute;left:50%;top:50%;width:var(--art-width);height:var(--art-height);max-width:none;object-fit:contain;transform:translate(-50%,-50%);transform-origin:center}

/* Encuadre algo más abierto y sombra suave bajo el borde interior. */
.art-surface .portrait-mia{width:118%;left:-22%;top:-24%}
.art-surface .portrait-den{width:138%;left:-15%;top:-18%}
.art-surface::after{content:'';position:absolute;inset:0;pointer-events:none;background:url('assets/gallery-inner-shadow.svg') center/100% 100% no-repeat;z-index:1}
.viewer-stage .art-surface::after{background:none;box-shadow:inset 0 0 12px 3px #01040b88}
.viewer-stage .art-surface img{left:50%;top:50%;width:var(--art-width);height:var(--art-height)}

/* Encuadre más amplio y profundidad púrpura. */
.art-surface .portrait-mia{width:100%;left:-8%;top:-18%}
.art-surface .portrait-den{width:112%;left:-4%;top:-10%}
.viewer-stage .art-surface img{left:50%;top:50%;width:var(--art-width);height:var(--art-height)}
.viewer-stage .art-surface::after{box-shadow:inset 0 0 14px 4px #692ea599}

/* La ilustración cubre todo el borde superior sin dejar una franja vacía. */
.illustration-gallery .art-surface .portrait-mia{width:104%;left:-4%;top:-18%}

/* Cadres de cristal nacarado: curvas, cintas y reflejos de la referencia. */
.illustration-gallery .art-entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.42fr);align-items:center;gap:42px;max-width:1000px;margin:0 auto;width:100%}
.illustration-gallery .art-frame{aspect-ratio:1}
.illustration-gallery .art-surface{inset:9%;clip-path:none;border-radius:8%;background:#080c18}
.art-rim,.art-frame::before{-webkit-mask-image:url('assets/gallery-ribbon-mask.svg');mask-image:url('assets/gallery-ribbon-mask.svg')}
.art-frame::after{background-image:url('assets/gallery-ribbon-details.svg')}
.illustration-gallery .art-surface img{position:absolute;width:100%;height:100%;left:0;top:0;object-fit:cover;transform:none}
.illustration-gallery .art-surface .portrait-mia{width:100%;height:100%;left:0;top:0;object-fit:cover;object-position:60% 24%}
.illustration-gallery .art-surface .portrait-den{width:100%;height:100%;left:0;top:0;object-fit:cover;object-position:42% 25%}
.illustration-gallery .art-surface::after{background:none;border-radius:inherit;box-shadow:inset 0 0 14px 4px #65399b99}
.illustration-gallery .art-caption{position:relative;inset:auto;width:auto;text-align:left;padding:0 0 0 22px;border-right:0;border-left:1px solid #b9a4e660;margin:0}
.illustration-gallery .art-caption h2{font:500 clamp(20px,2vw,28px)/1.3 var(--serif);margin:12px 0}
.illustration-gallery .art-caption p{font-size:14px;line-height:1.7}
.illustration-gallery .art-caption .art-index{display:block;font-size:10px}
.viewer-stage .art-rim,.viewer-stage .art-frame::before{-webkit-mask-image:url('assets/gallery-ribbon-mask.svg');mask-image:url('assets/gallery-ribbon-mask.svg')}
.viewer-stage .art-frame::after{inset:0;background:url('assets/gallery-ribbon-details.svg') center/100% 100% no-repeat;border:0;outline:0;box-shadow:none}
.viewer-stage .art-surface{inset:9%;border-radius:8%}
@media(max-width:650px){.illustration-gallery .art-entry{grid-template-columns:1fr;gap:20px}.illustration-gallery .art-caption{margin:0 8%;padding-left:16px}.illustration-gallery .art-caption h2{font-size:21px}}

/* Silueta panorámica anterior con el material nacarado y las cintas nuevas. */
.illustration-gallery .art-entry{display:block;position:relative;max-width:none;margin:0}
.illustration-gallery .art-frame{aspect-ratio:1600/440}
.illustration-gallery .art-surface{inset:0;border-radius:0;clip-path:polygon(3.94% 14.55%,96% 14.55%,96% 19.1%,59.5% 85.45%,3.94% 85.45%)}
.illustration-gallery .art-rim,.illustration-gallery .art-frame::before{-webkit-mask-image:url('assets/gallery-panorama-mask.svg');mask-image:url('assets/gallery-panorama-mask.svg')}
.illustration-gallery .art-frame::after{background-image:url('assets/gallery-panorama-ribbon.svg')}
.illustration-gallery .art-surface .portrait-mia{width:104%;height:auto;left:-4%;top:-18%;object-fit:initial}
.illustration-gallery .art-surface .portrait-den{width:112%;height:auto;left:-4%;top:-10%;object-fit:initial}
.illustration-gallery .art-surface::after{background:url('assets/gallery-inner-shadow.svg') center/100% 100% no-repeat;box-shadow:none}
.illustration-gallery .art-caption{position:absolute;right:3%;bottom:12%;width:23%;margin:0;padding:0 14px 0 0;border-left:0;border-right:1px solid #b9a4e660;text-align:right}
.illustration-gallery .art-caption h2{font-size:clamp(14px,1.6vw,22px);margin:5px 0 6px;line-height:1.15}
.illustration-gallery .art-caption p{font-size:clamp(10px,1.05vw,14px);line-height:1.4}
.illustration-gallery .art-caption .art-index{font-size:8px}
@media(max-width:700px){.illustration-gallery .art-caption{width:27%;padding-right:5px;bottom:11%}.illustration-gallery .art-caption h2{font-size:10px}.illustration-gallery .art-caption p{font-size:8px;line-height:1.2}.illustration-gallery .art-caption .art-index{display:none}}

/* Alternancia: diagonal inferior derecha / diagonal superior izquierda. */
.illustration-gallery .art-entry:nth-child(even) .art-rim,
.illustration-gallery .art-entry:nth-child(even) .art-frame::before{
  -webkit-mask-image:url('assets/gallery-panorama-mask-alternate.svg');
  mask-image:url('assets/gallery-panorama-mask-alternate.svg');
}
.illustration-gallery .art-entry:nth-child(even) .art-frame::after{background-image:url('assets/gallery-panorama-ribbon-alternate.svg')}
.illustration-gallery .art-entry:nth-child(even) .art-surface{clip-path:polygon(40.5% 14.55%,96.06% 14.55%,96.06% 85.45%,4% 85.45%,4% 80.9%)}
.illustration-gallery .art-entry:nth-child(even) .art-surface::after{background-image:url('assets/gallery-inner-shadow-alternate.svg')}
.illustration-gallery .art-entry:nth-child(even) .art-caption{left:3%;right:auto;top:12%;bottom:auto;text-align:left;padding:0 0 0 14px;border-right:0;border-left:1px solid #b9a4e660}
.illustration-gallery .art-entry:nth-child(even) .portrait-den{left:0;top:-7%}
@media(max-width:700px){.illustration-gallery .art-entry:nth-child(even) .art-caption{top:11%;padding-left:5px}}

/* Encuadres individuales de las seis nuevas obras. */
.illustration-gallery .art-surface .portrait-03{width:100%;height:auto;left:0;top:0%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .portrait-04{width:100%;height:auto;left:0;top:-55%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .portrait-05{width:100%;height:auto;left:0;top:0%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .portrait-06{width:100%;height:auto;left:0;top:0%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .portrait-07{width:100%;height:auto;left:0;top:-6%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .portrait-08{width:100%;height:auto;left:0;top:-65%;object-fit:initial;transform:none}

/* Segundo encabezado: cristal simétrico con título centrado. */
.illustration-gallery .crystal-heading{position:relative;display:grid;place-items:center;isolation:isolate;width:100%;height:clamp(130px,18vw,235px);padding:0 17% 2%;margin:0 auto 48px;border:0;background:url('assets/gallery-heading.svg') center/100% 100% no-repeat;filter:drop-shadow(0 0 9px #a3a5ed40)}
.illustration-gallery .crystal-heading h1{position:relative;z-index:1;text-align:center;font:500 clamp(22px,3.2vw,46px)/1.2 var(--serif);letter-spacing:.15em;margin:0;color:#f1edff;text-shadow:0 0 16px #bbc5ff55}
.illustration-gallery .crystal-heading>.heading-prism{position:absolute;inset:0;margin:0;pointer-events:none;background:url('assets/gallery-nacre.svg') center/100% 100%;mask:url('assets/gallery-heading-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/gallery-heading-mask.svg') center/100% 100% no-repeat;mix-blend-mode:screen;opacity:.7}
@media(max-width:700px){.illustration-gallery .crystal-heading{height:110px;margin-bottom:28px;padding-inline:12%}.illustration-gallery .crystal-heading h1{font-size:clamp(17px,4.5vw,25px);letter-spacing:.08em}.illustration-gallery .art-entry:last-child .art-caption h2{font-size:9px}}
@media(prefers-reduced-motion:reduce){.illustration-gallery .crystal-heading>.heading-prism{background:linear-gradient(120deg,#b3eeff,#eed6ff,#fff)}}

/* Cristal unido a la navegación y entrada secuencial. */
body:has(.illustration-gallery) .topbar{z-index:10}
.illustration-gallery{padding-top:0;position:relative;z-index:1}
.illustration-gallery .crystal-heading{margin-top:-13px;margin-bottom:42px;height:clamp(120px,16vw,210px);filter:drop-shadow(0 3px 5px #0009) drop-shadow(0 0 7px #aaa0e635);animation:gallery-crystal-arrival .7s cubic-bezier(.2,.75,.25,1) 1.9s both}
.illustration-gallery .crystal-heading>.heading-prism{opacity:.34}
.illustration-gallery .crystal-heading h1{font-size:clamp(21px,2.8vw,40px);animation:gallery-title-arrival .4s ease-out 2.35s both}
.illustration-gallery .crystal-heading::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 42%,#cbefff88 47%,white 50%,#eedbff88 53%,transparent 58%);background-size:300% 100%;mask:url('assets/gallery-heading-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/gallery-heading-mask.svg') center/100% 100% no-repeat;mix-blend-mode:screen;opacity:0;animation:gallery-crystal-flash .38s linear 2.65s both}
@keyframes gallery-crystal-arrival{from{opacity:0;transform:translateY(-65px)}to{opacity:1;transform:translateY(0)}}
@keyframes gallery-title-arrival{from{opacity:0}to{opacity:1}}
@keyframes gallery-crystal-flash{0%{background-position:100% 0;opacity:0}18%{opacity:1}80%{opacity:1}100%{background-position:0% 0;opacity:0}}
@media(max-width:700px){.illustration-gallery{padding-top:0}.illustration-gallery .crystal-heading{height:115px;margin-top:-9px;margin-bottom:30px}.illustration-gallery .crystal-heading h1{font-size:clamp(17px,4.5vw,25px)}}
@media(prefers-reduced-motion:reduce){.illustration-gallery .crystal-heading,.illustration-gallery .crystal-heading h1{animation:none}.illustration-gallery .crystal-heading::after{animation:none;display:none}}

/* Unión continua con la navegación y luz de borde tornasol. */
.illustration-gallery .crystal-heading{margin-top:0;filter:drop-shadow(0 0 2px #b7f0ff99) drop-shadow(-2px 1px 5px #9cbcff40) drop-shadow(2px 2px 5px #efb3ed40)}
body:has(.illustration-gallery){overflow-x:clip}
.illustration-gallery .art-entry{--entrance-side:-110vw;animation:art-side-arrival .8s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(3.05s + var(--entry-order,0)*.18s)}
.illustration-gallery .art-entry:nth-child(even){--entrance-side:110vw}
.illustration-gallery .art-entry:nth-child(1){--entry-order:0}
.illustration-gallery .art-entry:nth-child(2){--entry-order:1}
.illustration-gallery .art-entry:nth-child(3){--entry-order:2}
.illustration-gallery .art-entry:nth-child(4){--entry-order:3}
.illustration-gallery .art-entry:nth-child(5){--entry-order:4}
.illustration-gallery .art-entry:nth-child(6){--entry-order:5}
.illustration-gallery .art-entry:nth-child(7){--entry-order:6}
.illustration-gallery .art-entry:nth-child(8){--entry-order:7}
@keyframes art-side-arrival{from{opacity:0;transform:translateX(var(--entrance-side))}to{opacity:1;transform:translateX(0)}}
@media(max-width:700px){.illustration-gallery .crystal-heading{margin-top:0}}
@media(prefers-reduced-motion:reduce){.illustration-gallery .art-entry{animation:none}}

/* Triángulo suspendido del borde y respuesta suave de cada obra. */
.illustration-gallery .crystal-heading{padding-bottom:5%}
.illustration-gallery .art-open .art-frame{transform-origin:center;transition:transform .32s cubic-bezier(.2,.75,.25,1),filter .32s ease}
.illustration-gallery .art-open:focus-visible .art-frame{transform:scale(1.025);filter:brightness(1.06) drop-shadow(0 0 6px #d4f5ff99) drop-shadow(0 0 15px #b48ae766)}
@media(hover:hover){.illustration-gallery .art-open:hover .art-frame{transform:scale(1.025);filter:brightness(1.06) drop-shadow(0 0 6px #d4f5ff99) drop-shadow(0 0 15px #b48ae766)}}
@media(prefers-reduced-motion:reduce){.illustration-gallery .art-open .art-frame{transition:none}.illustration-gallery .art-open:hover .art-frame,.illustration-gallery .art-open:focus-visible .art-frame{transform:none}}

/* Secuencia más ágil: navegación, cristal y después las obras. */
.illustration-gallery .crystal-heading{animation-duration:.5s;animation-delay:1.35s}
.illustration-gallery .crystal-heading h1{font-size:clamp(17px,2.35vw,34px);letter-spacing:.08em;animation-duration:.25s;animation-delay:1.65s}
.illustration-gallery .crystal-heading::after{animation-duration:.24s;animation-delay:1.85s}
.illustration-gallery .art-entry{animation-delay:calc(2.1s + var(--entry-order,0)*.16s)}
@media(max-width:700px){.illustration-gallery .crystal-heading h1{font-size:clamp(13px,3.3vw,22px);letter-spacing:.04em}}
.anime-pending{text-align:center;color:#b9b4d0;padding:45px 20px 100px;font-size:15px;animation:gallery-title-arrival .5s ease 2.1s both}
@media(prefers-reduced-motion:reduce){.anime-pending{animation:none}}

/* Encuadres de la galería anime, sin alterar los originales. */
.illustration-gallery .art-surface .anime-art-01{width:100%;height:auto;left:0;top:-12%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-02{width:100%;height:auto;left:0;top:-70%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-03{width:100%;height:auto;left:0;top:-16%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-04{width:100%;height:auto;left:0;top:-72%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-05{width:100%;height:auto;left:0;top:-145%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-06{width:100%;height:auto;left:0;top:-15%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .anime-art-07{width:100%;height:auto;left:0;top:-115%;object-fit:initial;transform:none}

/* Nuevas obras: Kary e ilustraciones personales. */
.illustration-gallery .art-surface .anime-08-new{width:100%;height:auto;left:0;top:-60%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .ilustracion-09-new{width:100%;height:auto;left:0;top:-90%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .ilustracion-10-new{width:100%;height:auto;left:0;top:-115%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .ilustracion-11-new{width:100%;height:auto;left:0;top:-22%;object-fit:initial;transform:none}
.illustration-gallery .art-surface .ilustracion-12-new{width:100%;height:auto;left:0;top:-155%;object-fit:initial;transform:none}

/* Segunda vista: obra completa sin marco y tamaño original opcional. */
.viewer-stage .art-surface img{cursor:zoom-in}
.viewer-stage .art-surface img:focus-visible{outline:2px solid #d9c1ff;outline-offset:-3px}
.art-solo[hidden]{display:none}
.art-solo{position:fixed;inset:0;z-index:50;background:#000;color:#fff;width:100%;height:100%;overflow:hidden}
.solo-scroll{position:absolute;inset:0;overflow:auto;display:grid;place-items:center}
.solo-scroll img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.solo-tools{position:absolute;right:18px;top:16px;z-index:2;display:flex;gap:8px;opacity:.25;transition:opacity .2s}
.art-solo:hover .solo-tools,.solo-tools:focus-within{opacity:1}
.solo-tools button{font:500 13px var(--sans);border:1px solid #c5b7e966;background:#11101ddd;color:white;border-radius:24px;padding:10px 16px;cursor:pointer}
.solo-tools button:focus-visible{outline:2px solid #c3ecff;outline-offset:3px}
.at-original-size .solo-scroll{display:block}
.at-original-size .solo-scroll img{width:var(--original-width);height:var(--original-height);max-width:none;max-height:none;object-fit:contain;margin:auto}
@media(hover:none){.solo-tools{opacity:1}}

/* Ajustes de lectura y encuadres: rostros completos dentro de las diagonales. */
.illustration-gallery .art-surface .portrait-03{top:-10%}
.illustration-gallery .art-surface .portrait-05{top:-12%}
.illustration-gallery .art-surface .portrait-08{top:-96%}
.illustration-gallery .art-surface .anime-art-05{top:-172%}
.illustration-gallery .art-surface .anime-art-07{top:-143%}
.illustration-gallery .art-surface .anime-art-06{top:-8%}
.illustration-gallery .art-open .art-frame{filter:drop-shadow(0 5px 7px #0006) drop-shadow(0 0 3px #a1bfff20)}
.illustration-gallery .art-rim{filter:brightness(.94);transition:filter .3s ease}
.illustration-gallery .art-open:focus-visible .art-rim{filter:brightness(1.12)}
@media(hover:hover){.illustration-gallery .art-open:hover .art-rim{filter:brightness(1.12)}}
/* En pantallas pequeñas el texto pasa debajo: sin encajarlo en el triángulo. */
@media(max-width:760px){
  .illustration-gallery{padding-inline:5%}
  .illustration-gallery .art-grid{gap:36px}
  .illustration-gallery .art-entry .art-caption,
  .illustration-gallery .art-entry:nth-child(even) .art-caption{position:relative;inset:auto;width:auto;margin:16px 5% 0;padding:0 0 0 13px;text-align:left;border-right:0;border-left:1px solid #b9a4e660}
  .illustration-gallery .art-entry .art-caption h2,
  .illustration-gallery .art-entry:last-child .art-caption h2{font-size:18px;line-height:1.35;margin:6px 0;overflow-wrap:anywhere}
  .illustration-gallery .art-entry .art-caption p{font-size:13px;line-height:1.6;margin:0;color:#c0bed1}
  .illustration-gallery .art-entry .art-caption .art-index{display:block;font-size:10px;letter-spacing:.1em}
}
@media(prefers-reduced-motion:reduce){.illustration-gallery .art-rim{transition:none}}

/* Títulos con separación clara y distribución equilibrada. */
.illustration-gallery .crystal-heading .gallery-title-spaced{display:flex;justify-content:space-between;align-items:center;gap:1.25em;width:min(100%,780px);text-align:justify;font-size:clamp(16px,2.1vw,31px);letter-spacing:.07em}
.gallery-title-spaced span{white-space:nowrap}
@media(max-width:700px){.illustration-gallery .crystal-heading .gallery-title-spaced{width:100%;gap:.7em;font-size:clamp(10px,2.8vw,18px);letter-spacing:.025em}}
/* Títulos centrados con un espaciado natural y uniforme. */
.illustration-gallery .crystal-heading .gallery-title-spaced{display:block;width:auto;max-width:100%;font:500 clamp(16px,2.15vw,31px)/1.3 var(--serif);text-align:center;letter-spacing:.075em;word-spacing:.12em;color:#e8e1f5;text-wrap:balance;margin:0;gap:0;text-shadow:0 2px 12px #0a081c66}
@media(max-width:700px){.illustration-gallery .crystal-heading .gallery-title-spaced{width:auto;font-size:clamp(11px,2.85vw,20px);letter-spacing:.04em;word-spacing:.08em}}

/* Creation videos are enabled exclusively by semi-process.js. */
.process-toggle{position:absolute;right:28px;top:74px;z-index:11;display:flex;align-items:center;gap:9px;padding:11px 15px;border:1px solid #b9b4dc88;border-radius:8px;background:#101627;color:#e3dcf4;cursor:pointer;transition:box-shadow .25s,background .25s}
.process-toggle[hidden],.art-process[hidden]{display:none}
.process-toggle svg{width:27px;height:27px}.process-toggle:hover,.process-toggle:focus-visible{background:#24233b;box-shadow:0 0 18px #b5a0ee44;outline:2px solid #c5ecff}
.art-viewer.with-process .viewer-stage{width:54%;transition:width .45s ease}
.art-process{position:absolute;right:3%;top:50%;transform:translateY(-50%);width:40%;padding:22px;background:linear-gradient(135deg,#121b2b,#101020);border:1px solid #c5c4eb99;border-radius:12px;box-shadow:0 0 22px #a8b2ed22;animation:process-reveal .45s ease both}
.art-process h2{font:normal 23px Georgia,serif;color:#e0d3ef;margin:0 0 18px}.art-process iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:5px;background:#03050a}.art-process a{display:inline-block;margin-top:15px;color:#c4ddf1;font-size:12px}
@keyframes process-reveal{from{opacity:0;translate:25px 0}to{opacity:1;translate:0 0}}
@media(max-width:850px){.art-viewer.with-process{overflow-y:auto}.art-viewer.with-process .viewer-stage{width:100%;height:65vh}.art-process{position:relative;right:auto;top:auto;transform:none;width:min(100%,600px);margin:18px auto 45px;box-sizing:border-box}.process-toggle{right:18px;top:65px}.art-process h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){.art-process{animation:none}.art-viewer.with-process .viewer-stage{transition:none}}
.process-preview{position:relative;display:block!important;aspect-ratio:16/9;overflow:hidden;border-radius:5px;background:#03050a;margin:0!important}.process-preview img{width:100%;height:100%;object-fit:cover;opacity:.8}.process-preview span{position:absolute;inset:0;display:grid;place-content:center;color:white;font-size:16px;text-shadow:0 2px 8px #000;background:#0002}.process-local-note{font-size:12px;line-height:1.6;color:#bfc3d8}
/* Simple, generous artwork viewer shared by anime and semirealism. */
.art-viewer{padding:65px 24px 35px}.viewer-stage .art-frame{max-width:100%;background:none;border:0;border-radius:5px;box-shadow:none;filter:none}.viewer-stage .art-frame:before,.viewer-stage .art-frame:after,.viewer-stage .art-rim,.viewer-stage .art-gem{display:none!important}.viewer-stage .art-surface{inset:0;clip-path:none;border-radius:4px;background:transparent;overflow:hidden}.viewer-stage .art-surface:before,.viewer-stage .art-surface:after{display:none!important}.viewer-stage .art-surface img{width:var(--art-width);height:var(--art-height);object-fit:contain;filter:none}.viewer-close{border-radius:6px;background:#171b2b}.viewer-note{font-size:11px}
/* Refined crystal finish, preserving both existing panoramic silhouettes. */
.illustration-gallery .art-rim{background:#cbddef url('assets/gallery-crystal-refined.svg') center/100% 100% no-repeat;filter:brightness(1.02) saturate(.8);transition:filter .45s ease}
.illustration-gallery .art-rim:after{background:linear-gradient(110deg,transparent 34%,#fff0 42%,#ffffffbb 49%,#d9f7ff55 52%,transparent 60%);background-size:300% 100%;mix-blend-mode:screen;opacity:.5;animation:refined-crystal-sheen 11s ease-in-out infinite}
.illustration-gallery .art-frame::after{filter:drop-shadow(0 1px 1px #05091c99) drop-shadow(0 0 2px #e4eeff33)}
.illustration-gallery .art-open:hover .art-rim,.illustration-gallery .art-open:focus-visible .art-rim{filter:brightness(1.12) saturate(.95)}
@keyframes refined-crystal-sheen{0%,30%{background-position:100% 0}65%,100%{background-position:0% 0}}
@media(prefers-reduced-motion:reduce){.illustration-gallery .art-rim:after{animation:none}}

.semi-gallery-page .illustration-gallery .art-entry:nth-child(even) .art-frame::after{background-image:url("assets/gallery-panorama-ribbon-semi.svg")}

/* Recortes ligeros proporcionados para la galería; el visor conserva la obra completa. */
.illustration-gallery .art-grid .art-surface img.gallery-preview{left:3.94%;top:14.55%;width:92.12%;height:70.9%;object-fit:cover;object-position:center;transform:none}
