/* The folder behaves like a file being read by a CRT, then resolves into the
   approved About page without altering its artwork. */
#about-stage,#contact-stage{position:fixed;inset:0;z-index:45;display:none;overflow:hidden;isolation:isolate;background:transparent;pointer-events:none}
#about-stage[data-open="true"],#contact-stage[data-open="true"]{pointer-events:auto}
#about-page,#contact-page{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#e7e4f4;opacity:0;clip-path:inset(49.6% 0 49.6% 0);filter:brightness(1.35) contrast(1.14) saturate(1.22);transform-origin:50% 50%;will-change:opacity,transform,clip-path,filter;user-select:none}
#about-folder-flight,#contact-folder-flight{position:fixed;z-index:3;width:1px;height:1px;visibility:hidden;transform-origin:0 0;pointer-events:none;will-change:transform,opacity}
#about-folder-flight>img,#contact-folder-flight>img{display:block;width:100%;height:100%;filter:drop-shadow(0 18px 16px #24155c38);user-select:none}
.about-flight-label,.contact-flight-label{position:absolute;left:15%;right:10%;top:15%;display:flex;align-items:center;gap:3%;color:#251078;font-family:'Segoe UI','Microsoft YaHei',sans-serif;white-space:nowrap}
.about-flight-label>span,.contact-flight-label>span{font:clamp(28px,min(3.5vw,6vh),64px)/1 Arial,sans-serif;letter-spacing:-.04em}
.about-flight-label strong,.contact-flight-label strong{font-size:clamp(18px,min(1.85vw,3.3vh),36px);font-weight:650;letter-spacing:.04em}
.about-flight-label small,.contact-flight-label small{position:absolute;left:12%;top:110%;font:clamp(12px,min(1.2vw,2.2vh),24px)/1.1 Consolas,monospace}
#about-flash,#contact-flash{position:absolute;inset:0;z-index:4;opacity:0;pointer-events:none;background:radial-gradient(ellipse at center,#ffffffea 0 14%,#d9ceffb8 37%,#6548f52b 68%,transparent)}
#about-scanline,#contact-scanline{position:absolute;left:50%;top:50%;z-index:4;width:min(92vw,1680px);height:3px;opacity:0;transform:translate(-50%,-50%) scaleX(0) scaleY(1);transform-origin:center;background:linear-gradient(90deg,transparent 0,#7c61ff 10%,#f8f6ff 38%,#fff 50%,#f8f6ff 62%,#7c61ff 90%,transparent 100%);box-shadow:0 0 8px #fff,0 0 28px #9d8bff,0 0 72px #774dff;mix-blend-mode:screen;will-change:transform,opacity}
#about-tools,#contact-tools{position:absolute;left:50%;bottom:23px;z-index:5;display:flex;gap:9px;align-items:center;translate:-50% 0;color:#29205b;font:12px/1 'Segoe UI','Microsoft YaHei',sans-serif;white-space:nowrap;opacity:0;pointer-events:none}
#about-tools button,#contact-tools button{position:relative;min-height:38px;padding:0 17px 0 35px;border:1px solid #d7d0ffca;border-radius:999px;background:linear-gradient(135deg,#4a338e,#26215f);box-shadow:0 6px 16px #2b165b42,0 1px 0 #ffffff54 inset;color:#fff;font:600 13px/1 'Segoe UI','Microsoft YaHei',sans-serif;letter-spacing:.04em;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
#about-tools button::before,#contact-tools button::before{content:'←';position:absolute;left:15px;top:50%;translate:0 -51%;font:700 17px/1 Arial,sans-serif;color:#e5dfff}
#about-tools button:hover,#contact-tools button:hover{transform:translateY(-2px);filter:brightness(1.12);box-shadow:0 9px 20px #2b165b50,0 1px 0 #ffffff70 inset}
#about-tools button:focus-visible,#contact-tools button:focus-visible{outline:2px solid #fff;outline-offset:3px}
#about-tools>span,#contact-tools>span{display:grid;place-items:center;min-width:29px;min-height:22px;padding:0 6px;border:1px solid #45327a50;border-radius:5px;background:#f5f1ffab;box-shadow:0 1px 0 #fff inset;color:#35246a;font:600 10px/1 Consolas,monospace}
#about-stage[data-open="true"] #about-tools,#contact-stage[data-open="true"] #contact-tools{pointer-events:auto}
@media(max-width:700px){
 #about-page,#contact-page{object-fit:contain;background:#e7e4f4}
 #about-tools,#contact-tools{bottom:17px;gap:6px;max-width:94vw}
 #about-tools button,#contact-tools button{min-height:35px;padding-right:14px;padding-left:31px;font-size:12px}
 #about-tools button::before,#contact-tools button::before{left:13px;font-size:16px}
}
@media(prefers-reduced-motion:reduce){#about-flash,#about-scanline,#contact-flash,#contact-scanline{display:none}}

/* Hinged front / paper / rear planes. The supplied page stays the same element
   throughout extraction and expansion; there is no flash or image swap. */
#about-page,#contact-page{z-index:2;clip-path:none;filter:none;transform-origin:0 0;will-change:transform,opacity;border-radius:12px}
.folder-flight-rear{position:absolute;left:0;top:0;z-index:1;width:1px;height:1px;object-fit:fill;transform-origin:0 0;visibility:hidden;pointer-events:none;clip-path:inset(14% 8% 9% 8% round 24px);filter:brightness(.90);will-change:transform,opacity}
#about-folder-flight,#contact-folder-flight{left:0;top:0;transform-origin:50% 90%;will-change:transform,opacity;backface-visibility:hidden}
#about-folder-flight>img,#contact-folder-flight>img{clip-path:url(#folder-front-cut);filter:none}
#about-flash,#contact-flash,#about-scanline,#contact-scanline{display:none}
@media(prefers-reduced-motion:reduce){#about-tools button,#contact-tools button{transition:none}}