/* generated from styles.css 6a14b6ab66a9 by _build/build.py: edit styles.css, then build */
@view-transition { navigation: auto; }
:root{
--ink-navy:#1D2430;
--gold-bronze:#B8893A;
--gold-light:#D9B36A;
--warm-cream:#FAF5EE;
--soft-navy:#33405C;
--antique-gold:#B4914F;
--dusty-rose:#8C4A56;
--slate:#5F6B7D;
--white:#FFFFFF;
--cream-deep:#F2E9DA;
--cream-edge:#E7DDCB;
--cream-rule:#D6C9B2;
--gold-deep:#7F5C1C;
--ink-deep:#151B25;
--ink-70:#4A5462;
--ink-on-dark:#C6CDD8;
--ink-on-dark-dim:#98A2AF;
--green-deep:#2F6B4F;
--green-tint:#EAF3ED;
}
@font-face{font-family:"Garamond fallback mac";src:local("Iowan Old Style");size-adjust:84.6%}
@font-face{font-family:"Garamond fallback mac";font-style:italic;src:local("Iowan Old Style Italic");size-adjust:97%}
@font-face{font-family:"Garamond fallback win";src:local("Georgia");size-adjust:85.8%}
@font-face{font-family:"Garamond fallback win";font-style:italic;src:local("Georgia Italic");size-adjust:82%}
@font-face{font-family:"Noto fallback mac";src:local("Apple SD Gothic Neo"),local("AppleSDGothicNeo-Regular");size-adjust:105%;unicode-range:U+1100-11FF,U+3130-318F,U+A960-A97F,U+AC00-D7AF,U+D7B0-D7FF}
@font-face{font-family:"Noto fallback mac";font-weight:700;src:local("AppleSDGothicNeo-Bold");size-adjust:105%;unicode-range:U+1100-11FF,U+3130-318F,U+A960-A97F,U+AC00-D7AF,U+D7B0-D7FF}
:root{
color-scheme:light;
--surface:var(--warm-cream);
--surface-raised:var(--white);
--surface-sunken:var(--cream-deep);
--surface-inverse:var(--ink-navy);
--fg:var(--ink-navy);
--fg-body:var(--fg);
--fg-muted:var(--slate);
--fg-muted-sunken:var(--ink-70);
--fg-inverse:var(--warm-cream);
--fg-inverse-body:var(--ink-on-dark);
--fg-inverse-muted:var(--ink-on-dark-dim);
--accent:var(--gold-bronze);
--accent-ink:var(--gold-deep);
--accent-inverse:var(--gold-light);
--accent-mark:color-mix(in srgb,var(--gold-bronze) 80%,var(--ink-navy));
--highlight:color-mix(in srgb,var(--gold-light) 55%,transparent);
--highlight-inverse:color-mix(in srgb,var(--gold-light) 30%,transparent);
--line:var(--cream-edge);
--line-strong:var(--cream-rule);
--rule:var(--line);
--line-inverse:rgb(255 255 255 / .16);
--line-interactive:color-mix(in srgb,var(--gold-deep) 78%,var(--warm-cream));
--live:var(--green-deep);
--surface-status:var(--cream-edge);
--live-tint:var(--green-tint);
--focus-ring:var(--ink-navy);
--focus-halo:var(--white);
--font-display:'EB Garamond','Garamond fallback mac','Garamond fallback win','Times New Roman',serif;
--font-body:'Plus Jakarta Sans','Noto Sans KR','Noto fallback mac',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--font-kr:'Noto Sans KR','Plus Jakarta Sans','Noto fallback mac',-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
--t-hero:clamp(3rem,8.4vw,7.6rem);
--t-h1:clamp(2.6rem,6.2vw,5.6rem);
--t-h2:clamp(2rem,4vw,3.4rem);
--t-h2-sm:clamp(1.6rem,2.8vw,2.3rem);
--t-statement:clamp(1.7rem,3.5vw,3.05rem);
--t-figure:clamp(3.6rem,9.6vw,8.6rem);
--t-h3:clamp(1.25rem,1.7vw,1.5rem);
--t-lead:clamp(1.125rem,.88rem + .48vw,1.3125rem);
--t-body:clamp(1.0625rem,1rem + .25vw,1.125rem);
--t-small:1rem;
--t-caption:.875rem;
--t-label:.8125rem;
--label-track:.14em;
--label-track-kr:.04em;
--track-text:.012em; --track-small:.016em; --track-lead:.006em; --word-text:.05em;
--lh-text:1.62; --lh-small:1.56; --lh-lead:1.5;
--measure:33em; --measure-lead:28em;
--wrap:1280px;
--gutter:clamp(20px,4.6vw,56px);
--gap:clamp(16px,2.2vw,32px);
--col-gap:clamp(28px,4vw,64px);
--col4:calc(25% + var(--gap) * .75);
--col4-w:calc(75% - var(--gap) * .75);
--section:clamp(88px,10.5vw,168px);
--section-tight:clamp(56px,6.5vw,104px);
--radius-xs:2px;
--radius-sm:4px;
--radius:8px;
--radius-pill:999px;
--shadow-overlay:0 24px 48px rgb(29 36 48 / .14),0 0 18px rgb(29 36 48 / .06);
--shadow-raise:0 10px 24px rgb(29 36 48 / .08),0 1px 3px rgb(29 36 48 / .06);
--dur-1:50ms;  --dur-2:100ms; --dur-3:150ms;
--dur-4:200ms; --dur-5:250ms; --dur-6:300ms;
--dur-slow:620ms; --dur-slower:900ms;
--ease:cubic-bezier(.35,0,.35,1);
--ease-enter:cubic-bezier(0,0,.15,1);
--ease-exit:cubic-bezier(.35,0,1,1);
--ease-enter-expressive:cubic-bezier(.03,.4,.1,1);
--beat:var(--dur-2);
--ease-settle:var(--ease-enter);
--ease-spring:var(--ease-enter);
--shadow-lift:0 14px 26px -12px rgb(29 36 48 / .38),0 3px 8px -3px rgb(29 36 48 / .14);
--shadow-set:0 1px 2px rgb(29 36 48 / .18);
}
@supports (transition-timing-function:linear(0,1)){
:root{
--ease-settle:linear(0, 0.227 5.6%, 0.355 9%, 0.476 12.6%, 0.579 16.2%, 0.67 20%, 0.747 24%, 0.81 28.2%,
0.861 32.6%, 0.9 37.2%, 0.932 42.4%, 0.956 48.2%, 0.974 54.8%, 0.986 62.4%, 0.993 71.6%, 1);
--ease-spring:linear(0, 0.052 1.2%, 0.119 2.6%, 0.4 8%, 0.519 10.4%, 0.625 12.8%, 0.718 15.2%, 0.808 18%,
0.846 19.4%, 0.883 21%, 0.939 24%, 0.981 27.4%, 1.001 29.8%, 1.016 32.6%, 1.025 35.4%, 1.028 38.8%,
1.002 66.6%, 1);
}
}
html[lang^="ko"]{
--track-text:0; --track-small:0; --track-lead:0; --word-text:0;
--lh-text:1.8; --lh-small:1.75; --lh-lead:1.7;
--measure:28em; --measure-lead:26em;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:96px}
@media (prefers-reduced-motion:no-preference){html:focus-within{scroll-behavior:smooth}}
body{
margin:0;background:var(--surface);color:var(--fg-body);
font-family:var(--font-body);font-size:var(--t-body);line-height:var(--lh-text);
letter-spacing:var(--track-text);word-spacing:var(--word-text);font-feature-settings:"liga" 1,"kern" 1;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
font-optical-sizing:auto;font-variant-numeric:proportional-nums;
text-rendering:optimizeLegibility;
}
html[lang^="ko"] body{font-family:var(--font-kr);font-size:1.0625rem}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:var(--accent-ink);text-decoration:none}
p{margin:0 0 1em;text-wrap:pretty}
:is(li,dd,figcaption,.fig-label,.ways span){text-wrap:pretty}
p:last-child{margin-bottom:0}
strong{color:var(--fg);font-weight:700}
figure{margin:0}
::selection{background:color-mix(in srgb,var(--accent) 30%,transparent);color:var(--fg)}
:focus-visible{
outline:2px solid var(--focus-ring);outline-offset:3px;
box-shadow:0 0 0 3px var(--focus-halo);border-radius:var(--radius-sm);
}
.band-ink,.site-footer,.cover{--focus-ring:var(--white);--focus-halo:var(--ink-navy)}
h1,h2,h3,h4{
font-family:var(--font-display);color:var(--fg);font-weight:500;margin:0;
text-wrap:balance;font-kerning:normal;
}
:is(h1,h2,h3,h4,.hero-title,.pp-title,.why-premise,.why-resolve,.footer-line,.d-title,.wa-where dd,.others b,
.pl-name,.glance dd,.pp-glance dd,.qa dt,.rec-what b,.mini-figs dd,.fig b){font-feature-settings:"liga" 1,"kern" 1}
h1{font-size:var(--t-h1);line-height:1.02;letter-spacing:-.016em}
h2{font-size:var(--t-h2);line-height:1.08;letter-spacing:-.012em}
h3{font-size:var(--t-h3);line-height:1.24;letter-spacing:-.004em;font-weight:600}
h4{font-size:1.125rem;line-height:1.3;font-weight:600}
h1 em,h2 em,h3 em{font-style:normal;color:var(--accent-ink)}
:is(h1,h2,h3,h4,.hero-title,.why-premise,.why-reasons li,.why-resolve,.fig b,.footer-line,.cover,
.d-title,.wa-where dd,.others b,.pl-name,.glance dd,.pp-glance dd,.pi-facts dd,.qa dt,.rec-what b,.none-glance dd,
.direct a,.step-n,.att-head b,.mini-figs dd,.site-header,.btn,.tag,.go,.crumbs){word-spacing:normal}
.site-header,.btn,.tag{letter-spacing:0}
html[lang^="ko"] :is(h1,h2,h3,h4){font-family:var(--font-kr);font-weight:700;letter-spacing:-.034em}
html[lang^="ko"] h1{font-size:clamp(2.2rem,4.9vw,4.4rem);line-height:1.22}
html[lang^="ko"] h2{font-size:clamp(1.75rem,3.1vw,2.7rem);line-height:1.3}
html[lang^="ko"] h3{font-size:clamp(1.15rem,1.5vw,1.36rem);line-height:1.42;letter-spacing:-.01em}
html[lang^="ko"] :is(h1,h2,h3,h4) em{font-style:normal}
html[lang^="ko"] :is(h1,h2,h3,h4,p,li,dd,dt,figcaption,td,th,a,span,b,small){
word-break:keep-all;overflow-wrap:anywhere;line-break:strict;
}
.eyebrow,.kicker,.fig-period,.cap-label,.site-footer h2,
.glance dt,.facts dt,.pc-num,.pp-glance dt,.pi-facts dt,.places-group h3,
.none-glance dt,.mini-period,.ry-m,.ry-n,.lt-kind{
font-family:var(--font-body);font-size:var(--t-label);font-weight:600;
letter-spacing:var(--label-track);text-transform:uppercase;line-height:1.3;
font-variant-numeric:lining-nums tabular-nums;
}
html[lang^="ko"] :is(.eyebrow,.kicker,.fig-period,.cap-label,.site-footer h2,.glance dt,.facts dt,.pc-num,.pp-glance dt,.pi-facts dt,.places-group h3,.none-glance dt,.mini-period,.ry-m,.ry-n,.lt-kind){
font-family:var(--font-kr);font-size:.84rem;letter-spacing:var(--label-track-kr);font-weight:700;
}
html[lang^="ko"] :is(.glance dt,.facts dt,.pp-glance dt,.pi-facts dt,.none-glance dt){font-weight:400}
html[lang^="ko"] :is(.pp-glance dt,.facts-plain dt){font-weight:700}
html[lang^="ko"] :is(.eyebrow,.kicker,.fig-period,.cap-label,.site-footer h2,.glance dt,.facts dt,.pc-num,
.pp-glance dt,.pi-facts dt,.places-group h3,.none-glance dt,.mini-period,.ry-m,.ry-n,.lt-kind,.meet-label,
.route dt,.route-plan dt,.seats-label,.table-top dt,.wa dt,.d-label){text-transform:none}
.eyebrow{display:flex;align-items:baseline;gap:12px;margin:0 0 22px;color:var(--accent-ink)}
.eyebrow .no{color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums}
.kicker{color:var(--accent-ink)}
.eyebrow.section-label{
font-family:var(--font-body);font-size:var(--t-lead);font-weight:600;line-height:1.3;
letter-spacing:0;word-spacing:normal;text-transform:none;text-wrap:balance;
gap:.5em;margin:0 0 14px;color:var(--accent-ink);
}
html[lang^="ko"] .eyebrow.section-label{font-family:var(--font-kr);font-size:var(--t-lead);font-weight:700;
letter-spacing:-.01em}
.band-ink .eyebrow.section-label,.band-ink .eyebrow.section-label .no{color:var(--accent-inverse)}
@media (min-width:55.0625em){
.sh-split .eyebrow.section-label{margin:0;padding-top:0}
}
.why .eyebrow.section-label{margin:0}
.sr-only{
position:absolute;width:1px;height:1px;padding:0;margin:-1px;
overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;
}
.skip{position:absolute;left:-9999px}
.skip:focus{
left:12px;top:12px;z-index:400;background:var(--fg);color:var(--fg-inverse);
padding:12px 18px;border-radius:var(--radius-sm);
}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-mid{max-width:calc(1000px + 2 * var(--gutter))}
.wrap-narrow{max-width:calc(760px + 2 * var(--gutter))}
.lead{font-size:var(--t-lead);line-height:var(--lh-lead);letter-spacing:var(--track-lead);color:var(--fg);
max-width:var(--measure-lead)}
:is(.lead,.ph-lead,.sh-lead,.figs-note,.join-hint,.pi-text,.founder-line,.play-note){text-wrap:balance}
.sl{display:block}
.sl-n{display:inline}
@media (max-width:48em){.sl-n{display:block}}
mark{color:inherit;background:none;padding:0}
mark{
background-image:linear-gradient(transparent 50%,var(--highlight) 50%,var(--highlight) 94%,transparent 94%);
background-repeat:no-repeat;background-size:100% 100%;
-webkit-box-decoration-break:clone;box-decoration-break:clone;
padding-inline:.1em;margin-inline:-.04em;border-radius:.16em;
overflow-wrap:anywhere;
}
.band-ink mark{--highlight:var(--highlight-inverse)}
html[lang^="ko"] :is(mark,.ct-option>span){
background-image:linear-gradient(transparent 40%,var(--highlight) 40%,var(--highlight) 80%,transparent 80%)}
@media (forced-colors:active){mark{background:Mark;color:MarkText;forced-color-adjust:none}}
@media print{
.meet,.route,.route-plan,.played,.table-wrap,.wa,.doors{break-inside:avoid}
.ct-form{display:none !important}
}
@media (forced-colors:active){
.meet-hub::before{forced-color-adjust:none}
.ct-option input{appearance:auto;-webkit-appearance:radio}
.ct-option input::before{content:none}
}
@media print{mark{background:none;text-decoration:underline;text-decoration-thickness:.1em;text-underline-offset:.15em}}
.nowrap{white-space:nowrap}
.tn{display:inline-block;vertical-align:top;overflow-wrap:anywhere}
main,.site-footer{overflow-wrap:break-word}
:is(figcaption,figcaption>span,.pc h3,.tl-item,.pp-say,.now-when,.now-name){overflow-wrap:anywhere}
:is(.pc p,.pi p,.steps p,.qa dt,.qa dd,.tl-item p,.latest p,.clause-list li,.notice-text p,.leadins li,.facts dd,
.pp-glance dd,.pi-facts dd,.glance dd,figcaption,.rec-what>span,.rec-what small){text-wrap:balance}
html[lang^="ko"] :is(.lead,.ph-lead,.sh-lead,.figs-note,.join-hint,.pi-text,.founder-line,.play-note,
.pc p,.pi p,.steps p,.qa dt,.qa dd,.tl-item p,.latest p,.clause-list li,.notice-text p,.leadins li,.facts dd,
.pp-glance dd,.pi-facts dd,.glance dd,figcaption,.rec-what>span,.rec-what small,
.pp-now>p:not(.mail-alt)>span:not(.tag)){text-wrap:pretty}
.small{font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);max-width:var(--measure)}
.muted{color:var(--fg-muted)}
.center{text-align:center}
.mt-1{margin-top:12px}.mt-2{margin-top:20px}.mt-3{margin-top:32px}.mt-4{margin-top:48px}
.brandname{text-transform:none !important;font-variant:normal;white-space:nowrap}
@media (max-width:32.5em){.brandname{white-space:normal}}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
:where([class*="grid"],.split,.hero-body,.ph-head,.pp-top,.now,.founder,.mark,.prose-split,.places,.join,.why,.invite,.board)>*{min-width:0}
@keyframes rise{from{opacity:0;translate:0 28px}35%{opacity:1}to{opacity:1;translate:0 0}}
@keyframes rise-sm{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes line-up{from{translate:0 150%}to{translate:0 0}}
@keyframes mask-up{from{clip-path:inset(0 0 100% 0);translate:0 .35em}to{clip-path:inset(0 0 -12% 0);translate:0 0}}
@keyframes develop{from{opacity:0;scale:1.03}to{opacity:1;scale:1}}
@keyframes stroke-in{from{stroke-dasharray:1 2;stroke-dashoffset:1.02}to{stroke-dasharray:1.1 0;stroke-dashoffset:0}}
@keyframes pop{from{opacity:0;scale:.5}to{opacity:1;scale:1}}
@keyframes grow-y{from{scale:1 0}to{scale:1 1}}
@keyframes draw-x{from{scale:0 1}to{scale:1 1}}
@keyframes draw-y{from{scale:1 0}to{scale:1 1}}
@keyframes ripple{
0%  {opacity:0;scale:.55}
18% {opacity:.42}
100%{opacity:0;scale:1.55}
}
@keyframes ink-fill{to{background-size:100% 100%,100% 100%}}
@keyframes mark-draw{from{background-size:0% 100%}to{background-size:100% 100%}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes progress-grow{from{scale:0 1}to{scale:1 1}}
@keyframes vt-out{to{opacity:0;translate:0 -12px}}
@keyframes vt-in{from{opacity:0;translate:0 18px}}
@keyframes vt-recede{to{opacity:0;scale:.985}}
@keyframes vt-fade{to{opacity:0}}
@keyframes cover-set{from{translate:0 -6px;filter:drop-shadow(0 12px 12px rgb(29 36 48 / .28))}to{translate:none;filter:none}}
.progress{
position:fixed;inset-block-start:0;inset-inline:0;height:2px;z-index:300;
background:linear-gradient(90deg,var(--accent),var(--gold-light));
transform-origin:0 50%;scale:0 1;pointer-events:none;
}
.ln,.ln>span{display:block}
:is(.hero-title,.ph-title,.pp-title):has(>.ln){display:flex;flex-direction:column}
@media (prefers-reduced-motion:no-preference){
.ln{overflow:clip;padding:.12em 0 .3em;margin:-.12em 0 -.3em}
.ln>span{animation:line-up var(--dur-slower) var(--ease-enter-expressive) backwards}
.ln:nth-child(2)>span{animation-delay:var(--beat)}
.ln:nth-child(3)>span{animation-delay:calc(var(--beat) * 2)}
.lift{animation:rise var(--dur-slow) var(--ease-settle) backwards}
.lift-1{animation-delay:var(--beat)}
.lift-2,.lift-3{animation-delay:calc(var(--beat) * 2)}
.lift-4{animation-delay:calc(var(--beat) * 3)}
.lift-5{animation-delay:calc(var(--beat) * 4)}
.lift-6{animation-delay:calc(var(--beat) * 5)}
.open .photo img{animation:develop var(--dur-slow) var(--ease-settle) var(--beat) backwards}
::view-transition-old(root){animation:vt-recede var(--dur-4) var(--ease-exit) both}
::view-transition-new(root){animation:vt-in var(--dur-6) var(--ease-settle) both}
.site-header{view-transition-name:site-header}
::view-transition-group(site-header),::view-transition-old(site-header),
::view-transition-new(site-header){animation:none}
.nav-mark{view-transition-name:nav-current}
::view-transition-group(nav-current){animation-duration:var(--dur-6);animation-timing-function:var(--ease-settle)}
@media (min-width:62.5625em){.has-sub:is(:hover,:focus-within):not([data-shut]) .nav-sub{view-transition-name:nav-panel}}
::view-transition-group(nav-panel){animation-duration:var(--dur-3)}
@media (max-width:62.5em){.nav[data-open="true"]{view-transition-name:nav-drawer}}
::view-transition-old(nav-drawer){animation:none;opacity:0}
:is(.pc:is(:hover,:focus),.pi:is(:hover,:focus-within),.pp-cover) .cover{view-transition-name:var(--vtn)}
::view-transition-group(*.prog-cover){animation-duration:var(--dur-slow);animation-timing-function:var(--ease-settle)}
::view-transition-old(*.prog-cover),::view-transition-new(*.prog-cover){height:100%;object-fit:cover;
animation-duration:var(--dur-5)}
::view-transition-old(*.prog-cover):not(:only-child){z-index:1;mix-blend-mode:normal;animation:vt-fade var(--dur-2) linear both}
::view-transition-new(*.prog-cover):not(:only-child){mix-blend-mode:normal;animation:none}
::view-transition-old(*.prog-cover):only-child{animation:vt-recede var(--dur-4) var(--ease-exit) both}
::view-transition-new(*.prog-cover):only-child{animation:cover-set var(--dur-6) var(--ease-settle) both}
.pp-cover .cover-mark *{animation:none}
@supports (animation-timeline:scroll()){
.progress{animation:progress-grow linear both;animation-timeline:scroll(root block)}
}
@supports (animation-timeline:view()){
.rv{
animation:rise linear backwards;animation-timeline:view();
animation-range:entry 0% entry 100%;
animation-range:entry 0% entry min(100%, 180px);
}
.rv-stagger{view-timeline:--stagger block}
.rv-stagger>*{animation:rise linear backwards;animation-timeline:--stagger;animation-range:entry 0% entry 36%}
.rv-stagger>*:nth-child(2){animation-range:entry 6% entry 42%}
.rv-stagger>*:nth-child(3){animation-range:entry 12% entry 48%}
.rv-stagger>*:nth-child(4){animation-range:entry 18% entry 54%}
.rv-stagger>*:nth-child(5){animation-range:entry 24% entry 60%}
.rv-stagger>*:nth-child(n+6){animation-range:entry 30% entry 66%}
.sh h2,.mark h2,.founder h2{
animation:mask-up linear backwards;animation-timeline:view();
animation-range:entry 10% entry 60%;
}
.plate{view-timeline:--plate-tl block}
.plate .photo img{animation:develop linear backwards;animation-timeline:--plate-tl;
animation-range:entry 0% entry 60%;animation-range:entry 0% entry min(60%, 160px)}
mark{animation:mark-draw linear backwards;animation-timeline:view();animation-range:entry 0% entry 100%}
.cover{view-timeline:--cover block}
.cover-mark *{animation:stroke-in linear backwards;animation-timeline:--cover;
animation-range:entry 20% entry 90%}
.steps li::before{animation:draw-x linear backwards;animation-timeline:view();animation-range:entry 40% entry 100%}
@media (max-width:75em){.steps li::before{transform-origin:50% 0;animation-name:draw-y}}
.forty{view-timeline:--forty block}
.forty-row span{animation:pop linear backwards;animation-timeline:--forty;
animation-range:entry calc(10% + var(--i) * 1.4%) entry calc(30% + var(--i) * 1.6%)}
.strip{view-timeline:--strip block}
.strip .s-ev{transform-box:fill-box;transform-origin:50% 50%;animation:pop linear backwards;animation-timeline:--strip;
animation-range:entry calc(20% + var(--i) * 2%) entry calc(45% + var(--i) * 2%)}
.att{view-timeline:--att block}
.att .c-bar{transform-box:fill-box;transform-origin:50% 100%;animation:grow-y linear backwards;animation-timeline:--att;
animation-range:entry calc(15% + var(--i) * 2%) entry calc(40% + var(--i) * 2.4%)}
.places-map{view-timeline:--map block}
.map-svg :is(.m-dot,.m-halo){transform-box:fill-box;transform-origin:50% 50%;animation:pop linear backwards;
animation-timeline:--map;animation-range:entry 30% entry 70%}
}
@supports (timeline-trigger:--t view()) and (animation-trigger:--t play-once) and (trigger-scope:--t){
.rv{
trigger-scope:--rv;timeline-trigger:--rv view() entry 0% exit 100%;
animation:rise var(--dur-slow) var(--ease-settle) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--rv play-once;
}
.rv-stagger{trigger-scope:--rvs;timeline-trigger:--rvs view() entry 0% exit 100%}
.rv-stagger>*,.rv-stagger>*:nth-child(n){
animation:rise var(--dur-slow) var(--ease-settle) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--rvs play-once;
animation-delay:calc((min(sibling-index(), 6) - 1) * var(--beat));
}
.plate{trigger-scope:--plate;timeline-trigger:--plate view() entry 15% exit 100%}
.plate .photo img{
animation:develop var(--dur-slow) var(--ease-settle) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--plate play-once;
}
.sh h2,.mark h2,.founder h2{
trigger-scope:--h;timeline-trigger:--h view() entry 0% exit 100%;
animation:mask-up var(--dur-slower) var(--ease-enter-expressive) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--h play-once;
}
.rv-stagger.steps>li::before{
transform-origin:0 50%;
animation:draw-x var(--dur-slower) var(--ease) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--rvs play-once;animation-delay:calc(min(sibling-index(), 6) * var(--beat));
}
@media (max-width:75em){.rv-stagger.steps>li::before{transform-origin:50% 0;animation-name:draw-y}}
.cover{trigger-scope:--cv;timeline-trigger:--cv view() entry 20% exit 100%}
.cover-mark *{animation:stroke-in var(--dur-slower) var(--ease) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--cv play-once;animation-delay:var(--beat)}
.forty{trigger-scope:--forty;timeline-trigger:--forty view() entry 0% exit 100%}
.forty-row span{animation:pop var(--dur-5) var(--ease-settle) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--forty play-once;animation-delay:calc(var(--beat) * 2 + var(--i) * var(--beat) / 8)}
.strip.rv{trigger-scope:--rv,--strip;
timeline-trigger:--rv view() entry 0% exit 100%,--strip view() entry 0% exit 100%}
.strip .s-ev{animation:pop var(--dur-5) var(--ease-settle) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--strip play-once;animation-delay:calc(var(--beat) * 2 + var(--i) * var(--beat) / 4)}
.att.rv{trigger-scope:--rv,--att;
timeline-trigger:--rv view() entry 0% exit 100%,--att view() entry 0% exit 100%}
.att .c-bar{animation:grow-y var(--dur-6) var(--ease-settle) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--att play-once;animation-delay:calc(var(--beat) * 2 + var(--i) * var(--beat) / 4)}
.places-map{trigger-scope:--map;timeline-trigger:--map view() entry 0% exit 100%}
.map-svg :is(.m-dot,.m-halo){animation:pop var(--dur-5) var(--ease-enter) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--map play-once;animation-delay:calc(var(--beat) * 3)}
.meet,.route,.route-plan,.played,.table{trigger-scope:--draw;timeline-trigger:--draw view() entry 10% exit 100%}
:is(.meet-ico,.route-mark){animation:pop var(--dur-6) var(--ease-spring) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--draw play-once;
animation-delay:calc(var(--beat) * 2 + var(--i,0) * var(--beat) / 2)}
.seat{animation:fade var(--dur-slow) var(--ease-enter) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--draw play-once;
animation-delay:calc(var(--beat) * 2 + var(--i,0) * var(--beat) / 2)}
.played li{animation:rise-sm var(--dur-slow) var(--ease-enter) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--draw play-once;animation-delay:calc(var(--beat) + var(--i,0) * var(--beat))}
.meet-hub{animation:fade var(--dur-slow) var(--ease-enter) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--draw play-once}
.wa.rv{trigger-scope:--rv,--draw;timeline-trigger:--rv view() entry 0% exit 100%,--draw view() entry 10% exit 100%}
.doors{trigger-scope:--draw;timeline-trigger:--draw view() entry 10% exit 100%}
.latest.rv-stagger{trigger-scope:--rvs,--draw;
timeline-trigger:--rvs view() entry 0% exit 100%,--draw view() entry 10% exit 100%}
:is(.wa-ring,.d-ring,.wa-svg .m-dot,.wa-svg .m-halo){animation:pop var(--dur-5) var(--ease-enter) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once;
animation-delay:calc(var(--beat) * 2 + var(--i,0) * var(--beat) / 2)}
.wa-svg :is(.m-dot,.m-halo){transform-box:fill-box;transform-origin:50% 50%}
:is(.wa-ring,.d-ring){animation-duration:var(--dur-6);animation-timing-function:var(--ease-spring)}
@media (min-width:45.0625em){
.meet-list li::after,.meet-list::after{animation:draw-x var(--dur-slow) var(--ease) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once}
:is(.meet-give li::after,.meet-give .meet-list::after){transform-origin:0 50%}
:is(.meet-bring li::after,.meet-bring .meet-list::after){transform-origin:100% 50%}
.meet-list li::after{animation-delay:calc(var(--beat) * 2.5 + var(--i,0) * var(--beat) / 2)}
.meet-list li:not(:last-child)::before{transform-origin:50% 0;animation:draw-y var(--dur-slow) var(--ease) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once;
animation-delay:calc(var(--beat) * 4.5)}
.meet-list::after{animation-delay:calc(var(--beat) * 6)}
.meet-hub{animation-delay:calc(var(--beat) * 7)}
}
.route-st:not(:last-child)::before{transform-origin:0 50%;animation:draw-x var(--dur-slow) var(--ease) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once;
animation-delay:calc(var(--beat) * 2.5 + var(--i,0) * var(--beat) / 2)}
@media (max-width:68.75em){.route-st:not(:last-child)::before{transform-origin:50% 0;animation-name:draw-y}}
.played::before{transform-origin:0 50%;animation:draw-x var(--dur-slower) var(--ease) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once;animation-delay:calc(var(--beat) * .5)}
.wa-based dt::before{transform-origin:0 50%;animation:draw-x var(--dur-slow) var(--ease) backwards;
animation-timeline:auto;animation-range:normal;animation-trigger:--draw play-once;animation-delay:calc(var(--beat) * 3)}
@container board (min-width:34rem){
.seats::before{animation:pop var(--dur-5) var(--ease-enter) backwards;animation-timeline:auto;
animation-range:normal;animation-trigger:--draw play-once;animation-delay:var(--beat)}
.seat::after{animation:draw-x var(--dur-slow) var(--ease) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--draw play-once;animation-delay:calc(var(--beat) * 3 + var(--i,0) * var(--beat) / 2)}
}
mark{trigger-scope:--mk;timeline-trigger:--mk view() entry 30% exit 100%;
animation:mark-draw var(--dur-slower) var(--ease) backwards;animation-timeline:auto;animation-range:normal;
animation-trigger:--mk play-once;animation-delay:var(--beat)}
}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none !important;transition-duration:1ms !important}
::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none !important}
}
.site-header{
position:sticky;top:0;z-index:200;
background-color:var(--surface);
border-bottom:1px solid var(--line);
}
@media (max-height:30em){.site-header{position:relative}}
.header-inner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;min-height:76px}
.brand{margin-inline-end:auto;display:flex;align-items:center;padding-block:10px}
.brand{--brand-h:44px}
.brand img{height:var(--brand-h);width:auto;max-width:none;margin-inline-start:calc(var(--brand-h) * -.15);
transition:opacity var(--dur-3) var(--ease)}
@media (min-width:75em){.brand{--brand-h:56px}}
.brand:hover img{opacity:.7}
.nav{display:flex;align-items:center;gap:6px}
.nav-list{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none}
.nav-link{
position:relative;display:inline-flex;align-items:center;min-height:44px;
padding:0 12px;font-size:.9375rem;font-weight:500;color:var(--fg);
transition:color var(--dur-3) var(--ease);
}
.nav-link::after{
content:"";position:absolute;inset-inline:12px;bottom:9px;height:1px;
background:var(--accent);scale:0 1;transform-origin:100% 50%;
transition:scale var(--dur-6) var(--ease-enter);
}
.nav-link:hover{color:var(--accent-ink)}
.nav-link:hover::after{scale:1 1;transform-origin:0 50%}
.nav-link[aria-current="page"]{color:var(--accent-ink)}
.nav-mark{position:absolute;inset-inline:12px;bottom:9px;height:2px;background:var(--accent-mark);border-radius:2px;pointer-events:none}
.nav-n{display:none}
.has-sub{position:relative}
.nav-sub{list-style:none;margin:0;padding:0}
@media (min-width:62.5625em){
.has-sub::after{content:"";position:absolute;inset-inline:0;top:100%;height:29px;pointer-events:none}
.has-sub:hover::after{pointer-events:auto}
.has-sub[data-shut] .nav-sub{visibility:hidden;opacity:0;transition:none}
.nav-sub{
position:absolute;top:calc(100% + 29px);left:-11px;z-index:60;width:max-content;min-width:18rem;max-width:24rem;
padding:8px;background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-sm);
box-shadow:var(--shadow-overlay);opacity:0;visibility:hidden;translate:0 -4px;scale:.985;transform-origin:24px 0;
transition:opacity var(--dur-3) var(--ease) var(--dur-2),translate var(--dur-3) var(--ease) var(--dur-2),
scale var(--dur-3) var(--ease) var(--dur-2),visibility 0s linear calc(var(--dur-3) + var(--dur-2));
}
.has-sub:is(:hover,:focus-within):not([data-shut]) .nav-sub{
opacity:1;visibility:visible;translate:none;scale:none;
transition:opacity var(--dur-4) var(--ease-enter) var(--dur-2),translate var(--dur-4) var(--ease-settle) var(--dur-2),
scale var(--dur-4) var(--ease-settle) var(--dur-2),visibility 0s linear var(--dur-2);
}
.has-sub:focus-within:not([data-shut]) .nav-sub{transition-delay:0s}
.nav-sub a{display:flex;align-items:baseline;gap:12px;min-height:44px;padding:11px 14px;border-radius:calc(var(--radius-sm) - 1px);
font-size:.9375rem;font-weight:500;line-height:1.35;color:var(--fg);transition:background-color var(--dur-3) var(--ease),color var(--dur-3) var(--ease)}
.nav-sub a:hover{background:var(--surface-sunken);color:var(--accent-ink)}
.nav-sub a:focus-visible{outline-offset:-3px}
.nav-sub a[aria-current="page"]{color:var(--accent-ink);font-weight:600}
.ns-n{min-width:1.6em;color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums}
}
.ns-live{display:inline-block;width:7px;height:7px;margin-inline-start:.6em;border-radius:50%;
background:var(--live);vertical-align:.18em}
html[lang^="ko"] .nav-sub a{font-family:var(--font-kr)}
.nav .btn-nav{--btn-border:var(--line-interactive);min-height:42px;padding-inline:20px;margin-inline-start:10px}
.nav .btn-nav:hover{--btn-bg:var(--fg);--btn-fg:var(--fg-inverse);--btn-border:var(--fg)}
.nav .btn-nav:active{--btn-bg:var(--ink-deep)}
.nav .btn-nav[aria-current="page"]{--btn-border:var(--accent-mark);--btn-fg:var(--accent-ink)}
.lang{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;
margin-inline-start:-6px;padding-inline:6px;
font-family:var(--font-body);font-size:.875rem;font-weight:400;line-height:1;letter-spacing:0;word-spacing:normal;
color:var(--fg-muted);text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:1px;
text-underline-offset:.3em;transition:color var(--dur-3) var(--ease),text-decoration-color var(--dur-3) var(--ease)}
.lang:lang(ko){font-family:var(--font-kr);font-size:.8125rem}
.lang:hover{color:var(--accent-ink);text-decoration-color:var(--accent-mark)}
.lang-bar{display:none}
.site-footer a[hreflang="en"]{font-family:var(--font-body)}
.site-footer a[hreflang="ko"]{font-family:var(--font-kr)}
.menu-toggle{
display:none;position:relative;width:44px;height:44px;flex:0 0 auto;
background:none;border:1px solid var(--line-interactive);border-radius:50%;color:var(--fg);cursor:pointer;
transition:border-color var(--dur-3) var(--ease);
}
.menu-toggle:hover{border-color:var(--fg)}
.menu-toggle i{
position:absolute;left:10px;width:22px;height:1.5px;background:currentColor;border-radius:2px;
transition:translate var(--dur-6) var(--ease-spring),rotate var(--dur-6) var(--ease-spring),
scale var(--dur-6) var(--ease-settle);
}
.menu-toggle i:first-child{top:17px}
.menu-toggle i:last-child{top:25px;scale:.682 1}
.menu-toggle[aria-expanded="true"] i:first-child{translate:0 4px;rotate:45deg}
.menu-toggle[aria-expanded="true"] i:last-child{translate:0 -4px;rotate:-45deg;scale:none}
.menu-toggle:hover i:last-child{scale:none}
.btn{
--btn-bg:transparent;--btn-fg:var(--fg);--btn-border:transparent;
display:inline-flex;align-items:center;justify-content:center;gap:12px;
min-height:50px;padding:0 24px;border-radius:var(--radius-pill);
border:1px solid var(--btn-border);background:var(--btn-bg);color:var(--btn-fg);
font-family:var(--font-body);font-size:.9375rem;font-weight:600;line-height:1.2;
cursor:pointer;text-align:center;
transition:background-color var(--dur-4) var(--ease),color var(--dur-4) var(--ease),
border-color var(--dur-4) var(--ease),translate var(--dur-3) var(--ease-enter);
}
html[lang^="ko"] .btn{font-family:var(--font-kr);font-weight:700}
.btn:active{translate:0 1px;transition-duration:var(--dur-1)}
.arrow{display:inline-flex;overflow:hidden;width:1em;flex:0 0 auto;line-height:1;vertical-align:-.13em}
.arrow i{display:block;transition:translate var(--dur-slow) var(--ease-enter-expressive)}
.arrow svg{display:block;width:1em;height:1em;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.5;
stroke-linecap:round;stroke-linejoin:round}
html[lang^="ko"] .arrow svg{stroke-width:1.75}
a:hover .arrow i,.btn:hover .arrow i,a:focus-visible .arrow i{translate:1.3em 0}
.btn-primary{--btn-bg:var(--fg);--btn-fg:var(--fg-inverse)}
.btn-primary:hover{--btn-bg:var(--soft-navy)}
.btn-primary:active{--btn-bg:var(--ink-deep)}
.btn-gold{--btn-bg:var(--accent);--btn-fg:var(--ink-navy)}
.btn-gold:hover{--btn-bg:var(--gold-light)}
.btn-gold:active{--btn-bg:var(--antique-gold)}
.btn-quiet{--btn-border:var(--line-interactive)}
.btn-quiet:hover{--btn-border:var(--fg);--btn-bg:var(--surface-raised)}
.btn-quiet:active{--btn-bg:var(--surface-sunken)}
.btn-on-dark{--btn-border:rgb(255 255 255 / .5);--btn-fg:var(--white)}
.btn-on-dark:hover{--btn-border:var(--white);--btn-bg:rgb(255 255 255 / .08)}
.btn-on-dark:active{--btn-bg:rgb(255 255 255 / .16)}
.btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:36px}
.link{
color:var(--fg);font-weight:500;text-decoration:underline;
text-decoration-color:var(--accent-mark);text-decoration-thickness:1px;text-underline-offset:.24em;
transition:text-decoration-thickness var(--dur-3) var(--ease),color var(--dur-3) var(--ease);
}
.link:hover{color:var(--accent-ink);text-decoration-thickness:2px}
.go{
display:inline-flex;align-items:center;gap:10px;min-height:44px;
font-weight:600;color:var(--fg);
text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:1px;text-underline-offset:.3em;
transition:color var(--dur-3) var(--ease),text-decoration-color var(--dur-3) var(--ease);
}
.go .arrow{color:var(--accent-ink)}
.go:hover{color:var(--accent-ink);text-decoration-color:var(--accent-ink)}
html[lang^="ko"] .go{font-weight:700}
section{padding-block:var(--section)}
section.tight{padding-block:var(--section-tight)}
.band-white{background:var(--surface-raised)}
.band-sunken{background:var(--surface-sunken)}
.band-ink{background:var(--surface-inverse);color:var(--fg-inverse-body)}
.band-ink :is(h1,h2,h3,h4,strong){color:var(--fg-inverse)}
.band-ink :is(.eyebrow,.kicker,.eyebrow .no){color:var(--accent-inverse)}
.band-ink .link{color:var(--fg-inverse);text-decoration-color:var(--accent-inverse)}
.band-ink .link:hover{color:var(--accent-inverse)}
.band-ink .go{color:var(--fg-inverse)}
.band-ink .go .arrow{color:var(--accent-inverse)}
.band-ink .go:hover{color:var(--accent-inverse);text-decoration-color:var(--accent-inverse)}
.band-sunken :is(.muted,figcaption){color:var(--fg-muted-sunken)}
.sh{margin-bottom:clamp(36px,4.4vw,72px)}
.sh h2{max-width:16em}
.sh-lead{margin-top:max(24px,min(34px,calc(var(--t-h2) - 8px)));max-width:var(--measure-lead);font-size:var(--t-lead);line-height:var(--lh-lead);
letter-spacing:var(--track-lead);color:var(--fg)}
.band-ink .sh-lead{color:var(--fg-inverse-body)}
html[lang^="ko"] .sh-lead{margin-top:max(24px,min(28px,calc(var(--t-h2) - 16px)))}
@media (min-width:55.0625em){
.sh-split{display:grid;grid-template-columns:3fr 9fr;gap:var(--gap);align-items:baseline}
.sh-split .eyebrow{margin:0;padding-top:.2em}
}
.now-line{margin:26px 0 0}
.now-head{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;margin:0}
@media (max-width:62.5em){.now-head{flex-direction:column;align-items:flex-start;gap:10px}}
.now-name{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--fg);
font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;line-height:1.25;
transition:color var(--dur-3) var(--ease)}
html[lang^="ko"] .now-name{font-family:var(--font-kr);font-size:clamp(1.25rem,1.6vw,1.45rem);font-weight:700}
.now-name .arrow{color:var(--accent-ink)}
.now-name:hover{color:var(--accent-ink)}
.now-when{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;margin:2px 0 0;color:var(--fg)}
.now-when strong{font-weight:700}
.facts.facts-plain{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:20px var(--col-gap);
margin:28px 0 0;max-width:52rem}
.facts-plain>div{min-width:0}
.facts.facts-plain :is(dt,dd){padding:0;border:0}
.facts.facts-plain dd{margin:6px 0 0;font-size:var(--t-body);line-height:var(--lh-small);color:var(--fg)}
.facts.facts-rows{grid-template-columns:minmax(0,1fr);gap:10px;margin:14px 0 0}
.facts-rows>div{display:grid;grid-template-columns:minmax(8em,auto) minmax(0,1fr);gap:2px 20px;align-items:baseline}
.facts.facts-rows dt{font-family:var(--font-body);font-size:var(--t-body);font-weight:700;letter-spacing:0;text-transform:none;color:var(--fg)}
html[lang^="ko"] .facts.facts-rows dt{font-family:var(--font-kr);font-weight:700;font-size:var(--t-body);letter-spacing:0}
.facts.facts-rows dd{margin:0}
@media (max-width:30em){.facts-rows>div{grid-template-columns:minmax(0,1fr)}}
.leadins{list-style:none;margin:0;padding:0;display:grid;gap:clamp(16px,2vw,22px);max-width:var(--measure)}
.leadins li{color:var(--fg)}
.leadins strong{font-weight:700}
.fold{margin:24px 0 0}
.fold>summary{display:inline-flex;align-items:center;gap:12px;min-height:44px;cursor:pointer;list-style:none;
font-weight:600;color:var(--fg);transition:color var(--dur-3) var(--ease)}
html[lang^="ko"] .fold>summary{font-weight:700}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::before{content:"";flex:0 0 auto;width:8px;height:8px;border:solid var(--accent-ink);border-width:0 1.5px 1.5px 0;
rotate:45deg;translate:0 -3px;transition:rotate var(--dur-4) var(--ease),translate var(--dur-4) var(--ease)}
.fold[open]>summary::before{rotate:225deg;translate:0 2px}
.fold[open]>summary .f-show,.fold:not([open])>summary .f-hide{display:none}
@media (prefers-reduced-motion:no-preference){
@supports (interpolate-size:allow-keywords) and selector(::details-content){
.fold{interpolate-size:allow-keywords}
.fold::details-content{block-size:0;overflow-y:clip;
transition:block-size var(--dur-5) var(--ease-settle),content-visibility var(--dur-5);
transition-behavior:allow-discrete}
.fold[open]::details-content{block-size:auto}
}
.fold>summary::before{transition:rotate var(--dur-6) var(--ease-spring),translate var(--dur-6) var(--ease-spring)}
}
.fold>summary:hover{color:var(--accent-ink)}
.band-ink .fold>summary{color:var(--fg-inverse)}
.band-ink .fold>summary::before{border-color:var(--accent-inverse)}
.band-ink .fold>summary:hover{color:var(--accent-inverse)}
.mini-figs{margin:0 0 clamp(32px,4vw,52px)}
@media (min-width:55.0625em){.mini-figs{margin-inline-start:var(--col4)}}
.mini-figs dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px var(--col-gap);margin:0;max-width:52rem}
@media (min-width:75em){.mini-figs dl{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}}
.mini-figs dl>div{display:flex;flex-direction:column}
.mini-figs dd{order:-1}
@media (max-width:24em){.mini-figs dl{grid-template-columns:minmax(0,1fr)}}
.mini-figs dd{margin:0;font-family:var(--font-display);font-size:clamp(2.4rem,4vw,3.4rem);line-height:1;color:var(--fg);
font-variant-numeric:lining-nums}
.mini-figs dt{margin-top:8px;font-size:var(--t-small);line-height:1.35;color:var(--fg);max-width:12em}
.mini-period{margin:16px 0 0;color:var(--accent-ink)}
.clause-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:12px}
.rec-wrap>.fold{margin:0 0 10px}
.rec-wrap .fold>.rec{margin-top:6px}
.meet,.route,.route-plan,.played,.table{--stroke:var(--accent-mark);--ground:var(--surface)}
.band-white :is(.meet,.route,.route-plan,.played,.table){--ground:var(--surface-raised)}
:is(.meet-glyph,.route-glyph){width:1.375rem;height:1.375rem;fill:none;stroke:currentColor;stroke-width:1.6;
stroke-linecap:round;stroke-linejoin:round}
:is(.meet-label,.route dt,.route-plan dt,.seats-label,.table-top dt){
font-family:var(--font-body);font-size:var(--t-label);font-weight:600;letter-spacing:var(--label-track);
text-transform:uppercase;line-height:1.3;font-variant-numeric:lining-nums tabular-nums;color:var(--accent-ink)}
html[lang^="ko"] :is(.meet-label,.route dt,.route-plan dt,.seats-label,.table-top dt){
font-family:var(--font-kr);font-size:.84rem;letter-spacing:var(--label-track-kr);font-weight:700}
:is(.meet-t,.route dd,.route-plan dd,.played-name,.played-who,.seat,.table-top dd){text-wrap:balance}
html[lang^="ko"] :is(.meet-t,.route dd,.route-plan dd,.played-name,.played-who,.seat,.table-top dd){text-wrap:pretty}
.invite .meets{grid-column:2}
@media (max-width:55em){.invite .meets{grid-column:1}}
.meets{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(48px,5.2vw,72px)}
.meet{
--st:2.5rem;--tick:1.25rem;--hub:8.5rem;--cg:clamp(1.5rem,2.6vw,2.5rem);--row:14px;--lh-item:1.4;
display:grid;align-items:center;column-gap:var(--cg);row-gap:12px;
grid-template-columns:minmax(0,1fr) var(--hub) minmax(0,1fr);
grid-template-areas:"lg . lb" "give hub bring";
}
.meet-give,.meet-bring{display:contents}
.meet-label{margin:0}
.meet-give .meet-label{grid-area:lg;text-align:end;padding-inline-end:calc(var(--tick) + var(--st) + 14px)}
.meet-bring .meet-label{grid-area:lb;padding-inline-start:calc(var(--tick) + var(--st) + 14px)}
.meet-list{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:minmax(0,1fr);
gap:var(--row);align-self:center}
.meet-give .meet-list{grid-area:give;padding-inline-end:var(--tick)}
.meet-bring .meet-list{grid-area:bring;padding-inline-start:var(--tick)}
.meet-list li{position:relative;display:flex;align-items:flex-start;gap:14px;
font-size:var(--t-body);line-height:var(--lh-item);color:var(--fg)}
.meet-give li{flex-direction:row-reverse;text-align:end}
.meet-t{min-width:0;padding-top:calc((var(--st) - var(--lh-item) * 1em) / 2)}
.meet-ico{position:relative;z-index:1;flex:0 0 auto;display:grid;place-items:center;width:var(--st);height:var(--st);
border:1px solid var(--stroke);border-radius:50%;background:var(--ground);color:var(--accent-ink)}
.meet-list li::after{content:"";position:absolute;top:calc(var(--st) / 2);width:var(--tick);border-top:1px solid var(--stroke)}
.meet-give li::after{right:calc(-1 * var(--tick))}
.meet-bring li::after{left:calc(-1 * var(--tick))}
.meet-list li:not(:last-child)::before{content:"";position:absolute;top:calc(var(--st) / 2);
height:calc(100% + var(--row));border-left:1px solid var(--stroke)}
.meet-give li::before{right:calc(-1 * var(--tick))}
.meet-bring li::before{left:calc(-1 * var(--tick))}
.meet-list::after{content:"";position:absolute;top:50%;width:var(--cg);border-top:1px solid var(--stroke)}
.meet-give .meet-list::after{left:100%}
.meet-bring .meet-list::after{right:100%}
.meet-hub{grid-area:hub;position:relative;display:grid;place-items:center;width:var(--hub);aspect-ratio:1;
margin:0;padding:.75rem;border:1px solid var(--stroke);border-radius:50%;background:var(--ground);
outline:1px solid color-mix(in srgb,var(--stroke) 35%,transparent);outline-offset:.5rem;
font-size:var(--t-h3);line-height:1.2;text-align:center;text-wrap:balance;overflow-wrap:anywhere}
html[lang^="ko"] .meet-hub{font-size:1.3rem;line-height:1.4;letter-spacing:-.01em}
.meet-in{display:flex;flex-direction:column;align-items:center;gap:4px}
.meet-len{font-family:var(--font-body);font-size:var(--t-caption);font-weight:400;line-height:1.3;letter-spacing:0;
color:var(--fg-muted)}
html[lang^="ko"] .meet-len{font-family:var(--font-kr)}
@media (max-width:45em){.meet-in{align-items:flex-start}}
html[lang^="ko"] .meet{--lh-item:1.55}
@media (min-width:45.0625em){
.meet-list{grid-auto-rows:1fr}
.meet-list li{align-items:center}
.meet-t{padding-top:0}
.meet-list li::after,.meet-list li:not(:last-child)::before{top:50%}
}
@media (max-width:45em){
.meet{display:block;position:relative}
.meet-give,.meet-bring{display:block}
.meet-bring{margin-top:22px}
.meet-hub{display:flex;align-items:center;gap:16px;width:auto;aspect-ratio:auto;padding:0;margin:0 0 18px;
border:0;outline:0;background:none;text-align:start}
.meet-hub::before{content:"";flex:0 0 auto;width:var(--st);height:var(--st);border:1px solid var(--stroke);
border-radius:50%;background:var(--ground);
outline:1px solid color-mix(in srgb,var(--stroke) 35%,transparent);outline-offset:4px}
.meet-hub::after{content:"";position:absolute;left:calc(var(--st) / 2 - .5px);top:calc(50% + var(--st) / 2);
height:calc(50% - var(--st) / 2 + 18px);border-left:1px solid var(--stroke)}
.meet-give .meet-label,.meet-bring .meet-label{position:relative;text-align:start;
padding:0 0 10px calc(var(--st) + 16px)}
.meet-label::before{content:"";position:absolute;left:calc(var(--st) / 2 - .5px);top:0;bottom:0;
border-left:1px solid var(--stroke)}
.meet-give .meet-list,.meet-bring .meet-list{padding:0}
.meet-give li{flex-direction:row;text-align:start}
.meet-list li::after,.meet-list::after{display:none}
.meet-give li::before,.meet-bring li::before{left:calc(var(--st) / 2 - .5px);right:auto}
.meet-give li:last-child::before{content:"";position:absolute;top:calc(var(--st) / 2);
height:calc(100% - var(--st) / 2 + 22px);border-left:1px solid var(--stroke)}
}
.route{--st:2.75rem;--route-gap:clamp(16px,1.6vw,32px);
display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--route-gap);margin:0}
.route-st{position:relative;min-width:0;padding-top:calc(var(--st) + 16px)}
.route-mark{position:absolute;top:0;left:0;z-index:1;display:grid;place-items:center;width:var(--st);height:var(--st);
border:1px solid var(--stroke);border-radius:50%;background:var(--ground);color:var(--accent-ink)}
.route-year{font-family:var(--font-body);font-size:.8125rem;font-weight:600;letter-spacing:0;text-transform:none;
font-variant-numeric:lining-nums}
html[lang^="ko"] .route-year{font-family:var(--font-kr);font-weight:700}
.route-st:not(:last-child)::before{content:"";position:absolute;top:calc(var(--st) / 2);left:calc(var(--st) + 8px);
right:calc(-1 * var(--route-gap) + 8px);border-top:1px solid var(--stroke)}
.route dt{margin:0}
.route dd{margin:6px 0 0;max-width:16em;font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg)}
.route-plan{--st:2.75rem;position:relative;min-height:var(--st);margin:clamp(32px,3.6vw,44px) 0 0;
padding-inline-start:calc(var(--st) + 18px)}
.route-plan dt{margin:0;padding-top:calc((var(--st) - 1.3em) / 2)}
.route-plan dd{margin:6px 0 0;max-width:var(--measure);font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg)}
@media (max-width:68.75em){
.route{grid-template-columns:minmax(0,1fr)}
.route dd{max-width:var(--measure)}
.route-st{padding:0 0 26px calc(var(--st) + 18px);min-height:var(--st)}
.route-st:last-child{padding-bottom:0}
.route dt{padding-top:calc((var(--st) - 1.3em) / 2)}
.route-st:not(:last-child)::before{left:calc(var(--st) / 2 - .5px);right:auto;top:calc(var(--st) + 6px);bottom:6px;
border-top:0;border-left:1px solid var(--stroke)}
.route-plan{margin-top:30px}
}
.played-label{margin:clamp(44px,4.8vw,64px) 0 0;font-size:var(--t-h3)}
.played{--when:1.25rem;--rail:1.875rem;--played-gap:clamp(20px,2.6vw,36px);
list-style:none;margin:14px 0 0;padding:0;position:relative;
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--played-gap)}
.played::before{content:"";position:absolute;left:.375rem;top:calc(var(--when) + var(--rail) / 2);
right:calc((100% - (var(--n,4) - 1) * var(--played-gap)) / var(--n,4) - .375rem);border-top:1px solid var(--stroke)}
.played li{position:relative;display:flex;flex-direction:column;min-width:0;color:var(--fg)}
@media (min-width:62.5625em){
.played{grid-template-rows:auto auto auto}
.played li{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
}
.played li::before{content:"";position:absolute;z-index:1;left:0;top:calc(var(--when) + var(--rail) / 2 - .375rem);
width:.75rem;height:.75rem;box-sizing:border-box;border:1.5px solid var(--stroke);border-radius:50%;background:var(--ground)}
.played-when{display:block;min-height:var(--when);margin-bottom:var(--rail);font-size:.9375rem;font-weight:600;
line-height:var(--when);white-space:nowrap;font-variant-numeric:lining-nums}
html[lang^="ko"] .played-when{font-family:var(--font-kr);font-weight:700}
.played-name{font-family:var(--font-display);font-size:clamp(1.125rem,1.3vw,1.25rem);font-weight:600;line-height:1.25}
html[lang^="ko"] .played-name{font-family:var(--font-kr);font-weight:700;font-size:1.2rem;line-height:1.45;letter-spacing:-.01em}
.played-who{margin-top:6px;font-size:var(--t-small);line-height:var(--lh-small)}
@media (max-width:62.5em){
.played{grid-template-columns:minmax(0,1fr);row-gap:22px;padding-inline-start:2rem}
.played::before{display:none}
.played li::before{left:-2rem;top:calc(var(--when) / 2 - .375rem)}
.played li:not(:last-child)::after{content:"";position:absolute;left:calc(-2rem + .375rem - .5px);
top:calc(var(--when) / 2);height:calc(100% + 22px);border-left:1px solid var(--stroke)}
.played-when{height:auto;margin-bottom:6px;white-space:normal}
}
.table-wrap{margin:0}
.table-box{container:board / inline-size;width:100%;max-width:46rem;margin-inline:auto}
.table{position:relative}
.seats-label{margin:0 0 12px}
.seats{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:14px}
.seat{position:relative;display:block;
font-family:var(--font-display);font-size:1.1875rem;font-weight:600;line-height:1.25;color:var(--fg)}
html[lang^="ko"] .seat{font-family:var(--font-kr);font-weight:700;font-size:1.125rem;line-height:1.45;letter-spacing:-.01em}
.table-top{margin:26px 0 0}
.table-top dt{margin:0}
.table-top dd{margin:6px 0 0;font-size:var(--t-body);line-height:var(--lh-small);color:var(--fg)}
@container board (max-width:33.99rem){
.seats{position:relative;padding-inline-start:1.75rem}
.seat::before{content:"";position:absolute;inset-inline-start:-1.75rem;top:.75em;width:1.25rem;border-top:1px solid var(--stroke)}
.seat:not(:last-child)::after{content:"";position:absolute;inset-inline-start:-1.75rem;top:.75em;height:calc(100% + 14px);
border-inline-start:1px solid var(--stroke)}
}
@container board (min-width:17rem) and (max-width:33.99rem){
.seats{--bow:14px;font-size:1.1875rem;line-height:1.25}
html[lang^="ko"] .seats{font-size:1.125rem;line-height:1.45}
.seat:not(:last-child)::after{content:none}
.seats::before{content:"";position:absolute;inset-inline-start:0;top:.75em;bottom:.5em;bottom:calc(1lh - .75em);
width:var(--bow);border:1px solid var(--stroke);border-inline-start:0;border-radius:0 100% 100% 0 / 0 50% 50% 0}
.seat::before{inset-inline-start:calc(-1.75rem + var(--b,0) * var(--bow));width:calc(1.25rem - var(--b,0) * var(--bow))}
}
@container board (min-width:34rem){
.table{height:calc(var(--th) * 1cqw)}
.seats{position:absolute;inset:0;display:block;padding:0}
.seats::before{content:"";position:absolute;left:50%;top:var(--cy);width:25cqw;height:25cqw;translate:-50% -50%;
border:1px solid var(--stroke);border-radius:50%;background:var(--ground);
outline:1px solid color-mix(in srgb,var(--stroke) 35%,transparent);outline-offset:-.6rem}
.seat{position:absolute;left:var(--x);top:var(--y);max-width:27cqw;font-size:clamp(1.0625rem,2.9cqw,1.25rem)}
html[lang^="ko"] .seat{font-size:clamp(1.0625rem,2.8cqw,1.1875rem)}
.seat::after{content:"";position:absolute;width:3cqw;border-top:1px solid var(--stroke);
transform-origin:0 0;rotate:calc(var(--a) + 180deg)}
.seat-r{translate:0 -50%;padding-inline-start:1.5cqw}
.seat-r::after{left:0;top:50%}
.seat-l{left:auto;right:calc(100% - var(--x));translate:0 -50%;padding-inline-end:1.5cqw;text-align:end}
.seat-l::after{left:100%;top:50%}
.seat-t,.seat-b{width:max-content;max-width:30cqw;text-align:center;translate:-50% 0}
.seat-t{top:auto;bottom:calc(100% - var(--y));padding-bottom:1.5cqw}
.seat-t::after{left:50%;top:100%}
.seat-b{padding-top:1.5cqw}
.seat-b::after{left:50%;top:0}
.table-top{position:absolute;left:50%;top:var(--cy);translate:-50% -50%;width:18.75cqw;margin:0;text-align:center}
.table-top dd{font-size:var(--t-small);line-height:1.35}
}
.board .board-act .btn-row{margin-top:12px}
.play .played+.btn-row{margin-top:clamp(32px,3.6vw,44px)}
.play-note{margin-top:16px}
:is(.wa,.doors){--stroke:var(--accent-mark);--ground:var(--surface);--st:2.75rem}
.band-white :is(.wa,.doors){--ground:var(--surface-raised)}
:is(.wa-glyph,.d-glyph){width:1.375rem;height:1.375rem;fill:none;stroke:currentColor;stroke-width:1.6;
stroke-linecap:round;stroke-linejoin:round}
:is(.wa-ring,.d-ring){display:grid;place-items:center;width:var(--st);height:var(--st);
border:1px solid var(--stroke);border-radius:50%;background:var(--ground);color:var(--accent-ink)}
:is(.wa dt,.d-label){
font-family:var(--font-body);font-size:var(--t-label);font-weight:600;letter-spacing:var(--label-track);
text-transform:uppercase;line-height:1.3;font-variant-numeric:lining-nums tabular-nums;color:var(--accent-ink)}
html[lang^="ko"] :is(.wa dt,.d-label){font-family:var(--font-kr);font-size:.84rem;letter-spacing:var(--label-track-kr);
font-weight:700}
.hero{
position:relative;isolation:isolate;overflow-x:clip;
padding-block:clamp(48px,6vw,96px) 0;
}
.hero+section{padding-top:var(--section-tight)}
.hero{--hero-fs:min(var(--t-hero),19vw)}
html[lang^="ko"] .hero{--hero-fs:min(clamp(2.6rem,6.9vw,6.2rem),19vw)}
@media (max-width:22em){.hero{--hero-fs:min(var(--t-hero),14.6vw)}}
.hero-title{
font-size:var(--hero-fs);line-height:.96;letter-spacing:-.022em;font-weight:500;
max-width:none;text-wrap:initial;
}
.hero-title .for{
font-size:.42em;font-style:italic;font-weight:400;letter-spacing:0;color:var(--accent-ink);
vertical-align:.62em;
}
.hero-title em{font-style:italic;font-weight:500;color:var(--accent-ink)}
html[lang^="ko"] .hero-title{font-size:var(--hero-fs);line-height:1.12;letter-spacing:-.045em}
html[lang^="ko"] .hero-title em{font-weight:700}
.hero-title .ln{--hang:.04em;padding-inline-start:.12em;margin-inline-start:calc(.5px - .12em - var(--hang))}
.hero-title .ln:nth-child(2){--hang:.0222em}
html[lang^="ko"] .hero-title .ln{--hang:.042em}
html[lang^="ko"] .hero-title .ln:nth-child(2){--hang:.041em}
.hero-body{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,5vw,88px);align-items:start}
.footer-line .cm,.hero-sub .cm{white-space:nowrap}
@media (max-width:18em){.footer-line .cm{white-space:normal}}
@media (max-width:12em){.hero-sub .cm{white-space:normal}}
.hero{--hero-sub:max(1.375rem,calc(var(--hero-fs) * .352))}
html[lang^="ko"] .hero{--hero-sub:max(1.375rem,calc(var(--hero-fs) * .338))}
.hero-head{margin:0}
.hero-sub{
margin:max(calc(36px + var(--hero-fs) * .1),calc(var(--hero-fs) * .42)) 0 0;max-width:calc(var(--hero-fs) * 5.9);
font-family:var(--font-display);font-size:var(--hero-sub);font-weight:400;font-style:normal;line-height:1.2;
letter-spacing:-.006em;word-spacing:normal;color:var(--fg);text-wrap:balance;font-feature-settings:"liga" 1,"kern" 1;
}
.hero-sub em{font-style:normal;color:inherit}
html[lang^="ko"] .hero-sub{margin-top:max(30px,calc(var(--hero-fs) * .3));max-width:calc(var(--hero-fs) * 5.7)}
@media (min-width:62.5625em){.hero-sub{line-height:1.1}}
html[lang^="ko"] .hero-sub>[lang="en"]{font-family:var(--font-display);letter-spacing:-.006em;word-break:normal}
.hero-body{margin-top:max(60px,calc(var(--hero-fs) * .8))}
html[lang^="ko"] .hero-body{margin-top:max(56px,calc(var(--hero-fs) * .62))}
@media (min-width:45.0625em) and (max-width:64em){
html:not([lang^="ko"]) .hero-body{margin-top:max(calc(66px + var(--hero-fs) * .1),calc(var(--hero-fs) * .8))}
}
.hero .now-line{margin-top:0}
.hero .now-line+.hero-cta{margin-top:28px}
@media (min-width:62.5625em) and (max-height:56em){
.hero .now-line+.hero-cta{margin-top:20px}
}
.hero-cta{margin-top:12px}
@media (max-width:40em){.hero-cta{flex-direction:column;align-items:flex-start}}
.hero-figure{position:relative;margin-inline-end:calc((min(100vw,var(--wrap)) - 100vw) / 2 - var(--gutter))}
.hero-figure .photo{border-radius:var(--radius-xs) 0 0 var(--radius-xs)}
.hero-figure .photo{aspect-ratio:16/10}
.hero-figure .photo img{object-position:50% 72%}
.hero-figure figcaption{padding-inline-end:var(--gutter)}
.hero-figure::before,.rings::before,.rings::after{
content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%;
left:50%;top:50%;width:min(118vw,1180px);aspect-ratio:1;translate:-50% -50%;
}
.hero-figure::before{
background:repeating-radial-gradient(circle at center,color-mix(in srgb,var(--accent) 60%,transparent) 0 1px,transparent 1px 46px);
-webkit-mask-image:radial-gradient(circle at center,#000 22%,transparent 64%);
mask-image:radial-gradient(circle at center,#000 22%,transparent 64%);
opacity:.32;
}
.hero-figure{container-type:inline-size}
@supports (mask-composite:intersect){
.hero-figure::before{top:0;margin-top:31.25%;
-webkit-mask-image:radial-gradient(circle at center,#000 22%,transparent var(--ring-end,64%)),
linear-gradient(#000 calc(50% + 31.25cqw - 110px),transparent calc(50% + 31.25cqw));
mask-image:radial-gradient(circle at center,#000 22%,transparent var(--ring-end,64%)),
linear-gradient(#000 calc(50% + 31.25cqw - 110px),transparent calc(50% + 31.25cqw));
-webkit-mask-composite:source-in;mask-composite:intersect}
@media (max-width:75em){.hero-figure::before{--ring-end:56%;width:min(100vw,1180px);margin-top:37.5%;
-webkit-mask-image:radial-gradient(circle at center,#000 22%,transparent var(--ring-end,64%)),
linear-gradient(#000 calc(50% + 25cqw - 110px),transparent calc(50% + 25cqw));
mask-image:radial-gradient(circle at center,#000 22%,transparent var(--ring-end,64%)),
linear-gradient(#000 calc(50% + 25cqw - 110px),transparent calc(50% + 25cqw))}}
}
@media (max-width:55em){
.hero-figure::before{left:84%;top:0;margin-top:0;width:min(96vw,420px);--ring-end:56%;
background:repeating-radial-gradient(circle at center,color-mix(in srgb,var(--accent) 60%,transparent) 0 1px,transparent 1px 30px);
-webkit-mask-image:radial-gradient(circle at center,#000 22%,transparent 56%);
mask-image:radial-gradient(circle at center,#000 22%,transparent 56%)}
.rings::before,.rings::after{left:84%;top:0}
}
.rings{position:absolute;inset:0;z-index:-1;pointer-events:none}
.rings::before,.rings::after{width:min(70vw,760px);border:1px solid var(--accent);opacity:0}
@media (prefers-reduced-motion:no-preference){
.rings::before{animation:ripple calc(var(--dur-slower) * 2) var(--ease-enter) calc(var(--beat) * 3) backwards}
.rings::after{animation:ripple calc(var(--dur-slower) * 2) var(--ease-enter) calc(var(--beat) * 9) backwards}
}
@media (min-width:62.5625em) and (max-height:56em){
.hero{padding-top:clamp(32px,4vh,56px);--hero-fs:min(clamp(3rem,min(8.4vw,13vh),7.6rem),19vw)}
html[lang^="ko"] .hero{--hero-fs:min(clamp(2.6rem,min(6.9vw,13vh),6.2rem),19vw)}
.hero .eyebrow{margin-bottom:12px}
}
@media (max-width:55em){
.hero-body{grid-template-columns:1fr;gap:36px}
.hero-figure{margin-inline:0 calc(-1 * var(--gutter))}
.hero-figure figcaption{padding-inline:0 var(--gutter)}
}
.ph{position:relative;isolation:isolate;overflow-x:clip;padding-block:clamp(56px,7vw,120px) 0}
.ph::before{
content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%;
inset-inline-end:-16%;inset-block-start:-48%;width:min(80vw,920px);aspect-ratio:1;
background:repeating-radial-gradient(circle at center,color-mix(in srgb,var(--accent) 60%,transparent) 0 1px,transparent 1px 44px);
-webkit-mask-image:radial-gradient(circle at center,#000 16%,transparent 62%);
mask-image:radial-gradient(circle at center,#000 16%,transparent 62%);
opacity:.22;
}
.ph-plain::before{content:none}
@media (min-width:55.0625em){
.ph::before{content:none}
.ph-figure{position:relative}
.ph-figure::before{content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%;
left:0;top:50%;width:min(56vw,680px);aspect-ratio:1;translate:-50% -50%;
background:repeating-radial-gradient(circle at center,color-mix(in srgb,var(--accent) 60%,transparent) 0 1px,transparent 1px 44px);
-webkit-mask-image:radial-gradient(circle at center,#000 16%,transparent 62%);
mask-image:radial-gradient(circle at center,#000 16%,transparent 62%);
opacity:.22}
}
.ph-head{display:grid;grid-template-columns:7fr 5fr;gap:clamp(28px,5vw,88px);align-items:end}
.ph-title{max-width:12em}
.ph-lead{font-size:var(--t-lead);line-height:var(--lh-lead);letter-spacing:var(--track-lead);color:var(--fg);
max-width:var(--measure-lead);margin:0;padding-bottom:.4em}
@media (max-width:75em){.ph-head{grid-template-columns:minmax(0,1fr);align-items:start;gap:24px;
row-gap:max(36px,calc(var(--t-h1) * .56))}}
@media (max-width:75em){html[lang^="ko"] .ph-head{row-gap:max(36px,calc(var(--t-h1) * .44))}}
.ph-figure{margin:clamp(40px,5vw,80px) 0 0 var(--col4)}
.ph-figure .photo{aspect-ratio:3/2}
.ph-plain{padding-bottom:clamp(24px,3vw,48px)}
@media (max-width:55em){
.ph-head{grid-template-columns:1fr;align-items:start;gap:24px;row-gap:36px}
.ph-figure{margin-inline-start:0}
.ph::before{inset-inline-end:-50%;width:130vw;opacity:.16}
}
@media (min-width:40.0625em) and (max-width:55em){.ph::before{inset-inline-end:-56%;inset-block-start:-62%;width:120vw}}
.photo{
position:relative;overflow:clip;isolation:isolate;border-radius:var(--radius-xs);
background:var(--surface-sunken);
}
.photo picture{display:contents}
.photo img{width:100%;height:100%;object-fit:cover}
.photo-3x2{aspect-ratio:3/2}
.photo-4x3{aspect-ratio:4/3}
.photo-4x5{aspect-ratio:4/5}
.photo-1x1{aspect-ratio:1/1}
.photo-16x9{aspect-ratio:16/9}
figcaption{
margin-top:14px;font-size:var(--t-caption);line-height:1.5;color:var(--fg-muted);
display:flex;gap:2px 10px;align-items:baseline;flex-wrap:wrap;
}
figcaption .cap-credit{flex-basis:100%}
figcaption .cap-label{color:var(--accent-ink);font-size:var(--t-label)}
figcaption>span:not(.cap-label){max-width:36em}
.map-cap{display:block}
.cover{--cv-pad:clamp(14px,1.4vw,22px);--cv-no:clamp(1.5rem,2.1vw,2.05rem);--cv-line:clamp(.85rem,1.05vw,.98rem);
position:relative;isolation:isolate;overflow:clip;aspect-ratio:4/5;display:grid;grid-template-rows:auto 1fr auto;
container-type:inline-size;view-transition-class:prog-cover;
padding:var(--cv-pad);border-radius:var(--radius);background:var(--surface-inverse);color:var(--fg-inverse);
transition:background-color var(--dur-5) var(--ease)}
html[lang^="ko"] .cover{--cv-line:.875rem}
.cover-no{font-family:var(--font-display);font-size:var(--cv-no);line-height:1;color:var(--accent-inverse);
font-variant-numeric:lining-nums}
.cover-mark{position:absolute;inset:calc(var(--cv-pad) + var(--cv-no)) 0 calc(var(--cv-pad) + var(--cv-line) * 1.3);
margin:auto;width:38%;height:auto;overflow:visible;
fill:none;stroke:var(--accent-inverse);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.cover-line{grid-row:3;font-family:var(--font-display);font-style:italic;font-size:var(--cv-line);line-height:1.3;
color:var(--fg-inverse-body)}
html[lang^="ko"] .cover-line{font-family:var(--font-kr);font-style:normal;letter-spacing:-.01em}
:is(.pc,.cover-sm) .cover-mark{inset-block-end:var(--cv-pad)}
@container (max-width:180px){.cover-line{display:none}.cover-mark{width:44%;inset-block-end:var(--cv-pad)}}
.cover-sm{--cv-pad:8px;--cv-no:1.05rem;padding:8px 9px;grid-template-rows:auto 1fr}
.cover-sm .cover-no{font-size:var(--cv-no)}
.cover-sm .cover-mark{width:46%}
.cover-sm .cover-line{display:none}
@media (prefers-reduced-motion:no-preference){
.cover{--lift:-4px;transition:translate var(--dur-3) var(--ease),box-shadow var(--dur-3) var(--ease),
background-color var(--dur-5) var(--ease)}
.cover-sm{--lift:-2px;--shadow-lift:0 8px 14px -7px rgb(29 36 48 / .36),0 2px 5px -2px rgb(29 36 48 / .14)}
.cover-mark{transition:scale var(--dur-3) var(--ease)}
@media (hover:hover) and (pointer:fine){
:is(.pc,.pi):hover .cover{translate:0 var(--lift);box-shadow:var(--shadow-lift);
transition:translate var(--dur-5) var(--ease-settle),box-shadow var(--dur-5) var(--ease),
background-color var(--dur-5) var(--ease)}
:is(.pc,.pi):hover .cover-mark{scale:1.04;transition:scale var(--dur-5) var(--ease-settle)}
}
.pc:focus-visible .cover,.pi:has(:focus-visible) .cover{translate:0 var(--lift);box-shadow:var(--shadow-lift)}
:is(.pc,.pi):active .cover{translate:0 -1px;box-shadow:var(--shadow-set);transition-duration:var(--dur-1)}
@media (hover:none){:is(.pc,.pi):active .cover{translate:none;scale:.98;transition-duration:var(--dur-2)}}
}
a,button,summary,label{-webkit-tap-highlight-color:color-mix(in srgb,var(--gold-light) 28%,transparent)}
:is(.band-ink,.site-footer) a{-webkit-tap-highlight-color:rgb(255 255 255 / .12)}
.progs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);list-style:none;margin:0;padding:0}
.pc{display:flex;flex-direction:column;height:100%;color:var(--fg-body)}
.pc:hover{color:var(--fg-body)}
@media (prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){:is(.pc,.pi):hover .cover{background:var(--soft-navy)}}
.pc-body{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding-top:18px;flex:1}
.pc .kicker{display:inline-flex;align-items:center;gap:8px}
.pc h3{font-size:var(--t-h3);line-height:1.2;transition:color var(--dur-3) var(--ease)}
.pc-name{display:flex;flex-direction:column;gap:6px;margin-bottom:4px}
@media (min-width:62.5625em){
.progs{row-gap:0}
.progs>li{display:grid;grid-row:span 6;grid-template-rows:subgrid}
.pc{grid-row:1 / -1;display:grid;grid-template-rows:subgrid;height:auto}
.pc-body{grid-row:2 / -1;display:grid;grid-template-rows:subgrid;gap:0;padding-top:0}
.pc-name{display:contents}
.pc .kicker{margin-top:18px}
.pc h3{margin-top:10px}
.pc .pc-topics{margin-top:6px}
.pc-body>p:not(.pc-topics){margin-top:16px}
.pc .pc-body>.tag{margin-top:16px}
}
html[lang^="ko"] .pc h3{font-size:1.2rem;line-height:1.42}
.pc:hover h3{color:var(--accent-ink)}
.pc p{margin:0;font-size:var(--t-small);line-height:var(--lh-small);letter-spacing:var(--track-small);color:var(--fg)}
.pc .pc-topics{font-family:var(--font-display);font-style:italic;font-size:1.0625rem;line-height:1.3;
letter-spacing:0;text-wrap:balance}
.pc .cover-line{display:none}
html[lang^="ko"] .pc .pc-topics{font-family:var(--font-kr);font-style:normal;font-size:1rem;line-height:1.5;
letter-spacing:-.01em;text-wrap:pretty}
.pc .tag{margin-top:auto}
.pc .tag,.pi .tag,.pp-now .tag{white-space:normal;max-width:100%}
@media (min-width:62.5625em){
.pc .tag{align-self:stretch;align-items:flex-start;min-height:calc(2lh + 5px);padding:4px 0 0;border-radius:0;
background:none}
.pc .tag:not(.tag-live){color:var(--fg)}
.pc .tag-live::before{margin-top:calc(.5lh - 1.5px)}
html[lang^="ko"] .pc .tag-live::before{margin-top:calc(.5lh - 2.5px)}
}
.dot{display:inline-block;width:max(8px,.5em);height:max(8px,.5em);border-radius:50%;flex:0 0 auto;background:var(--accent-mark)}
.dot-open{background:transparent;box-shadow:inset 0 0 0 1.5px var(--accent-mark)}
@media (max-width:62.5em){
.progs{grid-template-columns:1fr;gap:0}
.pc{display:grid;grid-template-columns:clamp(96px,26vw,132px) minmax(0,1fr);column-gap:18px;align-items:start;
padding-block:16px}
.pc-body{padding-top:0}
}
.prog-index{list-style:none;margin:0;padding:0}
.pi{position:relative;display:grid;grid-template-columns:4.6rem minmax(0,1fr) 15.5rem auto;
gap:10px clamp(20px,3vw,48px);align-items:start;padding:clamp(20px,2.4vw,30px) 0;scroll-margin-top:110px}
.pi-main .kicker{display:inline-flex;align-items:center;gap:8px}
.pi h2{margin-top:8px;font-size:var(--t-h2-sm);line-height:1.12}
html[lang^="ko"] .pi h2{font-size:clamp(1.35rem,2.2vw,1.85rem);line-height:1.36}
.pi h2 a{color:var(--fg);transition:color var(--dur-3) var(--ease)}
.pi h2 a::after{content:"";position:absolute;inset:0;z-index:1}
.pi p{margin:14px 0 0;font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);max-width:var(--measure)}
.pi-state{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;align-self:start}
.pi-facts{margin:0}
.pi-facts dt{color:var(--accent-ink)}
.pi-facts dd{margin:5px 0 0;font-family:var(--font-display);font-size:1.12rem;font-weight:600;line-height:1.35;color:var(--fg)}
html[lang^="ko"] .pi-facts dd{font-family:var(--font-kr);font-weight:700;font-size:1rem}
.pi-end{display:flex;align-items:center;justify-content:flex-end;align-self:start;
padding-top:37px;height:calc(37px + var(--t-h2-sm) * 1.12);box-sizing:border-box}
html[lang^="ko"] .pi-end{padding-top:38.5px;height:calc(38.5px + clamp(1.35rem,2.2vw,1.85rem) * 1.36)}
.pi .cover-sm{align-self:start}
.pi .arrow{color:var(--accent-ink)}
.pi::before{content:"";position:absolute;inset-inline:0;top:-1px;height:1px;background:var(--accent);
scale:0 1;transform-origin:0 50%;transition:scale var(--dur-4) var(--ease)}
@media (hover:hover){.pi:hover::before{scale:1 1}}
.pi:hover h2 a{color:var(--accent-ink)}
.pi:hover .arrow i{translate:1.3em 0}
.pi:target .cover{background:var(--soft-navy)}
@media (hover:none){
.pc:active .cover{background:var(--soft-navy)}
:is(.pc:active h3,.others a:active b){color:var(--accent-ink)}
.pi:has(h2 a:active)::before{scale:1 1;transition-duration:var(--dur-1)}
.pi:has(h2 a:active) h2 a{color:var(--accent-ink)}
}
@media (prefers-reduced-motion:no-preference){.pi:target::before{animation:draw-x var(--dur-slow) var(--ease-settle) var(--dur-4) backwards}}
.pi:target::before{content:"";position:absolute;inset-inline:0;top:-1px;height:2px;background:var(--accent);scale:1 1}
.pi-note{display:grid;grid-template-columns:4.6rem minmax(0,1fr);column-gap:clamp(20px,3vw,48px);row-gap:6px;
margin:28px 0 0;font-size:var(--t-small);color:var(--fg);scroll-margin-top:110px}
.pi-note>*{grid-column:2}
.pi-note>span:not(.kicker){max-width:var(--measure)}
@media (max-width:62.5em){.pi-note{grid-template-columns:4.2rem minmax(0,1fr);column-gap:16px}}
@media (max-width:40em){.pi-note{display:block}.pi-note .kicker{display:flex;margin-bottom:6px}}
@media (max-width:22em){
.pi{grid-template-columns:minmax(0,1fr) !important}
.pi .cover-sm{width:4.2rem}
.pi-state{grid-column:1 !important}
}
@media (max-width:62.5em){
.pi{grid-template-columns:4.2rem minmax(0,1fr);gap:14px 16px}
.pi-state{grid-column:2}
.pi-end{display:none}
}
.facts{display:grid;grid-template-columns:minmax(8.5em,auto) 1fr;margin:30px 0 0}
.facts dt,.facts dd{padding-block:11px}
.facts dt{color:var(--accent-ink);padding-inline-end:20px;padding-top:calc(11px + .3em)}
.facts dd{margin:0;color:var(--fg);font-size:var(--t-body);line-height:1.56}
.facts dd+dt,.facts dd+dt+dd{border-top:1px solid var(--rule)}
.band-ink .facts :is(dd+dt,dd+dt+dd){border-top-color:var(--line-inverse)}
.band-ink .facts dt{color:var(--accent-inverse)}
.band-ink .facts dd{color:var(--fg-inverse)}
@media (max-width:35em){
.facts{grid-template-columns:1fr}
.facts dd+dt+dd{border-top:0}
.facts dt{padding-bottom:0}
.facts dd{padding-top:2px}
}
.callout{display:grid;grid-template-columns:auto 1fr;gap:6px 24px;align-items:baseline}
.callout p{margin:0;max-width:44em}
.callout .tag{justify-self:start}
@media (max-width:40em){.callout{grid-template-columns:1fr}}
.tag{
display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:var(--radius-pill);
font-family:var(--font-body);font-size:.9375rem;font-weight:700;line-height:1.3;letter-spacing:0;
text-transform:none;font-variant-numeric:lining-nums;
color:var(--fg);background:var(--surface-status);white-space:nowrap;
}
html[lang^="ko"] .tag{font-family:var(--font-kr);font-size:.9375rem;letter-spacing:-.01em}
.tag-live{color:var(--live);background:var(--live-tint)}
.tag-live::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;
translate:0 1.5px}
html[lang^="ko"] .tag-live::before{translate:0 .5px}
@media (min-width:62.5625em){.pc .tag-live::before{translate:none}}
@media (prefers-reduced-motion:no-preference){.tag-live::before{animation:pulse 1.8s var(--ease) 2}}
.why{display:grid;grid-template-columns:3fr 9fr;gap:var(--gap);align-items:baseline}
.why .eyebrow{margin:0}
.why-premise{font-size:var(--t-statement);line-height:1.12;max-width:17em}
html[lang^="ko"] .why-premise{font-size:clamp(1.55rem,3vw,2.55rem);line-height:1.38}
.why-reasons{list-style:none;margin:clamp(24px,3vw,38px) 0 0;padding:0;display:grid;gap:10px}
.why-reasons li{font-family:var(--font-display);font-size:var(--t-h3);line-height:1.34;color:var(--fg)}
html[lang^="ko"] .why-reasons li{font-family:var(--font-kr);font-size:var(--t-lead);font-weight:400;line-height:1.6;letter-spacing:-.01em}
.why-resolve{margin:clamp(28px,3.4vw,48px) 0 0;font-family:var(--font-display);font-size:var(--t-h2);line-height:1.04;
font-weight:500;letter-spacing:-.012em;color:var(--fg)}
.why-resolve em{font-style:normal;color:var(--accent-ink)}
html[lang^="ko"] .why-resolve{font-family:var(--font-kr);font-weight:700;font-size:clamp(1.75rem,3.1vw,2.7rem);
line-height:1.3;letter-spacing:-.034em}
html[lang^="ko"] .why-resolve em{font-style:normal}
.why .btn-row{margin-top:28px}
@media (max-width:55em){.why{grid-template-columns:1fr;gap:20px}}
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()) and ((background-clip:text) or (-webkit-background-clip:text)){
.ink{
color:transparent;
background:
linear-gradient(var(--fg),var(--fg)) 0 0 / 0% 100% no-repeat,
linear-gradient(color-mix(in srgb,var(--fg) 50%,var(--surface-raised)),color-mix(in srgb,var(--fg) 50%,var(--surface-raised))) 0 0 / 100% 100% no-repeat;
-webkit-background-clip:text;background-clip:text;
animation:ink-fill linear both;animation-timeline:view();animation-range:entry 0% entry 80%;
}
.why-premise{view-timeline:--premise block}
.ink{animation-timeline:--premise}
}
}
@media (prefers-contrast:more){.ink{color:inherit !important;background:none !important;animation:none !important}}
@property --c{syntax:"<integer>";inherits:false;initial-value:0}
.figs{display:grid;grid-template-columns:repeat(var(--figs,3),minmax(0,1fr));column-gap:var(--col-gap);margin:0}
.fig{position:relative;display:flex;flex-direction:column;padding:clamp(20px,2.4vw,32px) 0 4px}
.fig b{
display:block;font-family:var(--font-display);font-weight:400;font-size:var(--t-figure);
line-height:.86;letter-spacing:-.03em;color:var(--fg-inverse);
font-variant-numeric:lining-nums tabular-nums;
}
.fig b sup,.fig .plus{font-size:.5em;vertical-align:.7em;color:var(--accent-inverse);margin-inline-start:.04em}
.fig-label{display:block;margin-top:22px;font-size:var(--t-small);line-height:1.5;color:var(--fg-inverse);max-width:18em}
.fig-period{display:block;margin-top:10px;color:var(--accent-inverse)}
html[lang^="ko"] .fig b{font-family:var(--font-display)}
.fig b{margin-inline-start:calc(-1 * var(--hang,0em))}
.figs-note{margin-top:clamp(36px,4vw,56px);max-width:var(--measure);color:var(--fg-inverse);font-size:var(--t-lead);
line-height:var(--lh-lead,1.5)}
.figs-band .figs-note+.btn-row{margin-top:18px}
@media (min-width:48.0625em){
.figs{grid-template-rows:auto auto auto;row-gap:0}
.fig{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
}
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()) and (counter-reset:n var(--c)){
@keyframes count-up{from{--c:0}to{--c:var(--n)}}
.fig b{view-timeline:--fig block}
.count{display:inline-block;min-width:2ch;text-align:start;
counter-reset:n var(--c);animation:count-up linear both;animation-timeline:--fig;animation-range:entry 0% entry 45%}
.count>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.count::before{content:counter(n);content:counter(n) / ""}
}
}
@media (max-width:48em){
.figs{grid-template-columns:1fr}
.fig{padding-bottom:20px}
}
@media (min-width:55.0625em){
.figs-band>.wrap{display:grid;grid-template-columns:3fr 9fr;column-gap:var(--gap);align-items:start}
.figs-band>.wrap>*{grid-column:2}
.figs-band>.wrap>.eyebrow{grid-column:1;grid-row:1;margin:0;padding-top:0}
.figs-band .fig{padding-top:0}
}
.forty{margin:clamp(36px,4.4vw,56px) 0 0}
.forty-groups{display:flex;gap:16px clamp(20px,2.4vw,32px)}
.forty-g{flex:var(--n,20) 1 0;min-width:0}
.forty-row{display:grid;grid-template-columns:repeat(var(--n,20),minmax(0,1fr));gap:6px;align-content:start}
.forty-row span{width:100%;aspect-ratio:1;border-radius:50%;background:var(--accent-inverse)}
.forty-row .f-open{background:transparent;box-shadow:inset 0 0 0 1.5px var(--accent-inverse)}
@media (max-width:48em){
.forty-groups{flex-direction:column}
.forty-g{flex:none}
.forty-row{grid-template-columns:repeat(23,minmax(0,1fr));gap:clamp(2px,.9vw,5px);max-width:34rem}
}
.forty-n{margin:12px 0 0;font-size:var(--t-small);line-height:1.4;color:var(--fg-inverse);font-variant-numeric:lining-nums}
.forty figcaption{margin-top:20px;font-size:var(--t-caption);color:var(--fg-inverse-body)}
.glance{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px var(--col-gap);margin:0}
.glance dt{color:var(--accent-ink)}
.glance dd{margin:12px 0 0;font-family:var(--font-display);font-size:clamp(1.35rem,2vw,1.75rem);line-height:1.15;color:var(--fg)}
html[lang^="ko"] .glance dd{font-family:var(--font-kr);font-weight:700;font-size:1.2rem;letter-spacing:-.01em;line-height:1.4}
.glance dd small{display:block;margin-top:8px;font-family:var(--font-body);font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg)}
html[lang^="ko"] .glance dd small{font-family:var(--font-kr);font-weight:400;letter-spacing:0}
@media (max-width:55em){.glance{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:55.0625em){
.glance{grid-template-columns:calc(var(--col4) - var(--col-gap)) repeat(3,minmax(0,1fr))}
}
@media (max-width:30em){.glance{grid-template-columns:minmax(0,1fr)}}
.prose-split{display:grid;grid-template-columns:3fr 9fr;gap:var(--gap);align-items:start}
.prose-split .sh{margin:0}
.prose{font-size:var(--t-body);line-height:var(--lh-text);max-width:var(--measure)}
.prose p+p{margin-top:1.1em}
@media (min-width:55.0625em){.prose-split .sh{position:sticky;top:120px}.prose-split .sh h2{font-size:var(--t-h2-sm)}}
@media (max-width:55em){.prose-split{grid-template-columns:1fr}}
.founder{display:grid;grid-template-columns:6fr 6fr;gap:clamp(32px,6vw,104px);align-items:center}
.founder .photo{aspect-ratio:4/5}
:is(.founder,.now)>.plate{max-width:480px}
.founder-ko{display:block;margin-top:8px;font-size:var(--t-h3);line-height:1.3}
.founder h2 .nm{display:inline-block}
.founder-role{margin-top:max(20px,min(33px,calc((var(--t-h2) - 32px) * 1.6 + 20px)));color:var(--fg);font-weight:600}
.founder-line{margin:22px 0 0;font-size:var(--t-lead);line-height:var(--lh-lead);color:var(--fg);max-width:var(--measure-lead)}
.founder .facts-plain{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:26px}
html[lang^="ko"] .founder-role{font-weight:700}
@media (max-width:55em){.founder{grid-template-columns:1fr}.founder .plate{max-width:440px}}
@media (min-width:55.0625em){.run-body{margin-inline-start:var(--col4)}}
.run-body .btn-row{margin-top:28px}
.places{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,4vw,64px);align-items:start}
.places-map{margin:0;position:sticky;top:110px;container-type:inline-size}
.map-svg{width:100%;max-width:520px;height:auto;overflow:visible}
.map-svg .m-land{fill:var(--surface-sunken);stroke:var(--line-strong);stroke-width:.9;stroke-linejoin:round}
.map-svg .m-dot{fill:var(--accent-mark)}
.map-svg .m-halo{fill:none;stroke:var(--accent-mark);stroke-width:1}
.map-svg .m-lead{fill:none;stroke:var(--accent-mark);stroke-width:.8}
.map-svg .m-label{fill:var(--fg);font-family:var(--font-display);font-size:19px}
.map-svg .m-sub{fill:var(--fg-muted-sunken);font-family:var(--font-body);font-size:15px}
html[lang^="ko"] .map-svg :is(.m-label,.m-sub){font-family:var(--font-kr)}
html[lang^="ko"] .map-svg .m-label{font-size:17px;font-weight:700}
@container (max-width:400px){
.map-svg .m-label{font-size:24px}
.map-svg .m-sub{font-size:20px;transform:translateY(6px)}
html[lang^="ko"] .map-svg .m-label{font-size:22px}
}
.places-map figcaption{margin-top:14px}
.places-list{columns:2;column-gap:var(--gap)}
@media (max-width:75em){.places-list{columns:1}}
.places-group{break-inside:avoid;margin-bottom:clamp(28px,3vw,44px)}
.places-group h3{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 10px;color:var(--accent-ink)}
.pl-n{color:var(--fg-muted)}
.places-group ul{list-style:none;margin:0;padding:0}
.places-group li{padding-block:5px}
.pl-name{display:block;font-family:var(--font-display);font-size:1.15rem;line-height:1.3;color:var(--fg)}
html[lang^="ko"] .pl-name{font-family:var(--font-kr);font-weight:400;font-size:1.0625rem;letter-spacing:-.01em}
.places-group small{display:block;margin-top:2px;font-size:var(--t-caption);color:var(--fg-muted)}
@media (max-width:55em){
.places{grid-template-columns:1fr}
.places-map{position:static;max-width:460px}
}
@media (max-width:30em){.places-list{columns:1}}
.mark{display:grid;grid-template-columns:6fr 6fr;gap:clamp(32px,6vw,104px);align-items:center}
.mark h2+.lead{margin-top:34px}
.mark h2 em{font-style:normal;color:var(--accent-ink)}
.mark-plate{display:grid;place-items:center;padding:clamp(40px,6vw,88px);background:var(--surface-raised);
border-radius:var(--radius-xs)}
.mark-plate img{width:min(360px,100%);height:auto}
@media (max-width:55em){.mark{grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:6fr 6fr;gap:clamp(32px,6vw,104px);align-items:center}
.split-flip>.plate{order:2}
@media (max-width:55em){.split{grid-template-columns:1fr}.split-flip>.plate{order:0}}
section.gi-ways{padding-top:0}
.doors ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
gap:clamp(28px,3vw,40px) var(--gap)}
.doors li{display:flex;min-width:0}
.doors a{position:relative;display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;min-width:0;
padding-block:6px;color:var(--fg)}
.d-ring{transition:border-color var(--dur-3) var(--ease),color var(--dur-3) var(--ease)}
.d-label{margin-top:16px}
.d-title{margin-top:8px;max-width:12em;font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;
line-height:1.22;text-wrap:balance;transition:color var(--dur-3) var(--ease)}
html[lang^="ko"] .d-title{font-family:var(--font-kr);font-weight:700;font-size:1.25rem;line-height:1.4;letter-spacing:-.01em;
text-wrap:pretty}
.d-go{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:auto;padding-top:10px;
font-size:var(--t-small);font-weight:600;color:var(--fg);transition:color var(--dur-3) var(--ease)}
html[lang^="ko"] .d-go{font-family:var(--font-kr);font-weight:400}
.d-go .arrow{color:var(--accent-ink)}
.d-act{min-width:0}
.doors :is(.d-title,.d-act){overflow-wrap:anywhere}
.doors a:hover :is(.d-title,.d-go){color:var(--accent-ink)}
.doors a:hover .d-act{text-decoration:underline;text-decoration-color:var(--accent-mark);
text-decoration-thickness:1px;text-underline-offset:4px}
.doors a:hover .d-ring{border-color:var(--accent-ink)}
.doors a:focus-visible{outline-offset:6px}
@media (min-width:62.5625em){
.doors ul{grid-template-columns:calc(var(--col4) - var(--gap)) repeat(3,minmax(0,1fr))}
}
@media (max-width:62.5em){.doors ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:35em){
.doors ul{grid-template-columns:minmax(0,1fr);gap:6px}
.doors a{display:grid;grid-template-columns:var(--st) minmax(0,1fr);column-gap:18px;align-items:start;
padding-block:12px}
.d-ring{grid-row:1 / span 3}
.d-label{margin-top:2px}
.d-title{margin-top:4px;max-width:none}
.d-go{margin-top:0;padding-top:2px}
}
@media (max-width:19.99em){
.doors a{display:flex;flex-direction:column}
.d-ring{grid-row:auto}
.d-label{margin-top:14px}
}
.doors.doors-pair{
--st:3.5rem;list-style:none;margin:clamp(36px,4.4vw,56px) 0 0;padding:0;
display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(14px,1.6vw,24px);
}
@media (min-width:62.5625em){.doors.doors-pair{grid-template-columns:repeat(2,minmax(0,1fr))}}
.doors.doors-pair li{display:flex;min-width:0}
.doors.doors-pair a{
flex:1 1 auto;display:grid;grid-template-columns:var(--st) minmax(0,1fr) 2.75rem;align-items:center;
column-gap:clamp(16px,1.8vw,24px);min-width:0;padding:clamp(18px,2vw,26px) clamp(18px,2.2vw,30px);
background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius);color:var(--fg);
transition:border-color var(--dur-3) var(--ease),box-shadow var(--dur-6) var(--ease),translate var(--dur-6) var(--ease-settle);
}
.doors.doors-pair .d-ring{width:var(--st);height:var(--st)}
.doors.doors-pair .d-glyph{width:1.6rem;height:1.6rem}
.doors.doors-pair .d-text{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.doors.doors-pair .d-label{margin:0}
.doors.doors-pair .d-title{margin:0;max-width:none;font-size:clamp(1.35rem,1.9vw,1.6rem);line-height:1.15}
html[lang^="ko"] .doors.doors-pair .d-title{font-size:clamp(1.2rem,1.6vw,1.35rem);line-height:1.4}
.doors.doors-pair .d-note{font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);text-wrap:balance}
html[lang^="ko"] .doors.doors-pair .d-note{text-wrap:pretty}
.doors.doors-pair .d-cta{display:grid;place-items:center;width:2.75rem;height:2.75rem;border:1px solid var(--accent-mark);
border-radius:50%;color:var(--accent-ink);font-size:1.15rem;
transition:background-color var(--dur-3) var(--ease),color var(--dur-3) var(--ease),border-color var(--dur-3) var(--ease)}
.doors.doors-pair a:hover{border-color:var(--accent-mark)}
.doors.doors-pair a:hover .d-cta{background:var(--accent);border-color:var(--accent);color:var(--ink-navy)}
.doors.doors-pair a:hover .d-title{color:var(--accent-ink)}
.doors.doors-pair a:focus-visible{outline-offset:4px}
@media (max-width:40em){
.doors.doors-pair a{grid-template-columns:var(--st) minmax(0,1fr);row-gap:14px}
.doors.doors-pair .d-ring{grid-column:1;grid-row:1}
.doors.doors-pair .d-cta{grid-column:2;grid-row:1;justify-self:end}
.doors.doors-pair .d-text{grid-column:1 / -1;grid-row:2}
}
@media (min-width:62.5625em){
.doors.doors-pair{row-gap:0}
.doors.doors-pair li{display:grid;grid-row:span 3;grid-template-rows:subgrid}
.doors.doors-pair a{grid-row:1 / -1;grid-template-rows:subgrid;row-gap:6px}
.doors.doors-pair .d-text{display:contents}
.doors.doors-pair .d-ring{grid-column:1;grid-row:1 / -1;align-self:center}
.doors.doors-pair :is(.d-label,.d-title,.d-note){grid-column:2}
.doors.doors-pair .d-label{grid-row:1;align-self:end}
.doors.doors-pair .d-title{grid-row:2}
.doors.doors-pair .d-note{grid-row:3;align-self:start}
.doors.doors-pair .d-cta{grid-column:3;grid-row:1 / -1;align-self:center}
}
@media (max-width:23.75em){
.doors.doors-pair a{grid-template-columns:var(--st) minmax(0,1fr);row-gap:14px}
.doors.doors-pair .d-cta{grid-column:2}
}
@media (max-width:16em){
.doors.doors-pair a{grid-template-columns:minmax(0,1fr)}
.doors.doors-pair .d-cta{grid-column:1}
}
.doors a:active .d-ring{background:var(--surface-sunken)}
.invite{display:grid;grid-template-columns:3fr 9fr;gap:var(--gap)}
.invite :is(.steps,.meets){grid-column:2}
.invite-act{grid-column:2;margin-top:8px}
.invite-act .btn-row{margin-top:20px}
.meets>.invite-act{grid-column:auto;margin-top:calc(28px - clamp(48px,5.2vw,72px))}
.meets>.invite-act .btn-row{margin-top:0}
.meets>.invite-more{margin-top:calc(28px - clamp(48px,5.2vw,72px))}
.play{margin-inline-start:var(--col4)}
.board{display:grid;grid-template-columns:3fr 9fr;gap:var(--gap)}
.board>*{grid-column:2}
.board .btn-row{margin-top:28px}
@media (max-width:55em){
.invite,.board{grid-template-columns:1fr}
.invite :is(.steps,.meets),.invite-act,.board>*{grid-column:1}
.play{margin-inline-start:0}
}
.helps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px var(--col-gap)}
.help{display:flex;flex-direction:column;scroll-margin-top:110px}
.help h3{font-size:clamp(1.35rem,2vw,1.7rem);margin-top:6px}
html[lang^="ko"] .help h3{font-size:1.28rem}
.help p{margin-top:14px;font-size:var(--t-small);line-height:var(--lh-small)}
.help .btn-row{margin-top:auto;padding-top:26px}
@media (max-width:55em){
.helps{grid-template-columns:minmax(0,1fr)}
}
.ico{
display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
width:44px;height:44px;border-radius:50%;margin-bottom:16px;
background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent-ink);
}
.ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.promise{list-style:none;margin:0;padding:0;counter-reset:pr;display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(32px,5vw,72px)}
.promise li{position:relative;counter-increment:pr;padding:12px 0 12px 52px;
font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg)}
.promise li::before{
content:counter(pr);position:absolute;left:0;top:10px;font-family:var(--font-display);
font-size:1.8rem;line-height:1;color:var(--accent);font-variant-numeric:lining-nums;
}
.promise strong{display:block;margin-bottom:4px;font-size:1rem}
@media (max-width:48em){.promise{grid-template-columns:1fr}}
.latest{--stroke:var(--accent-mark);--ground:var(--surface-raised);--st:3.5rem;
display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
.lt{position:relative;display:flex;flex-direction:column;min-width:0;
padding:clamp(20px,2.2vw,28px) clamp(20px,2.2vw,28px) calc(clamp(20px,2.2vw,28px) - 10px);
background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius);
transition:border-color var(--dur-3) var(--ease),box-shadow var(--dur-6) var(--ease),translate var(--dur-6) var(--ease-settle)}
.lt .go::after{content:"";position:absolute;inset:0;border-radius:inherit}
.lt .go{scroll-margin-top:clamp(240px,28vw,340px)}
.lt:has(.go:hover){border-color:var(--accent-mark)}
.lt:has(.go:hover) h3{color:var(--accent-ink)}
@media (hover:hover) and (pointer:fine){:is(.doors.doors-pair a:hover,.lt:has(.go:hover)){box-shadow:var(--shadow-raise)}}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
:is(.doors.doors-pair a:hover,.lt:has(.go:hover)){translate:0 -2px}}
:is(.doors.doors-pair a:active,.lt:has(.go:active)){translate:none;box-shadow:var(--shadow-set);transition-duration:var(--dur-1)}
@supports selector(:has(*)){
.lt:has(.go:focus-visible){outline:2px solid var(--focus-ring);outline-offset:4px;box-shadow:0 0 0 6px var(--focus-halo)}
.lt .go:focus-visible{outline:none;box-shadow:none}
}
.lt-top{display:flex;flex-direction:column;align-items:stretch;gap:16px}
.lt-top>.d-ring{align-self:flex-start}
.lt .d-ring{flex:0 0 auto}
.lt .d-glyph{width:1.6rem;height:1.6rem}
.lt-when{display:flex;flex-direction:column;gap:3px;min-width:0}
.lt-kind{color:var(--accent-ink)}
.lt-date{font-size:var(--t-body);font-weight:600;line-height:1.3;color:var(--fg);font-variant-numeric:lining-nums}
html[lang^="ko"] .lt-date{font-family:var(--font-kr);font-weight:700;font-size:1rem}
.lt h3{margin-top:20px;font-size:clamp(1.3rem,1.9vw,1.6rem)}
html[lang^="ko"] .lt h3{font-size:1.22rem}
.lt p{margin-top:10px;font-size:var(--t-small);line-height:var(--lh-small)}
.lt-go{margin-top:auto;padding-top:18px}
@media (min-width:55.0625em){
.latest{row-gap:0}
.lt{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0}
.lt-go{margin-top:0;align-self:end}
}
@media (max-width:55em){.latest{grid-template-columns:minmax(0,1fr)}}
.timeline{position:relative;list-style:none;margin:0;padding:0 0 0 40px;view-timeline:--tl block;view-timeline-inset:48% 50%}
.timeline::before,.timeline::after{content:"";position:absolute;inset-inline-start:6px;top:10px;bottom:10px;width:1px}
.timeline::before{background:var(--line-strong)}
.timeline::after{background:var(--accent);transform-origin:50% 0;scale:1 1}
.tl-item{position:relative;display:grid;grid-template-columns:12em minmax(0,1fr);gap:4px 32px;padding-bottom:40px}
.tl-item:last-child{padding-bottom:0}
.timeline{--tl-ground:var(--surface)}
.band-sunken .timeline{--tl-ground:var(--surface-sunken)}
.band-white .timeline{--tl-ground:var(--surface-raised)}
.tl-item::before{
content:"";position:absolute;inset-inline-start:-34px;top:.72em;width:16px;height:1px;
background:var(--accent-mark);
}
.tl-date{font-family:var(--font-body);font-size:var(--t-body);font-weight:600;line-height:1.35;color:var(--fg);
padding-top:2px;font-variant-numeric:lining-nums}
html[lang^="ko"] .tl-date{font-family:var(--font-kr);font-weight:700}
.tl-item h3{font-size:clamp(1.2rem,1.6vw,1.4rem)}
.tl-item p{margin-top:8px;font-size:var(--t-body);line-height:var(--lh-text);color:var(--fg);max-width:var(--measure)}
@media (max-width:48em){.tl-item{grid-template-columns:minmax(0,1fr)}}
.timeline-years{--yw:6rem;padding:0}
.timeline-years::before,.timeline-years::after{inset-inline-start:calc(var(--yw) + 6px)}
.tl-year{display:grid;grid-template-columns:var(--yw) minmax(0,1fr);column-gap:40px;align-items:baseline}
.tl-year+.tl-year{margin-top:48px}
.tl-y{grid-column:1;padding-inline-end:24px;text-align:end;font-family:var(--font-display);
font-size:clamp(1.6rem,2.2vw,2.1rem);font-weight:500;line-height:0;color:var(--accent-ink);font-variant-numeric:lining-nums;
white-space:nowrap}
.timeline-years .tl-item{align-items:baseline}
.timeline-years .tl-date{padding-top:0}
html[lang^="ko"] .timeline-years{margin-top:-2px}
html[lang^="ko"] .timeline-years .tl-item::before{top:.86em}
:is(.timeline>.tl-item:last-child,.timeline-years>.tl-year:last-child .tl-item:last-child)::after{
content:"";position:absolute;z-index:1;inset-inline-start:-36px;top:calc(.72em + 1px);bottom:-12px;width:5px;background:var(--tl-ground)}
.tl-items{grid-column:2;list-style:none;margin:0;padding:0}
.timeline-years .tl-item{grid-template-columns:9em minmax(0,1fr)}
html[lang^="ko"] .timeline-years .tl-item{grid-template-columns:6.5em minmax(0,1fr)}
@media (max-width:48em){
.timeline-years{--yw:0px}
.tl-year{grid-template-columns:minmax(0,1fr);column-gap:0}
.tl-y{line-height:1.1;text-align:start;padding:0 0 10px 40px;font-size:1.35rem}
.tl-items{grid-column:1;padding-inline-start:40px}
:is(html,html[lang^="ko"]) .timeline-years .tl-item{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()){
.timeline::after{scale:1 0;animation:draw-y linear both;animation-timeline:--tl;animation-range:cover 0% cover 100%}
}
}
.record-years{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(44px,4.6vw,64px);margin:0}
.ry{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.ry-y{display:flex;flex-direction:column;gap:8px;margin:0;font-size:clamp(2rem,3vw,2.6rem);line-height:1;
font-variant-numeric:lining-nums}
html[lang^="ko"] .ry-y{font-family:var(--font-display);font-size:clamp(2rem,3vw,2.6rem);font-weight:500;
line-height:1;letter-spacing:-.01em}
.ry-y{color:var(--accent-ink)}
.ry-n{color:var(--accent-ink)}
.ry-months{list-style:none;margin:0;padding:0;columns:2;column-gap:var(--col-gap)}
.ry-mo{display:grid;grid-template-columns:3.4em minmax(0,1fr);column-gap:12px;align-items:baseline;
break-inside:avoid;padding-bottom:20px}
.ry-m{color:var(--accent-ink)}
.ry-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.ry-list li{position:relative;padding-inline-start:1.3em}
.ry-list li::before{content:"";position:absolute;inset-inline-start:0;top:.5em;width:.5em;height:.5em;border-radius:50%;
background:var(--accent-mark)}
.ry-list li.ry-p::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--accent-mark)}
.ry-k{display:inline-flex;align-items:center;gap:.5em;white-space:nowrap}
@media (max-width:23.75em){.ry-k{white-space:normal}}
.ry-k+.ry-k,.ry-k+.sr-only+.ry-k{margin-inline-start:1.1em}
.ry-what{min-width:0}
.ry-what b{display:block;font-family:var(--font-display);font-size:1.125rem;font-weight:600;line-height:1.3;color:var(--fg)}
html[lang^="ko"] .ry-what b{font-family:var(--font-kr);font-weight:700;font-size:1.2rem;line-height:1.45}
.ry-what>span{display:block;margin-top:2px;font-size:var(--t-small);line-height:1.45;color:var(--fg)}
@media (max-width:40em){.ry-months{columns:1}.ry-mo{grid-template-columns:minmax(0,1fr);row-gap:8px}}
@media (min-width:75em){
.ry{grid-template-columns:calc(var(--col4) - var(--gap)) minmax(0,1fr);column-gap:var(--gap);align-items:baseline}
.ry-y{align-self:baseline;position:sticky;top:120px}
}
.ry-fold{margin:0}
@supports selector(::details-content){
@media (min-width:40.0625em){
.ry-fold>summary{display:none}
.ry-fold::details-content{content-visibility:visible;display:block;block-size:auto;transition:none}
}
}
@media (max-width:40em){.ry-fold[open]>summary{margin-bottom:12px}}
.gal-fold{margin:0}
@supports selector(::details-content){
@media (min-width:40.0625em){
.gal-fold>summary{display:none}
.gal-fold::details-content{content-visibility:visible;display:block;block-size:auto;transition:none}
}
}
.gal-fold>.gallery{margin-top:clamp(24px,2.6vw,36px)}
@media (max-width:40em){.gal-fold{margin-top:28px}.gal-fold[open]>summary{margin-bottom:4px}}
.mini-figs dt .dot{margin-inline-end:8px;vertical-align:.1em}
.mini-figs dt:has(.dot){padding-inline-start:16px;text-indent:-16px}
.gallery{--g:clamp(14px,1.6vw,24px);display:flex;flex-wrap:wrap;gap:clamp(24px,2.6vw,36px) var(--g);
list-style:none;margin:0;padding:0}
.gallery>li{flex:1 1 calc((100% - (var(--n2) - 1) * var(--g)) * var(--w2) - .5px);min-width:0;margin:0}
@media (min-width:75em){.gallery>li{flex-basis:calc((100% - (var(--n) - 1) * var(--g)) * var(--w) - .5px)}}
.gallery .photo{aspect-ratio:var(--ar)}
.gallery .photo img{width:100%;height:100%;object-fit:cover}
@media (max-width:40em){.gallery>li{flex-basis:100%}}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;margin:0 0 clamp(20px,3vw,36px);padding:0;
list-style:none;font-size:.9375rem;color:var(--fg-muted)}
.crumbs li{display:inline-flex;align-items:center}
.crumbs li+li::before{content:"/";content:"/" / "";margin-inline-end:10px;color:var(--line-strong)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--fg-muted);text-decoration:underline;
text-decoration-color:var(--accent-mark);text-decoration-thickness:1px;text-underline-offset:.24em;
transition:color var(--dur-3) var(--ease)}
.crumbs a:hover{color:var(--accent-ink);text-decoration-color:var(--accent-ink)}
.crumbs [aria-current]{color:var(--fg)}
.pp-head{position:relative;isolation:isolate;overflow-x:clip;padding-block:clamp(28px,4vw,64px) clamp(40px,5vw,72px)}
.pp-top{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,6vw,104px);align-items:end}
.pp-intro .eyebrow{gap:12px}
.pp-intro .eyebrow .dot{align-self:center}
.pp-title{font-size:clamp(2.5rem,5.2vw,4.75rem);line-height:1.02;letter-spacing:-.018em;max-width:11.5em}
html[lang^="ko"] .pp-title{font-size:clamp(2.05rem,4.2vw,3.7rem);line-height:1.22}
.pp-intro .lead{margin-top:max(36px,calc(clamp(2.5rem,5.2vw,4.75rem) * .5));max-width:30em}
html[lang^="ko"] .pp-intro .lead{margin-top:34px}
.pp-cover{justify-self:end;width:100%;max-width:360px}
.pp-glance{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px var(--col-gap);margin:clamp(40px,5vw,72px) 0 0}
@media (min-width:55.0625em){.pp-glance{grid-template-columns:calc(var(--col4) - var(--col-gap)) repeat(3,minmax(0,1fr))}}
.pp-glance dt{color:var(--accent-ink)}
.pp-glance dd{margin:10px 0 0;font-family:var(--font-display);font-size:clamp(1.12rem,1.5vw,1.32rem);line-height:1.3;color:var(--fg)}
html[lang^="ko"] .pp-glance dd{font-family:var(--font-kr);font-weight:400;font-size:1.0625rem;line-height:1.6;letter-spacing:-.01em}
.pp-glance .is-when dd{font-weight:600}
html[lang^="ko"] .pp-glance .is-when dd{font-weight:700}
@media (max-width:55em){
.pp-top{grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:start;gap:28px}
.pp-glance{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:40em){
.pp-top{grid-template-columns:1fr}
.pp-cover{justify-self:start;max-width:min(220px,60vw)}
.pp-head>.wrap{display:flex;flex-direction:column}
.pp-head .pp-top{display:contents}
.pp-head .pp-glance{order:1}
.pp-head .pp-cover{display:none}
.pp-head .pp-top{display:grid;grid-template-columns:4.2rem minmax(0,1fr);gap:0 16px;align-items:center}
.pp-head .pp-title{margin-top:22px}
.pp-head .pp-intro>.lead{margin-bottom:0}
.pp-head .pp-intro{display:contents}
.pp-head .pp-intro>*{grid-column:1 / -1}
.pp-head .pp-intro>.eyebrow{grid-column:2;grid-row:1;margin:0}
@media (max-width:12em){.pp-head .pp-intro>.eyebrow{grid-column:1 / -1;grid-row:2;margin-top:12px}}
.pp-head .pp-cover{display:block;grid-column:1;grid-row:1;width:4.2rem;max-width:none;justify-self:start}
.pp-head .pp-cover .cover{--cv-pad:8px;--cv-no:1.05rem;padding:8px 9px;grid-template-rows:auto 1fr}
.pp-head .pp-cover .cover-no{font-size:var(--cv-no)}
.pp-head .pp-cover .cover-mark{width:46%;inset-block-end:var(--cv-pad)}
.pp-head .pp-cover .cover-line{display:none}
}
@media (max-width:30em){.pp-glance{grid-template-columns:minmax(0,1fr);row-gap:20px}}
.pp-now{margin-top:clamp(24px,3vw,36px);padding-top:4px;max-width:34em}
.pp-now>p:not(.mail-alt){display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;margin:0;color:var(--fg)}
.pp-now>p:not(.mail-alt)>span:not(.tag){flex-basis:100%;color:var(--fg);text-wrap:balance}
.pp-now.is-live>p:not(.mail-alt)>span:not(.tag){font-family:var(--font-display);font-size:var(--t-h3);
line-height:1.3;color:var(--fg)}
.pp-where{display:block}
html[lang^="ko"] .pp-now.is-live>p:not(.mail-alt)>span:not(.tag){font-family:var(--font-kr);
font-size:clamp(1.125rem,1rem + .35vw,1.3125rem);line-height:1.55;
letter-spacing:-.01em}
.pp-now strong{font-weight:600;color:var(--fg)}
html[lang^="ko"] .pp-now strong{font-weight:700}
.pp-now .btn-row{margin-top:22px}
@media (max-width:30em){:is(.pp-now .btn-row,.btn-row:has(>.btn + .go)){flex-direction:column;align-items:flex-start}}
.mail-alt{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin:14px 0 0;font-size:var(--t-small);line-height:1.6;color:var(--fg-muted)}
.mail-alt a{color:var(--fg);font-weight:500;text-decoration:underline;text-decoration-color:var(--accent-mark);
text-decoration-thickness:1px;text-underline-offset:.24em}
.mail-alt a:hover{color:var(--accent-ink);text-decoration-color:var(--accent-ink)}
.steps{--step-gap:clamp(20px,3vw,48px);list-style:none;margin:0;padding:0;display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,12.5rem),1fr));gap:36px var(--step-gap)}
.steps li{position:relative;padding-top:66px}
.steps li::before{content:"";position:absolute;top:22px;left:52px;right:calc(-1 * var(--step-gap) + 8px);height:1px;
background:var(--stroke,var(--accent-mark));transform-origin:0 50%}
.steps li:last-child::before{display:none}
.steps{--stroke:var(--accent-mark);--ground:var(--surface)}
.band-white .steps{--ground:var(--surface-raised)}
.step-n{position:absolute;top:0;left:0;display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;
border:1px solid var(--stroke);background:var(--ground);color:var(--accent-ink);
font-family:var(--font-display);font-size:1.25rem;line-height:1;font-variant-numeric:lining-nums}
html[lang^="ko"] .step-n{font-family:var(--font-kr);font-size:1.125rem}
.steps h3{font-size:var(--t-h3)}
.steps p{margin-top:10px;font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);max-width:22em}
@media (max-width:75em){
.steps{grid-template-columns:minmax(0,1fr);gap:0}
.steps p{font-size:var(--t-body);line-height:var(--lh-text);max-width:var(--measure)}
.steps li{padding:2px 0 30px 68px}
.steps li:last-child{padding-bottom:0}
.steps li::before{display:block;top:52px;bottom:6px;left:22px;right:auto;width:1px;height:auto}
.steps li:last-child::before{display:none}
}
.qa{margin:0}
.qa>div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:baseline}
.qa>div+div{margin-top:clamp(24px,3vw,36px)}
.qa dt{font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;line-height:1.25;color:var(--fg)}
html[lang^="ko"] .qa dt{font-family:var(--font-kr);font-weight:700;font-size:1.35rem;line-height:1.45;letter-spacing:-.015em}
.qa dd{margin:0;font-size:var(--t-body);line-height:var(--lh-text);color:var(--fg);max-width:var(--measure)}
@media (max-width:55em){.qa>div{grid-template-columns:minmax(0,1fr);row-gap:8px}}
.rec{list-style:none;margin:0;padding:0;columns:2 30rem;column-gap:clamp(40px,6vw,88px)}
.rec li{display:grid;grid-template-columns:8.6em minmax(0,1fr);gap:2px 18px;align-items:baseline;padding:9px 0;
break-inside:avoid}
.rec-when{font-size:var(--t-caption);font-weight:600;color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums;line-height:1.5}
.rec-what b{display:block;font-family:var(--font-display);font-size:1.12rem;font-weight:600;line-height:1.3;color:var(--fg)}
html[lang^="ko"] .rec-what b{font-family:var(--font-kr);font-weight:700;font-size:1.2rem;letter-spacing:-.01em;line-height:1.5}
.rec-what>span{display:block;margin-top:2px;font-size:var(--t-small);line-height:1.5;color:var(--fg-body)}
.rec-what small{display:block;margin-top:3px;font-size:var(--t-caption);line-height:1.5;color:var(--fg-muted)}
html[lang^="ko"] .rec li{grid-template-columns:10.5em minmax(0,1fr)}
@media (max-width:30em){:is(html,html[lang^="ko"]) .rec li{grid-template-columns:minmax(0,1fr)}.rec-when{grid-column:1/-1}}
:target{animation:none !important}
.room{display:flex;justify-content:flex-end}
@media (min-width:55.0625em){#how .steps,#expect .qa,.rec-short{margin-inline-start:var(--col4)}}
.room .plate{width:min(100%,var(--col4-w))}
.room .room-portrait{width:min(100%,460px);margin-inline-end:auto;margin-inline-start:var(--col4)}
.room .video{width:min(100%,var(--col4-w))}
@media (max-width:55em){.room .plate,.room .video{width:100%}.room .room-portrait{margin-inline-start:0}}
.strip{margin:0 0 clamp(36px,4vw,56px)}
.strip-svg{width:100%;height:auto;overflow:visible}
.strip .s-axis{stroke:var(--line-strong);stroke-width:1}
.strip .s-year-tick{stroke:var(--line-strong);stroke-width:1}
.strip .s-year{fill:var(--fg);font-family:var(--font-display);font-size:15px}
.strip .s-on{fill:var(--accent-mark)}
.strip .s-open{fill:var(--surface);stroke:var(--accent-mark);stroke-width:1.6}
.band-white .strip .s-open{fill:var(--surface-raised)}
.strip .s-span.s-on{fill:var(--accent-mark)}
.strip .s-ev:hover :is(circle,rect){stroke:var(--fg);stroke-width:2}
@media (max-width:40em){
.strip .s-year{font-size:26px}
.strip circle{r:5.3px}
.strip .s-open{stroke-width:2}
}
.strip-key{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:14px;font-size:var(--t-caption);color:var(--fg-muted)}
.strip-key span{display:inline-flex;align-items:center;gap:8px}
.strip-key i{width:10px;height:10px;border-radius:50%;background:var(--accent-mark)}
.strip-key i.o{background:transparent;box-shadow:inset 0 0 0 1.6px var(--accent-mark)}
.band-ink .strip .s-axis,.band-ink .strip .s-year-tick{stroke:var(--line-inverse)}
.band-ink .strip .s-year{fill:var(--fg-inverse)}
.band-ink .strip :is(.s-on,.s-span.s-on){fill:var(--accent-inverse)}
.band-ink .strip .s-open{fill:var(--surface-inverse);stroke:var(--accent-inverse)}
.band-ink .strip .s-ev:hover :is(circle,rect){stroke:var(--fg-inverse)}
.band-ink .strip-key{color:var(--fg-inverse-muted)}
.band-ink .strip-key i{background:var(--accent-inverse)}
.band-ink .strip-key i.o{background:transparent;box-shadow:inset 0 0 0 1.6px var(--accent-inverse)}
.band-ink .rec-when{color:var(--accent-inverse)}
.band-ink .rec-what b{color:var(--fg-inverse)}
.band-ink .rec-what>span{color:var(--fg-inverse-body)}
.band-ink .rec-what small{color:var(--fg-inverse-body)}
.band-ink .att-head{color:var(--fg-inverse-body)}
.band-ink .att-head b{color:var(--fg-inverse)}
.band-ink .att .c-grid{stroke:var(--line-inverse)}
.band-ink .att .c-sep{stroke:var(--line-inverse)}
.band-ink .att :is(.c-tick){fill:var(--fg-inverse-muted)}
.band-ink .att :is(.c-year,.c-val){fill:var(--fg-inverse)}
.band-ink .att .c-bar{fill:var(--accent-inverse)}
.band-ink .att .c-col:hover .c-bar{fill:var(--fg-inverse)}
.rec-short{columns:1;max-width:46rem}
.att{margin:0 0 clamp(44px,5vw,72px)}
.att-head{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:0 0 20px;font-size:var(--t-small);color:var(--fg-muted)}
.att-head b{font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;color:var(--fg)}
html[lang^="ko"] .att-head b{font-family:var(--font-kr);font-weight:700;font-size:1.1rem}
.att-plot{max-width:600px}
.att-svg{width:100%;height:auto;overflow:visible}
.att .c-grid{stroke:var(--line);stroke-width:1}
.att .c-sep{stroke:var(--line-strong);stroke-width:1}
.att .c-tick,.att .c-year{fill:var(--fg-muted);font-family:var(--font-body);font-size:11px;font-variant-numeric:lining-nums tabular-nums}
.att .c-year{font-size:12px;fill:var(--fg)}
.att .c-val{fill:var(--fg);font-family:var(--font-body);font-size:12px;font-weight:700;font-variant-numeric:lining-nums}
.att .c-bar{fill:var(--accent-mark);transition:fill var(--dur-3) var(--ease)}
.att .c-hit{fill:transparent}
.att .c-col:hover .c-bar{fill:var(--accent-ink)}
html[lang^="ko"] .att :is(.c-tick,.c-year,.c-val){font-family:var(--font-kr)}
.meet-glyph{width:1.25rem;height:1.25rem}
:is(.doors.doors-pair,.lt) .d-glyph{width:1.75rem !important;height:1.75rem !important}
:is(.meet-glyph,.route-glyph,.wa-glyph,.d-glyph) :is(path,rect,circle,line,polyline){vector-effect:non-scaling-stroke;stroke-width:1.5px}
@media (min-width:55.0625em){.att{margin-inline-start:var(--col4)}}
@media (max-width:40em){
.att :is(.c-tick,.c-year,.c-val){font-size:20px}
}
.join-body{max-width:var(--measure)}
@media (min-width:55.0625em){.join-body{margin-inline-start:var(--col4)}}
.join-hint{margin:0;font-weight:600;color:var(--fg)}
.join-fields{list-style:none;margin:14px 0 0;padding:0;counter-reset:jf}
.join-fields li{display:grid;grid-template-columns:2.2em minmax(0,1fr);column-gap:.5em;align-items:baseline;
padding:6px 0;counter-increment:jf;font-size:var(--t-body);line-height:var(--lh-small);color:var(--fg)}
.join-fields li::before{content:counter(jf,decimal-leading-zero);content:counter(jf,decimal-leading-zero) / "";
color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums}
.join-body .btn-row{margin-top:28px}
.others{list-style:none;margin:0;padding:0}
.others a{display:grid;grid-template-columns:auto minmax(0,max-content) 1fr;gap:2px 18px;align-items:baseline;padding:12px 0;
min-height:56px;color:var(--fg)}
.others .arrow{justify-self:start}
@media (min-width:55.0625em){
#more>.wrap{display:grid;grid-template-columns:3fr 9fr;column-gap:var(--gap);align-items:baseline}
#more h2.eyebrow{grid-column:1;margin:0}
#more :is(.others,.btn-row){grid-column:2}
}
.toc-n{color:var(--accent-ink)}
.others .toc-n{grid-row:1/4;font-family:var(--font-display);font-size:clamp(1.25rem,1.8vw,1.5rem);font-weight:600;
line-height:1.2;color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums}
html[lang^="ko"] .others .toc-n{font-family:var(--font-kr);font-weight:700;font-size:1.12rem;letter-spacing:-.01em}
.others .tag{grid-column:2;justify-self:start;margin-top:10px}
#more h2.eyebrow{margin:0 0 18px}
.others b{font-family:var(--font-display);font-size:clamp(1.25rem,1.8vw,1.5rem);font-weight:600;line-height:1.2;
transition:color var(--dur-3) var(--ease)}
html[lang^="ko"] .others b{font-family:var(--font-kr);font-weight:700;font-size:1.12rem;letter-spacing:-.01em}
.others-line{grid-column:2;font-size:var(--t-small);color:var(--fg-muted)}
.others .arrow{grid-row:1;grid-column:3;align-self:center;color:var(--accent-ink)}
.others a:hover b{color:var(--accent-ink)}
.video :is(iframe,video){display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius-xs);background:var(--surface-inverse)}
.video iframe:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;box-shadow:0 0 0 3px var(--focus-halo)}
section.ct-write{padding-top:0}
.ct-form{display:grid;gap:clamp(32px,3.6vw,44px);max-width:40rem}
@media (min-width:55.0625em){.ct-form{margin-inline-start:var(--col4)}}
.ct-topics{border:0;margin:0;padding:0;min-width:0}
.ct-topics legend,.ct-label{display:block;padding:0;margin:0 0 10px;font-family:var(--font-display);
font-size:var(--t-h3);font-weight:600;line-height:1.25;color:var(--fg)}
html[lang^="ko"] :is(.ct-topics legend,.ct-label){font-family:var(--font-kr);font-size:1.25rem;font-weight:700;
letter-spacing:-.01em}
.ct-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;
grid-template-rows:repeat(var(--rows,3),auto);gap:4px var(--col-gap)}
@media (max-width:40em){.ct-options{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-template-rows:none}}
.ct-option{display:flex;align-items:center;gap:14px;min-height:48px;cursor:pointer;color:var(--fg);
font-size:var(--t-body);line-height:1.35}
.ct-option input{appearance:none;-webkit-appearance:none;flex:0 0 auto;display:grid;place-items:center;
width:24px;height:24px;margin:0;border:1.5px solid var(--line-interactive);border-radius:50%;
background:var(--surface-raised);cursor:pointer;transition:border-color var(--dur-3) var(--ease)}
.ct-option input::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent-ink);
scale:0;transition:scale var(--dur-5) var(--ease-spring)}
.ct-option input:checked{border-color:var(--accent-ink)}
.ct-option input:checked::before{scale:1}
.ct-option:hover input{border-color:var(--accent-ink)}
.ct-option>span{text-wrap:balance}
html[lang^="ko"] .ct-option>span{text-wrap:pretty}
.ct-option>span{background-image:linear-gradient(transparent 50%,var(--highlight) 50%,var(--highlight) 94%,transparent 94%);
background-repeat:no-repeat;background-size:0% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone;
padding-inline:.1em;margin-inline:-.1em}
.ct-option input:checked+span{background-size:100% 100%}
@media (prefers-reduced-motion:no-preference){
.ct-option>span{transition:background-size var(--dur-5) var(--ease-settle)}
.ct-hint{transition:opacity var(--dur-5) var(--ease-enter)}
@starting-style{.ct-form:has(.ct-options input:checked) .ct-hint{opacity:0}}
}
.ct-option input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;box-shadow:0 0 0 3px var(--focus-halo)}
.ct-hints{margin:0 0 12px;max-width:var(--measure);color:var(--fg)}
.ct-hint{display:none;margin:0}
.ct-hint.is-general{display:block;font-size:var(--t-small);line-height:var(--lh-small)}
.ct-hint>p{margin:0;font-weight:600}
html[lang^="ko"] .ct-hint>p{font-weight:400}
.ct-fields{list-style:none;margin:6px 0 0;padding:0;counter-reset:cf}
.ct-fields li{display:grid;grid-template-columns:2.2em minmax(0,1fr);column-gap:.5em;align-items:baseline;
padding:4px 0;counter-increment:cf;font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg)}
.ct-fields li::before{content:counter(cf,decimal-leading-zero);content:counter(cf,decimal-leading-zero) / "";
color:var(--accent-ink);font-variant-numeric:lining-nums tabular-nums}
@supports selector(:has(*)){
.ct-form:has(.ct-options input:checked) .ct-hint.is-general{display:none}
.ct-form:has(input.t-part:checked) .ct-hint.t-part,
.ct-form:has(input.t-venue:checked) .ct-hint.t-venue,
.ct-form:has(input.t-artist:checked) .ct-hint.t-artist,
.ct-form:has(input.t-board:checked) .ct-hint.t-board,
.ct-form:has(input.t-data:checked) .ct-hint.t-data{display:block}
}
.ct-field textarea{display:block;width:100%;min-height:11rem;padding:14px 16px;border:1px solid var(--line-interactive);
border-radius:var(--radius-sm);background:var(--surface-raised);color:var(--fg);font:inherit;font-size:var(--t-body);
line-height:var(--lh-text);resize:vertical;transition:border-color var(--dur-3) var(--ease)}
.ct-field textarea:hover{border-color:var(--fg)}
@supports (field-sizing:content){.ct-field textarea{field-sizing:content;max-height:24lh;overflow-y:auto}}
.ct-field textarea:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;box-shadow:0 0 0 5px var(--focus-halo)}
.ct-act{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.ct-how{flex:1 1 18rem;margin:0;font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);max-width:var(--measure)}
html:not([lang^="ko"]) :is(.ct-how,.ct-hint){text-wrap:balance}
html:not([lang^="ko"]) .why-reasons li{text-wrap:balance}
html[lang^="ko"] .ct-hint .sl-n{display:block}
.ct-write .direct{margin-top:clamp(40px,4.4vw,56px)}
.direct{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px;margin:28px 0 0}
@media (max-width:55em){.direct{flex-direction:column;align-items:flex-start}}
.direct .kicker{flex-basis:auto}
.direct a{font-family:var(--font-display);font-size:var(--t-h3);color:var(--fg);text-decoration:underline;
text-decoration-color:var(--accent-mark);text-decoration-thickness:1px;text-underline-offset:.24em;overflow-wrap:anywhere;
transition:color var(--dur-3) var(--ease)}
.direct a:hover{color:var(--accent-ink)}
.direct-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px}
@media (min-width:55.0625em){
.direct{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:var(--gap)}
}
.wa{container:wa / inline-size;--wa-gap:var(--col-gap);--lab-half:.528rem}
html[lang^="ko"] .wa{--lab-half:.546rem}
:where(.wa) :where(dl,dd){margin:0}
.wa-top{--wa-m:min(calc((100cqw - 2 * var(--wa-gap)) / 3),300px);
display:grid;grid-template-columns:var(--wa-m) minmax(0,1fr);column-gap:var(--wa-gap);align-items:start}
.wa-map{margin:0;width:var(--wa-m)}
.wa-svg{display:block;width:100%;height:auto;overflow:visible}
.wa-svg .m-land{fill:var(--surface-sunken);stroke:var(--line-strong);stroke-width:.9;stroke-linejoin:round}
.wa-svg .m-dot{fill:var(--accent-mark)}
.wa-svg .m-halo{fill:none;stroke:var(--accent-mark);stroke-width:1;vector-effect:non-scaling-stroke}
.wa-where{display:grid;gap:16px;margin-top:calc(var(--wa-m) * var(--dub-y) - var(--lab-half))}
.wa-based dt{position:relative}
.wa-based dt::before{content:"";position:absolute;top:var(--lab-half);right:calc(100% + 10px);
width:calc(var(--wa-m) * var(--dub-r) + var(--wa-gap) - 10px);border-top:1px solid var(--stroke)}
.wa-where dd{margin-top:6px;font-family:var(--font-display);font-size:var(--t-h3);font-weight:500;line-height:1.25;
color:var(--fg);text-wrap:balance}
.wa-travel dd{font-size:calc(var(--t-h3) * 1.2);font-style:normal;line-height:1.2}
html[lang^="ko"] .wa-where dd{font-family:var(--font-kr);font-size:1.125rem;font-weight:400;line-height:1.6;
letter-spacing:-.01em;text-wrap:pretty}
html[lang^="ko"] .wa-travel dd{font-size:calc(1.125rem * 1.2);font-weight:700;font-style:normal;line-height:1.45}
.wa-who{display:grid;grid-template-columns:minmax(0,1fr);row-gap:16px;margin-top:clamp(32px,3.4vw,48px)}
.wa-st{position:relative;min-width:0;min-height:var(--st);padding-inline-start:calc(var(--st) + 16px)}
.wa-st .wa-ring{position:absolute;top:0;left:0}
.wa-st dt{padding-top:calc((var(--st) - 1.3em) / 2)}
.wa-st dd{margin-top:6px;max-width:var(--measure);font-size:var(--t-small);line-height:var(--lh-small);color:var(--fg);
text-wrap:balance}
html[lang^="ko"] .wa-st dd{text-wrap:pretty}
@container wa (min-width:52rem){
.wa-who{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--wa-gap)}
.wa-st{padding:calc(var(--st) + 16px) 0 0}
.wa-st dt{padding-top:0}
.wa-st dd{max-width:17em}
}
@container wa (max-width:40rem){
.wa-top{--wa-m:min(calc((100cqw - var(--wa-gap)) * .4),300px)}
}
@container wa (max-width:21rem){
.wa-top{--wa-m:min(60cqw,12rem);grid-template-columns:minmax(0,1fr);row-gap:20px}
.wa-where{margin-top:0}
.wa-based dt::before{content:none}
}
@media (max-width:35em){.details{grid-template-columns:1fr}.details dd+dt+dd{border-top:0}.details dt{padding-bottom:0}.details dd{padding-top:6px}}
.notice-text{font-size:var(--t-body);line-height:var(--lh-text);color:var(--fg);max-width:var(--measure)}
.notice-text h3{font-family:var(--font-body);font-size:1.125rem;font-weight:700;margin:0;letter-spacing:0}
html[lang^="ko"] .notice-text h3{font-family:var(--font-kr)}
.notice-text p{margin-top:8px}
.none-glance{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,max-content);gap:16px 32px;margin:24px 0 8px}
.none-glance dt{color:var(--accent-ink)}
.none-glance dd{margin:4px 0 0;font-family:var(--font-display);font-size:1.15rem;color:var(--fg);text-wrap:balance}
html[lang^="ko"] .none-glance dd{font-family:var(--font-kr);font-weight:700;font-size:1rem}
@media (max-width:40em){.none-glance{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:22em){.none-glance{grid-template-columns:minmax(0,1fr)}}
.notice-list{list-style:none;margin:28px 0 0;padding:0;counter-reset:nl}
.notice-list>li{position:relative;counter-increment:nl;padding:0 0 0 44px}
.notice-list>li+li{margin-top:clamp(24px,2.8vw,32px)}
.notice-list>li>h3::before{content:counter(nl);content:counter(nl) / "";position:absolute;left:0;color:var(--accent-ink);
font-variant-numeric:lining-nums tabular-nums}
.site-footer{background:var(--surface-inverse);color:var(--fg-inverse-muted);padding-block:clamp(72px,8vw,128px) 36px;font-size:var(--t-small)}
.footer-line{
font-family:var(--font-display);font-weight:500;font-size:clamp(2.2rem,5.6vw,5rem);line-height:1.02;
letter-spacing:-.02em;color:var(--fg-inverse);margin:0;max-width:13em;text-wrap:balance;
}
.footer-line em{font-style:normal;color:var(--accent-inverse)}
html[lang^="ko"] .footer-line{font-family:var(--font-display);font-weight:500;font-size:clamp(2.2rem,5.6vw,5rem);
line-height:1.02;letter-spacing:-.02em;word-break:normal}
.footer-grid{
display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;
margin-top:clamp(56px,6vw,96px);padding-top:40px;border-top:1px solid var(--line-inverse);
}
.site-footer{--logo-h:88px}
.footer-grid img{width:calc(var(--logo-h) * 2.603);max-width:100%;height:auto;margin:0 0 0 calc(var(--logo-h) * -.15)}
@media (max-width:64em){.site-footer{--logo-h:80px}}
@media (max-width:35em){.site-footer{--logo-h:64px}}
.footer-grid .logo-print{display:none}
.footer-about{max-width:26em;font-size:var(--t-small);line-height:1.6;color:var(--fg-inverse-body)}
.site-footer h2{color:var(--accent-inverse);margin:6px 0 14px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li a{display:inline-flex;align-items:center;min-height:36px;color:var(--fg-inverse-body);
transition:color var(--dur-3) var(--ease)}
.site-footer li a:hover{color:var(--accent-inverse)}
.footer-bottom{
margin-top:clamp(48px,5vw,72px);padding-top:22px;border-top:1px solid var(--line-inverse);
display:grid;grid-template-columns:1fr 1fr;gap:8px 28px;font-size:var(--t-caption);line-height:1.6;color:var(--fg-inverse-body);
}
.footer-bottom>span:nth-child(2){grid-row:1 / span 2;grid-column:2;text-align:end}
.footer-bottom>span:nth-child(3){align-self:end}
.footer-status{font-size:var(--t-caption);line-height:1.6}
@media (max-width:48em){.footer-bottom{grid-template-columns:1fr}.footer-bottom>span:nth-child(2){grid-row:auto;grid-column:auto;text-align:start}}
.footer-bottom a{color:var(--fg-inverse-body);text-decoration:underline;text-decoration-color:var(--fg-inverse-muted);text-underline-offset:3px}
.footer-bottom a:hover{color:var(--accent-inverse)}
@media (max-width:64em){.footer-grid{grid-template-columns:1fr 1fr}}
@media (min-width:35.0625em) and (max-width:64em){
.footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.footer-grid>:first-child{grid-column:1/-1}
}
@media (max-width:35em){.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
.footer-grid>:first-child,.footer-grid>:last-child{grid-column:1/-1}}
@media (max-width:22.5em){.footer-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:40em){
:is(figcaption,.footer-bottom) .cp{display:block}
:is(figcaption,.footer-bottom) .cs{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
.site-footer li a{min-inline-size:24px}
:is(.footer-bottom,.mail-alt) a{display:inline-flex;align-items:center;min-height:24px}
@media (any-pointer:coarse){
.site-footer li a{min-height:44px;min-inline-size:44px}
.footer-bottom a{display:inline-flex;align-items:center;min-height:44px}
:is(.mail-alt,.direct) a{display:inline-flex;align-items:center;min-height:44px}
.nav-link{min-inline-size:44px;justify-content:center}
}
@media (max-width:62.5em){
html:has(.nav[data-open="true"]){overflow:hidden;scrollbar-gutter:stable}
html:has(.nav[data-open="true"]) :is(main,.site-footer){visibility:hidden}
.menu-toggle{display:block}
.header-inner{min-height:68px}
.brand{--brand-h:42px}
.nav{
position:absolute;top:100%;left:0;right:0;z-index:190;height:calc(100dvh - 68px);
display:none;flex-direction:column;align-items:stretch;gap:0;
padding:16px var(--gutter) calc(32px + env(safe-area-inset-bottom,0px));
background:var(--surface);overflow-y:auto;overscroll-behavior:contain;
border-top:1px solid var(--line);
}
.nav[data-open="true"]{display:flex}
.nav-list{flex-direction:column;align-items:stretch;gap:0;counter-reset:nv}
.nav-list>li{border-bottom:1px solid var(--line)}
.nav-sub{margin:-8px 0 14px;padding-inline-start:calc(clamp(1.7rem,7vw,2.3rem) * 1.6 + 18px)}
html[lang^="ko"] .nav-sub{padding-inline-start:calc(clamp(1.35rem,5.6vw,1.8rem) * 1.6 + 18px)}
.nav-sub a{display:flex;align-items:baseline;min-height:44px;padding:6px 0;font-family:var(--font-display);
font-size:1.25rem;font-weight:500;line-height:1.3;color:var(--fg);text-wrap:balance}
html[lang^="ko"] .nav-sub a{font-family:var(--font-kr);font-size:1.0625rem;font-weight:500}
.nav-sub a[aria-current="page"]{color:var(--accent-ink)}
.ns-n{display:none}
.nav-link{
min-height:64px;padding:0;gap:18px;width:100%;justify-content:flex-start;align-items:baseline;
font-family:var(--font-display);font-size:clamp(1.7rem,7vw,2.3rem);font-weight:500;letter-spacing:-.012em;
}
html[lang^="ko"] .nav-link{font-family:var(--font-kr);font-weight:700;font-size:clamp(1.35rem,5.6vw,1.8rem);letter-spacing:-.03em}
.nav-link::after,.nav-mark{display:none}
.nav-link[aria-current="page"]{color:var(--accent-ink)}
.nav-n{display:inline;font:inherit;letter-spacing:inherit;color:var(--accent-ink);min-width:1.6em;
font-variant-numeric:lining-nums tabular-nums}
.nav .btn-nav{--btn-bg:var(--fg);--btn-fg:var(--fg-inverse);--btn-border:transparent;margin:28px 0 0;min-height:54px}
.nav .btn-nav[aria-current="page"]{--btn-bg:var(--soft-navy);--btn-fg:var(--fg-inverse);--btn-border:transparent}
.lang-wide{display:none}
.lang-bar{display:inline-flex;margin:0}
.header-inner{column-gap:8px}
html:has(.nav[data-open="true"]) .skip{display:none}
@media (prefers-reduced-motion:no-preference){
.nav[data-open="true"]{transition:translate var(--dur-4) var(--ease-settle)}
@starting-style{.nav[data-open="true"]{translate:0 -8px}}
.nav[data-open="true"] .nav-list>li{animation:rise-sm var(--dur-6) var(--ease-settle) backwards}
.nav[data-open="true"] .nav-list>li:nth-child(2){animation-delay:30ms}
.nav[data-open="true"] .nav-list>li:nth-child(3){animation-delay:60ms}
.nav[data-open="true"] .nav-list>li:nth-child(4){animation-delay:90ms}
.nav[data-open="true"] .nav-list>li:nth-child(5){animation-delay:120ms}
.nav[data-open="true"] .btn-nav{animation:fade var(--dur-4) var(--ease) 150ms backwards}
}
}
@media (max-width:62.5em) and (max-height:46em){.nav-link{min-height:52px}.nav .btn-nav{margin-top:18px}}
@media (max-width:23.75em){
:is(h1,h2,h3,.hero-title,.footer-line,.others b,.others-line,.rec-what,.rec-what>*,.d-title,.pp-glance dd,.pl-name){overflow-wrap:anywhere}
:is(h1,h2,h3) .nowrap{white-space:normal}
.pc{grid-template-columns:minmax(0,1fr)}
.pc .cover{max-width:160px}
.pc-body{padding-top:14px}
.btn{width:100%}
.tag{white-space:normal}
}
a[href^="mailto:"]{overflow-wrap:anywhere}
.nf-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px var(--col-gap)}
.nf-list a{display:flex;flex-direction:column;gap:6px;min-height:100%;padding:16px 0;color:var(--fg)}
.nf-list b{font-family:var(--font-display);font-size:1.5rem;font-weight:600}
.nf-list [lang="ko"] b{font-family:var(--font-kr);font-weight:700;font-size:1.2rem}
.nf-list span{font-size:var(--t-small);color:var(--fg-muted)}
.nf-list a:hover b{color:var(--accent-ink)}
@media (max-width:48em){.nf-list{grid-template-columns:minmax(0,1fr)}}
.moved{min-height:70vh;display:grid;place-items:center;text-align:center}
.moved p{font-size:var(--t-lead);color:var(--fg)}
@media (prefers-contrast:more){
:root{--fg-muted:var(--ink-70);--accent:var(--accent-mark);
--line:color-mix(in srgb,var(--ink-navy) 22%,var(--warm-cream));
--line-strong:color-mix(in srgb,var(--ink-navy) 45%,var(--warm-cream))}
}
@media (forced-colors:active){
.menu-toggle i{background:CanvasText}
:is(.dot,.nav-mark,.forty-row span,.strip-key i,.ns-live){forced-color-adjust:none}
.ry-list li::before{forced-color-adjust:none;background:CanvasText}
.ry-list li.ry-p::before{background:Canvas;box-shadow:inset 0 0 0 1.5px CanvasText}
.tl-item::before{forced-color-adjust:none;animation:none;background:CanvasText;box-shadow:none}
.dot,.ns-live{background:CanvasText}
:is(.dot-open,.forty-row .f-open,.strip-key i.o){background:Canvas;box-shadow:inset 0 0 0 1.5px CanvasText}
:is(.forty-row span,.strip-key i):not(.f-open,.o){background:CanvasText}
.cover{border:1px solid CanvasText}
.cover-mark{stroke:CanvasText}
:is(.strip,.att,.map-svg,.wa-svg) :is(circle,rect,path){forced-color-adjust:none}
:is(.strip,.att,.map-svg,.wa-svg) :is(text,line){forced-color-adjust:none}
:is(.strip,.att,.map-svg) text{fill:CanvasText !important}
.strip :is(.s-axis,.s-year-tick),.att :is(.c-grid,.c-sep){stroke:GrayText !important}
.strip :is(.s-on,.s-span.s-on),.att .c-bar,:is(.map-svg,.wa-svg) .m-dot{fill:CanvasText !important}
.strip .s-open{fill:Canvas !important;stroke:CanvasText !important}
:is(.map-svg,.wa-svg) .m-land{fill:Canvas !important;stroke:CanvasText !important}
:is(.map-svg,.wa-svg) :is(.m-halo,.m-lead){stroke:CanvasText !important}
.strip-key i.o{background:Canvas;box-shadow:inset 0 0 0 1.5px CanvasText}
}
@media print{
*,*::before,*::after{animation:none !important;transition:none !important}
.ink{color:inherit !important;background:none !important}
body{-webkit-print-color-adjust:exact;print-color-adjust:exact;background:#fff;font-size:11pt}
.site-header,.progress,.menu-toggle,.btn-row,.rings,.no-print,.video :is(iframe,video){display:none !important}
section{padding-block:18pt}
.hero-figure,.ph-figure,.plate,.cover,.places-map,.strip,.att,.forty{break-inside:avoid}
.band-ink,.site-footer{background:#fff;color:#222}
.site-footer .logo-screen{display:none !important}
.site-footer .logo-print{display:block !important}
.band-ink,.band-ink *,.site-footer,.site-footer *{color:#222 !important;border-color:#bbb !important}
.cover{background:none !important;border:1px solid #999;color:#222;translate:none !important;box-shadow:none !important}
.cover-mark{scale:none !important}
.cover-mark{stroke:#333 !important}
.cover-no,.cover-line{color:#222 !important}
.forty-row span{background:#333 !important}
.forty-row .f-open{background:none !important;box-shadow:inset 0 0 0 1.5px #333 !important}
:is(.strip,.att) :is(.s-on,.c-bar){fill:#333 !important}
:is(.strip) .s-open{fill:#fff !important;stroke:#333 !important}
:is(.map-svg,.wa-svg) .m-land{fill:#f2f2f2 !important;stroke:#999 !important}
.count::before{content:none !important}
.count>span{position:static !important;width:auto !important;height:auto !important;
overflow:visible !important;clip-path:none !important;white-space:normal !important}
details::details-content{content-visibility:visible !important;display:block !important;block-size:auto !important}
.fold>summary::before{display:none}
}