/* Illuminated violet ASCII, a rotating scan and a restrained typographic lockup. */
#gs-light-field.gs-ascii-reel{background:#0d0a12}
#gs-light-field.gs-ascii-reel canvas{position:absolute;inset:0;width:100%;height:100%}
#gs-light-field.gs-ascii-reel .gs-ascii-canvas{z-index:0}
#gs-light-field.gs-ascii-reel canvas:not(.gs-ascii-canvas){z-index:1}
#gs-light-field.gs-ascii-reel:after{z-index:2;background:linear-gradient(180deg,#0d0a1277,transparent 110px),linear-gradient(0deg,#0d0a1277,transparent 30%)}
.gs-fullpage .gs-hero{cursor:grab}
.gs-fullpage .gs-hero:active{cursor:grabbing}
.gs-fullpage .gs-hero .hero-copy{position:absolute;left:0;right:0;bottom:1%;top:auto;width:100%;padding:0;text-align:center;pointer-events:none}
.gs-fullpage .gs-hero .hero-copy h1{height:auto!important;margin:0!important;line-height:1.3!important;font-size:clamp(30px,3.1vw,46px)!important;font-weight:300!important;letter-spacing:.04em!important;background:none!important;text-shadow:none!important}
.gs-fullpage .gs-hero .hero-copy .gs-title-fallback{display:block!important;position:static!important;transform:none!important;white-space:normal!important;font:inherit!important;line-height:inherit!important;letter-spacing:inherit!important;text-align:center!important}
.gs-hero .hero-title-lead{display:block;font-family:'Noto Sans TC',sans-serif;font-size:12px;font-weight:300;letter-spacing:.22em;color:#e8dcf2b3;margin-bottom:9px}
.gs-hero .hero-title-main{display:block;font-family:'Noto Serif TC',serif;color:#faf6ff;font-weight:400;letter-spacing:.08em}
.gs-hero .hero-title-main em{font-family:'DM Sans',sans-serif;font-style:normal;font-weight:300;letter-spacing:-.055em;margin-right:.16em}
#gs-tech-title{display:none!important}
.gs-hero .hero-demo{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:26px;min-width:156px;min-height:46px;padding:0 22px;margin-top:24px;border-radius:24px;border:1px solid #f4e8ff38;background:linear-gradient(145deg,#f5e8ff14,#f5e8ff05);box-shadow:inset 0 1px 0 #ffffff1f,0 8px 30px #00000012;backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);color:#f6f0ff;font:400 11px 'Noto Sans TC',sans-serif;letter-spacing:.12em;text-decoration:none;pointer-events:auto;transition:background .25s,border-color .25s,transform .25s}
.gs-hero .hero-demo:hover{background:#efe0ff1c;border-color:#f4e8ff66;transform:translateY(-2px)}
.gs-hero .hero-demo:focus-visible{outline:2px solid #d8baff;outline-offset:5px}
.gs-hero .hero-demo>span:last-child{font-size:17px;letter-spacing:0;font-weight:300}
#gs-light-field.webgl-unavailable:before{content:'';position:absolute;inset:18% 20% 34%;background:url('/assets/gs3d/reel/view-swagger-coverpose.webp') center/contain no-repeat;z-index:1;opacity:.8}
@media(max-width:700px){.gs-fullpage .gs-hero .hero-copy{bottom:2.5%}.gs-fullpage .gs-hero .hero-copy h1{font-size:33px!important}.gs-hero .hero-title-lead{font-size:11px;margin-bottom:10px;letter-spacing:.15em}.gs-hero .hero-demo{margin-top:21px;min-height:44px;min-width:148px}}
@media(max-height:650px){.gs-fullpage .gs-hero .hero-copy{bottom:0}.gs-fullpage .gs-hero .hero-copy h1{font-size:28px!important}.gs-hero .hero-title-lead{font-size:10px;margin-bottom:4px}.gs-hero .hero-demo{margin-top:12px;min-height:40px}.gs-hero .hero-title-main{font-size:28px}}
@media(prefers-reduced-motion:reduce){.gs-hero .hero-demo{transition:none}}

.gs-fullpage:has(.gs-page[data-page="experience"][data-active="true"]) .archive-links a{color:#f8f0ff}
/* Open title: no panel, only a restrained lavender text glow. */
#gs-light-field.gs-ascii-reel{background:#100e18}
#gs-light-field.gs-ascii-reel:after{background:linear-gradient(180deg,#160c2666,transparent 95px),linear-gradient(0deg,#100e1855,transparent 25%)}
.gs-fullpage .gs-hero .hero-copy{bottom:8%}
.gs-fullpage .gs-hero .hero-copy h1{display:block;padding:0!important;border:0;border-radius:0;box-shadow:none;background:none!important;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:clamp(30px,3.1vw,44px)!important}
.gs-hero .hero-title-lead{font-family:'Noto Sans TC',sans-serif;font-size:11px;font-weight:300;letter-spacing:.18em;color:#e9ddf3bf;margin-bottom:8px}
.gs-hero .hero-title-main{font-family:'Noto Sans TC',sans-serif;font-weight:300;letter-spacing:.055em;color:#faf7ff;text-shadow:0 0 16px #e4c9ff40,0 0 35px #a66bfa1c}
.gs-hero .hero-title-main em{font-weight:300;letter-spacing:-.04em;margin-right:.18em}
.gs-hero .hero-demo{display:flex;width:max-content;margin:17px auto 0}
@media(max-width:700px){.gs-fullpage .gs-hero .hero-copy{bottom:17%}.gs-fullpage .gs-hero .hero-copy h1{font-size:32px!important}.gs-hero .hero-title-lead{font-size:10px}.gs-hero .hero-demo{margin-top:17px}}
@media(max-height:650px){.gs-fullpage .gs-hero .hero-copy{bottom:1%}.gs-fullpage .gs-hero .hero-copy h1{font-size:25px!important}.gs-hero .hero-title-lead{margin-bottom:4px}.gs-hero .hero-demo{margin-top:10px}}

/* White particle lettering uses the current compact Hero composition. */
#gs-white-particle-title{display:block;width:min(680px,100%);height:132px;margin:0 auto;pointer-events:auto;user-select:none}
#gs-white-particle-title .particle-text{height:100%;min-height:0;touch-action:pan-y;font-family:'DM Sans','Noto Sans TC',sans-serif}
.hero-copy:has(#gs-white-particle-title [data-particles-ready="true"]) .gs-title-fallback{display:none!important}
.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy{bottom:2.5%}
.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy h1{position:relative}
.hero-copy:has(#gs-white-particle-title) .gs-title-fallback{position:absolute!important;inset:0!important;pointer-events:none;font-size:24px!important}
@media(max-width:700px){#gs-white-particle-title{height:112px;width:100%}.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy{bottom:13%}}
@media(max-height:650px){#gs-white-particle-title{height:112px}.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy{bottom:1%}}

/* Option A: flat white type, restrained weight and open spacing. */
.gs-fullpage .gs-hero .hero-copy:has([data-solid-ready="true"]) .gs-title-fallback{display:none!important}
#gs-white-particle-title{pointer-events:none;display:flex;align-items:center;justify-content:center}
.hero-solid-title{width:100%;text-align:center;line-height:1.35;font-family:'DM Sans','Noto Sans TC',sans-serif}
.hero-solid-title>span{position:relative;display:block;width:max-content;max-width:100%;margin-inline:auto;color:#faf8ff;letter-spacing:.025em;text-shadow:0 0 22px #e6d7ff12}
.hero-solid-lead{font-size:clamp(13px,1.15vw,16px);font-weight:300;letter-spacing:.22em!important;margin-bottom:15px;color:#f0eaf8!important}
.hero-solid-main{font-size:clamp(32px,3.7vw,52px);font-weight:300}
.hero-solid-title>span:after{display:none}
@media(max-width:700px){.hero-solid-lead{font-size:13px;margin-bottom:13px}.hero-solid-main{font-size:32px}}
#gs-light-field.gs-ascii-reel .gs-solid-canvas{z-index:1;pointer-events:none}
.gs-model-access,.gs-model-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.gs-model-access:focus-visible{position:fixed;left:50%;top:56%;transform:translateX(-50%);width:auto;height:auto;margin:0;padding:10px 18px;clip-path:none;z-index:30;border:1px solid #ffffff66;border-radius:24px;background:#161020e8;color:#fff;outline:2px solid #d5baff;outline-offset:4px}
.gs-model-status.is-loading{position:fixed;left:50%;top:56%;transform:translateX(-50%);width:auto;height:auto;margin:0;padding:8px 15px;clip-path:none;z-index:30;border:1px solid #ffffff22;border-radius:20px;background:#161020d9;color:#eee;font-size:11px}

/* Raise the desktop title and demo action together; retain the mobile composition. */
@media(min-width:701px){.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy{bottom:calc(2.5% + 50px)}}
@media(min-width:701px) and (max-height:650px){.gs-fullpage .gs-hero:has(#gs-white-particle-title) .hero-copy{bottom:calc(1% + 35px)}}
@media(max-width:700px){.hero-solid-main{font-size:clamp(25px,8.4vw,36px)}html[lang="en"] .hero-solid-main{font-size:clamp(20px,5.9vw,30px)}}

@media(min-width:701px){html[lang="en"] .hero-solid-main{font-size:clamp(28px,3.2vw,46px)}}
