@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css";:root{--fg:#0a0a0a;--bg:#fff;--ease-out:cubic-bezier(.22, 1, .36, 1);--cols:4;--margin:16px;--gap:12px}@media (width>=768px){:root{--cols:8;--margin:32px;--gap:20px}}@media (width>=1280px){:root{--cols:12;--margin:40px;--gap:24px}}@media (width>=1440px){:root{--margin:48px}}*,:before,:after{box-sizing:border-box}body{color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-family:Pretendard Variable,Pretendard,-apple-system,Apple SD Gothic Neo,sans-serif}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}.headline{letter-spacing:-.03em;white-space:nowrap;margin:0;font-size:clamp(2rem,7vw,4.5rem);font-weight:700;line-height:1.08}.back-button{top:var(--margin);left:var(--margin);z-index:10;background:color-mix(in srgb, var(--fg) 7%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--fg);font:inherit;border:0;border-radius:999px;align-items:center;gap:6px;padding:11.5px;font-size:.875rem;font-weight:500;line-height:1;transition:background .25s;display:inline-flex;position:fixed}.back-button svg{width:18px;height:18px}.back-button__label{display:none}@media (hover:hover){.back-button:hover{background:color-mix(in srgb, var(--fg) 14%, transparent)}}@media (width>=768px){.back-button{padding:16.5px 24px 16.5px 20px;font-size:1rem}.back-button__label{display:inline}}.global-cursor{z-index:1000;mix-blend-mode:difference;pointer-events:none;background:#fff;border-radius:50%;place-items:center;width:32px;height:32px;display:grid;position:fixed;top:-16px;left:-16px}.global-cursor__glove{z-index:1000;pointer-events:none;width:40px;height:40px;position:fixed;top:-20px;left:-20px}.global-cursor__glove img{width:100%;height:100%;position:absolute;inset:0}@media (hover:hover) and (pointer:fine){*,:before,:after{cursor:none!important}}.headline__char{display:inline-block;position:relative}.headline__glyph{display:inline-block}.headline__blur{filter:url(#headline-vblur);display:inline-block;position:absolute;top:0;left:0}.intro{z-index:100;position:fixed;inset:0}.intro__light{position:absolute;inset:0}.intro__text{text-align:center;margin:0;position:absolute}.intro__base{color:color-mix(in srgb, var(--bg) 20%, transparent);display:block}.intro__fill{position:absolute;inset:0}.page-transition{position:relative}.page-transition__page{background:var(--bg);min-height:100svh;position:relative}.page-transition__page:after{content:"";z-index:100;background:rgb(0 0 0/var(--dim,0));pointer-events:none;position:absolute;inset:0}.segment-nav{background:color-mix(in srgb, var(--fg) 7%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px;padding:4px;display:inline-flex;position:relative}.segment-nav__indicator{background:var(--bg);box-shadow:0 1px 2px color-mix(in srgb, var(--fg) 8%, transparent), 0 2px 8px color-mix(in srgb, var(--fg) 6%, transparent);border-radius:999px;position:absolute;top:4px;bottom:4px;left:0}.segment-nav__item{z-index:1;color:color-mix(in srgb, var(--fg) 55%, transparent);border-radius:999px;padding:8px 14px;font-size:.875rem;font-weight:500;transition:color .3s;position:relative}.segment-nav__item[data-active]{color:var(--fg)}@media (hover:hover){.segment-nav__item:hover{color:var(--fg)}}@media (width>=768px){.segment-nav{padding:5px}.segment-nav__indicator{top:5px;bottom:5px}.segment-nav__item{padding:11px 22px;font-size:1rem}}.top-blur{--h:80px;z-index:9;height:var(--h);pointer-events:none;position:fixed;top:0;left:0;right:0}.top-blur__layer,.top-blur:after{opacity:0;transition:opacity .35s}.top-blur[data-visible] .top-blur__layer,.top-blur[data-visible]:after{opacity:1}.top-blur__layer{will-change:backdrop-filter;-webkit-backdrop-filter:blur(var(--blur)) saturate(160%);backdrop-filter:blur(var(--blur)) saturate(160%);-webkit-mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b), #000 var(--c), transparent var(--d));-webkit-mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b), #000 var(--c), transparent var(--d));mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b), #000 var(--c), transparent var(--d));position:absolute;inset:0}.top-blur__layer:last-child{-webkit-mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b));-webkit-mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b));mask-image:linear-gradient(to top, transparent var(--a), #000 var(--b))}.top-blur:after{content:"";background:linear-gradient(#ffffff4d 0%,#ffffff3d 15%,#ffffff2b 30%,#ffffff1a 45%,#ffffff0d 60%,#ffffff05 75%,#fff0 100%);position:absolute;inset:0}.site-header{top:var(--margin);z-index:10;position:fixed;left:50%;transform:translate(-50%)}.career-cta{border:1.5px solid var(--fg);background:var(--bg);border-radius:999px;align-items:center;gap:12px;padding:12px 24px;font-size:1.0625rem;font-weight:600;transition:background .25s,color .25s;display:inline-flex}.career-cta svg{width:22px;height:22px;transition:transform .25s}@media (hover:hover){.career-cta:hover{background:var(--fg);color:var(--bg)}.career-cta:hover svg{transform:translate(4px)}}@media (width>=768px){.career-cta{padding:14px 28px;font-size:1.25rem}}.float-icons{z-index:5;pointer-events:none;position:absolute;inset:0}.float-icon{top:var(--my);left:var(--mx);width:calc(var(--size) * .7);height:calc(var(--size) * .7);margin:calc(var(--size) * -.35) 0 0 calc(var(--size) * -.35);pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;position:absolute}.float-icon[data-mobile=hidden]{display:none}@media (width<=767px) and (height<=760px){.float-icon{width:calc(var(--size) * .5);height:calc(var(--size) * .5);margin:calc(var(--size) * -.25) 0 0 calc(var(--size) * -.25)}}@media (width>=768px){.float-icon{top:var(--ty);left:var(--tx);width:var(--size);height:var(--size);margin:calc(var(--size) * -.5) 0 0 calc(var(--size) * -.5)}.float-icon[data-mobile=hidden]{display:block}}@media (width>=1280px){.float-icon{top:var(--y);left:var(--x)}}@media (width>=1280px) and (height<=740px){.float-icon{width:calc(var(--size) * .75);height:calc(var(--size) * .75);margin:calc(var(--size) * -.375) 0 0 calc(var(--size) * -.375)}}.float-icon__body,.float-icon__body img{width:100%;height:100%}.float-icon__body img{object-fit:contain;pointer-events:none}.float-icon__placeholder{background:radial-gradient(circle at 30% 25%, #ffffffd9 0 8%, transparent 22%), radial-gradient(circle at 70% 80%, #00000040, transparent 55%), var(--color);border-radius:38%;width:100%;height:100%;display:block;box-shadow:inset -6px -8px 14px #0000002e,inset 6px 6px 12px #ffffff59,0 12px 24px #0000001f}.float-icons__edit{z-index:2000;pointer-events:auto;flex-direction:column;align-items:flex-end;gap:8px;font-size:.875rem;display:flex;position:fixed;bottom:16px;right:16px}.float-icons__edit-row{align-items:center;gap:8px;display:flex}.float-icons__edit textarea{border:1px solid var(--fg);background:var(--bg);width:min(320px,100vw - 32px);color:var(--fg);resize:none;border-radius:8px;padding:10px;font:.8125rem/1.5 ui-monospace,monospace}.float-icons__edit button{background:var(--fg);color:var(--bg);font:inherit;border:0;border-radius:999px;padding:10px 16px;font-weight:600}.cursor-badge{z-index:50;background:color-mix(in srgb, var(--fg) 25%, transparent);width:48px;height:48px;color:var(--bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none;border-radius:50%;place-items:center;display:grid;position:fixed;top:-24px;left:-24px}.cursor-badge__arrow{width:20px;height:20px}.project-cards{--card-h:60px;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.pcard{min-width:0;height:var(--card-h);background:color-mix(in srgb, var(--fg) 5%, transparent);border-radius:12px;position:relative;overflow:hidden;container-type:size}.pcard__link{height:100%;display:block}.pcard__base{display:none}.pcard__skin{background:var(--skin-bg);color:var(--skin-ink);position:absolute;inset:0}.pcard__skin-content{grid-template-columns:auto 1fr auto;grid-template-areas:"logo phrase arrow";align-items:center;padding:0 14px;display:grid;position:absolute;inset:0}.pcard__art,.pcard__phrase--wide,.pcard__narrow-content{display:none}.pcard__logo{grid-area:logo;width:auto;height:24px}.pcard__phrase--line{text-overflow:ellipsis;white-space:nowrap;grid-area:phrase;font-size:.9375rem;font-weight:600;overflow:hidden}.pcard__logo+.pcard__phrase--line{margin-left:12px}.pcard__skin-content>.pcard__arrow{grid-area:arrow;width:22px;height:22px}@container (height>=96px){.pcard__skin-content{grid-template-columns:1fr auto;grid-template-areas:"logo arrow""phrase phrase";align-content:space-between;padding:14px}.pcard__logo{height:28px}.pcard__logo+.pcard__phrase--line{margin-left:0}.pcard__skin-content>.pcard__arrow{align-self:start}}@media (hover:none) and (width>=768px){.project-cards{--card-h:96px}.portfolio-page .project-cards .pcard__skin-content{flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;padding:0 14px;display:flex}.portfolio-page .project-cards .pcard__skin-content>.pcard__logo,.portfolio-page .project-cards .pcard__phrase--line{z-index:1;max-width:50%}.portfolio-page .project-cards .pcard__skin-content>.pcard__logo{height:28px}.portfolio-page .project-cards .pcard__logo+.pcard__phrase--line{margin-left:0}.portfolio-page .project-cards .pcard__art{background-position:50%;background-repeat:no-repeat;background-size:auto 100%;width:60%;display:block;position:absolute;inset:0 0 0 auto;-webkit-mask-image:linear-gradient(90deg,#0000,#000 30%);mask-image:linear-gradient(90deg,#0000,#000 30%)}.portfolio-page .project-cards .pcard[data-project=video] .pcard__art{background-position:100%}.portfolio-page .project-cards .pcard__skin-content>.pcard__arrow{z-index:1;position:absolute;top:14px;right:14px}}@media (hover:hover) and (width>=768px){.project-cards{--card-h:180px;flex-direction:row}.pcard{flex:1 1 0;transition:flex-grow 1s cubic-bezier(.65,0,.35,1)}.pcard__link{cursor:none}.pcard__base{z-index:1;color:var(--skin-ink);justify-content:space-between;align-items:flex-start;gap:12px;padding:20px;transition:opacity .3s;display:flex;position:absolute;inset:0}.pcard__head{flex-direction:column;flex:1;align-items:flex-start;gap:12px;min-width:0;display:flex}.pcard__tag{text-overflow:ellipsis;background:color-mix(in srgb, currentColor 16%, transparent);white-space:nowrap;border-radius:6px;max-width:100%;padding:3px 8px;font-size:.875rem;font-weight:500;overflow:hidden}.pcard__head .pcard__logo{object-fit:contain;object-position:left;width:auto;max-width:100%;height:clamp(24px,13cqh,32px)}.pcard__title{font-size:1.25rem;font-weight:600;line-height:1.3}.pcard__arrow{flex:none;width:22px;height:22px}.pcard__skin-content{width:var(--open-w,100%);opacity:0;padding:0;transition:opacity .3s;display:block;right:auto;container-type:size}.project-cards .pcard:is(:hover,:has(.pcard__link:focus-visible)){flex-grow:7}.pcard:is(:hover,:has(.pcard__link:focus-visible)) .pcard__skin-content,.pcard:is(:hover,:has(.pcard__link:focus-visible)) .pcard__art{opacity:1;transition-duration:.6s}.pcard:is(:hover,:has(.pcard__link:focus-visible)) .pcard__base,.project-cards:is(:has(.pcard:hover),:has(.pcard__link:focus-visible)) .pcard__base{opacity:0}.pcard__art{width:var(--open-w,100%);background-position:50%;background-repeat:no-repeat;background-size:auto max(100%, calc(var(--open-w) * 440 / 1837));opacity:0;transition:opacity .3s;display:block;position:absolute;top:0;bottom:0;left:0}.pcard__phrase--wide{white-space:nowrap;flex-direction:column;font-size:clamp(18px,10.9cqh,32px);font-weight:600;line-height:1.2;display:flex;position:absolute;top:50%;left:18.2cqh;transform:translateY(-50%)}.pcard__chip{background:color-mix(in srgb, currentColor 16%, transparent);border-radius:6px;align-self:flex-start;margin-bottom:.55em;padding:.3em .65em;font-size:max(11px,.58em);font-weight:500;line-height:1.3}.pcard__skin-content>.pcard__logo{height:clamp(36px,21.8cqh,64px);position:absolute;top:50%;right:18.6cqh;transform:translateY(-50%)}.pcard__phrase--line,.pcard__skin-content>.pcard__arrow{display:none}@container (height>=300px){.pcard__base{padding:10cqh}.pcard__art{opacity:1;background-position:bottom;background-size:auto 70%;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(#0000 30%,#000 40%);mask-image:linear-gradient(#0000 30%,#000 40%)}.pcard[data-project=video] .pcard__art{background-position:100% 100%;background-size:calc(var(--open-w) * 2.2) auto}.pcard__phrase--wide{font-size:5.7cqh;top:10cqh;bottom:auto;left:10cqh;transform:none}.pcard__skin-content>.pcard__logo{height:11.4cqh;top:10cqh;bottom:auto;right:10cqh;transform:none}.project-cards:is(:has(.pcard:hover),:has(.pcard__link:focus-visible)) .pcard:not(:hover):not(:has(.pcard__link:focus-visible)) .pcard__art{opacity:0}}}@media (hover:hover) and (width>=768px) and (width<=1414px){@container (height<=299px){.pcard__art{background-position:calc(var(--open-w) * .7 - var(--card-h) * 2.0875) center;background-size:auto 100%;-webkit-mask-image:linear-gradient(90deg,#0000 35%,#000 55%);mask-image:linear-gradient(90deg,#0000 35%,#000 55%)}.pcard[data-project=video] .pcard__art{background-position:100%}.pcard__narrow-content{flex-direction:column;align-items:flex-start;gap:8px;display:flex;position:absolute;top:50%;left:24px;transform:translateY(-50%)}.pcard__narrow-content>.pcard__chip{margin-bottom:0}.pcard__narrow-content>.pcard__logo{object-fit:contain;object-position:left;width:auto;height:28px}.pcard__phrase--narrow{white-space:nowrap;flex-direction:column;font-size:clamp(16px,2.35cqw,18px);font-weight:600;line-height:1.2;display:flex}.pcard__phrase--wide,.pcard__skin-content>.pcard__logo{display:none}}}@media (hover:hover) and (width>=1280px){.project-cards{--card-h:220px}}@media (hover:hover) and (width>=1280px) and (height<=740px){.project-cards{--card-h:170px}}.home{flex-direction:column;height:100svh;display:flex;position:relative;overflow:hidden}.home__hero{min-height:0;padding:calc(var(--margin) + 56px + var(--gap)) var(--margin) var(--gap);flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex;position:relative}.home__title{align-items:center;gap:calc(var(--gap) * 2);flex-direction:column;display:flex}.home__headline{text-align:center}.home__headline .headline__char{transform-origin:50% 100%}.home__cta{z-index:6;position:relative}.home__projects{z-index:6;padding:0 var(--margin) var(--margin);position:relative}@media (width>=768px) and (width<=1279px){.home{height:auto;overflow:visible}.home__hero{height:max(600px,70svh);padding-top:calc(var(--margin) + 64px + var(--gap));flex:none}.home__projects{padding-bottom:calc(var(--margin) * 2)}}@media (width>=1280px){.home__hero{padding-top:calc(var(--margin) + 88px + 100px);justify-content:flex-start}}@media (width>=1280px) and (height<=860px){.home__hero{padding-top:calc(var(--margin) + 88px + min(200px, 12svh) - 100px)}}@media (width>=1280px) and (height<=740px){.home__hero{padding-top:calc(var(--margin) + 88px);justify-content:center}}.pop-text{white-space:nowrap;margin:0}.pop-text__char{transform-origin:50% 100%;display:inline-block}.portfolio-page{padding:calc(var(--margin) + 72px + var(--gap) * 2) var(--margin) calc(var(--margin) * 2)}.portfolio-page__title{letter-spacing:-.03em;font-size:84px;font-weight:700;line-height:1.05}.portfolio-page__list{margin-top:calc(var(--gap) * 1.2)}@media (hover:none),(width<=767px){.portfolio-page .project-cards{--card-h:120px}}@media (hover:hover) and (width>=768px){.portfolio-page .project-cards{--card-h:360px}}@media (hover:hover) and (width>=1280px){.portfolio-page .project-cards{--card-h:420px}}.scroll-top-button{right:var(--margin);bottom:var(--margin);z-index:20;opacity:0;width:46px;height:46px;color:var(--bg);background:color-mix(in srgb, var(--fg) 82%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none;border:0;border-radius:50%;place-items:center;padding:0;transition:background .25s,opacity .3s,transform .3s;display:grid;position:fixed;transform:translateY(12px);box-shadow:0 6px 20px #00000038}.scroll-top-button--visible{opacity:1;pointer-events:auto;transform:translateY(0)}.scroll-top-button svg{width:20px;height:20px;transform:rotate(90deg)}.scroll-top-button:focus-visible{outline-offset:3px;outline:3px solid #0365fc}@media (hover:hover){.scroll-top-button:hover{background:var(--fg)}}@media (width>=768px){.scroll-top-button{width:52px;height:52px}}@media (prefers-reduced-motion:reduce){.scroll-top-button{transition:background .25s,opacity .01ms;transform:none}}.video-page{padding:calc(var(--margin) + 72px + var(--gap) * 2) var(--margin) calc(var(--margin) * 2)}.video-page__header{justify-content:space-between;align-items:flex-end;gap:var(--gap);min-width:0;display:flex}.video-page__title{letter-spacing:-.03em;flex:none;font-size:clamp(3rem,5.833vw,84px);font-weight:700;line-height:1.05}.video-filters{scrollbar-width:none;flex-wrap:nowrap;flex:0 auto;justify-content:flex-start;gap:8px;min-width:0;display:flex;overflow-x:auto}.video-filters::-webkit-scrollbar{display:none}.video-filter{border:1px solid var(--fg);color:var(--fg);font:inherit;cursor:pointer;isolation:isolate;background:0 0;border-radius:999px;flex:none;padding:8px 14px;font-size:.875rem;font-weight:600;line-height:1;transition:color .25s;position:relative}.video-filter__pill{z-index:-1;border-radius:inherit;background:var(--fg);position:absolute;inset:-1px}.video-filter[aria-pressed=true]{color:var(--bg)}.video-filter:focus-visible,.video-card:focus-visible,.video-page__playlist:focus-visible{outline-offset:3px;outline:3px solid #0365fc}.video-grid{gap:calc(var(--gap) * 2) var(--gap);margin-top:calc(var(--gap) * 1.5);grid-template-columns:1fr;display:grid}.video-card{flex-direction:column;min-width:0;display:flex}.video-card__thumbnail{aspect-ratio:16/9;background:color-mix(in srgb, var(--fg) 6%, transparent);border-radius:8px;display:block;position:relative;overflow:hidden}.video-card__thumbnail img{object-fit:cover;width:100%;height:100%;transition:transform .4s var(--ease-out)}.video-card__badge{color:var(--bg);background:var(--fg);border-radius:5px;padding:5px 8px;font-size:.75rem;font-weight:600;line-height:1;position:absolute;top:8px;left:8px}.video-card__duration{color:#fff;background:#000000b3;border-radius:4px;padding:4px 6px;font-size:.75rem;font-weight:600;line-height:1;position:absolute;bottom:8px;right:8px}.video-card__title{text-underline-offset:3px;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:12px;font-size:1.125rem;font-weight:650;line-height:1.4;text-decoration-line:underline;text-decoration-color:#0000;text-decoration-thickness:1px;display:-webkit-box;overflow:hidden}.video-card__meta{color:color-mix(in srgb, var(--fg) 52%, transparent);margin-top:6px;font-size:.875rem;line-height:1.4}.video-page__playlist{margin-top:calc(var(--gap) * 3);text-underline-offset:4px;font-size:1rem;font-weight:600;text-decoration:underline;display:inline-block}@media (hover:hover){.video-card:hover .video-card__thumbnail img{transform:scale(1.04)}.video-card:hover .video-card__title{text-decoration-color:currentColor}}@media (width>=768px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1280px){.video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=767px){.video-page__header{flex-direction:column;align-items:stretch}.video-page__title{font-size:clamp(2.5rem,12vw,4rem)}.video-filters{margin-right:calc(var(--margin) * -1);padding-right:var(--margin);justify-content:flex-start}}@media (hover:hover) and (pointer:fine){.video-card__thumbnail{cursor:none}}.video-grid{position:relative}.project-page{--slide-edge:8px;padding:calc(var(--margin) + 72px) var(--slide-edge) var(--slide-edge)}.project-slides{flex-direction:column;gap:0;display:flex}.project-slide{aspect-ratio:16/9;background:color-mix(in srgb, var(--fg) 6%, transparent);border-radius:0;margin:0;overflow:hidden}.project-slide img{object-fit:cover;width:100%;height:100%}.project-slide__placeholder{height:100%;color:color-mix(in srgb, var(--fg) 45%, transparent);place-items:center;font-size:clamp(.875rem,1.6vw,1.25rem);font-weight:500;display:grid}.project-slide{position:relative}.project-slide__link{border-radius:8px;position:absolute}.project-slide__link:focus-visible{outline-offset:2px;outline:3px solid #0365fc}
