:root{color-scheme:light;--bg:#f4f2eb;--text:#292e29;--muted:#62695f;--dim:#6e766a;--line:#d8dbcf;--accent:#a34424;--panel:#edece3;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;--sans:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:48px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.85;word-break:keep-all;-webkit-font-smoothing:antialiased}::selection{background:var(--accent);color:var(--bg)}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:2px}p{margin:0 0 18px}h1,h2{margin:0;font-weight:500}h2{line-height:1.5;letter-spacing:-.035em}section{scroll-margin-top:48px;margin-bottom:76px}section:last-of-type{margin-bottom:56px}.layout{max-width:1136px;margin:0 auto;padding:87px 44px 32px;display:grid;grid-template-columns:270px minmax(0,1fr);gap:112px}.profile{position:sticky;top:75px;align-self:start}.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);margin-bottom:28px}.profile h1{font-family:"AppleMyungjo","Batang",Georgia,serif;font-size:59px;font-weight:500;line-height:1.2;letter-spacing:-.08em}.name-period{color:var(--accent)}.role{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:24px;line-height:1.2;letter-spacing:-.02em;margin:17px 0 25px}.profile-description{color:var(--muted);font-size:14px;line-height:1.85;margin-bottom:24px}.availability{font-size:12px;color:var(--accent);display:flex;align-items:center;gap:8px;margin:0 0 47px}.availability>span{width:5px;height:5px;border-radius:50%;background:var(--accent)}nav{display:flex;flex-direction:column;max-width:182px;gap:2px;margin-bottom:28px}nav a{display:flex;align-items:center;justify-content:space-between;min-height:44px;font-size:13px;color:var(--muted);transition:color .15s ease}nav a span{font-family:var(--mono);font-size:10px;color:var(--dim)}.external{display:inline-block;font-family:var(--mono);font-size:12px;color:var(--muted);text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:var(--dim);text-underline-offset:5px;padding-block:8px;min-height:44px}.external span[aria-hidden]{display:inline-block;transition:transform .15s ease}.external:hover span[aria-hidden]{transform:translate(2px,-2px)}.profile-note{font-size:11px;color:var(--dim);margin-top:27px}.section-label{display:flex;gap:16px;font:11px/1.6 var(--mono);letter-spacing:.04em;color:var(--muted);margin:0 0 27px}.section-label>span{color:var(--dim)}.intro-title{font-family:"AppleMyungjo","Batang",serif;font-size:33px;line-height:1.55;margin-bottom:26px}.intro-title>span{color:var(--accent)}.intro-copy{font-size:16px;line-height:1.9}.muted{color:var(--muted);font-size:14px}.project-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:5px}.project-heading h2{font-family:Georgia,serif;font-size:29px;letter-spacing:-.03em}.accent{color:var(--accent);font-family:var(--sans);font-size:21px;padding-left:10px}.project-short{color:var(--dim);font:11px var(--mono)}.project-subtitle{font-size:15px;color:var(--text);margin:0 0 14px}.meta{font:11px/1.8 var(--mono);color:var(--dim);margin-bottom:26px}.meta>span{font:10px var(--sans);margin-left:7px}.flow{display:flex;align-items:center;flex-wrap:wrap;gap:5px 9px;border-left:1px solid var(--line);padding:2px 0 2px 15px;margin:25px 0;color:var(--muted);font-size:12px;line-height:2}.flow b{font-weight:400;color:var(--dim)}.stack{font:11px/2 var(--mono);color:var(--dim);margin-bottom:8px}.architecture{margin-top:24px}.section-title{font-size:21px;margin-bottom:21px}details{border-bottom:1px solid var(--line)}summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;min-height:58px;font-size:13px;color:var(--muted);padding:14px 0;transition:color .15s ease}summary::-webkit-details-marker{display:none}summary:hover{color:var(--accent)}.toggle{width:12px;height:12px;position:relative;flex:0 0 12px;color:var(--dim)}.toggle:before,.toggle:after{content:"";position:absolute;background:currentColor;width:10px;height:1px;top:6px;left:1px}.toggle:after{transform:rotate(90deg)}details[open]>summary .toggle:after{transform:rotate(0deg)}details[open]>summary{color:var(--text)}.detail-body{padding:6px 0 24px;font-size:13px;line-height:1.9;color:var(--muted);overflow-wrap:anywhere;word-break:normal}.detail-body p:last-child{margin-bottom:0}.case summary{padding:22px 0;align-items:flex-start;gap:17px}.case summary>.toggle{margin-top:8px}.case-number{font:10px/2.6 var(--mono);color:var(--dim)}.case summary>span:nth-child(2){flex:1}.case strong{font-size:15px;font-weight:500;color:var(--text)}.case small{display:block;font-size:12px;color:var(--muted);margin-top:5px}.case .detail-body{padding-left:32px}.inline-label{color:var(--text);display:block;font-size:12px;margin-bottom:4px}.system{padding:18px;background:var(--panel);margin:4px 0 22px}.system-node{border:1px solid var(--line);padding:12px 14px;text-align:center}.system-node strong{display:block;font:12px var(--mono);color:var(--text);margin-bottom:4px}.system-node span{font-size:11px;color:var(--muted)}.system-connector{text-align:center;font:17px/1.6 var(--mono);color:var(--dim)}.system-note{font-size:11px;margin:14px 0 0!important;text-align:center}.metrics{display:grid;grid-template-columns:1fr 1.5fr .8fr;gap:20px;margin:28px 0 19px;padding:21px 0 22px;border-block:1px solid var(--line)}.metrics dt{font-size:11px;color:var(--muted);margin-bottom:6px}.metrics dd{margin:0;font:28px/1.4 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.metrics dd span{font:11px var(--mono);color:var(--muted);margin-left:5px}.measurement-scope{font-size:11px;color:var(--muted);line-height:1.9;margin-bottom:22px}.source-link{margin-left:16px}.table-wrap{overflow-x:auto;margin-bottom:18px}table{width:100%;border-collapse:collapse;font:11px/1.8 var(--mono);text-align:right}th,td{padding:10px 5px;border-bottom:1px solid var(--line);white-space:nowrap}th:first-child{text-align:left}th{font-weight:400;color:var(--text)}thead{color:var(--muted)}footer{border-top:1px solid var(--line);padding-top:23px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;color:var(--dim)}footer a{min-height:44px;display:flex;align-items:center;gap:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;background:var(--accent);color:var(--bg);padding:12px;z-index:5}.skip-link:focus{top:16px}
@media(min-width:1400px){.layout{max-width:1210px;grid-template-columns:286px minmax(0,1fr);gap:140px;padding-top:100px}}
@media(max-width:1000px){.layout{gap:64px;grid-template-columns:230px minmax(0,1fr);padding-inline:36px}.profile h1{font-size:59px}.project-heading h2{font-size:26px}}
@media(max-width:760px){html{scroll-padding-top:28px}.layout{display:block;padding:46px 28px 22px;max-width:620px}.profile{position:static;margin-bottom:65px}.eyebrow{margin-bottom:24px}.profile h1{font-size:59px}.role{margin-top:16px}.profile-description{margin-bottom:19px}.availability{margin-bottom:22px}nav{flex-direction:row;max-width:none;gap:7px 19px;flex-wrap:wrap;margin-bottom:12px}nav a{font-size:12px}nav a span{display:none}.profile-github{font-size:11px}.profile-note{display:none}section{margin-bottom:59px}.section-label{margin-bottom:22px}.intro-title{font-size:29px}.intro-copy{font-size:15px}.project-heading h2{font-size:27px}.project-short{display:none}.case strong{font-size:14px}.case small{font-size:11px}.metrics{gap:15px}.metrics dd{font-size:27px}.meta>span{display:block;margin-left:0;margin-top:4px}footer{font-size:9px}.case .detail-body{padding-left:0}}
@media(max-width:360px){.layout{padding-inline:20px}.metrics{gap:10px}.metrics dd{font-size:24px}.project-heading h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media print{:root{color-scheme:light;--bg:#fff;--text:#111;--muted:#444;--dim:#555;--line:#ccc;--accent:#222;--panel:#f5f5f5}body{font-size:11pt}.layout{display:block;padding:0;max-width:none}.profile{position:static;margin-bottom:35px}.profile h1{font-size:42px}nav,.availability,.profile-note,.skip-link,footer a{display:none}.profile h1 br{display:none}.profile h1 br:after{content:" "}.profile-description{display:none}section{margin-bottom:30px}.external{font-size:9pt}.detail-body{font-size:10pt}.metrics{break-inside:avoid}summary{break-after:avoid}}

.folio-mark{display:inline-block;width:9px;height:9px;background:var(--accent);margin-right:9px;transform:rotate(-12deg)}.eyebrow{font-size:10px;letter-spacing:.02em}.section-label>span{color:var(--accent)}.profile-description{margin-top:6px}.profile-github{color:var(--text)}.section-title{font-weight:500}.project-heading h2{font-style:italic}.metrics dd{color:var(--accent)}.availability>span{border-radius:0;transform:rotate(-12deg)}

/* A short greeting, then the page. Content remains usable throughout. */
.welcome{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:var(--bg);pointer-events:none;visibility:hidden;animation:welcome-scene 1.9s ease both}
.welcome-content{text-align:center;padding:28px}
.welcome-kicker{font:10px/1.6 var(--mono);letter-spacing:.18em;color:var(--dim);margin-bottom:27px;animation:greeting-in .65s .1s ease both}
.welcome-name{font-family:Georgia,"Times New Roman",serif;font-size:74px;font-style:italic;line-height:1.3;letter-spacing:-.05em;margin-bottom:8px;animation:greeting-in .75s .12s cubic-bezier(.2,.65,.3,1) both}
.welcome-name>span{color:var(--accent)}
.welcome-greeting{font:italic 25px/1.5 Georgia,serif;color:var(--accent);margin-bottom:30px;animation:greeting-in .7s .3s ease both}
.welcome-line{display:block;width:36px;height:1px;margin:0 auto;background:var(--accent);transform-origin:left;animation:greeting-line .7s .4s ease both}
.portrait{width:112px;margin:0 0 12px;line-height:0}
.portrait img{display:block;width:100%;height:auto;border-radius:2px}
.profile-email{display:inline-flex;align-items:center;gap:8px;font:11px/1.6 var(--mono);color:var(--muted);min-height:44px;margin:0 0 12px;text-decoration:underline;text-decoration-style:dotted;text-decoration-color:var(--dim);text-underline-offset:5px}
.availability{margin-bottom:24px}
.profile{position:static}
.skip-link:focus{z-index:20}
body:has(:focus-visible) .welcome{display:none}
@keyframes welcome-scene{0%,67%{visibility:visible;opacity:1}99%{visibility:visible;opacity:0}100%{visibility:hidden;opacity:0}}
@keyframes greeting-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes greeting-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:761px) and (min-height:1000px){.profile{position:sticky;top:35px}}
@media(max-width:760px){.portrait{width:96px}.profile{margin-bottom:52px}.welcome-name{font-size:46px}.profile-email{font-size:11px}.availability{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.welcome{display:none}.welcome *{animation:none}}
@media print{.welcome{display:none}.portrait{width:75px}.profile-email{display:block}}