*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--r:2rem;--bg:#f0ede8;--card-bg:#fff;--text:#1a1a1a;--muted:#888;--border:#00000014}html,body,#root{background:var(--bg);width:100%;height:100%;color:var(--text);font-family:DM Mono,monospace;overflow:hidden}#stack{justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.section{background:var(--card-bg);border-radius:var(--r);border:1px solid var(--border);will-change:transform, opacity;pointer-events:none;-webkit-user-select:none;user-select:none;flex-direction:column;width:min(92vw,840px);height:min(86vh,660px);display:flex;position:absolute;overflow:hidden}.section-label{letter-spacing:.14em;color:var(--muted);text-transform:uppercase;border-bottom:1px solid var(--border);flex-shrink:0;padding:.85rem clamp(1.4rem,5vw,3.5rem);font-size:10px}.section-inner{scrollbar-width:thin;scrollbar-color:#ddd transparent;flex:1;padding:clamp(1.4rem,4vw,2.8rem) clamp(1.4rem,5vw,3.5rem);overflow:hidden auto}.section-inner::-webkit-scrollbar{width:4px}.section-inner::-webkit-scrollbar-thumb{background:#ddd;border-radius:2px}.section.active{opacity:1;z-index:10;pointer-events:auto;-webkit-user-select:auto;user-select:auto;transform:translateY(0)scale(1)}.section.peek-1{opacity:.5;z-index:2;transform:translateY(9px)scale(.97)}.section.peek-2{opacity:0;z-index:1;transform:translateY(16px)scale(.94)}.section.hidden-card{opacity:0;z-index:0;transform:translateY(0)scale(.94)}#dots{z-index:100;flex-direction:column;gap:10px;display:flex;position:fixed;top:50%;right:clamp(.75rem,2.5vw,2rem);transform:translateY(-50%)}.dot{cursor:pointer;background:#ccc;border-radius:50%;width:5px;height:5px;transition:background .3s,transform .3s}.dot.active{background:var(--text);transform:scale(1.6)}.hero-name{letter-spacing:-.02em;margin-top:.3rem;margin-bottom:1.1rem;font-family:DM Serif Display,serif;font-size:clamp(2.5rem,9vw,5.5rem);line-height:1}.hero-name em{color:var(--muted);font-style:italic}.hero-sub{color:var(--muted);max-width:380px;margin-bottom:1.75rem;font-size:clamp(.75rem,2vw,.9rem);line-height:1.8}.hero-tags{flex-wrap:wrap;gap:7px;display:flex}.tag{border:1px solid var(--border);letter-spacing:.04em;color:var(--muted);border-radius:999px;padding:5px 12px;font-size:11px}.hero-cta{align-items:center;gap:1rem;margin-top:2rem;display:flex}.resume-btn{background:var(--text);color:var(--card-bg);border-radius:999px;align-items:center;padding:.8rem 1.6rem;font-size:.8rem;font-weight:500;text-decoration:none;transition:opacity .2s,transform .2s;display:inline-flex}.resume-btn:hover{opacity:.85;transform:translateY(-2px)}.github-btn{color:var(--text);border:1px solid var(--border);background:0 0;border-radius:999px;align-items:center;padding:.8rem 1.6rem;font-size:.8rem;font-weight:500;text-decoration:none;transition:border-color .2s,transform .2s;display:inline-flex}.github-btn:hover{border-color:var(--text);transform:translateY(-2px)}.about-grid{grid-template-columns:1fr 1fr;align-items:start;gap:2.5rem;display:grid}@media (width<=560px){.about-grid{grid-template-columns:1fr;gap:1.5rem}}.about-text h2{margin-top:.2rem;margin-bottom:1rem;font-family:DM Serif Display,serif;font-size:clamp(1.6rem,4vw,2.5rem);font-weight:400;line-height:1.1}.about-text p{color:var(--muted);margin-bottom:.75rem;font-size:clamp(.75rem,1.8vw,.84rem);line-height:1.85}.skills-list{flex-direction:column;display:flex}.skill-group{margin-bottom:1.25rem}.skill-category-label{letter-spacing:.08em;text-transform:uppercase;color:#888;margin-bottom:.5rem;font-size:11px;font-weight:500}.skill-tags{flex-wrap:wrap;gap:6px;display:flex}.skill-tag{border:1px solid #e0e0e0;border-radius:999px;padding:4px 10px;font-size:13px}.skill-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;padding:9px 0;font-size:clamp(11px,1.8vw,13px);display:flex}.skill-row:last-child{border-bottom:none}.skill-bar-wrap{background:#eee;border-radius:2px;flex-shrink:0;width:64px;height:2px;overflow:hidden}.skill-bar{background:var(--text);border-radius:2px;height:100%}.projects-header{margin-top:.2rem;margin-bottom:1.25rem}.projects-header h2{font-family:DM Serif Display,serif;font-size:clamp(1.6rem,4vw,2.5rem);font-weight:400;line-height:1.1}.projects-grid{grid-template-columns:repeat(2,1fr);gap:.75rem;display:grid}@media (width<=460px){.projects-grid{grid-template-columns:1fr}}.project-card{border:1px solid var(--border);border-radius:.9rem;flex-direction:column;gap:.3rem;height:100%;padding:1.1rem;transition:border-color .2s;display:flex}.project-card:hover{border-color:#bbb}.project-icon{color:var(--muted);margin-bottom:.25rem;font-size:15px}.project-name{font-size:clamp(.8rem,2vw,.88rem)}.project-desc{color:var(--muted);flex-grow:1;font-size:clamp(.7rem,1.5vw,.74rem);line-height:1.65}.project-stack{flex-wrap:wrap;gap:6px;margin-top:1rem;display:flex}.stack-pill{background:var(--bg);border:1px solid var(--border);color:var(--muted);letter-spacing:.02em;border-radius:4px;padding:3px 8px;font-size:.65rem}.contact-inner{max-width:460px;padding-top:.2rem}.contact-inner h2{margin-bottom:.85rem;font-family:DM Serif Display,serif;font-size:clamp(1.6rem,5vw,3rem);font-weight:400;line-height:1.1}.contact-inner>p{color:var(--muted);margin-bottom:1.75rem;font-size:clamp(.75rem,1.8vw,.84rem);line-height:1.8}.contact-links{flex-direction:column;display:flex}.contact-link{border-bottom:1px solid var(--border);color:var(--text);justify-content:space-between;align-items:center;padding:.85rem 0;font-size:clamp(.75rem,2vw,.84rem);text-decoration:none;transition:color .2s;display:flex}.contact-link:first-child{border-top:1px solid var(--border)}.contact-link:hover{color:var(--muted)}.contact-link span{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;flex-shrink:0;margin-left:8px;font-size:10px}#scroll-hint{letter-spacing:.12em;color:var(--muted);text-transform:uppercase;z-index:100;opacity:0;white-space:nowrap;font-size:10px;animation:3.5s 1.2s forwards fadeHint;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)}@keyframes fadeHint{0%{opacity:0}20%{opacity:1}80%{opacity:1}to{opacity:0}}.history-header{margin-top:.2rem;margin-bottom:2rem}.history-header h2{font-family:DM Serif Display,serif;font-size:clamp(1.6rem,4vw,2.5rem);font-weight:400;line-height:1.1}.timeline{flex-direction:column;gap:2rem;padding-left:20px;display:flex;position:relative}.timeline:before{content:"";background:var(--border);width:1px;position:absolute;top:6px;bottom:0;left:4px}.timeline-item{position:relative}.timeline-dot{background:var(--bg);border:1px solid var(--text);border-radius:50%;width:9px;height:9px;position:absolute;top:6px;left:-20px}.timeline-year{letter-spacing:.12em;color:var(--muted);text-transform:uppercase;margin-bottom:.4rem;font-size:10px}.timeline-role{margin-bottom:.35rem;font-size:clamp(.85rem,2vw,.95rem)}.timeline-role span{color:var(--muted);font-style:italic}.timeline-desc{color:var(--muted);max-width:95%;font-size:clamp(.75rem,1.8vw,.84rem);line-height:1.7}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#1c1c1c;--card-bg:#282828;--text:#e8e8e8;--muted:#a0a0a0;--border:#ffffff1a}:root:not([data-theme=light]) .skill-bar-wrap{background:#383838}:root:not([data-theme=light]) .project-card:hover{border-color:#666}:root:not([data-theme=light]) .dot{background:#555}}:root[data-theme=dark]{--bg:#1c1c1c;--card-bg:#282828;--text:#e8e8e8;--muted:#a0a0a0;--border:#ffffff1a}:root[data-theme=dark] .skill-bar-wrap{background:#383838}:root[data-theme=dark] .project-card:hover{border-color:#666}:root[data-theme=dark] .dot{background:#555}.navbar{z-index:100;pointer-events:none;justify-content:space-between;align-items:center;width:100%;padding:clamp(1rem,3vw,1.5rem) clamp(1.4rem,5vw,3.5rem);display:flex;position:fixed;top:0;left:0}.navbar>*{pointer-events:auto}.navbar-brand{color:var(--text);font-family:DM Serif Display,serif;font-size:1.2rem;text-decoration:none;transition:opacity .2s}.navbar-brand:hover{opacity:.7}.theme-toggle{border:1px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-family:inherit;font-size:12px;transition:background .2s,color .2s,border-color .2s;display:flex}.theme-toggle:hover{background:var(--text);color:var(--bg);border-color:var(--text)}
