:root{--bg: #efefef;--paper: #ffffff;--ink: #121212;--muted: #4c4c4c;--line: #1b1b1b}*{box-sizing:border-box}html,body{margin:0;min-height:100%}html{font-size:12px}body{font-family:Noto Sans TC,sans-serif;color:var(--ink);background:radial-gradient(circle at 15% 12%,#ffffff 0%,transparent 38%),radial-gradient(circle at 88% 20%,#f6f6f6 0%,transparent 34%),var(--bg);width:min(101.667rem,94vw);margin:0 auto;padding:1.8rem 0 2.4rem}h1,h2,h3,.folder,.btn{font-family:Archivo,Noto Sans TC,sans-serif}.desktop-noise{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:radial-gradient(rgba(0,0,0,.0823529412) .058rem,transparent .058rem);background-size:.333rem .333rem;opacity:.26;z-index:-1}.desktop-window{border:.167rem solid var(--line);border-radius:1.2rem;overflow:hidden;background:var(--paper);box-shadow:1rem 1rem #0000002a}.window-bar{height:2.3rem;border-bottom:.167rem solid var(--line);display:flex;align-items:center;gap:.45rem;padding-inline:1rem}.window-bar span{width:.78rem;height:.78rem;border:.133rem solid var(--line);border-radius:83.25rem;background:#fff}.desktop-layout{min-height:64vh;display:grid;grid-template-columns:.92fr 1.5fr}.folders{border-right:.167rem solid var(--line);padding:0;position:relative}.desktop-title{position:absolute;left:1rem;top:1rem;z-index:2;pointer-events:none;font-size:clamp(3rem,4vw,4rem)}.desktop-title h1{margin:0;font-size:1em;letter-spacing:.03em}.desktop-title p{margin:.2rem 0 0;color:var(--muted);font-size:.4em}.desktop-canvas{--folder-base-left: 1rem;--folder-column-gap: 1rem;position:relative;min-height:64vh;height:100%;background:linear-gradient(to bottom,transparent 2.583rem,rgba(0,0,0,.0588235294) 2.667rem),linear-gradient(to right,transparent 2.583rem,rgba(0,0,0,.0588235294) 2.667rem);background-size:2.667rem 2.667rem}.folder{position:absolute;border:0;background:transparent;color:var(--ink);text-align:center;width:7.167rem;display:grid;justify-items:center;gap:.25rem;padding:.15rem;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;transition:transform .12s ease}.folder:hover{transform:translateY(-.167rem)}.folder.is-active span{background:#111;color:#fff}.folder.is-dragging{z-index:3;transform:scale(1.04)}.folder__svg{width:8rem;height:6rem}.folder__svg path{fill:#fff;stroke:#111;stroke-width:2}.folder span{font-size:1.5rem;line-height:1.15;border-radius:.46rem;padding:.15rem .34rem;background:#fff}.profile-photo{height:80vh}@media screen and (max-width:81.667rem){.profile-photo{height:42vh}}.profile-photo img{display:block;height:100%;width:auto;margin:auto}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#00000045;opacity:0;pointer-events:none;transition:opacity .16s ease;z-index:20}.modal-backdrop.is-open{opacity:1;pointer-events:auto}.modal-window{width:min(81.667rem,92vw);max-height:84vh;border:.167rem solid var(--line);border-radius:1rem;background:#fff;box-shadow:1rem 1rem #00000036;overflow:hidden}.modal-bar{height:5rem;border-bottom:.167rem solid var(--line);display:flex;align-items:center;gap:.75rem;padding-inline:.75rem}.modal-bar p{margin:0;font-size:1.2rem;letter-spacing:.03em}.modal-close{width:2rem;height:2rem;border-radius:8.25rem;border:.125rem solid #121212;background:#fff;cursor:pointer;position:relative}.modal-close:before,.modal-close:after{content:"";position:absolute;left:50%;top:50%;width:1.16rem;height:.25rem;background:#111;transform-origin:center}.modal-close:before{transform:translate(-50%,-50%) rotate(45deg)}.modal-close:after{transform:translate(-50%,-50%) rotate(-45deg)}.modal-body{padding:1.1rem 1.25rem 1.2rem;overflow:auto;max-height:calc(84vh - 2.3rem)}.page-section{display:none;padding:4rem 1rem}.page-section h2{margin:0;font-size:clamp(2rem,4vw,3rem)}.page-section p,.page-section li{color:var(--muted);font-size:1.85rem}.page-section.is-active{display:block;animation:reveal .28s ease}.section-head p{margin-top:.35rem}.timeline{display:grid;gap:.7rem}.timeline article{border:.125rem solid var(--line);border-radius:.8rem;padding:.8rem .9rem;background:#fcfcfc}.timeline h3{margin:0;font-size:1.25rem}.timeline p{margin:.35rem 0 0}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:.8rem}.project-card{border:.167rem solid var(--line);border-radius:.9rem;overflow:hidden;background:#fff}.project-card img{width:100%;height:15.833rem;object-fit:cover;filter:grayscale(100%);display:block}.project-card img:hover{filter:grayscale(0%);cursor:pointer}.project-card .project-card__body{padding:.9rem}.project-card h3{margin:0;font-size:1.08rem}.project-card p{margin:.4rem 0 .7rem;font-size:.95rem}.project-card .project-card__links{display:flex;gap:.52rem;flex-wrap:wrap}.btn{border:.125rem solid var(--line);border-radius:83.25rem;padding:.48rem .9rem;font-size:.9rem;cursor:pointer;text-decoration:none;transition:transform .14s ease}.btn:hover{transform:translateY(-.083rem)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn--primary{background:#101010;color:#fff}.btn--ghost{background:#fff;color:#121212}.pager{margin-top:1rem;display:flex;align-items:center;justify-content:center;gap:.62rem}.pager__numbers{display:flex;gap:.35rem}.pager__number{width:2rem;height:2rem;border:.125rem solid var(--line);border-radius:.5rem;background:#fff;cursor:pointer}.pager__number.is-active{background:#121212;color:#fff}.contact-links{display:flex;gap:.7rem;flex-wrap:wrap}.contact-links a{color:#111;font-weight:700}.footer{text-align:center;margin-top:1rem;color:#5a5a5a;font-size:.9rem}@keyframes reveal{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@media(max-width:81.667rem){.desktop-layout{grid-template-columns:1fr}.folders{border-right:0;border-bottom:.167rem solid var(--line)}.desktop-canvas{min-height:12rem;overflow:hidden;padding-bottom:1rem;--folder-base-left: 1rem;--folder-column-gap: 1rem}.folder{width:7rem;max-width:calc(100% - var(--folder-base-left) * 2 - var(--folder-column-gap))}.project-grid{grid-template-columns:1fr}}@media(max-width:53.333rem){body{width:min(101.667rem,95vw);padding-top:1rem}.modal-window{width:95vw;max-height:88vh}.modal-body{padding:.9rem;max-height:calc(88vh - 2.3rem)}.folder{width:5.5rem}}