:root{--bg:#e2e1dc;--panel:#ecebe6;--paper:#f4f3ef;--ink:#161616;--muted:#5f5f5a;--text:#3d3d3a;--accent:#ff5a1f;--accent-ink:#a8380c;--soft:#ffe2d6;--line:2px solid var(--ink);--mono:"IBM Plex Mono", Menlo, monospace;--sans:"IBM Plex Sans KR", -apple-system, "Apple SD Gothic Neo", sans-serif;--head:70px}html:lang(ja){--sans:"IBM Plex Sans JP", -apple-system, "Hiragino Sans", sans-serif}*{box-sizing:border-box}html{scroll-padding-top:var(--head)}html,body{margin:0}body{background-color:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;background-image:linear-gradient(#0000000f 1px,#0000 1px),linear-gradient(90deg,#0000000f 1px,#0000 1px);background-size:40px 40px}a{color:inherit}button{font:inherit;color:inherit;cursor:pointer}img{display:block}.col{flex-direction:column;gap:18px;display:flex}.wrap{max-width:1360px;margin:0 auto}.kicker{font-family:var(--mono);color:var(--accent);font-size:13px}h1{letter-spacing:-.035em;margin:0;font-size:68px;font-weight:700;line-height:1.02}h2{letter-spacing:-.03em;margin:0;font-size:46px;line-height:1.08}h2.huge{letter-spacing:-.04em;font-size:76px;line-height:.98}p{color:var(--text);margin:0;font-size:17px;line-height:1.75}p.light{color:#c9c8c2}html,body{overflow-x:clip}.gl{pointer-events:none;z-index:1;position:fixed!important}:root{--gl-h:100vh}@supports (height:100lvh){:root{--gl-h:100lvh}}#s04 .wrap{position:relative}.press-gl{z-index:1;pointer-events:none;position:absolute;inset:0}.top{z-index:10;border-bottom:var(--line);background:var(--panel);grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:14px 32px;display:grid;position:sticky;top:0}.brand{align-items:center;gap:12px;text-decoration:none;display:flex}.brand img{border-radius:8px;width:34px;height:34px}.brand b{font-family:var(--mono);letter-spacing:.12em;white-space:nowrap;font-size:15px}.top nav{border:var(--line);font-family:var(--mono);font-size:12px;display:flex}.top nav a{white-space:nowrap;padding:7px 10px;text-decoration:none;transition:background .25s,color .25s}.top nav a+a{border-left:var(--line)}.top nav a.on{background:var(--ink);color:var(--panel)}.actions{justify-self:end;gap:8px;display:flex}.sound,.auto{border:var(--line);background:var(--paper);min-height:40px;font-family:var(--mono);white-space:nowrap;align-items:center;gap:8px;padding:0 14px;font-size:13px;display:flex}.sound[aria-pressed=true]{background:var(--accent)}.auto i{border-left:9px solid var(--ink);border-top:6px solid #0000;border-bottom:6px solid #0000;width:0;height:0}.auto[aria-pressed=true]{background:var(--ink);color:var(--paper)}.auto[aria-pressed=true] i{border:0;border-left:3px solid var(--accent);border-right:3px solid var(--accent);width:9px;height:10px}.go{border:var(--line);background:var(--ink);min-height:40px;color:var(--panel);font-family:var(--mono);white-space:nowrap;align-items:center;padding:0 16px;font-size:13px;text-decoration:none;display:flex}.progress{background:var(--accent);width:0;height:4px;position:absolute;bottom:-2px;left:0}@media (width<=1560px){.go{display:none}}@media (width<=1320px){.brand b{display:none}.top{grid-template-columns:auto 1fr auto}.top nav{justify-self:center}}.story{grid-template-columns:minmax(380px,470px) 1fr;grid-template-areas:"panels stage";gap:32px;padding:0 32px;display:grid;position:relative}.panels{flex-direction:column;grid-area:panels;display:flex}.stage-wrap{grid-area:stage}.stage{top:calc(var(--head) + 18px);height:calc(100vh - var(--head) - 36px);border:var(--line);background:var(--paper);position:sticky}.fig-head{z-index:2;border-bottom:var(--line);background:var(--panel);font-family:var(--mono);justify-content:space-between;padding:9px 14px;font-size:12px;display:flex;position:absolute;top:0;left:0;right:0}.frame-label{transition:color .3s}.stage .view{position:absolute;inset:38px 0 6px}.fig-bar{border-top:var(--line);background:var(--paper);z-index:2;height:6px;position:absolute;bottom:0;left:0;right:0}.stage-bar{background:var(--accent);width:0;height:100%}.panel{flex-direction:column;justify-content:center;gap:20px;min-height:115vh;padding:64px 0;display:flex}.panel.hero{min-height:calc(100vh - var(--head));justify-content:center;padding-top:40px}.panel.tall{justify-content:flex-start;min-height:300vh}.pin{top:calc(var(--head) + 60px);flex-direction:column;gap:20px;display:flex;position:sticky}.ph-pin{display:contents}.ph-pin>*,.panel>*{max-width:470px}.tail{min-height:45vh}.tail.end{min-height:30vh}.hero p{font-size:18px}.stats{border:var(--line);background:var(--panel);font-family:var(--mono);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.stats>span{flex-direction:column;padding:12px 14px;display:flex}.stats>span+span{border-left:var(--line)}.stats small{color:var(--muted);font-size:11px}.stats b{white-space:nowrap;font-size:28px}.panel.hero{position:relative}.scroll-cue{align-items:center;gap:14px;transition:opacity .4s;display:flex;position:absolute;bottom:34px;left:0}.scroll-cue.gone{opacity:0}.cue-key{border:var(--line);background:var(--paper);width:42px;height:42px;box-shadow:0 5px 0 var(--ink);border-radius:7px;place-items:center;animation:1.8s cubic-bezier(.5,0,.3,1) infinite cue-press;display:grid}.cue-key b{color:var(--accent);font-size:18px;line-height:1}.cue-text{color:var(--text);flex-direction:column;gap:2px;font-size:13px;display:flex}.cue-text small{font-family:var(--mono);letter-spacing:.18em;color:var(--ink);font-size:11px}.cue-track{background:#00000026;width:2px;height:42px;margin-left:4px;position:relative;overflow:hidden}.cue-track i{background:var(--accent);border-radius:3px;width:6px;height:10px;animation:1.8s cubic-bezier(.5,0,.3,1) infinite cue-flow;position:absolute;top:-10px;left:-2px}@keyframes cue-press{0%,18%,to{box-shadow:0 5px 0 var(--ink);transform:none}30%,42%{box-shadow:0 0 0 var(--ink);transform:translateY(5px)}}@keyframes cue-flow{0%,25%{top:-10px}85%,to{top:46px}}.solo-tap{z-index:3;border:var(--line);background:var(--accent);text-align:left;box-shadow:4px 4px 0 var(--ink);opacity:0;pointer-events:none;touch-action:none;align-items:center;gap:12px;padding:10px 16px 10px 12px;transition:opacity .3s,transform .3s,box-shadow .12s;display:flex;position:fixed;transform:translateY(10px)}.solo-tap.show{opacity:1;pointer-events:auto;transform:none}.solo-tap.show:active{box-shadow:1px 1px 0 var(--ink);transform:translate(3px,3px)}.solo-tap i{border:var(--line);background:var(--paper);width:26px;height:26px;box-shadow:0 3px 0 var(--ink);border-radius:5px;animation:1.6s cubic-bezier(.5,0,.3,1) infinite cue-press}.solo-tap span{flex-direction:column;display:flex}.solo-tap b{font-size:15px}.solo-tap small{font-family:var(--mono);font-size:11px}.layers,.steps{border:var(--line);background:var(--panel);margin:0;padding:0;font-size:15px;list-style:none}.layers li,.steps li{grid-template-columns:52px 1fr;align-items:stretch;display:grid}.layers li+li,.steps li+li{border-top:var(--line)}.layers li>b,.steps li>b{border-right:var(--line);font-family:var(--mono);justify-content:center;align-items:center;transition:background .3s,color .3s;display:flex}.layers li>span{padding:10px 14px}.layers li.lit>b,.steps li.on>b{background:var(--accent)}.layers li.lit{background:var(--soft)}.steps li{grid-template-columns:52px 1fr;padding:0;font-size:15px}.steps li>b+*{padding:10px 14px}.steps li{transition:background .3s}.steps li.on{background:var(--soft)}.steps li.done>b{background:var(--ink);color:var(--paper)}.parts{border:var(--line);background:var(--panel);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.parts span{color:var(--text);flex-direction:column;gap:4px;padding:12px 14px;font-size:13px;display:flex}.parts span+span{border-left:var(--line)}.parts b{color:var(--ink);font-size:18px}.typed{border:var(--line);background:var(--paper);align-items:center;gap:12px;min-height:56px;padding:12px 16px;font-size:22px;font-weight:500;display:flex}.typed small{font-family:var(--mono);color:var(--muted);white-space:nowrap;font-size:11px}.typed i{background:var(--accent);width:3px;height:26px;margin-left:-10px;animation:.9s step-end infinite blink}@keyframes blink{50%{opacity:0}}.modes{border:var(--line);background:var(--panel);grid-template-columns:1fr 1fr;display:grid}.modes span{flex-direction:column;gap:2px;padding:12px 16px;font-size:13px;transition:background .3s,color .3s;display:flex}.modes span+span{border-left:var(--line)}.modes b{font-size:18px}.modes span.on{background:var(--ink);color:var(--paper)}.theme-list{border:var(--line);background:var(--panel);font-family:var(--mono);margin:0;padding:0;font-size:13px;list-style:none}.theme-list li{align-items:center;gap:12px;padding:9px 14px;transition:background .2s,padding .2s;display:flex}.theme-list li+li{border-top:var(--line)}.theme-list i{border:1.5px solid var(--ink);background:linear-gradient(90deg, var(--c) 60%, var(--d) 60%);width:26px;height:16px}.theme-list li.on{background:var(--accent);padding-left:22px;font-weight:600}.dark-panel{justify-content:center}.dark-panel>*{max-width:none}.dark-panel{background:var(--ink);min-height:0;color:var(--panel);box-shadow:14px 14px 0 var(--accent);margin:30vh 0 0;padding:56px 44px}.dark-panel small{font-family:var(--mono);color:#9a9993;font-size:13px}.cta{border:2px solid var(--panel);background:var(--accent);min-height:70px;color:var(--ink);align-self:flex-start;align-items:center;gap:14px;padding:0 30px;font-size:21px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-flex}.cta:hover{box-shadow:6px 6px 0 var(--panel);transform:translate(-3px,-3px)}.callouts{z-index:2;pointer-events:none;width:0;height:0;position:fixed;top:0;left:0;overflow:hidden}.co{opacity:0;width:100%;transition:opacity .35s;position:absolute;top:0;left:0}.co.show{opacity:1}.co-tag{border:var(--line);background:var(--panel);font-family:var(--mono);white-space:nowrap;padding:5px 10px;font-size:12px;transition:background .3s,transform .35s;position:absolute;left:14px;transform:translateY(-50%)}.co:not(.show) .co-tag{transform:translate(-14px,-50%)}.co.hot .co-tag{background:var(--accent);font-weight:600}.co-line{transform-origin:0;background:var(--ink);height:2px;transition:transform .45s .1s;position:absolute;left:14px}.co:not(.show) .co-line{transform:scaleX(0)}.co-line{transform-box:border-box}.co-dot{background:var(--accent);width:12px;height:12px;box-shadow:0 0 0 3px var(--ink);border-radius:50%;margin:-6px 0 0 -6px;transition:transform .35s cubic-bezier(.3,1.6,.5,1) .2s;position:absolute}.co:not(.show) .co-dot{transform:scale(0)}.co.hot .co-dot{animation:1.4s ease-out infinite pulse}@keyframes pulse{0%{box-shadow:0 0 0 3px var(--ink), 0 0 0 3px #ff5a1fb3}to{box-shadow:0 0 0 3px var(--ink), 0 0 0 20px #ff5a1f00}}.sec{border-top:var(--line);border-bottom:var(--line);background:var(--bg);padding:110px 32px;position:relative}.dark{background:var(--ink);color:var(--panel)}.two{align-items:center;gap:40px;display:grid}.head-row{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.head-row p{font-size:16px}.press{border:var(--line);background:var(--panel);grid-template-columns:1.25fr 1fr;display:grid}.press-fig{border-right:var(--line);background:var(--paper);height:380px;position:relative}.press-fig .view{cursor:pointer;touch-action:none;position:absolute;inset:0}.tap{z-index:2;border:var(--line);background:var(--paper);font-family:var(--mono);pointer-events:none;align-items:center;gap:10px;padding:8px 12px 8px 10px;font-size:12px;transition:opacity .4s;display:flex;position:absolute;bottom:16px;right:18px}.tap i{background:var(--accent);border-radius:50%;width:14px;height:14px;position:relative}.tap i:after{content:"";border:2px solid var(--accent);border-radius:50%;animation:1.6s ease-out infinite ring;position:absolute;inset:-2px}.tap.gone{opacity:0}@keyframes ring{to{opacity:0;transform:scale(2.6)}}.press-info{flex-direction:column;display:flex}.pi-head{border-bottom:var(--line);font-family:var(--mono);justify-content:space-between;padding:9px 14px;font-size:12px;display:flex}.pi-body{flex-direction:column;gap:10px;padding:20px 20px 18px;display:flex}.pi-name{letter-spacing:-.02em;font-size:40px;line-height:1}.pi-word{color:var(--text);min-height:52px;font-size:16px;line-height:1.6}.pi-body .meters{max-width:300px}.depth{border-top:var(--line);background:var(--paper);margin-top:auto;padding:16px 20px 18px}.depth-top{font-family:var(--mono);justify-content:space-between;align-items:baseline;display:flex}.depth-top small{color:var(--muted);font-size:12px}.depth-top b{font-size:22px}.depth-bar{border:var(--line);background:var(--panel);height:16px;margin:10px 0 8px;position:relative}.depth-fill{background:var(--ink);width:0;position:absolute;top:0;bottom:0;left:0}.depth-act{background:var(--accent);width:3px;margin-left:-1px;position:absolute;top:-6px;bottom:-6px;left:50%}.depth-note{font-family:var(--mono);color:var(--muted);font-size:11px}.meters{font-family:var(--mono);grid-template-columns:34px 1fr;align-items:center;gap:6px;font-size:11px;display:grid}html:lang(en) .meters{grid-template-columns:50px 1fr}.cards{border:var(--line);background:var(--panel);grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.card{text-align:left;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border:0;flex-direction:column;padding:0;transition:background .2s,box-shadow .2s;display:flex;position:relative}.card+.card{border-left:var(--line)}.card.on{background:var(--soft)}.card:hover{box-shadow:inset 0 -5px 0 var(--accent);background:#f7efe9}.card.on:hover{background:var(--soft)}.card-head{border-bottom:var(--line);font-family:var(--mono);justify-content:space-between;padding:8px 12px;font-size:11px;display:flex}.card-img{border-bottom:var(--line);background:var(--paper);height:210px;position:relative}.card-img .view{position:absolute;inset:0}.card-tap{z-index:2;border:1.5px solid var(--ink);background:var(--paper);font-family:var(--mono);opacity:0;padding:3px 8px;font-size:10px;transition:opacity .25s,transform .25s;position:absolute;bottom:10px;right:10px;transform:translateY(4px)}.card:hover .card-tap,.card.demo .card-tap{opacity:1;transform:none}.card.demo .card-tap{background:var(--accent)}.card-body{flex-direction:column;gap:6px;padding:14px;display:flex}.card-body b{font-size:22px}.card-body>span:not(.seg){color:var(--text);font-size:13px}.card-body small{font-family:var(--mono);color:var(--muted);font-size:10px}.seg{gap:3px;margin-top:4px;display:flex}.seg i{height:10px;transition:background .25s;transition-delay:calc(var(--j,0) * 50ms);background:#d2d1cb;flex:1}.seg i.on{background:var(--ink)}.seg.sm{gap:2px;margin:0}.seg.sm i{height:9px}.know{border:2px solid var(--panel);margin:0;padding:0;list-style:none}.know li{grid-template-columns:150px 1fr;display:grid}.know li+li{border-top:2px solid var(--panel)}.know b{border-right:2px solid var(--panel);color:var(--accent);padding:12px 14px;font-size:15px}.know span{color:#d9d8d2;padding:12px 14px;font-size:14px;line-height:1.6}.learn-fig{height:560px;position:relative}.info-card{border:2px solid var(--panel);background:var(--panel);width:420px;color:var(--ink);box-shadow:14px 14px 0 var(--accent);position:absolute;top:20px;left:0}.ic-head{border-bottom:var(--line);font-family:var(--mono);justify-content:space-between;padding:8px 12px;font-size:11px;display:flex}.accent{color:var(--accent-ink)}.ic-body{grid-template-columns:150px 1fr;display:grid}.ic-img{background:var(--paper);border-right:var(--line);justify-content:center;align-items:center;display:flex}.ic-img img{width:auto;height:120px}.chips{border-top:var(--line);gap:6px;padding:10px 12px;font-size:12px;display:flex}.chips span{border:1.5px solid var(--ink);padding:2px 8px}.chips span.ink{background:var(--ink);color:var(--panel);border:0;padding:3px 8px}.price-card{border:2px solid var(--panel);background:var(--paper);width:340px;color:var(--ink);position:absolute;top:230px;right:0}.pc-head{border-bottom:var(--line);font-family:var(--mono);background:var(--accent);padding:8px 12px;font-size:11px}.pc-big{align-items:baseline;gap:8px;padding:12px 14px;display:flex}.pc-big b{font-size:32px}.pc-big span{font-size:13px}.pc-rows{font-family:var(--mono);font-size:12px}.pc-rows>span{border-top:1px solid var(--ink);justify-content:space-between;padding:8px 14px;display:flex}.pc-rows>span.best{background:var(--soft)}.yt{border:2px solid var(--panel);background:var(--ink);color:var(--panel);align-items:center;gap:8px;padding:12px 18px;font-size:15px;font-weight:600;text-decoration:none;display:flex;position:absolute;bottom:10px;left:40px}html.anim .reveal{opacity:0;transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transform:translateY(26px)}html.anim .reveal.in{opacity:1;transform:none}html.anim .stagger>*{opacity:0;transition:opacity .55s,transform .55s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 90ms);transform:translateY(16px)}html.anim .stagger.in>*,html.anim .cards.stagger.reveal{opacity:1;transform:none}html.anim .panel>*,html.anim .ph-pin>*{opacity:0;transition:opacity .6s,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 80ms);transform:translateY(22px)}html.anim .panel.in>*,html.anim .panel.in .ph-pin>*{opacity:1;transform:none}html.anim .panel.in>.scroll-cue.gone,.scroll-cue.gone{opacity:0}html.anim .learn-fig .info-card{opacity:0;transition:opacity .7s,translate .8s cubic-bezier(.2,.7,.2,1),rotate .8s;translate:-60px;rotate:-2deg}html.anim .learn-fig .price-card{opacity:0;transition:opacity .7s .2s,translate .8s cubic-bezier(.2,.7,.2,1) .2s,rotate .8s .2s;translate:60px 20px;rotate:2deg}html.anim .learn-fig .yt{opacity:0;transition:opacity .6s .45s,translate .6s .45s;translate:0 24px}html.anim .learn-fig.in .info-card,html.anim .learn-fig.in .price-card,html.anim .learn-fig.in .yt{opacity:1;translate:0;rotate:0deg}html.anim .learn-fig.reveal{opacity:1;transform:none}html.anim .seg i.on{background:#d2d1cb}html.anim .in .seg i.on,html.anim .press-info .seg i.on{background:var(--ink)}.know li{transition:background .3s}.know li:hover{background:#222}@media (width<=900px){:root{--head:58px;--stage-h:40vh}.top{grid-template-columns:1fr auto;padding:10px 14px}.top nav,.go{display:none}.brand b{font-size:12px;display:inline}.brand img{width:30px;height:30px}.sound,.auto{min-height:36px;padding:0 10px;font-size:12px}.auto span{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.auto:after{content:"자동";content:"자동" / ""}html:lang(en) .auto:after{content:"Auto";content:"Auto" / ""}html:lang(ja) .auto:after{content:"自動";content:"自動" / ""}.scroll-cue{z-index:4;border:var(--line);background:var(--panel);box-shadow:4px 4px 0 var(--ink);padding:10px 12px;position:fixed;bottom:14px;left:14px;right:14px}.scroll-cue.gone{pointer-events:none;transform:translateY(20px)}.solo-tap{gap:9px;padding:7px 12px 7px 9px}.solo-tap i{width:20px;height:20px}.solo-tap b{font-size:13px}h1{font-size:40px}h2{font-size:30px}h2.huge{font-size:46px}p{font-size:15px}.story{grid-template-columns:1fr;grid-template-areas:"stage""panels";gap:0;padding:0 14px;display:grid}.stage-wrap{top:calc(var(--head) + 8px);height:var(--stage-h);position:sticky}.stage-wrap:before{content:"";background:var(--paper);position:absolute;inset:-8px -14px 0}.stage-wrap:after{content:"";background:linear-gradient(var(--paper), transparent);pointer-events:none;height:18px;position:absolute;top:100%;left:-14px;right:-14px}.stage{height:100%;position:relative;top:0}.panels{padding-top:8px}.panel{justify-content:flex-start;min-height:100vh;padding:28px 0 40px}.panel.hero{justify-content:flex-start;min-height:70vh;padding-bottom:110px}.pin,.ph-pin{top:calc(var(--head) + var(--stage-h) + 22px);position:sticky}.ph-pin{flex-direction:column;gap:20px;display:flex}.panel.tall{min-height:260vh}.panel>*{max-width:none}.tail{min-height:40vh}.stats b{font-size:22px}html:lang(en) .stats b,html:lang(ja) .stats b{font-size:19px}.callouts .co-tag{padding:3px 6px;font-size:10px;left:8px}.co-line{left:8px}.sec{padding:64px 14px}.two,.head-row{flex-direction:column;align-items:stretch;display:flex}.press{grid-template-columns:1fr}.press-fig{border-right:0;border-bottom:var(--line);height:280px}.pi-name{font-size:32px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card{border-top:var(--line)}.card:nth-child(-n+2){border-top:0}.card:nth-child(odd){border-left:0}.card:last-child{grid-column:span 2}.card-img{height:160px}.learn-fig{flex-direction:column;gap:20px;height:auto;display:flex}.info-card,.price-card,.yt{width:auto;position:static}.info-card{margin-right:14px}.know li{grid-template-columns:1fr}.know b{border-right:0;padding-bottom:0}.dark-panel{margin-top:10vh;padding:36px 24px}.panel.dark-panel{min-height:0;margin:0 0 24px}.tail.end{min-height:0}}
