:root{--surface-color: #ffffff;--line-color: #d2deea;--text-main: #162d43;--text-muted: #4f6477;--navy-700: #1b5378;--navy-800: #123955;--teal-700: #0f7f8a;--surface-shadow: 0 22px 44px -30px rgba(17, 43, 66, .45);font-family:Pretendard Variable,SUIT Variable,Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-width:320px;color:var(--text-main);background:#fff}a{color:inherit}a:focus-visible{outline:3px solid #0f7f8a;outline-offset:3px;border-radius:8px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.app-shell{min-height:100vh}.top-nav-container{position:sticky;top:.65rem;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(1080px,calc(100% - 2rem));margin:0 auto;padding:.95rem 1rem;overflow:hidden;isolation:isolate;border:1px solid rgba(255,255,255,.62);border-radius:14px;background:linear-gradient(155deg,#ffffff8a,#ffffff57 52%,#e6f2ff4d);backdrop-filter:blur(24px) saturate(1.78);-webkit-backdrop-filter:blur(24px) saturate(1.78);box-shadow:0 22px 38px -30px #0815258c,0 10px 18px -14px #5f8cbe47,inset 0 1px #ffffffd6,inset 0 -1px #ffffff4d}.top-nav-container:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(130% 95% at 8% 0%,#ffffffb8,#fff0 58%),linear-gradient(112deg,#a8c8ee38,#a8c8ee00 46%),linear-gradient(72deg,#ffffff29,#fff0 55%)}.top-nav-container:after{content:"";position:absolute;left:8%;right:8%;bottom:-30px;height:36px;pointer-events:none;border-radius:999px;background:#112b473d;filter:blur(22px);opacity:.52}.top-nav-container>*{position:relative;z-index:1}.brand{display:inline-flex;align-items:center;gap:.55rem;font-weight:800;letter-spacing:.015em;color:var(--navy-800);text-decoration:none}.brand-logo{width:32px;height:32px;border-radius:8px;object-fit:contain}.top-nav-list{list-style:none;position:relative;isolation:isolate;overflow:hidden;display:flex;gap:.55rem;margin:0;padding:.23rem;border:1px solid rgba(255,255,255,.5);border-radius:12px;background:linear-gradient(155deg,#fff6,#e6f2ff3d);box-shadow:inset 0 1px #ffffffb8,0 4px 12px -10px #12284580;backdrop-filter:blur(18px) saturate(1.52);-webkit-backdrop-filter:blur(18px) saturate(1.52);--nav-highlight-x: 0px;--nav-highlight-y: 0px;--nav-highlight-width: 0px;--nav-highlight-height: 0px;--nav-highlight-opacity: 0}.top-nav-list:before{content:"";position:absolute;left:0;top:0;width:var(--nav-highlight-width);height:var(--nav-highlight-height);border-radius:10px;transform:translate(var(--nav-highlight-x),var(--nav-highlight-y));opacity:var(--nav-highlight-opacity);border:1px solid rgba(255,255,255,.48);background:linear-gradient(150deg,#ffffff9e,#c4e1ff61);box-shadow:inset 0 1px #ffffffdb,inset 0 -1px #ffffff47,0 12px 24px -16px #2654858c;transition:transform .34s cubic-bezier(.22,1,.36,1),width .34s cubic-bezier(.22,1,.36,1),height .34s cubic-bezier(.22,1,.36,1),opacity .2s ease;pointer-events:none;z-index:0}.top-nav-link{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:.46rem .9rem;border-radius:10px;text-decoration:none;color:#143b5acc;font-weight:700;transition:color .2s ease,transform .2s ease}.top-nav-link:hover{color:#194f93;transform:translateY(-1px)}.top-nav-link.is-active{color:#0f4588}.app-main{width:min(1080px,calc(100% - 2.5rem));margin:1rem auto 0;padding-bottom:2rem}@media(max-width:900px){.top-nav-container{width:min(1080px,calc(100% - 1rem));top:.45rem;padding:.72rem;border-radius:12px;box-shadow:0 16px 30px -26px #08152580,0 8px 16px -14px #5f8cbe40,inset 0 1px #ffffffd1}.app-main{width:min(1080px,calc(100% - 1.5rem))}.brand{font-size:.95rem}.brand-logo{width:28px;height:28px}}@media(max-width:560px){.top-nav-container{flex-direction:column;align-items:flex-start;gap:.55rem}.top-nav-list{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}.top-nav-link{width:100%}}.home-page{display:grid;gap:1rem;min-height:60vh}.home-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1rem;padding:1.5rem;border:1px solid var(--line-color);border-radius:20px;background:radial-gradient(circle at 12% 18%,rgba(55,122,245,.16),transparent 42%),linear-gradient(130deg,#fffffff5,#e9f4fff2);box-shadow:var(--surface-shadow)}.home-intro{display:grid;align-content:center;gap:.7rem}.home-tag{margin:0;width:fit-content;padding:.28rem .68rem;border-radius:999px;background:#1e6be81f;color:#1f61c4;font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.home-intro h1{margin:0;font-size:clamp(2rem,5vw,3rem);color:var(--navy-800);line-height:1.1}.home-intro p{margin:0;max-width:56ch;color:var(--text-muted)}.hero-logo{margin:0;border-radius:16px;border:1px solid rgba(18,70,111,.16);background:radial-gradient(circle at 50% 80%,rgba(48,98,255,.24),transparent 56%),#ffffffc7;display:grid;place-items:center;padding:1rem}.hero-logo img{width:min(100%,340px);height:auto;object-fit:contain;filter:drop-shadow(0 20px 24px rgba(47,91,197,.2))}.logo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.logo-card{border:1px solid var(--line-color);border-radius:16px;padding:1rem;background:#ffffffdb;box-shadow:var(--surface-shadow);display:grid;gap:.65rem;align-content:start}.logo-card img{width:min(100%,220px);justify-self:center;height:auto;object-fit:contain}.logo-card h2{margin:0;font-size:1.08rem;color:var(--navy-800)}.logo-card p{margin:0;color:var(--text-muted);font-size:.94rem}@media(max-width:900px){.home-hero{grid-template-columns:1fr;padding:1.15rem}.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.logo-grid{grid-template-columns:1fr}.logo-card{padding:.9rem}}.resume-page{position:relative;width:100%;padding:1rem 1rem 1.8rem;border-radius:28px;font-size:.94rem;line-height:1.42;background:radial-gradient(circle at 12% 10%,rgba(55,122,245,.16),transparent 40%),radial-gradient(circle at 88% 0%,rgba(30,107,232,.1),transparent 32%),linear-gradient(145deg,#fffffffa,#e9f4ffeb)}.hero{background:radial-gradient(circle at 12% 18%,rgba(55,122,245,.16),transparent 42%),linear-gradient(130deg,#fffffff5,#e9f4fff2);border:1px solid var(--line-color);border-radius:20px;padding:1.7rem;box-shadow:var(--surface-shadow)}.hero-tag{display:inline-block;margin:0;padding:.28rem .62rem;border-radius:999px;background:#1e6be81f;color:#1f61c4;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.hero h1{margin:.72rem 0 0;font-size:clamp(1.55rem,3vw,2.2rem);line-height:1.12;color:var(--navy-800)}.hero-role{margin:.42rem 0 0;font-size:clamp(.92rem,1.7vw,1.05rem);color:#1f61c4;font-weight:700}.hero-headline{margin:.78rem 0 0;color:var(--text-muted);font-size:.9rem}.contact-list{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.55rem}.contact-list a{display:inline-flex;align-items:center;min-height:38px;padding:.45rem .72rem;border-radius:10px;border:1px solid rgba(18,70,111,.22);background:#ffffffe6;color:var(--navy-700);font-weight:600;font-size:.86rem;text-decoration:none;transition:transform .2s ease,border-color .2s ease,background-color .2s ease}.contact-list a:hover{transform:translateY(-1px);border-color:#1e6be873;background:#ecf5fff2}.resume-sections{display:grid;gap:.72rem;margin-top:.8rem}.section{background:linear-gradient(140deg,#fffffffa,#f0f8ffd1);border:1px solid var(--line-color);border-radius:16px;box-shadow:var(--surface-shadow);padding:1.1rem}.section-header{display:flex;align-items:baseline;justify-content:space-between;gap:.55rem;margin-bottom:.62rem}.section h2{margin:0;font-size:clamp(1rem,1.7vw,1.2rem);color:var(--navy-800)}.education-stack{display:grid;gap:.65rem}.strength-list,.project-details,.certification-list{margin:0;padding-left:1rem;color:var(--text-muted)}.strength-list li,.project-details li,.certification-list li{margin-top:.38rem}.strength-list li:first-child,.project-details li:first-child,.certification-list li:first-child{margin-top:0}.timeline-grid{display:grid;grid-template-columns:1fr;gap:.65rem}.project-card,.skill-card,.education-card{border:1px solid rgba(18,70,111,.14);border-radius:12px;padding:.9rem;background:#fff}.project-period,.education-period{margin:0;color:#1f61c4;font-size:.78rem;font-weight:700}.project-card h3,.skill-card h3,.education-card h3{margin:.42rem 0 0;font-size:.95rem;color:var(--navy-800)}.certification-card h3{margin:0}.project-summary,.education-thesis{margin:.55rem 0 0;color:var(--text-main);font-size:.88rem}.project-details{margin-top:.6rem}.skills-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.chip-list{list-style:none;margin:.58rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.34rem}.chip{border-radius:999px;padding:.24rem .56rem;border:1px solid rgba(30,107,232,.32);background:#1e6be81a;color:#1f61c4;font-size:.72rem;font-weight:700;line-height:1.3}.certification-list{list-style:none;padding:0}.certification-list li{display:grid;gap:.25rem;padding:.56rem 0;border-bottom:1px solid rgba(18,70,111,.12)}.certification-list li:last-child{border-bottom:0;padding-bottom:0}.certification-list strong{color:var(--navy-800)}.reveal{opacity:0;transform:translateY(14px);animation:reveal-up .6s cubic-bezier(.2,.75,.3,1) forwards}.hero{animation-delay:.04s}.resume-sections .section:nth-of-type(1){animation-delay:.1s}.resume-sections .section:nth-of-type(2){animation-delay:.16s}.resume-sections .section:nth-of-type(3){animation-delay:.22s}.resume-sections .section:nth-of-type(4){animation-delay:.28s}@keyframes reveal-up{to{opacity:1;transform:translateY(0)}}@media(min-width:940px){.timeline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1100px){.resume-page{font-size:.9rem}.resume-sections{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.resume-sections .section:nth-of-type(1),.resume-sections .section:nth-of-type(2){grid-column:1 / -1}.resume-sections .section:nth-of-type(3){grid-column:1}.resume-sections .section:nth-of-type(4){grid-column:2}}@media(max-width:900px){.resume-page{padding:.7rem .7rem 1.4rem;font-size:.92rem}.hero,.section{padding:1rem}.skills-grid{grid-template-columns:1fr}}@media(max-width:560px){.contact-list{flex-direction:column}.contact-list a{width:100%;justify-content:center}.hero h1{font-size:clamp(1.4rem,8vw,1.8rem)}.chip{font-size:.7rem;padding:.24rem .55rem}}
