:root{color-scheme:dark;--paper:#0f1114;--raise:#191d22;--grid:#171a1f;--grid-major:#272c34;--ink:#f1f3f5;--muted:#9aa1ab;--red:#e5372c;--green:#2e9e4f;--blue:#2f6be0;--magenta:#c2309c;--teal:#0e9aa7;--key:#ffc400;--on-key:#000;--display:"Archivo", "IBM Plex Sans KR", sans-serif;--body:"IBM Plex Sans KR", system-ui, sans-serif;--pad:clamp(16px, 4vw, 56px);--inline:max(var(--pad), calc((100% - 1200px) / 2))}*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font:400 17px/1.7 var(--body);word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;margin:0}h1,h2,h3,p{margin:0}a{color:inherit}img{max-width:100%;height:auto;display:block}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.draft-note{padding:6px var(--pad);color:var(--muted);text-align:center;border-bottom:1px dashed var(--grid-major);font-size:13px}.top{padding:18px var(--pad);align-items:center;gap:32px;display:flex}.logo{flex-shrink:0;line-height:0;display:block}.logo img{width:auto;height:64px;display:block}@media (width<=860px){.logo img{height:44px}}.top nav{gap:24px;margin-left:auto;display:flex}.top nav a,.lang a{font-size:15px;font-weight:500;text-decoration:none}.top nav a:hover{text-underline-offset:4px;text-decoration:underline}.lang{gap:10px;font-size:14px;display:flex}.lang a{color:var(--muted)}.lang a[aria-current]{color:var(--ink)}.hero{padding:clamp(24px, 3vw, 40px) var(--inline) 56px;background-color:var(--paper);background-image:linear-gradient(var(--grid-major) 1px, transparent 1px), linear-gradient(90deg, var(--grid-major) 1px, transparent 1px), linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-position:-1px -1px;background-size:160px 160px,160px 160px,32px 32px,32px 32px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;gap:40px clamp(32px,5vw,72px);display:grid}.stage{touch-action:pan-y;position:relative}.graph{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.curve{fill:none;stroke:var(--red);stroke-width:3px;stroke-linecap:round}.guide{stroke:var(--ink);stroke-width:1px}.guide-peak{stroke-dasharray:6 6;opacity:.45}.guide-floor{stroke-width:2px}.playhead{stroke:var(--ink);stroke-width:1.5px;opacity:0}.tangent{stroke:var(--muted);stroke-width:1.5px}.tangent-end{fill:var(--paper);stroke:var(--muted);stroke-width:1.5px}.handle{cursor:grab;touch-action:none}.handle:active{cursor:grabbing}.handle .hit{fill:#0000}.handle .diamond{fill:var(--key);stroke:var(--ink);stroke-width:2px;transform-box:fill-box;transform-origin:50%;transition:transform .15s;transform:rotate(45deg)}.handle:hover .diamond,.handle.is-dragging .diamond{transform:rotate(45deg)scale(1.35)}.handle:focus{outline:none}.handle:focus-visible .diamond{stroke:var(--blue);stroke-width:3px}.word{pointer-events:none;position:absolute;inset:0}.letter{font-family:var(--display);font-size:var(--letter-size,160px);font-variation-settings:"wdth" 100, "wght" 800;transform-origin:50% 100%;will-change:transform;user-select:none;line-height:1;position:absolute;top:0;left:0}.mark{color:var(--muted);white-space:nowrap;background:var(--paper);padding:0 6px;font-size:13px;font-weight:500;position:absolute}.hint{top:calc(var(--floor,100%) + 4px);color:var(--muted);align-items:center;gap:12px;font-size:14px;display:flex;position:absolute;right:0}.hint:before{content:"";background:var(--key);border:1.5px solid var(--ink);width:10px;height:10px;transform:rotate(45deg)}.hint button{font:inherit;color:var(--ink);border:1px solid var(--grid-major);cursor:pointer;background:0 0;border-radius:4px;padding:2px 10px;font-size:13px}.hint button:hover{border-color:var(--ink)}.intro h1{letter-spacing:-.025em;font-size:clamp(32px,3.4vw,48px);font-weight:700;line-height:1.16}.intro p{color:var(--muted);max-width:30em;margin-top:18px}@media (width<=960px){.hero{grid-template-columns:minmax(0,1fr)}.stage{height:clamp(220px,34svh,300px)}}@media (width<=520px){.hero{padding-bottom:88px}.hint{top:calc(var(--floor,100%) + 34px);left:0;right:auto}}.actions{flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:20px;display:flex}.btn{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:0;border-radius:4px;padding:13px 22px;font-weight:500;text-decoration:none;transition:background .15s,color .15s;display:inline-block}.btn:hover{background:var(--red);color:#fff}.text-link{text-underline-offset:5px;font-weight:500;text-decoration-thickness:1.5px}.text-link:hover{color:var(--red)}.work,.career,.about,.contact{padding:clamp(72px, 10vw, 140px) var(--inline)}.work{padding-top:clamp(48px,6vw,88px)}.section-head{flex-wrap:wrap;align-items:baseline;gap:8px 32px;margin-bottom:40px;display:flex}.section-head h2{letter-spacing:-.02em;font-size:clamp(30px,3.4vw,46px);line-height:1.2}.section-head p{color:var(--muted);max-width:36em}.track{margin:0;padding:0;list-style:none;position:relative}.track:before{content:"";background:var(--ink);width:2px;position:absolute;top:0;bottom:0;left:23px}.row>a,.row>div{border-bottom:1px solid var(--grid-major);color:inherit;grid-template-columns:48px 64px minmax(0,1fr) auto 168px;align-items:center;gap:20px;padding:20px 0;text-decoration:none;display:grid}.key{background:var(--paper);border:2px solid var(--ink);justify-self:center;width:16px;height:16px;transition:background .15s;position:relative;transform:rotate(45deg)}.row>a:hover .key,.row>a:focus-visible .key{background:var(--key)}.year{color:var(--muted);font-variant-numeric:tabular-nums;font-size:15px;font-weight:500}.title{letter-spacing:-.015em;font-size:clamp(22px,2.4vw,32px);font-weight:700;line-height:1.25;display:block}.desc{color:var(--muted);margin-top:2px;font-size:15px;display:block}.roles{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.roles span{border:1.5px solid var(--c,var(--ink));white-space:nowrap;border-radius:999px;padding:2px 10px;font-size:13px;font-weight:500}.thumb{aspect-ratio:4/3;object-fit:cover;border:2px solid var(--ink);width:168px;transition:transform .2s}.row>a:hover .thumb{transform:translateY(-3px)rotate(-1.5deg)}.row-next>div{grid-template-columns:48px 64px minmax(0,1fr)}.row-next .key{background:0 0;border-style:dashed}.row-next .title{color:var(--muted)}.tabs{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.tab{min-height:48px;font:inherit;color:var(--ink);border:1.5px solid var(--ink);cursor:pointer;background:0 0;border-radius:4px;align-items:center;gap:10px;padding:8px 18px 8px 16px;scroll-margin-top:40px;font-size:17px;font-weight:700;line-height:1.3;transition:background .15s,color .15s;display:inline-flex}.tab:before{content:"";background:var(--c);flex-shrink:0;width:12px;height:12px}.tab:hover{background:var(--raise)}.tab[aria-selected=true]{color:var(--on-key);background:var(--key);border-color:var(--key)}.count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:14px;font-weight:500}.tab[aria-selected=true] .count{color:var(--on-key)}.panel{border-top:2px solid var(--ink)}.panel-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;padding:16px 0 8px;display:flex}.panel-desc{color:var(--muted)}.panel .track:before{background:var(--c)}@media (prefers-reduced-motion:no-preference){.has-switched .panel .track:before{transform-origin:top;animation:.6s cubic-bezier(.2,.7,.2,1) backwards track-draw}.has-switched .panel .row{animation:row-in .45s cubic-bezier(.2, .7, .2, 1) var(--delay,0s) backwards}.has-switched .panel .key{animation:key-set .4s cubic-bezier(.3, 1.5, .5, 1) calc(var(--delay,0s) + .1s) backwards}.panel .row:nth-child(2){--delay:70ms}.panel .row:nth-child(3){--delay:.14s}.panel .row:nth-child(n+4){--delay:.21s}}@keyframes track-draw{0%{transform:scaleY(0)}}@keyframes row-in{0%{opacity:0;transform:translateY(14px)}}@keyframes key-set{0%{transform:rotate(45deg)scale(0)}}.career{padding-top:clamp(40px,6vw,72px)}.chart{gap:4px;margin-bottom:48px;display:grid}.chart-row{grid-template-columns:144px minmax(0,1fr);align-items:center;gap:16px;display:grid}.chart-name{text-align:right;white-space:nowrap;font-size:14px;font-weight:500}.chart-track{background:repeating-linear-gradient(90deg, var(--grid-major) 0 1px, transparent 1px 9.5238%);height:24px;position:relative}.chart-ticks{background:0 0;height:22px}.chart-ticks span{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:12px;position:absolute;bottom:2px;transform:translate(-50%)}.chart-bar{background:var(--red);min-width:2px;height:4px;position:absolute;top:50%;transform:translateY(-50%)}.chart-bar:before,.chart-bar:after{content:"";background:var(--paper);border:2px solid var(--ink);width:9px;height:9px;position:absolute;top:50%;transform:translate(-50%,-50%)rotate(45deg)}.chart-bar:before{left:0}.chart-bar:after{left:100%}.chart-bar.is-now:after{background:var(--key)}.jobs{border-top:2px solid var(--ink);margin:0;padding:0;list-style:none}.job{border-bottom:1px solid var(--grid-major);grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px 40px;padding:22px 0;display:grid}.job h3{font-size:clamp(20px,2vw,26px);line-height:1.3}.job-period{color:var(--muted);font-variant-numeric:tabular-nums;font-size:15px}.job-length{color:var(--ink);margin-left:10px;font-weight:500}.job-body{gap:6px;max-width:40em;display:grid}.job-role{font-weight:700}.job-tools{flex-wrap:wrap;gap:6px;margin:6px 0 0;padding:0;list-style:none;display:flex}.job-list{gap:4px;margin:4px 0 0;padding:0;list-style:none;display:grid}.job-list li{padding-left:20px;position:relative}.job-list li:before{content:"";border:1.5px solid var(--ink);width:7px;height:7px;position:absolute;top:.62em;left:3px;transform:rotate(45deg)}.job-tools li{border:1.5px solid var(--ink);border-radius:999px;padding:2px 10px;font-size:13px;font-weight:500}.todo{color:var(--muted);text-decoration:underline dashed var(--grid-major);text-underline-offset:6px}@media (width<=860px){.chart-row{grid-template-columns:84px minmax(0,1fr);gap:10px}.chart-name{white-space:normal;font-size:12px;line-height:1.25}.chart-ticks span.minor{display:none}.job{grid-template-columns:1fr}}.about{border-top:2px solid var(--ink)}.values{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;display:grid}.value h3{margin-bottom:12px;font-size:clamp(28px,3vw,40px);line-height:1.2}.value p{color:var(--muted);max-width:22em}.solo{border-top:2px solid var(--ink);margin-top:72px;padding-top:28px}.solo h3{letter-spacing:-.015em;font-size:clamp(24px,2.4vw,32px);line-height:1.3}.solo-points{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 40px;margin-top:24px;display:grid}.solo h4{margin:0 0 6px;font-size:19px}.solo p{color:var(--muted);max-width:24em}.solo .text-link{color:var(--ink);white-space:nowrap}@media (width<=860px){.solo-points{grid-template-columns:minmax(0,1fr)}}.services{border-top:2px solid var(--ink);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;margin-top:72px;padding-top:28px;display:grid}.service h3{align-items:center;gap:10px;margin-bottom:4px;font-size:20px;display:flex}.service h3:before{content:"";background:var(--c);width:12px;height:12px}.service p{color:var(--muted);font-size:16px}.contact{border-top:2px solid var(--ink)}.contact h2{letter-spacing:-.03em;margin-bottom:20px;font-size:clamp(34px,5.4vw,76px);line-height:1.15}.contact>p{color:var(--muted)}.foot{padding:24px var(--inline);color:var(--muted);border-top:1px solid var(--grid-major);justify-content:space-between;font-size:14px;display:flex}@media (width<=860px){.values,.services{grid-template-columns:1fr;gap:28px}.row>a{grid-template-columns:32px minmax(0,1fr);grid-template-areas:"key thumb""key year""key text""key roles";gap:6px 16px}.row>a .key{grid-area:key;align-self:start;margin-top:8px}.row>a .thumb{grid-area:thumb;width:100%;margin-bottom:10px}.row>a .year{grid-area:year}.row>a .text{grid-area:text}.row>a .roles{grid-area:roles;justify-content:flex-start;margin-top:6px}.row-next>div{grid-template-columns:32px 56px minmax(0,1fr)}.track:before{left:15px}.tabs{gap:6px}.tab{gap:7px;min-height:44px;padding:6px 12px 6px 10px;font-size:15px}.tab:before{width:10px;height:10px}.count{font-size:13px}.top,.top nav{gap:16px}}.admin-bar{padding:8px var(--pad);color:var(--on-key);background:var(--key);flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 18px;font-size:14px;font-weight:500;display:flex}.admin-bar .text-link{color:inherit;font:inherit;cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:0;text-decoration:underline}.foot-links{align-items:center;gap:18px;display:flex}.foot-admin{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;padding:0}.foot-admin:hover{color:var(--ink);text-underline-offset:4px;text-decoration:underline}.gate{background:var(--raise);border:2px solid var(--ink);border-radius:4px;gap:12px;max-width:460px;padding:28px;display:grid}.gate-title{text-wrap:balance;font-size:19px;font-weight:700;line-height:1.5}.gate label{font-size:14px;font-weight:500}.gate-row{gap:8px;display:flex}.gate input{min-width:0;font:inherit;background:var(--paper);border:1.5px solid var(--ink);border-radius:4px;flex:1;padding:12px 14px}.gate input[aria-invalid=true]{border-color:var(--red)}.gate-error{color:var(--red);font-size:15px;font-weight:500}.gate-help{color:var(--muted);font-size:15px}.gate{position:relative}.login{color:var(--ink);background:0 0;border:0;padding:0}.login::backdrop{background:#0009}.login .gate{width:min(460px,100vw - 32px)}.login .gate-title{padding-right:32px}.login-close{width:36px;height:36px;font:400 24px/1 var(--body);color:var(--muted);cursor:pointer;background:0 0;border:0;position:absolute;top:10px;right:10px}.login-close:hover{color:var(--ink)}.row.is-private .title:after{content:"비공개";letter-spacing:0;vertical-align:middle;color:var(--on-key);background:var(--key);border-radius:999px;margin-left:10px;padding:1px 9px;font-size:13px;font-weight:700;line-height:1.6;display:inline-block}.row.is-private .key{border-style:dashed}.row-empty .title{color:var(--muted)}
