:root{--paper:#f2efe8;--ink:#0b0b0a;--accent:#ff4f24;--line:rgba(255,255,255,.34);--pad:clamp(20px,4.2vw,68px)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#11110f;color:#fff;font-family:"Helvetica Neue",-apple-system,BlinkMacSystemFont,"Noto Sans TC",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
#frame-hero{min-height:100svh;background:#11110f}
.fh-stage{position:relative;height:100svh;min-height:640px;overflow:hidden;isolation:isolate;touch-action:pan-y;cursor:ew-resize;background:#181715}
.fh-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fh-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,4,.78) 0%,rgba(5,5,4,.54) 30%,rgba(5,5,4,.08) 60%,rgba(5,5,4,.2) 100%),linear-gradient(0deg,rgba(5,5,4,.52),transparent 44%)}
.fh-nav{position:absolute;z-index:4;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px var(--pad);font-weight:800;letter-spacing:.11em;font-size:12px}
.fh-brand{font-size:20px;letter-spacing:.04em}.fh-brand small{font-size:9px;letter-spacing:.2em}.fh-nav nav{display:flex;align-items:center;gap:32px}.fh-nav nav a{min-height:44px;display:flex;align-items:center;border-bottom:1px solid transparent}.fh-nav nav a:hover,.fh-nav nav a:focus-visible{border-color:#fff}
.fh-copy{position:absolute;z-index:3;left:var(--pad);bottom:clamp(118px,14vh,160px);width:min(650px,48vw)}
.fh-eyebrow{margin:0 0 18px;font-size:10px;font-weight:850;letter-spacing:.28em;color:rgba(255,255,255,.72)}
.fh-copy h1{margin:0;font-size:clamp(54px,7vw,112px);line-height:.88;letter-spacing:-.07em;font-weight:900;text-wrap:balance}.fh-copy h1 em{font-style:normal;color:#fff}
.fh-lead{max-width:500px;margin:24px 0 0;font-size:clamp(15px,1.2vw,18px);line-height:1.58;color:rgba(255,255,255,.82)}
.fh-actions{display:flex;align-items:center;gap:28px;margin-top:34px;font-size:13px;font-weight:800}.fh-actions a{min-height:48px;display:inline-flex;align-items:center;gap:16px;border-bottom:1px solid rgba(255,255,255,.72)}.fh-actions .fh-primary{padding:0 20px;background:#fff;color:#0b0b0a;border:0}.fh-actions a:hover,.fh-actions a:focus-visible{outline:2px solid #fff;outline-offset:4px}
.fh-interaction{position:absolute;z-index:4;right:var(--pad);bottom:38px;width:min(360px,34vw)}.fh-interaction p{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:10px;font-weight:800;letter-spacing:.17em;color:rgba(255,255,255,.8)}.fh-pointer{width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 5px rgba(255,79,36,.14)}.fh-interaction input{width:100%;height:44px;margin:0;accent-color:var(--accent);cursor:ew-resize}
#frame-hero[data-phase=loading] .fh-stage::after,#frame-hero[data-phase=error] .fh-stage::after{position:absolute;z-index:5;right:var(--pad);top:92px;font-size:10px;letter-spacing:.16em;color:rgba(255,255,255,.7)}#frame-hero[data-phase=loading] .fh-stage::after{content:"LOADING FRAMES"}#frame-hero[data-phase=error] .fh-stage::after{content:"STATIC FALLBACK"}
#frame-hero-keyframes{display:none}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:720px){
 .fh-stage{min-height:700px;cursor:default}.fh-stage canvas{height:68%;top:0}.fh-shade{background:linear-gradient(180deg,rgba(5,5,4,.05) 0%,rgba(5,5,4,.08) 34%,rgba(5,5,4,.94) 68%,#11110f 100%)}
 .fh-nav{padding:20px}.fh-brand{font-size:18px}.fh-nav nav{gap:18px}.fh-nav nav a:first-child{display:none}
 .fh-copy{left:20px;right:20px;bottom:126px;width:auto}.fh-eyebrow{margin-bottom:12px}.fh-copy h1{font-size:clamp(46px,13vw,62px);line-height:.91}.fh-lead{font-size:15px;line-height:1.5;margin-top:18px}.fh-actions{gap:18px;margin-top:24px}.fh-actions a{font-size:12px}.fh-actions .fh-primary{padding:0 16px}
 .fh-interaction{left:20px;right:20px;bottom:24px;width:auto}.fh-interaction p{justify-content:space-between}.fh-interaction input{height:48px}
}
@media(prefers-reduced-motion:reduce){
 .fh-stage{cursor:default}.fh-interaction{display:none}.fh-pointer{display:none}
 #frame-hero-keyframes{display:none}
}