@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap');
:root{--green:#246b50;--ink:#233e32;--muted:#78847c;--line:#e5e8df;--paper:#fafbf7}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans','Noto Sans KR',sans-serif;font-size:14px}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e5a963;outline-offset:3px}.sidebar{position:fixed;inset:0 auto 0 0;width:235px;background:#f2f4ed;border-right:1px solid var(--line);padding:32px 23px;display:flex;flex-direction:column}.brand{font-weight:700;font-size:24px;letter-spacing:-1px}.brandmark{display:inline-block;background:var(--ink);color:#fff;width:29px;height:29px;border-radius:7px;text-align:center;margin-right:5px;font-size:24px;line-height:25px;position:relative}.brandmark span{position:absolute;right:0;top:-4px;font-size:15px}.tiny{display:block;font-size:10px;letter-spacing:1px;color:var(--muted);font-weight:400;margin:12px 0 48px 4px}.navlabel{font-size:9px;letter-spacing:1.5px;color:#8d988f;margin:0 12px 16px}nav{display:grid;gap:7px}nav a{padding:12px 10px;font-size:12px;border-radius:6px;display:flex;align-items:center;gap:10px}nav a span{font-size:17px}nav a b{font-size:10px;margin-left:auto;font-weight:500;background:#d7e4d9;border-radius:4px;padding:3px 5px}nav a:hover,nav a.selected{background:#e3eadf;color:#235e46}.side-note{margin-top:auto;padding:24px 9px 8px;font-size:10px;color:#6f8173}.live-dot,.eyebrow span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#398660;margin-right:5px}.side-note p{font-size:15px;line-height:1.8;letter-spacing:-.5px;color:#536b59}.download{border-top:1px solid #dce2d6;padding:18px 9px;font-size:11px}.sidefooter{font-size:7px;letter-spacing:1px;color:#9aa398;padding-left:9px}main{margin-left:235px;max-width:1800px}.topbar{height:78px;border-bottom:1px solid var(--line);padding:0 48px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#8a938b}.topbar strong{color:#4c5d50;font-weight:500}.slash{padding:0 12px;color:#bdc5ba}.date{display:flex;align-items:center;gap:18px}.avatar{display:inline-grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#e3e9da;color:#5d735a;font-size:11px}.intro{padding:50px 48px 37px;position:relative;overflow:hidden}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:600;color:#6a7d6d}.intro h1{font-size:48px;line-height:1.25;font-weight:600;letter-spacing:-2.7px;margin:21px 0 16px}.intro>p{color:#7b887c;line-height:1.9;font-size:12px}.intro-meta{display:flex;align-items:center;gap:17px;font-size:10px;color:#7a897c;margin-top:27px}.intro-meta b{font-size:15px;color:#3c5943;padding-right:3px}.intro-meta i{width:1px;height:12px;background:#d9dfd3}.hero-art{position:absolute;right:48px;top:51px;width:330px;height:230px}.hero-art svg{position:absolute;inset:10px 0 0;width:100%;height:180px;overflow:visible}.hero-art svg path{fill:none;stroke:#bdcbb9;stroke-width:1.5;stroke-dasharray:4 5}.hero-art svg circle{fill:#75a078}.orb{position:absolute;z-index:1;display:grid;place-items:center;border:1px solid #d6dfce;background:#f0f4e9;border-radius:18px;font-size:24px;color:#658361;box-shadow:0 5px 18px #425e3310;transform:rotate(-8deg)}.orb1{width:70px;height:70px;left:12px;top:61px}.orb2{width:61px;height:61px;right:0;top:17px;transform:rotate(10deg);background:#edf0e1}.orb3{width:59px;height:59px;right:0;top:127px;background:#f5e9da;color:#bc844c;transform:rotate(-6deg)}.artcaption{position:absolute;bottom:0;right:0;font-size:8px;letter-spacing:1.4px;color:#9aa991}.library-section{padding:26px 48px 55px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}h2{font-size:19px;letter-spacing:-.7px;font-weight:600;margin:0}.section-heading h2 span{font-size:10px;vertical-align:middle;display:inline-block;padding:3px 7px;border:1px solid #dce3d6;border-radius:5px;color:#789275;margin-left:7px}.search{display:flex;align-items:center;gap:7px;border:1px solid #e0e5da;border-radius:7px;background:#fff;padding:8px 11px;color:#7c8b7b}.search input{width:175px;border:0;outline:none;background:none;font-size:10px;color:var(--ink)}.search>span{font-size:19px;line-height:13px}.search kbd{font-size:8px;background:#f6f7f2;padding:3px 4px;border:1px solid #e8ebe3;border-radius:3px}.filterbar{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);margin-top:23px;gap:8px}.filters{display:flex;gap:22px;flex-wrap:wrap}.filters button{border:0;border-bottom:2px solid transparent;padding:0 0 13px;background:none;font-size:11px;color:#8c968c}.filters button.active{border-bottom-color:var(--green);color:var(--green);font-weight:600}.savedfilter{border:0;background:none;font-size:10px;color:#7d8d7b;padding:0 0 13px;white-space:nowrap}.savedfilter[aria-pressed=true]{color:var(--green);font-weight:700}.resultinfo{display:flex;justify-content:space-between;font-size:9px;color:#96a08f;padding:17px 0}.resultinfo span:first-child{color:#6d806a}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.card{border:1px solid #e1e6da;background:#fff;border-radius:9px;padding:18px 19px 13px;position:relative;transition:border-color .2s,transform .2s;min-width:0}.card:hover{border-color:#aebfa6;transform:translateY(-2px)}.card.featured{background:#f5f7ee;border-color:#cdd8bf}.cardhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.source-logo{width:32px;height:32px;display:grid;place-items:center;font-weight:700;border-radius:8px;font-size:14px;letter-spacing:-1px;background:var(--logo-bg);color:var(--logo-fg)}.star{border:0;background:none;color:#9da892;font-size:21px;padding:0 1px;line-height:25px}.star[aria-pressed=true]{color:#c19649}.card h3{font-size:13px;font-weight:600;letter-spacing:-.3px;margin:0 0 7px;overflow-wrap:anywhere}.card p{font-size:10px;line-height:1.8;color:#8b9587;margin:0 0 17px;min-height:36px}.cardbottom{border-top:1px solid #eff1eb;padding-top:11px;display:flex;justify-content:space-between;align-items:center}.tag{font-size:8px;padding:4px 6px;border-radius:3px;background:#f0f3eb;color:#7b8e71}.source-link{font-size:9px;color:#6b7c60;padding:3px}.source-link:hover{text-decoration:underline}.motion-section{margin:0 48px 55px;border:1px solid #dce5d8;border-radius:12px;background:#eff3e9;display:grid;grid-template-columns:1fr 1.25fr;gap:22px;padding:31px}.motion-copy{padding:7px 0}.motion-copy .eyebrow{font-size:8px;letter-spacing:1.3px}.motion-copy h2{font-size:23px;line-height:1.6;margin:19px 0 12px;letter-spacing:-1px}.motion-copy em{font-style:normal;color:#728667}.motion-copy p{font-size:10px;color:#7c8974;line-height:1.9}.motion-tags{display:flex;gap:5px;flex-wrap:wrap;margin:19px 0}.motion-tags span{font-size:8px;border:1px solid #d5dfcb;border-radius:4px;padding:5px;color:#77896a}.motion-copy a{font-size:10px;border-bottom:1px solid #a8b59d;padding-bottom:4px}.motion-copy small{display:block;font-size:8px;color:#91a083;margin-top:16px;line-height:1.7}.demo{background:#fff;border:1px solid #d9e2d2;border-radius:9px;padding:17px 18px 0;overflow:hidden;align-self:center}.demo-top{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1px;color:#8b9b80}.demo-top i{display:inline-block;width:5px;height:5px;background:#5a915c;border-radius:50%;margin-right:4px}.demo-top label{font-size:8px;letter-spacing:0;color:#9aa48f}.demo-top select{font-size:9px;background:#f5f7f0;border:1px solid #e0e6d8;border-radius:4px;padding:4px;color:#57704a;margin-left:5px}.diagram{width:100%;margin:9px 0}.paths path{fill:none;stroke:#ccd5c7;stroke-width:1.5;marker-end:url(#arrow);transition:stroke .3s}.paths path.active{stroke:#3a8960;stroke-width:2.5}.node rect{fill:#f8faf5;stroke:#dce3d5;transition:all .25s}.node text{text-anchor:middle;fill:#7c8e70;font-size:16px}.node .nlabel{font-size:10px;fill:#647b58}.node.active rect{fill:#e5f1e7;stroke:#5c9a70;stroke-width:1.7}.node.active text{fill:#256b45}.pathlabel{fill:#9fac93;font-size:8px}.caption{display:flex;gap:10px;padding:8px 2px 15px;min-height:65px}.caption>span{font-size:11px;padding:5px 7px;border-radius:5px;background:#edf3e7;color:#5a7e48;align-self:flex-start}.caption b{font-size:10px;font-weight:500}.caption p{font-size:9px;line-height:1.7;color:#9ba48f;margin:5px 0 0}.demo-controls{display:flex;align-items:center;gap:8px;border-top:1px solid #edf0e7;padding:12px 0}.demo-controls button{border:1px solid #e1e6d9;border-radius:5px;padding:6px 8px;background:#fff;font-size:9px;color:#7b8c6b}.demo-controls .play{background:#305e40;border-color:#305e40;color:#fff;min-width:62px}.demo-controls>span{margin-left:auto;font-size:8px;color:#9ba78f}.progress{height:2px;background:#eef2e9;margin:0 -18px}.progress div{height:100%;background:#63935b;transition:width .3s}.workflow{padding:0 48px 36px}.muted{color:#99a58f;font-size:8px;letter-spacing:1px}.workflow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:29px}.workflow-grid article{border-top:1px solid #dfe5d6;padding-top:16px}.workflow-grid article>span{font-size:8px;color:#93a184;letter-spacing:1px}.workflow h3{font-size:13px;font-weight:500;margin:13px 0 8px}.workflow p{font-size:10px;color:#8c9783;line-height:1.9}.workflow-note{font-size:9px;line-height:1.8;color:#829075;background:#eff3e9;border-radius:5px;padding:12px;margin-top:23px}.workflow-note>span{margin-right:5px}footer{border-top:1px solid var(--line);margin:0 48px;padding:25px 0;display:flex;gap:14px;align-items:center;font-size:9px;color:#99a28e}.footerbrand{font-size:14px;font-weight:600;color:#537048}footer>a:last-child{margin-left:auto}#empty{padding:50px;text-align:center;color:#829075;font-size:13px}@media(min-width:1500px){.intro{padding-top:60px}.intro h1{font-size:58px}.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.hero-art{right:100px;transform:scale(1.2);top:75px}}@media(max-width:1100px){.sidebar{width:195px;padding:28px 16px}.brand{font-size:21px}main{margin-left:195px}.topbar{padding:0 30px}.intro,.library-section{padding-left:30px;padding-right:30px}.hero-art{opacity:.6;right:24px;width:270px;transform:scale(.85);transform-origin:right top}.intro h1{font-size:43px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.motion-section{margin-left:30px;margin-right:30px;padding:24px;grid-template-columns:1fr}.motion-copy p br{display:none}.motion-copy h2 br{display:none}.motion-copy h2{font-size:22px}.motion-tags{margin:13px 0}.workflow{padding:0 30px 30px}.filters{gap:15px}footer{margin:0 30px}.search input{width:140px}.search kbd{display:none}}@media(max-width:700px){.sidebar{position:relative;width:100%;height:auto;display:block;padding:20px}.brand{font-size:22px}.tiny,.navlabel,.side-note,.download,.sidefooter{display:none}nav{display:flex;margin-top:20px;gap:8px}nav a{font-size:10px;padding:9px 8px}nav a span{font-size:13px}nav a b{display:none}main{margin:0}.topbar{height:53px;padding:0 22px;font-size:9px}.date{font-size:8px;gap:8px}.avatar{width:22px;height:22px}.intro{padding:33px 22px 25px}.intro h1{font-size:39px}.intro>p{font-size:11px}.eyebrow{font-size:8px;letter-spacing:1.1px}.hero-art{display:none}.intro-meta{font-size:9px;gap:10px}.intro-meta b{font-size:13px}.library-section{padding:20px 22px 35px}.section-heading{flex-wrap:wrap;gap:15px}h2{font-size:17px}.search{width:100%}.search input{width:100%}.search kbd{display:block;white-space:nowrap}.filterbar{align-items:flex-end;gap:14px}.filters{gap:14px;row-gap:12px}.filters button{font-size:10px;padding-bottom:10px}.savedfilter{font-size:9px;padding-bottom:10px}.resultinfo{font-size:8px}.cards{gap:10px}.card{padding:14px 13px 11px}.cardhead{margin-bottom:13px}.card h3{font-size:12px}.card p{font-size:9px}.source-link{font-size:8px}.tag{font-size:7px}.motion-section{margin:0 22px 35px;padding:20px;gap:15px}.motion-copy h2{font-size:21px}.motion-copy h2 br{display:block}.demo{padding:13px 12px 0}.demo-top select{padding:3px}.caption b{font-size:9px}.caption p{font-size:8px}.demo-controls button{font-size:8px;padding:6px}.workflow{padding:0 22px 25px}.workflow-grid{grid-template-columns:1fr;gap:12px;margin-top:20px}.workflow p br{display:none}.workflow-grid article{padding-top:12px}.workflow h3{margin:9px 0 5px}footer{margin:0 22px;flex-wrap:wrap;gap:8px;font-size:8px}.footerbrand{font-size:12px}.resultinfo span:last-child{max-width:170px;text-align:right}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}.hero-art svg circle{display:none}}