.personal-portfolio{--pp-bg:#fafafa;--pp-bg-soft:#f0f0f0;--pp-text:#111;--pp-text-soft:#555;--pp-text-mute:#999;--pp-border:#ddd;--pp-border-strong:#111;--pp-link-base:#555;--pp-link-hover:#111;--pp-font-sans:"Pretendard Variable", "Pretendard", "Inter", sans-serif;--pp-font-display:"Space Grotesk", "Pretendard Variable", sans-serif;--pp-text-name:clamp(3rem, 10vw, 6rem);--pp-text-display:clamp(1.5rem, 3vw, 2.25rem);--pp-text-body:1rem;--pp-text-lead:1.125rem;--pp-text-small:.875rem;--pp-text-caption:.75rem;--pp-line-height:1.8;--pp-section-gap:clamp(96px, 14vw, 160px);--pp-container-max:900px;--pp-container-padding:clamp(20px, 5vw, 40px);--pp-gap-md:24px;--pp-gap-lg:48px;--pp-radius-sm:2px;--pp-radius-md:4px;--pp-ease:cubic-bezier(.6, 0, .2, 1);--pp-duration-quick:.15s;--pp-duration-base:.4s;--pp-duration-slow:.6s}:root[data-theme=dark] .personal-portfolio{--pp-bg:#0a0a0a;--pp-bg-soft:#1a1a1a;--pp-text:#fafafa;--pp-text-soft:#aaa;--pp-text-mute:#666;--pp-border:#333;--pp-border-strong:#fafafa;--pp-link-base:#aaa;--pp-link-hover:#fafafa}.personal-portfolio{box-sizing:border-box}.personal-portfolio *,.personal-portfolio :before,.personal-portfolio :after{box-sizing:inherit}.personal-portfolio h1,.personal-portfolio h2,.personal-portfolio h3,.personal-portfolio h4,.personal-portfolio h5,.personal-portfolio h6,.personal-portfolio p,.personal-portfolio ul,.personal-portfolio ol,.personal-portfolio figure,.personal-portfolio blockquote{margin:0;padding:0}.personal-portfolio ul,.personal-portfolio ol{list-style:none}.personal-portfolio img,.personal-portfolio picture,.personal-portfolio video,.personal-portfolio canvas,.personal-portfolio svg{max-width:100%;height:auto;display:block}.personal-portfolio a{color:inherit;text-decoration:none}.personal-portfolio button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}.personal-portfolio :focus-visible{outline:2px solid var(--pp-text);outline-offset:4px}@media (hover:hover){:root.pp-cursor-on{cursor:none}:root.pp-cursor-on .personal-portfolio,:root.pp-cursor-on .personal-portfolio a,:root.pp-cursor-on .personal-portfolio button{cursor:none!important}}.personal-portfolio{background:var(--pp-bg);color:var(--pp-text);font-family:var(--pp-font-sans);font-size:var(--pp-text-body);line-height:var(--pp-line-height);-webkit-font-smoothing:antialiased;min-height:100vh;transition:background-color var(--pp-duration-base) var(--pp-ease), color var(--pp-duration-base) var(--pp-ease);font-weight:400}.personal-portfolio .pp-display{font-family:var(--pp-font-display);letter-spacing:-.015em}.personal-portfolio .pp-section-title{font-family:var(--pp-font-display);font-size:var(--pp-text-display);color:var(--pp-text);letter-spacing:-.01em;margin-bottom:40px;font-weight:600;line-height:1.2}.personal-portfolio .pp-section-subtitle{font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.25em;color:var(--pp-text-mute);margin-bottom:12px;font-weight:500}@media (prefers-reduced-motion:reduce){.personal-portfolio *,.personal-portfolio :before,.personal-portfolio :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.personal-portfolio .pp-container{width:100%;max-width:var(--pp-container-max);padding-left:var(--pp-container-padding);padding-right:var(--pp-container-padding);margin-left:auto;margin-right:auto}.personal-portfolio section{padding-top:var(--pp-section-gap);padding-bottom:var(--pp-section-gap)}.personal-portfolio .pp-theme-toggle{top:60px;right:calc(var(--pp-container-padding) + 16px);z-index:85;background:var(--pp-bg);border:1px solid var(--pp-border);width:40px;height:40px;color:var(--pp-text);transition:background var(--pp-duration-base) var(--pp-ease), border-color var(--pp-duration-base) var(--pp-ease), transform var(--pp-duration-quick) var(--pp-ease);border-radius:50%;justify-content:center;align-items:center;display:flex;position:fixed}.personal-portfolio .pp-theme-toggle:hover{border-color:var(--pp-border-strong);transform:scale(1.1)}.personal-portfolio .pp-theme-toggle svg{stroke:currentColor;fill:none;stroke-width:1.75px;stroke-linecap:round;stroke-linejoin:round;width:16px;height:16px}.personal-portfolio .pp-theme-toggle .pp-icon-sun{display:none}.personal-portfolio .pp-theme-toggle .pp-icon-moon,:root[data-theme=dark] .personal-portfolio .pp-theme-toggle .pp-icon-sun{display:block}:root[data-theme=dark] .personal-portfolio .pp-theme-toggle .pp-icon-sun{display:block}:root[data-theme=dark] .personal-portfolio .pp-theme-toggle .pp-icon-moon{display:none}@media (hover:hover){.pp-custom-cursor{pointer-events:none;mix-blend-mode:difference;z-index:9999;width:16px;height:16px;transition:width var(--pp-duration-quick,.15s) ease-out, height var(--pp-duration-quick,.15s) ease-out, opacity var(--pp-duration-quick,.15s) ease-out;will-change:transform, width, height;background:#111;border-radius:50%;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}.pp-custom-cursor.is-hovering{background:#fafafa;width:40px;height:40px}:root[data-theme=dark] .pp-custom-cursor{background:#fafafa}:root[data-theme=dark] .pp-custom-cursor.is-hovering{background:#111}}@media (hover:hover) and (hover:none),(hover:hover) and (width<=767px){.pp-custom-cursor{display:none}}:root{--demo-bar-bg:#fafafae6;--demo-bar-text:#111;--demo-bar-border:#ddd;--demo-fab-bg:#111;--demo-fab-icon:#fafafa}:root[data-theme=dark]{--demo-bar-bg:#0a0a0ae6;--demo-bar-text:#fafafa;--demo-bar-border:#333;--demo-fab-bg:#fafafa;--demo-fab-icon:#111}.personal-portfolio .pp-intro{min-height:100vh;padding-top:calc(var(--pp-section-gap) * .5);padding-bottom:calc(var(--pp-section-gap) * .5);text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.personal-portfolio .pp-intro .pp-intro-eyebrow{font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.4em;color:var(--pp-text-mute);margin-bottom:32px}.personal-portfolio .pp-intro .pp-intro-name{font-family:var(--pp-font-display);font-size:var(--pp-text-name);letter-spacing:-.04em;color:var(--pp-text);min-height:1.1em;margin-bottom:24px;font-weight:700;line-height:1}.personal-portfolio .pp-intro .pp-intro-name .pp-typewriter-cursor{background:var(--pp-text);vertical-align:baseline;width:3px;height:.85em;margin-left:8px;animation:none;display:inline-block;transform:translateY(.05em)}.personal-portfolio .pp-intro .pp-intro-name .pp-typewriter-cursor.is-blinking{animation:.8s step-end infinite pp-blink}@keyframes pp-blink{0%,50%{opacity:1}51%,to{opacity:0}}.personal-portfolio .pp-intro .pp-intro-title{font-size:var(--pp-text-lead);color:var(--pp-text-soft);max-width:480px;margin-bottom:64px}.personal-portfolio .pp-intro .pp-intro-scroll{color:var(--pp-text-mute);font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.25em;flex-direction:column;align-items:center;gap:12px;display:inline-flex}.personal-portfolio .pp-intro .pp-intro-scroll svg{stroke:currentColor;fill:none;stroke-width:1.25px;width:14px;height:20px;animation:1.8s ease-in-out infinite pp-scroll-bounce}@keyframes pp-scroll-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}.personal-portfolio .pp-about .pp-about-inner{grid-template-columns:280px 1fr;align-items:start;gap:clamp(32px,6vw,72px);display:grid}@media (width<=767px){.personal-portfolio .pp-about .pp-about-inner{grid-template-columns:1fr;gap:40px}}.personal-portfolio .pp-about .pp-about-photo img{aspect-ratio:1;object-fit:cover;border-radius:var(--pp-radius-sm);filter:grayscale()contrast(1.05);width:100%;transition:filter var(--pp-duration-slow) var(--pp-ease)}@media (hover:hover){.personal-portfolio .pp-about .pp-about-photo:hover img{filter:grayscale(0%)contrast()}}.personal-portfolio .pp-about .pp-about-body p{font-size:var(--pp-text-body);color:var(--pp-text-soft);line-height:1.9}.personal-portfolio .pp-about .pp-about-body p+p{margin-top:18px}.personal-portfolio .pp-about .pp-about-body .pp-skills{border-top:1px solid var(--pp-border);margin-top:40px;padding-top:32px}.personal-portfolio .pp-about .pp-about-body .pp-skills .pp-skills-label{font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.2em;color:var(--pp-text-mute);margin-bottom:16px}.personal-portfolio .pp-about .pp-about-body .pp-skills .pp-skills-list{flex-wrap:wrap;gap:8px;display:flex}.personal-portfolio .pp-about .pp-about-body .pp-skills .pp-skill{background:var(--pp-bg-soft);color:var(--pp-text);font-size:var(--pp-text-caption);letter-spacing:.02em;border-radius:var(--pp-radius-md);opacity:0;transition:opacity .4s var(--pp-ease), transform .4s var(--pp-ease);padding:6px 14px;display:inline-block;transform:translateY(6px)}.personal-portfolio .pp-about .pp-about-body .pp-skills .pp-skill.is-revealed{opacity:1;transform:translateY(0)}.personal-portfolio .pp-experience .pp-timeline{padding-top:20px;position:relative}.personal-portfolio .pp-experience .pp-timeline:before{content:"";background:var(--pp-border);width:1px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-.5px)}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline:before{left:12px}}.personal-portfolio .pp-experience .pp-timeline .pp-timeline-line-fill{background:var(--pp-border-strong);width:1px;height:0;transition:height .1s linear;position:absolute;top:0;left:50%;transform:translate(-.5px)}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline .pp-timeline-line-fill{left:12px}}.personal-portfolio .pp-experience .pp-timeline-item{opacity:0;transition:opacity .6s var(--pp-ease), transform .6s var(--pp-ease);grid-template-columns:1fr 1fr;gap:48px;padding:32px 0;display:grid;position:relative;transform:translateY(24px)}.personal-portfolio .pp-experience .pp-timeline-item.is-revealed{opacity:1;transform:translateY(0)}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline-item{grid-template-columns:1fr;gap:0;padding-left:40px}}.personal-portfolio .pp-experience .pp-timeline-item:nth-child(odd) .pp-timeline-content{text-align:right;grid-column:1;padding-right:40px}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline-item:nth-child(odd) .pp-timeline-content{text-align:left;grid-column:1;padding-right:0}}.personal-portfolio .pp-experience .pp-timeline-item:nth-child(2n) .pp-timeline-content{grid-column:2;padding-left:40px}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline-item:nth-child(2n) .pp-timeline-content{grid-column:1;padding-left:0}}.personal-portfolio .pp-experience .pp-timeline-item:before{content:"";background:var(--pp-bg);border:2px solid var(--pp-border-strong);z-index:2;border-radius:50%;width:10px;height:10px;position:absolute;top:40px;left:50%;transform:translate(-50%)}@media (width<=767px){.personal-portfolio .pp-experience .pp-timeline-item:before{left:12px}}.personal-portfolio .pp-experience .pp-timeline-period{font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.15em;color:var(--pp-text-mute);margin-bottom:6px}.personal-portfolio .pp-experience .pp-timeline-role{font-family:var(--pp-font-display);color:var(--pp-text);margin-bottom:4px;font-size:1.125rem;font-weight:600}.personal-portfolio .pp-experience .pp-timeline-company{font-size:var(--pp-text-small);color:var(--pp-text-soft);margin-bottom:8px}.personal-portfolio .pp-experience .pp-timeline-desc{font-size:var(--pp-text-small);color:var(--pp-text-soft);line-height:1.7}.personal-portfolio .pp-works .pp-works-grid{gap:var(--pp-gap-lg);grid-template-columns:repeat(2,1fr);display:grid}@media (width<=639px){.personal-portfolio .pp-works .pp-works-grid{grid-template-columns:1fr;gap:32px}}.personal-portfolio .pp-works .pp-work-card{cursor:pointer}.personal-portfolio .pp-works .pp-work-card .pp-work-thumb{aspect-ratio:4/3;border-radius:var(--pp-radius-sm);background:var(--pp-bg-soft);position:relative;overflow:hidden}.personal-portfolio .pp-works .pp-work-card .pp-work-thumb img{object-fit:cover;filter:grayscale()contrast(1.05);width:100%;height:100%;transition:filter var(--pp-duration-slow) var(--pp-ease), transform var(--pp-duration-slow) var(--pp-ease)}.personal-portfolio .pp-works .pp-work-card .pp-work-thumb .pp-work-overlay{color:#fff;font-size:var(--pp-text-caption);text-transform:uppercase;letter-spacing:.3em;opacity:0;transition:opacity var(--pp-duration-base) var(--pp-ease);background:#0009;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}@media (hover:hover){.personal-portfolio .pp-works .pp-work-card .pp-work-thumb:hover img{filter:grayscale(0%);transform:scale(1.03)}.personal-portfolio .pp-works .pp-work-card .pp-work-thumb:hover .pp-work-overlay{opacity:1}}.personal-portfolio .pp-works .pp-work-card .pp-work-meta{justify-content:space-between;align-items:baseline;gap:16px;margin-top:20px;display:flex}.personal-portfolio .pp-works .pp-work-card .pp-work-title{font-family:var(--pp-font-display);color:var(--pp-text);letter-spacing:-.01em;font-size:1.25rem;font-weight:600}.personal-portfolio .pp-works .pp-work-card .pp-work-category{font-size:var(--pp-text-caption);color:var(--pp-text-mute);text-transform:uppercase;letter-spacing:.15em;flex-shrink:0}.personal-portfolio .pp-works .pp-work-modal-backdrop{z-index:200;opacity:0;pointer-events:none;transition:opacity var(--pp-duration-base) var(--pp-ease);background:#000000bf;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.personal-portfolio .pp-works .pp-work-modal-backdrop.is-open{opacity:1;pointer-events:auto}.personal-portfolio .pp-works .pp-work-modal{background:var(--pp-bg);border-radius:var(--pp-radius-md);width:100%;max-width:720px;max-height:85vh;transition:transform var(--pp-duration-slow) var(--pp-ease);padding:40px;overflow-y:auto;transform:translateY(16px)scale(.98)}@media (width<=479px){.personal-portfolio .pp-works .pp-work-modal{padding:28px 24px}}.personal-portfolio .pp-works .pp-work-modal-backdrop.is-open .pp-work-modal{transform:translateY(0)scale(1)}.personal-portfolio .pp-works .pp-work-modal-image{aspect-ratio:4/3;background:var(--pp-bg-soft);margin:-40px -40px 28px;overflow:hidden}@media (width<=479px){.personal-portfolio .pp-works .pp-work-modal-image{margin:-28px -24px 24px}}.personal-portfolio .pp-works .pp-work-modal-image img{object-fit:cover;width:100%;height:100%}.personal-portfolio .pp-works .pp-work-modal-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:16px;display:flex}.personal-portfolio .pp-works .pp-work-modal-header h2{font-family:var(--pp-font-display);color:var(--pp-text);letter-spacing:-.02em;font-size:1.75rem;font-weight:600}.personal-portfolio .pp-works .pp-work-modal-header .pp-work-modal-year{font-size:var(--pp-text-caption);color:var(--pp-text-mute);text-transform:uppercase;letter-spacing:.15em}.personal-portfolio .pp-works .pp-work-modal-category{font-size:var(--pp-text-small);color:var(--pp-text-mute);margin-bottom:24px}.personal-portfolio .pp-works .pp-work-modal-desc{font-size:var(--pp-text-body);color:var(--pp-text-soft);margin-bottom:28px;line-height:1.85}.personal-portfolio .pp-works .pp-work-modal-tools{flex-wrap:wrap;gap:8px;margin-bottom:28px;display:flex}.personal-portfolio .pp-works .pp-work-modal-tools span{background:var(--pp-bg-soft);font-size:var(--pp-text-caption);color:var(--pp-text);border-radius:var(--pp-radius-md);padding:5px 12px}.personal-portfolio .pp-works .pp-work-modal-actions{border-top:1px solid var(--pp-border);justify-content:space-between;align-items:center;gap:16px;padding-top:20px;display:flex}.personal-portfolio .pp-works .pp-work-modal-link{font-size:var(--pp-text-small);color:var(--pp-link-base);transition:color var(--pp-duration-quick) var(--pp-ease);border-bottom:1px solid}.personal-portfolio .pp-works .pp-work-modal-link:hover{color:var(--pp-link-hover)}.personal-portfolio .pp-works .pp-work-modal-close{font-size:var(--pp-text-small);color:var(--pp-text-soft);border:1px solid var(--pp-border);border-radius:var(--pp-radius-md);transition:border-color var(--pp-duration-quick) var(--pp-ease), background var(--pp-duration-quick) var(--pp-ease);padding:8px 16px}.personal-portfolio .pp-works .pp-work-modal-close:hover{border-color:var(--pp-border-strong)}.personal-portfolio .pp-works .pp-work-preview{background:var(--pp-bg-soft);border-radius:var(--pp-radius-sm);pointer-events:none;z-index:9998;opacity:0;width:220px;height:140px;transition:opacity .2s var(--pp-ease), transform .2s var(--pp-ease);position:fixed;top:0;left:0;overflow:hidden;transform:translate(-50%,-50%)scale(.9)}.personal-portfolio .pp-works .pp-work-preview img{object-fit:cover;width:100%;height:100%}.personal-portfolio .pp-works .pp-work-preview.is-visible{opacity:1;transform:translate(-50%,-50%)scale(1)}@media (hover:none),(width<=767px){.personal-portfolio .pp-works .pp-work-preview{display:none}}.personal-portfolio .pp-contact{text-align:center;padding-bottom:calc(var(--pp-section-gap) + 40px)}.personal-portfolio .pp-contact .pp-contact-title{font-family:var(--pp-font-display);color:var(--pp-text);letter-spacing:-.02em;margin-bottom:20px;font-size:clamp(2rem,5vw,3.5rem);font-weight:700;line-height:1.1}.personal-portfolio .pp-contact .pp-contact-lead{font-size:var(--pp-text-lead);color:var(--pp-text-soft);max-width:480px;margin-bottom:40px;margin-left:auto;margin-right:auto}.personal-portfolio .pp-contact .pp-contact-email{font-family:var(--pp-font-display);color:var(--pp-link-base);transition:color var(--pp-duration-base) var(--pp-ease);border-bottom:1px solid;margin-bottom:56px;padding:4px 0;font-size:clamp(1.25rem,2.5vw,1.75rem);font-weight:500;display:inline-block}.personal-portfolio .pp-contact .pp-contact-email:hover{color:var(--pp-link-hover)}.personal-portfolio .pp-contact .pp-contact-socials{justify-content:center;gap:32px;margin-bottom:80px;display:flex}.personal-portfolio .pp-contact .pp-contact-socials a{font-size:var(--pp-text-small);color:var(--pp-text-soft);text-transform:uppercase;letter-spacing:.15em;transition:color var(--pp-duration-quick) var(--pp-ease)}.personal-portfolio .pp-contact .pp-contact-socials a:hover{color:var(--pp-text)}.personal-portfolio .pp-contact .pp-contact-copy{font-size:var(--pp-text-caption);color:var(--pp-text-mute);letter-spacing:.1em}