.crystal-perspective { display:none; }
html[data-theme="crystal"].crystal-parallax-ready .hero {
 background:linear-gradient(180deg,#ecf1f7,#e4edf9 45%,#cbdcf4 85%,#d5e3f7) !important;
}
html[data-theme="crystal"].crystal-parallax-ready .hero-scene { display:none !important; }
html[data-theme="crystal"].crystal-parallax-ready .hero-inner {
 display:grid;grid-template-columns:39% 61%;gap:0;width:100%;max-width:none;
 padding:110px 2.3vw 14px 2.8vw;height:100%;min-height:0;align-items:center;
}
html[data-theme="crystal"].crystal-parallax-ready .hero-copy { width:100%;max-width:none;position:relative;z-index:2; }
html[data-theme="crystal"].crystal-parallax-ready .original-hero { display:none !important; }
html[data-theme="crystal"] .crystal-perspective {
 display:block;position:relative;width:100%;height:100%;min-height:0;overflow:hidden;touch-action:pan-y;
 mask-image:linear-gradient(to right,transparent,#000 5%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 95%,transparent);
 mask-composite:intersect;
}
.crystal-perspective canvas { display:block;width:100%;height:100%; }
@media(max-width:900px) {
 html[data-theme="crystal"].crystal-parallax-ready .hero { height:auto;min-height:100svh;display:block;padding:0; }
 html[data-theme="crystal"].crystal-parallax-ready .hero-inner { display:flex;flex-direction:column;height:auto;gap:24px;padding:110px 22px 8px; }
 html[data-theme="crystal"].crystal-parallax-ready .hero-copy { text-align:center;flex:none; }
 html[data-theme="crystal"].crystal-parallax-ready .hero-actions { justify-content:center; }
 html[data-theme="crystal"] .crystal-perspective { height:clamp(280px,68vw,540px);flex:none; }
 html[data-theme="crystal"] .trust-strip { position:relative;inset:auto;min-height:88px;height:88px;margin-top:10px; }
}
@media(min-width:901px) and (max-height:650px) {
 html[data-theme="crystal"].crystal-parallax-ready .hero { min-height:650px; }
}
.crystal-perspective .crystal-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% 50%;}
.crystal-perspective .crystal-realtime{position:absolute;inset:0;width:100%;height:100%;}
.crystal-poster-canvas{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
html[data-theme="crystal"].crystal-parallax-ready .crystal-poster-canvas{display:block;}
html[data-theme="crystal"].crystal-parallax-ready .trust-strip{z-index:2;}
.crystal-baked-canvas{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
html[data-theme="crystal"].crystal-baked-ready .crystal-baked-canvas{display:block;}
html[data-theme="crystal"].crystal-baked-ready .crystal-poster-canvas{visibility:hidden;}

/* Blue portfolio: direct section shortcuts and enlarged introduction. */
@font-face { font-family:"Portfolio Blue Chinese"; src:url("assets/portfolio-blue-zh.woff2") format("woff2"); font-weight:100 900; font-display:swap; }
html[data-theme="crystal"] { --font-cjk:"Portfolio Blue Chinese"; }
html[data-theme="crystal"] #nav-items { display:flex; gap:clamp(18px,1.5vw,30px); position:absolute; left:calc(50vw - 16px); top:50%; transform:translate(-50%,-50%); width:max-content; margin:0; }
html[data-theme="crystal"] :is(#skin-toggle,#skin-options) { display:none!important; }
html[data-theme="crystal"] .nav-actions .button-plain { display:none; }
html[data-theme="crystal"] .nav-actions { padding:0 12px; gap:20px; }
html[data-theme="crystal"] .nav-actions::before { content:none; }
html[data-theme="crystal"] .nav-actions .nav-cube-stage { width:42px; height:42px; }
html[data-theme="crystal"] .nav-actions .cube-object { --cube-size:25px; --cube-depth:12.5px; }
html[data-theme="crystal"] .nav-actions .button-black { font-family:var(--sans); font-size:14px; }
html[data-theme="crystal"] .nav-main .skin-switcher { margin-left:auto; margin-right:0; }
html[data-theme="crystal"] #hero-cube-stage { cursor:pointer; }
html[data-theme="crystal"] .menu-button { display:none; }
html[data-theme="crystal"] .nav-overlay { display:none!important; }
html[data-theme="crystal"] .nav-dropdown { box-shadow:0 20px 60px #172f6726; }
html[data-theme="crystal"] .nav-direct { display:inline-flex; align-items:center; justify-content:center; text-align:center; font-size:14px; font-weight:500; line-height:1.4; min-height:42px; padding:10px 14px; border-radius:6px; transition:background .2s,color .2s,box-shadow .2s; }
html[data-theme="crystal"] .nav-direct:is(:hover,:focus-visible,[aria-expanded="true"]) { color:#fff; background:#2148ef; box-shadow:inset 0 -3px #7bc9f5; }
html[data-theme="crystal"] .hero h1 { font-size:clamp(46.2px,4.73vw,72.6px); }
html[data-theme="crystal"] .hero-copy::before { font-size:12.1px; margin-bottom:26.4px; }
html[data-theme="crystal"] .hero-copy>p { font-size:23.1px; margin-top:30.8px; }
html[data-theme="crystal"] .hero-actions { gap:13.2px; margin-top:35.2px; }
html[data-theme="crystal"] .hero-actions .button { min-height:52.8px; padding:14.3px 27.5px; font-family:var(--sans); font-size:14.3px; font-weight:500; border-radius:30.8px; }
html[data-theme="crystal"] .hero-actions>a:last-of-type { display:none; }
html[data-theme="crystal"] .hero-actions { position:relative; width:max-content; }
html[data-theme="crystal"] [data-resume] { cursor:default; }
html[data-theme="crystal"] [data-resume]:active { transform:none; }
html[data-theme="crystal"].crystal-parallax-ready .hero-inner { grid-template-columns:42% 58%; }
.works-heading { display:none; }
html[data-theme="crystal"] .footer-top>a::after { content:none; }
html[data-theme="crystal"] .works-heading { display:block; }
html[data-theme="crystal"] .works-heading .mono { display:block; color:#1c4de7; font-size:12px; letter-spacing:.1em; }
html[data-theme="crystal"] .works-heading h2 { margin-top:22px; font-size:clamp(30px,3vw,44px); }

/* Shared personal-profile panel and footer contact block. */
html[data-theme="crystal"] .nav-dropdown.profile-menu { grid-template-columns:minmax(0,2.1fr) minmax(270px,1fr); gap:36px; padding:32px 40px; }
.profile-resume-main { display:grid; grid-template-columns:minmax(0,1fr) 112px; gap:28px 32px; }
html[data-theme="crystal"] .profile-menu h3 { font-family:var(--sans); color:#1a2d50; font-size:14px; font-weight:500; margin:0 0 18px; }
.profile-overview>p { color:#5d6b83; font-size:clamp(18px,1.6vw,24px); line-height:1.7; font-weight:400; }
.profile-services ul { list-style:none; padding:0; margin:0; }
.profile-services li { font-size:14px; color:#5d6b83; padding:15px 0; border-bottom:1px solid #e7edf7; }
.profile-services li:first-child { padding-top:3px; }
.profile-experience { grid-column:1/-1; }
.profile-experience table { width:100%; border-collapse:collapse; font-size:13px; line-height:1.6; }
.profile-experience th { text-align:left; font-weight:400; width:39%; color:#273c60; }
.profile-experience :is(th,td) { padding:16px 8px 16px 0; border-bottom:1px solid #e6edf8; vertical-align:middle; }
.profile-experience td { color:#6d7a90; }
.profile-experience td:last-child { text-align:right; padding-right:0; white-space:nowrap; font-size:12px; }
.profile-blue-card { position:relative; isolation:isolate; overflow:hidden; border-radius:6px; padding:26px; background:linear-gradient(145deg,#edf7ff,#dce9ff); color:#173d85; display:flex; flex-direction:column; justify-content:space-between; gap:32px; border:1px solid #d4e6ff; }
.profile-blue-card::after { content:""; position:absolute; width:240px; height:240px; right:-85px; bottom:-95px; border:34px solid #ffffff60; border-radius:50%; z-index:-1; }
.profile-card-eyebrow { font:500 10px/1.5 var(--mono); letter-spacing:.08em; color:#6384b7; }
.profile-card-message h2 { font-size:clamp(26px,2.25vw,38px); line-height:1.35; letter-spacing:-.02em; color:#173d85; }
.profile-card-message p { margin-top:18px; color:#657fa9; font-size:14px; line-height:1.8; }
.profile-card-bottom { display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:20px; border-top:1px solid #c4d9f8; padding-top:22px; }
.profile-card-years { font-family:var(--sans); font-size:48px; line-height:1; color:#2148ef; }
.profile-card-years>span { font-size:24px; vertical-align:top; }
.profile-card-years small { display:block; font-size:11px; margin-top:10px; color:#657fa9; }
.profile-card-tags { display:flex; flex-direction:column; gap:7px; font-size:11px; color:#416197; }
.footer-contact,.portfolio-copyright { display:none; }
html[data-theme="crystal"] .footer-bottom { grid-template-columns:minmax(0,1fr) minmax(280px,auto); align-items:end; gap:32px; margin-top:18px; }
html[data-theme="crystal"] .footer-bottom>:is(.footer-legal,.social-links,p:first-child) { display:none; }
html[data-theme="crystal"] .footer-bottom .portfolio-copyright { display:block; margin:0; font-size:11px; }
html[data-theme="crystal"] .footer-bottom .footer-contact { display:flex; align-items:center; gap:32px; color:#233d68; }
.footer-contact-heading { display:none; font-size:14px; white-space:nowrap; }
html[data-theme="crystal"] .footer-contact-heading { display:block; margin-top:28px; text-align:right; color:#233d68; }
.footer-contact-row { display:flex; align-items:center; gap:32px; }
.footer-contact .footer-contact-item { display:inline-flex; align-items:center; gap:12px; padding:0; white-space:nowrap; font-weight:500; font-size:18px; line-height:1.4; color:inherit; }
.footer-contact strong { font-weight:500; }
.footer-contact .contact-icon { width:24px; height:24px; flex:none; color:inherit; }
.footer-contact a:hover { color:#2148ef; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:991px) {
 html[data-theme="crystal"] .nav-dropdown.profile-menu { gap:24px; padding:24px; grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr); }
 .profile-resume-main { grid-template-columns:minmax(0,1fr); gap:24px; }
 .profile-services ul { display:flex; gap:20px; }
 .profile-services li { padding:0; border:0; }
 .profile-services li:first-child { padding:0; }
 .profile-experience { grid-column:auto; }
 .profile-experience :is(th,td) { font-size:12px; }
}
@media(max-width:767px) {
 html[data-theme="crystal"] .nav-dropdown.profile-menu { top:calc(100% + 8px); grid-template-columns:minmax(0,1fr); max-height:calc(100dvh - 140px); }
 .profile-overview>p { font-size:17px; }
 .profile-experience th { width:38%; }
 .profile-experience :is(th,td) { font-size:11px; padding-block:12px; }
 .profile-experience td:last-child { font-size:10px; white-space:normal; }
 .profile-blue-card { gap:24px; padding:24px; }
 .profile-card-message h2 { font-size:28px; }
 .profile-card-message h2 br { display:none; }
 .profile-card-tags { flex-direction:row; flex-wrap:wrap; }
 html[data-theme="crystal"] .footer-bottom { grid-template-columns:1fr; gap:24px; }
 html[data-theme="crystal"] .footer-bottom .portfolio-copyright { order:2; }
 html[data-theme="crystal"] .footer-bottom .footer-contact { flex-wrap:wrap; gap:18px; }
 .footer-contact-row { gap:18px; }
 .footer-contact .footer-contact-item { font-size:14px; gap:8px; }
 .footer-contact .contact-icon { width:20px; height:20px; }
}
@media(max-width:1199px) {
 html[data-theme="crystal"] .nav-actions { display:flex; }
 html[data-theme="crystal"] .nav-main { flex-wrap:wrap; height:auto; min-width:0; padding:10px 16px; gap:6px 16px; }
 html[data-theme="crystal"] #nav-items { position:static; transform:none; order:3; width:100%; margin:0; overflow-x:auto; gap:26px; scrollbar-width:none; justify-content:safe center; }
 html[data-theme="crystal"] #nav-items::-webkit-scrollbar { display:none; }
 html[data-theme="crystal"] .nav-direct { padding:9px 14px; font-size:13px; flex:none; }
 html[data-theme="crystal"] .hero-inner { padding-top:132px!important; }
 html[data-theme="crystal"] { scroll-padding-top:140px; }
}
@media(max-width:767px) {
 html[data-theme="crystal"] .nav-actions { gap:4px; padding:0 8px; }
 html[data-theme="crystal"] .nav-actions .nav-cube-stage { width:28px; }
 html[data-theme="crystal"] .nav-actions .cube-object { --cube-size:20px; --cube-depth:10px; }
 html[data-theme="crystal"] .nav-actions .button-black { padding:8px 10px; font-size:12px; }
 html[data-theme="crystal"] .hero h1 { font-size:clamp(33px,9.02vw,47.3px); }
 html[data-theme="crystal"] .hero-copy::before { font-size:9.9px; margin-bottom:16.5px; }
 html[data-theme="crystal"] .hero-copy>p { font-size:16.5px; margin-top:13.2px; }
 html[data-theme="crystal"] .hero-actions { margin-top:19.8px; }
 html[data-theme="crystal"] .hero-actions { margin-inline:auto; }
 html[data-theme="crystal"] .hero-actions .button { padding:13.2px 19.8px; min-height:48.4px; font-size:13.2px; }
}