:root{--bg:#070b14;--bg2:#0b1220;--card:#0f1a2f;--card2:#0b1427;--text:#e7eefc;--muted:#aab6d6;--line:#ffffff1a;--line2:#ffffff29;--shadow:0 20px 60px #00000059;--primary:#7c5cff;--primary2:#18d6ff;--good:#3ef2b1;--warning:#ffd074;--radius:18px;--radius2:14px;--max:1100px;--ease:cubic-bezier(.2,.8,.2,1)}[data-theme=light]{--bg:#f7f9ff;--bg2:#fff;--card:#fff;--card2:#f2f5ff;--text:#0b1220;--muted:#4b5a7a;--line:#0a16321a;--line2:#0a163229;--shadow:0 20px 60px #0a16321f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(1200px 600px at 20% 10%, #7c5cff40, transparent 55%), radial-gradient(1000px 500px at 80% 20%, #18d6ff38, transparent 60%), linear-gradient(180deg, var(--bg) 0%, var(--bg2) 70%, var(--bg) 100%);min-height:100vh;margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,Noto Sans TC,Microsoft JhengHei,sans-serif}a{color:inherit}img{max-width:100%;display:block}button,input,textarea{font:inherit;color:inherit}.container{width:min(var(--max), calc(100% - 48px));margin-inline:auto}.skip-link{background:var(--card);border:1px solid var(--line2);box-shadow:var(--shadow);transition:transform .2s var(--ease);z-index:9999;border-radius:12px;padding:10px 12px;position:absolute;top:10px;left:12px;transform:translateY(-140%)}.skip-link:focus{transform:translateY(0)}.topbar{z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:color-mix(in srgb, var(--bg2) 72%, transparent);border-bottom:1px solid var(--line);position:sticky;top:0}.topbar__inner{justify-content:space-between;align-items:center;gap:14px;padding:14px 0;display:flex}.brand{-webkit-user-select:none;user-select:none;align-items:center;gap:10px;text-decoration:none;display:flex}.brand__mark{background:linear-gradient(135deg, var(--primary), var(--primary2));color:#071022;border-radius:12px;place-items:center;width:34px;height:34px;font-weight:800;display:grid}.brand__text{letter-spacing:.2px;font-weight:700}.nav{align-items:center;gap:10px;display:flex}.nav__link{color:var(--muted);transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);border:1px solid #0000;border-radius:12px;padding:10px 12px;text-decoration:none}.nav__link:hover{background:color-mix(in srgb, var(--card) 70%, transparent);border-color:var(--line);color:var(--text)}.nav__link[aria-current=page]{color:var(--text);background:color-mix(in srgb, var(--card) 85%, transparent);border-color:var(--line2)}.topbar__actions{align-items:center;gap:10px;display:flex}.topbar__actionsText,.topbar__menuBtn{display:none}.btn{border:1px solid var(--line2);background:color-mix(in srgb, var(--card) 60%, transparent);color:var(--text);cursor:pointer;transition:transform .15s var(--ease), background .2s var(--ease), border-color .2s var(--ease);border-radius:14px;align-items:center;gap:10px;padding:10px 14px;text-decoration:none;display:inline-flex}.btn:hover{border-color:var(--line2);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:focus-visible{outline:2px solid color-mix(in srgb, var(--primary) 70%, white);outline-offset:2px}.btn--primary{background:linear-gradient(135deg, var(--primary), var(--primary2));color:#071022;border-color:#0000;font-weight:700}.btn--ghost{background:color-mix(in srgb, var(--card2) 45%, transparent)}.btn--sm{border-radius:12px;padding:8px 10px}.icon{display:inline-flex}.mobileNav{border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--bg2) 86%, transparent)}.mobileNav__inner{gap:8px;padding:10px 0 14px;display:grid}.mobileNav__link{border:1px solid var(--line);background:color-mix(in srgb, var(--card) 65%, transparent);border-radius:14px;padding:12px;text-decoration:none}.page{padding-bottom:40px}.hero{padding:56px 0 26px;position:relative;overflow:hidden}.hero__grid{grid-template-columns:1.15fr .85fr;align-items:stretch;gap:22px;display:grid}.hero__copy{position:relative}.badge{border:1px solid var(--line);background:color-mix(in srgb, var(--card) 58%, transparent);color:var(--muted);border-radius:999px;align-items:center;gap:10px;width:fit-content;padding:8px 12px;display:inline-flex}.dot{background:var(--good);width:8px;height:8px;box-shadow:0 0 0 6px color-mix(in srgb, var(--good) 18%, transparent);border-radius:999px}.hero__title{letter-spacing:-.6px;margin:14px 0 10px;font-size:clamp(34px,4.6vw,54px);line-height:1.1}.gradText{background:linear-gradient(135deg, var(--primary), var(--primary2));color:#0000;-webkit-background-clip:text;background-clip:text}.hero__subtitle{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin:0;font-size:18px;display:flex}.role{color:var(--text);font-weight:700}.caret{background:color-mix(in srgb, var(--text) 60%, transparent);border-radius:6px;width:9px;height:22px;animation:1.05s step-end infinite blink;display:inline-block}@keyframes blink{0%,45%{opacity:1}50%,to{opacity:0}}.hero__summary{color:var(--muted);max-width:62ch;margin:14px 0 0;line-height:1.75}.hero__cta{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.hero__meta{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px;display:grid}.metaItem{border:1px solid var(--line);background:color-mix(in srgb, var(--card) 52%, transparent);border-radius:16px;padding:12px}.metaItem__label{color:var(--muted);font-size:12px;display:block}.metaItem__value{margin-top:6px;font-weight:700;display:block}.hero__card{border-radius:var(--radius);border:1px solid var(--line);background:linear-gradient(180deg, color-mix(in srgb, var(--card) 62%, transparent), color-mix(in srgb, var(--card2) 58%, transparent));box-shadow:var(--shadow);padding:18px;position:relative}.profile{grid-template-columns:76px 1fr;align-items:center;gap:14px;display:grid}.profile__avatar{width:76px;height:76px;position:relative}.avatarRing{background:conic-gradient(from 180deg, var(--primary), var(--primary2), var(--good), var(--primary));filter:blur(.2px);border-radius:999px;position:absolute;inset:0}.avatarFace{background:linear-gradient(180deg, color-mix(in srgb, var(--bg2) 50%, transparent), color-mix(in srgb, var(--card) 70%, transparent));border:1px solid var(--line2);border-radius:999px;place-items:center;display:grid;position:absolute;inset:4px}.avatarInitial{letter-spacing:.4px;font-size:28px;font-weight:900}.profile__nameRow{justify-content:space-between;align-items:center;gap:10px;display:flex}.profile__name{margin:0;font-size:18px}.chip{border:1px solid var(--line2);background:color-mix(in srgb, var(--card2) 55%, transparent);color:var(--muted);border-radius:999px;padding:6px 10px;font-size:12px}.profile__desc{color:var(--muted);margin:6px 0 0;line-height:1.6}.profile__links{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.linkBtn{border:1px solid var(--line);background:color-mix(in srgb, var(--card) 50%, transparent);color:var(--text);transition:transform .15s var(--ease), border-color .2s var(--ease);border-radius:12px;padding:8px 10px;text-decoration:none}.linkBtn:hover{border-color:var(--line2);transform:translateY(-1px)}.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px;display:grid}.stat{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 55%, transparent);border-radius:16px;padding:12px}.stat__num{font-size:18px;font-weight:900}.stat__label{color:var(--muted);margin-top:6px;font-size:12px}.hero__bg{pointer-events:none;z-index:-1;position:absolute;inset:0}.blob{filter:blur(40px);opacity:.55;border-radius:140px;width:520px;height:520px;position:absolute}.blob--a{background:radial-gradient(circle at 30% 30%,#7c5cfff2,#7c5cff00);top:-220px;left:-220px;transform:rotate(12deg)}.blob--b{background:radial-gradient(circle at 30% 30%,#18d6ffe0,#18d6ff00);top:-180px;right:-260px;transform:rotate(-10deg)}.gridGlow{opacity:.35;background-image:linear-gradient(90deg,#ffffff0f 1px,#0000 1px),linear-gradient(#ffffff0f 1px,#0000 1px);background-size:56px 56px;position:absolute;inset:-40px;-webkit-mask-image:radial-gradient(circle at 40% 20%,#000 0%,#0000 60%);mask-image:radial-gradient(circle at 40% 20%,#000 0%,#0000 60%)}.section{padding:44px 0}.section--alt{background:linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--bg2) 28%, transparent) 35%, transparent 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.sectionHead{gap:10px;margin-bottom:18px;display:grid}.sectionTitle{letter-spacing:-.2px;margin:0;font-size:26px}.sectionLead{color:var(--muted);max-width:75ch;margin:0;line-height:1.75}.aboutGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.card{border-radius:var(--radius);border:1px solid var(--line);background:color-mix(in srgb, var(--card) 60%, transparent);box-shadow:var(--shadow);padding:18px}.card__title{margin:0 0 10px;font-size:16px}.card__text{color:var(--muted);margin:0;line-height:1.75}.pillRow{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.pill{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 55%, transparent);color:var(--text);border-radius:999px;padding:7px 10px;font-size:12px}.callout{border:1px dashed var(--line2);background:color-mix(in srgb, var(--card2) 42%, transparent);border-radius:16px;margin-top:14px;padding:12px}.callout__title{color:var(--muted);font-size:12px}.callout__body{margin-top:8px;font-weight:800}.skillsLayout{grid-template-columns:1.2fr .8fr;align-items:start;gap:14px;display:grid}.skillList{gap:10px;display:grid}.skill{gap:8px;display:grid}.skill__top{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.skill__name{font-weight:800}.skill__level{color:var(--muted);font-size:12px}.bar{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 55%, transparent);border-radius:999px;height:10px;overflow:hidden}.bar>span{background:linear-gradient(90deg, var(--primary), var(--primary2));width:0%;height:100%;transition:width .9s var(--ease);border-radius:999px;display:block}.checkList{color:var(--muted);gap:8px;margin:0;padding-left:18px;line-height:1.65;display:grid}.divider{background:var(--line);height:1px;margin:14px 0}.filterBar{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 40%, transparent);border-radius:var(--radius);justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px;padding:12px;display:flex}.filterBar__title{color:var(--muted);font-size:12px}.filterBar__buttons{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.tabBtn{border:1px solid var(--line);background:color-mix(in srgb, var(--card) 45%, transparent);cursor:pointer;color:var(--muted);transition:transform .15s var(--ease), border-color .2s var(--ease), color .2s var(--ease);border-radius:999px;padding:8px 10px}.tabBtn:hover{border-color:var(--line2);color:var(--text);transform:translateY(-1px)}.tabBtn[aria-selected=true]{color:var(--text);background:linear-gradient(135deg, color-mix(in srgb, var(--primary) 85%, white 10%), color-mix(in srgb, var(--primary2) 85%, white 10%));border-color:#0000}.grid{gap:14px;display:grid}.projectsGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.project{border-radius:var(--radius);border:1px solid var(--line);background:linear-gradient(180deg, color-mix(in srgb, var(--card) 64%, transparent), color-mix(in srgb, var(--card2) 60%, transparent));box-shadow:var(--shadow);transition:transform .2s var(--ease), border-color .2s var(--ease);grid-template-rows:auto 1fr auto;gap:10px;min-height:185px;padding:16px;display:grid;position:relative;overflow:hidden}.project:hover{border-color:var(--line2);transform:translateY(-2px)}.project__title{margin:0;font-size:16px}.project__desc{color:var(--muted);margin:0;line-height:1.7}.tags{flex-wrap:wrap;gap:8px;display:flex}.tag{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 50%, transparent);color:var(--muted);border-radius:999px;padding:6px 10px;font-size:12px}.project__links{flex-wrap:wrap;gap:10px;display:flex}.miniLink{color:var(--text);border:1px solid var(--line);background:color-mix(in srgb, var(--card) 50%, transparent);border-radius:12px;padding:8px 10px;font-weight:700;text-decoration:none}.miniLink:hover{border-color:var(--line2)}.timeline{gap:10px;display:grid}.event{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 45%, transparent);border-radius:16px;grid-template-columns:140px 1fr;gap:14px;padding:14px 12px;display:grid}.event__time{color:var(--muted);font-size:12px;line-height:1.6}.event__title{margin:0;font-weight:900}.event__body{color:var(--muted);margin:8px 0 0;line-height:1.7}.contactGrid{grid-template-columns:.95fr 1.05fr;align-items:start;gap:14px;display:grid}.contactRow{border-bottom:1px solid var(--line);grid-template-columns:72px 1fr auto;align-items:center;gap:10px;padding:10px 0;display:grid}.contactRow:last-child{border-bottom:0}.contactRow__label{color:var(--muted);font-size:12px}.contactRow__value a{color:var(--text)}.note{color:var(--muted);line-height:1.75}.form{gap:12px;display:grid}.field{gap:8px;display:grid}.field__label{color:var(--muted);font-size:12px}input,textarea{border:1px solid var(--line);background:color-mix(in srgb, var(--card2) 38%, transparent);width:100%;transition:border-color .2s var(--ease), background .2s var(--ease);border-radius:14px;outline:none;padding:12px}textarea{resize:vertical}input:focus,textarea:focus{border-color:color-mix(in srgb, var(--primary) 65%, var(--line2));background:color-mix(in srgb, var(--card) 55%, transparent)}.form__actions{flex-wrap:wrap;gap:10px;display:flex}.form__hint{color:var(--muted);margin:0;font-size:12px;line-height:1.6}.footer{border-top:1px solid var(--line);background:color-mix(in srgb, var(--bg2) 60%, transparent);padding:18px 0}.footer__inner{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;font-size:12px;display:flex}.sep{margin:0 8px}.footerLink{color:var(--muted);text-decoration:none}.footerLink:hover{color:var(--text)}.toast{border:1px solid var(--line2);background:color-mix(in srgb, var(--card) 82%, transparent);box-shadow:var(--shadow);color:var(--text);z-index:2000;border-radius:14px;max-width:min(520px,100% - 24px);padding:10px 12px;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.reveal{opacity:0;transition:opacity .55s var(--ease), transform .6s var(--ease);transform:translateY(10px)}.reveal.is-visible{opacity:1;transform:translateY(0)}@media (width<=980px){.hero__grid{grid-template-columns:1fr;gap:14px}.hero{padding-top:40px}.skillsLayout,.aboutGrid,.contactGrid{grid-template-columns:1fr}.projectsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero__meta{grid-template-columns:1fr}.nav{display:none}.topbar__menuBtn{display:inline-flex}.topbar__actionsText{display:none}}@media (width<=560px){.projectsGrid,.event{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.caret{animation:none}.btn,.project,.reveal{transition:none}.btn:hover,.project:hover{transform:none}}
