@charset "UTF-8";
:root{--bg:#07111b;--bg-deep:#040a12;--panel:#0c1b2a;--ink:#d7e4f7;--muted:#8ea3bd;--faint:#526b87;--cyan:#59d7ff;--blue:#2f86ff;--violet:#9275ff;--pink:#dd63c7;--line:#5c89b54d;color-scheme:dark;font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 78% 10%,#153b63 0,#07111b 32rem,var(--bg-deep) 75%);color:var(--ink);line-height:1.7}a{color:inherit}button,input{font:inherit}button{color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible,#stage:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}.skip-link{position:absolute;left:1rem;top:-4rem;background:var(--cyan);color:#03101b;padding:.55rem 1rem;z-index:10}.skip-link:focus{top:1rem}.site-header{height:82px;max-width:1320px;margin:auto;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;letter-spacing:3px;color:#eaf5ff}.brand b{font:700 20px Georgia;color:var(--cyan)}.brand small{display:block;color:var(--muted);font:10px "Noto Sans TC",sans-serif;letter-spacing:2px;margin-top:2px}.site-header nav{display:flex;gap:28px}.site-header nav a{text-decoration:none;font:11px Georgia,serif;letter-spacing:3px;color:var(--muted);transition:color .2s}.site-header nav a:hover{color:var(--cyan)}.section-shell{max-width:1180px;margin:0 auto;padding-left:5%;padding-right:5%}.hero{min-height:760px;display:grid;grid-template-columns:45% 55%;align-items:center;gap:0;padding-top:38px;padding-bottom:58px}.hero-copy{padding-right:48px}.eyebrow{display:flex;align-items:center;gap:12px;margin:0;color:var(--cyan);font:11px Georgia,serif;letter-spacing:3px}.eyebrow>span:first-child{width:7px;height:7px;border:1px solid var(--cyan);transform:rotate(45deg);display:inline-block}.hero-kicker{margin:38px 0 8px;color:#a9c4de;letter-spacing:5px;font-size:18px}.hero h1{font-size:clamp(48px,5.2vw,78px);font-weight:500;line-height:1.18;letter-spacing:3px;margin:0;color:#f0f6ff}.hero h1 em{display:block;font-style:normal;color:var(--cyan);text-shadow:0 0 24px #1dbbe84d}.hero-intro{max-width:390px;color:#a1b2c8;font-size:15px;line-height:2.1;margin:28px 0}.hero-actions{display:flex;gap:12px;margin:27px 0 34px}.button{padding:11px 17px;border:1px solid var(--line);font-size:13px;text-decoration:none;transition:.2s}.button-primary{background:linear-gradient(110deg,var(--cyan),#4b9cff);border-color:transparent;color:#04121e}.button-secondary:hover,.button-primary:hover{transform:translateY(-2px);border-color:var(--cyan)}.button span{margin-left:10px}.profile-facts{display:flex;gap:28px;margin:0;border-top:1px solid var(--line);padding-top:20px}.profile-facts div{min-width:0}.profile-facts dt{color:var(--faint);font-size:11px;margin-bottom:3px}.profile-facts dd{margin:0;color:#c7d7eb;font-size:13px}.hero-card-wrap{position:relative;min-width:0;padding:12px 0 0 16px}.hero-card-wrap:before{content:"";position:absolute;inset:4% 4% 6% 0;background:linear-gradient(135deg,#1a77bb18,transparent 40%,#9246c51f);border:1px solid #4e9bd226;transform:skewY(-3deg);pointer-events:none}.card-caption{display:flex;justify-content:space-between;color:var(--faint);font:10px Georgia,serif;letter-spacing:3px;padding:0 3% 8px 8%}.card-caption button{color:var(--cyan);font-size:11px;letter-spacing:1px}.card-display{height:570px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.card-display:after{content:"";position:absolute;inset:7% 13%;border:1px solid #5ed9ff1a;pointer-events:none;transform:skewY(-3deg)}#stage{width:100%;height:540px;position:relative;touch-action:none;cursor:grab;z-index:1}#stage:active{cursor:grabbing}#stage canvas{display:block;width:100%;height:100%}#loading{position:absolute;inset:0;display:grid;place-items:center;color:var(--cyan);font-size:13px;letter-spacing:3px;text-align:center;white-space:pre-wrap}.view-label{position:absolute;top:12px;left:50%;transform:translateX(-50%);margin:0;color:#6793b9;font:9px Georgia,serif;letter-spacing:3px;z-index:2}.card-tools{display:flex;justify-content:center;gap:10px;position:relative;z-index:2}.card-tools button{border:1px solid #5c89b54d;padding:9px 14px;color:#a8c1db;font-size:12px}.card-tools button:hover{border-color:var(--cyan);color:#ecf8ff}.card-tools .tool-primary{background:#59d7ff;color:#03131f;border-color:var(--cyan)}.card-hint{text-align:center;color:var(--faint);font:10px Georgia,serif;letter-spacing:1px;margin:12px 0}.notes,.story,.capabilities,.journey,.work,.contact{padding-top:110px;padding-bottom:110px}.section-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:12px;margin-bottom:32px}.section-heading .eyebrow{grid-column:1/-1}.section-heading h2,.story h2,.contact h2{font-size:clamp(32px,4vw,52px);font-weight:400;line-height:1.3;letter-spacing:2px;margin:0;color:#e5f1ff}.section-heading>a{color:var(--cyan);font-size:13px;text-decoration:none}.section-heading.wide{display:block}.section-heading.wide>p:last-child{color:var(--muted);font-size:14px;margin:10px 0 0}.featured-note{border:1px solid #3c87bb66;background:linear-gradient(115deg,#0e263b,#091725);box-shadow:0 20px 80px #0005}.featured-note a{display:block;padding:30px 34px;text-decoration:none;position:relative}.featured-note a>div{display:flex;justify-content:space-between;color:var(--cyan);font:10px Georgia,serif;letter-spacing:2px}.featured-note h3{max-width:850px;font-size:27px;line-height:1.45;font-weight:400;margin:24px 0 12px;color:#e5f3ff}.featured-note p{max-width:780px;color:#8ea8c1;font-size:14px;margin:0}.article-arrow{position:absolute;right:32px;bottom:27px;color:var(--pink);font-size:24px}.article-list{border-top:1px solid var(--line)}.article-list a{display:grid;grid-template-columns:40px 1fr auto 24px;gap:14px;align-items:center;padding:21px 8px;border-bottom:1px solid var(--line);text-decoration:none;color:#bbcee3;font-size:15px}.article-list a:hover{color:var(--cyan);background:#1b4a6b1f}.article-list b{color:var(--cyan);font:12px Georgia}.article-list small{display:block;text-transform:uppercase;color:var(--violet);font:10px Georgia;letter-spacing:2px}.article-list time{color:var(--faint);font-size:12px}.article-list i{color:var(--pink);font-style:normal}.story{display:grid;grid-template-columns:40% 60%;gap:40px;border-top:1px solid var(--line)}.story-heading>p:last-child{color:var(--violet);font:11px Georgia;letter-spacing:3px;margin-top:25px}.story-copy{max-width:640px;color:#b6c8dd;font-size:17px}.story-copy blockquote{border-left:2px solid var(--cyan);padding-left:20px;margin:28px 0;color:#7fa5c9;font:italic 16px Georgia;letter-spacing:.3px}.story-copy ol{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;list-style:none;padding:0;margin:32px 0 0}.story-copy li{border-top:1px solid var(--line);padding-top:11px;color:var(--cyan);font-size:12px}.capabilities{border-top:1px solid var(--line)}.capability-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}.capability-grid article{background:#081724;padding:25px 20px;min-height:180px}.capability-grid b{color:var(--cyan);font:12px Georgia}.capability-grid h3{font-size:19px;font-weight:400;margin:25px 0 8px;color:#e3f0ff}.capability-grid p{color:var(--muted);font-size:13px;margin:0;line-height:1.8}.journey{border-top:1px solid var(--line)}.timeline{list-style:none;margin:0;padding:0;border-left:1px solid #4b84b866}.timeline li{display:grid;grid-template-columns:145px 1fr;gap:28px;padding:0 0 38px 28px;position:relative}.timeline li:before{content:"";position:absolute;left:-4px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--faint)}.timeline li.current:before{background:var(--cyan);box-shadow:0 0 13px var(--cyan)}.timeline time{color:var(--faint);font:13px Georgia}.timeline h3{margin:4px 0 1px;font-size:21px;font-weight:400;color:#d9eaff}.timeline small{color:var(--violet);font:10px Georgia;letter-spacing:2px}.timeline strong{color:var(--cyan);font-size:13px;font-weight:400}.timeline p{color:var(--muted);font-size:13px;margin:7px 0 0}.education{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:35px 0 0 173px}.education article{border-top:1px solid var(--line);padding-top:15px}.education span{color:var(--violet);font:12px Georgia}.education h3{font-size:16px;font-weight:400;margin:8px 0;color:#c9ddf1}.education p{color:var(--muted);font-size:13px;margin:0}.work{border-top:1px solid var(--line)}.project-grid{display:grid;grid-template-columns:repeat(2,1fr);list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.project-grid li{padding:17px 12px;border-bottom:1px solid var(--line);color:#b6cbe0;font-size:14px}.project-grid b{display:inline-block;width:40px;color:var(--cyan);font:12px Georgia}.credentials{margin-top:35px;border:1px solid var(--line);padding:20px 24px;background:#0a1a2a}.credentials h3{margin:0 0 10px;color:var(--violet);font:12px Georgia;letter-spacing:3px;text-transform:uppercase}.credentials ul{display:flex;flex-wrap:wrap;gap:9px 28px;margin:0;padding-left:18px;color:var(--muted);font-size:13px}.contact{border-top:1px solid var(--line);padding-bottom:80px}.contact>p:not(.eyebrow){max-width:470px;color:var(--muted);font-size:15px}.email-link{display:inline-block;color:var(--cyan);font-size:28px;text-decoration:none;margin:22px 0}.email-link span{color:var(--pink)}.contact-links{display:flex;gap:24px;flex-wrap:wrap}.contact-links a{color:#a2b8d0;font-size:13px;text-decoration:none}.contact-links a:hover{color:var(--cyan)}.site-footer{max-width:1180px;margin:auto;border-top:1px solid var(--line);padding:24px 5% 38px;display:flex;justify-content:space-between;gap:20px;color:var(--faint);font:10px Georgia;letter-spacing:1.5px}.site-footer a{color:var(--cyan);text-decoration:none}.card-controls{max-width:1180px;margin:0 auto 28px;padding:22px 5%;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr) 110px;gap:22px;color:var(--faint);font:10px Georgia;letter-spacing:2px}.card-controls output{float:right;color:var(--cyan)}.card-controls input{display:block;width:100%;margin-top:12px;accent-color:var(--cyan)}.card-controls button{border:1px solid var(--line);color:var(--cyan);font-size:11px;letter-spacing:1px}.card-controls button:hover{border-color:var(--cyan)}dialog{max-width:500px;border:1px solid #4e9ed080;background:#091b2b;color:var(--ink);padding:35px;box-shadow:0 20px 80px #000b}dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}dialog h2{font-size:27px;line-height:1.4;font-weight:400}dialog p{color:#a8bfd5;font-size:14px}.close{position:absolute;right:15px;top:7px;color:var(--cyan);font-size:24px}@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:70px}.hero-copy{padding-right:0}.hero-card-wrap{padding:50px 0 0}.card-display{height:560px}.story{grid-template-columns:1fr;gap:15px}.capability-grid{grid-template-columns:repeat(2,1fr)}.card-controls{grid-template-columns:repeat(2,1fr)}.card-controls button{padding:10px}.profile-facts{gap:16px}}@media(max-width:600px){.site-header{height:70px}.site-header nav{gap:12px}.site-header nav a{font-size:9px;letter-spacing:1px}.brand small{font-size:8px}.hero{padding-top:44px;min-height:0}.hero-kicker{margin-top:28px;font-size:15px;letter-spacing:3px}.hero h1{font-size:44px}.hero-intro{font-size:14px}.hero-actions{flex-wrap:wrap}.profile-facts{display:grid;grid-template-columns:1fr 1fr}.profile-facts div:last-child{grid-column:1/-1}.hero-card-wrap{padding-top:35px}.card-display{height:490px}.card-display:after{inset:8% 8%}.card-tools{flex-wrap:wrap}.card-hint{font-size:9px}.notes,.story,.capabilities,.journey,.work,.contact{padding-top:78px;padding-bottom:78px}.section-heading{display:block}.section-heading>a{display:inline-block;margin-top:13px}.section-heading h2,.story h2,.contact h2{font-size:34px;margin-top:10px}.featured-note a{padding:22px 19px}.featured-note a>div{display:block;line-height:2}.featured-note time{display:block}.featured-note h3{font-size:21px}.article-list a{grid-template-columns:28px 1fr 20px}.article-list time{display:none}.story-copy{font-size:15px}.story-copy ol{grid-template-columns:repeat(2,1fr)}.capability-grid{grid-template-columns:1fr}.timeline li{grid-template-columns:1fr;gap:4px;padding-left:18px}.education{margin-left:18px;grid-template-columns:1fr}.project-grid{grid-template-columns:1fr}.email-link{font-size:22px}.site-footer{display:block;line-height:2.2}.site-footer span:nth-child(2){display:block}.card-controls{grid-template-columns:1fr 1fr;gap:18px;padding-left:5%;padding-right:5%}.card-controls button{grid-column:1/-1;padding:10px}.card-controls label{font-size:9px}}
