@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;800&family=Space+Mono:wght@400;700&family=DM+Serif+Display:ital@0;1&family=Pacifico&family=Caveat:wght@400;600&family=Gamja+Flower&family=Yomogi&family=Noto+Sans+JP:wght@400&family=Noto+Sans+SC:wght@400&family=Zhi+Mang+Xing&family=Dekko&display=swap";:root{--punch-red: #e63946ff;--honeydew: #f1faeeff;--frosted-blue: #a8dadcff;--cerulean: #457b9dff;--oxford-navy: #1d3557ff;--section-seam-tint: rgba(168, 218, 220, .1);--bg-1: var(--honeydew);--bg-2: var(--honeydew);--surface: rgba(255, 255, 255, .72);--line: rgba(15, 23, 42, .12);--text: var(--oxford-navy);--muted: #5b6474;--accent-1: var(--frosted-blue);--accent-2: var(--cerulean);--visual-margin-y: 1.1rem}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Manrope,sans-serif;color:var(--text);background:var(--honeydew)}#root{min-height:100vh}.app-root{width:100%;height:100vh;min-height:100vh;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scroll-behavior:smooth;animation:fade-in .42s ease-out}.landing-section,.mds-section{height:100vh;min-height:100vh;width:100%;scroll-snap-align:start;scroll-snap-stop:always}.landing-section{position:relative;background:linear-gradient(to bottom,transparent 86%,var(--section-seam-tint) 100%),radial-gradient(circle at 20% 20%,rgba(168,218,220,.28),transparent 40%),radial-gradient(circle at 85% 80%,rgba(168,218,220,.14),transparent 34%),var(--honeydew);display:flex;align-items:stretch;justify-content:center;overflow:hidden}.landing-content{position:relative;width:min(1020px,100%);min-height:100vh;padding:clamp(1.35rem,3.8vw,2.8rem) clamp(.9rem,3vw,2.2rem) 4.6rem;display:grid;grid-template-rows:auto auto 1fr;row-gap:clamp(.15rem,.8vw,.5rem);justify-items:center;align-items:start}.landing-title{margin:6rem 0 0;font-family:Dekko,cursive;font-weight:400;font-style:normal;font-size:clamp(1.8rem,4.1vw,2.85rem);line-height:1.1;letter-spacing:.01em;text-align:center;color:var(--oxford-navy)}.landing-title-highlight{display:inline-flex;align-items:center;justify-content:center;min-width:3.8ch;padding:.2em .24em .14em;border-radius:.2em;background:var(--cerulean);color:var(--honeydew);overflow:hidden;line-height:1}.landing-title-highlight-word{display:inline-block;animation:landing-word-swap .32s ease-out}.landing-instruction{margin:.55rem 0 0;max-width:64ch;text-align:center;font-family:Dekko,cursive;font-weight:400;font-style:normal;font-size:clamp(1.5rem,1.8vw,1.08rem);line-height:1.38;color:#1d3557db}.landing-visual{width:min(900px,100%);display:flex;align-items:center;justify-content:center;align-self:center}.landing-visual-svg{width:min(900px,95vw);height:auto}.landing-connection-line{stroke:var(--cerulean);stroke-width:2}.landing-connection-text{fill:var(--cerulean);font-family:Caveat,Manrope,sans-serif;font-weight:700;font-size:clamp(13px,2vw,18px);letter-spacing:.005em}.landing-node{fill:#8ba1c7;stroke:#fffc;stroke-width:1.6}.landing-flag-node{filter:drop-shadow(0 0 4px rgba(69,123,157,.45))}.landing-interactive-node{cursor:pointer}.landing-interactive-node:focus-visible{outline:none}.landing-interactive-node:focus-visible .landing-flag-node{filter:drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 .5px rgba(255,255,255,.95)) drop-shadow(0 0 .5px rgba(255,255,255,.95)) drop-shadow(0 0 7px rgba(69,123,157,.65))}.landing-node-label{fill:var(--cerulean);font-family:Caveat,cursive;font-size:clamp(12px,4vw,18px);font-weight:400}.landing-callout-line{fill:none;stroke:var(--cerulean);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.landing-callout-text{fill:var(--cerulean);font-family:Caveat,Manrope,sans-serif;font-size:clamp(13px,2vw,18px);font-weight:700;letter-spacing:.01em}.landing-scroll-hint{position:absolute;left:50%;bottom:max(1.5rem,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;gap:.34rem;color:var(--cerulean);text-transform:lowercase;font-family:Space Mono,monospace;font-size:.86rem;letter-spacing:.08em;opacity:.84;z-index:2}.landing-scroll-hint:focus-visible{outline:2px solid rgba(69,123,157,.45);outline-offset:4px}.landing-scroll-arrow{width:16px;height:16px;border-right:2px solid var(--cerulean);border-bottom:2px solid var(--cerulean);transform:rotate(45deg);animation:arrow-bob 1.4s ease-in-out infinite}.mds-section{background:linear-gradient(to bottom,var(--section-seam-tint) 0%,transparent 20%),radial-gradient(circle at 16% 0%,rgba(168,218,220,.22),transparent 38%),radial-gradient(circle at 88% 78%,rgba(168,218,220,.12),transparent 36%),var(--honeydew);height:100vh}.mds-section-content,.mds-section-content .graph-shell{height:100%}.graph-shell{position:relative;width:100%;height:100%;padding:var(--visual-margin-y) 0;display:grid;grid-template-rows:auto 1fr}.graph-header{padding:1.9rem 1.2rem .85rem;z-index:2;pointer-events:auto;display:flex;flex-direction:column;align-items:center;text-align:center}.graph-header h1{margin:0;font-size:clamp(1.45rem,3vw,2.2rem);line-height:1.08;color:var(--oxford-navy)}.graph-title{display:block;max-width:min(920px,96vw);padding:0;font-family:"DM Serif Display",serif;font-size:clamp(1.45rem,3.2vw,2.35rem);line-height:1.12;letter-spacing:.01em;color:var(--oxford-navy)}.graph-subtitle{margin:.45rem 0 0;max-width:min(820px,94vw);font-family:Manrope,sans-serif;font-size:clamp(.9rem,1.6vw,1.02rem);line-height:1.35;color:var(--cerulean)}.graph-compare-row{margin-top:.7rem;display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap;color:var(--oxford-navy);font-family:Dekko,cursive;font-weight:400;font-style:normal;font-size:clamp(1.5rem,1.7vw,1rem);line-height:1.35}.graph-language-select{width:auto;min-width:0;max-width:78vw;border:1px solid rgba(29,53,87,.24);border-radius:999px;background:#ffffffe6;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23457b9d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .95rem center;background-size:12px 8px;color:var(--oxford-navy);font-family:Dekko,cursive;font-size:1.2rem;font-weight:400;font-style:normal;line-height:1.4;padding:.62rem .5rem .42rem 1rem}.graph-language-select::-ms-expand{display:none}.graph-language-select:focus{outline:2px solid rgba(69,123,157,.5);outline-offset:1px}.graph-svg{width:100%;height:100%;display:block;background:transparent}.graph-link{stroke:var(--frosted-blue);stroke-width:1.35;pointer-events:stroke}.graph-node{cursor:pointer;transition:filter .18s ease;outline:none}.graph-node circle{stroke:#ffffff73;stroke-width:1}.graph-node text{fill:var(--oxford-navy);font-family:Caveat,Noto Sans KR,Noto Sans JP,Noto Sans SC,sans-serif;font-size:18px;font-weight:400;letter-spacing:0}.graph-node image{filter:drop-shadow(0 0 4px #457b9d)}.graph-node-flag-container{overflow:hidden;border-radius:50%}.graph-node-flag{width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center}.graph-node:hover{filter:brightness(1.18)}.graph-node.is-selected{filter:drop-shadow(0 0 10px rgba(91,140,255,.52))}.graph-pronunciation-callout{opacity:.95}.graph-pronunciation-callout .main-stroke{fill:none;stroke:var(--cerulean);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.graph-pronunciation-callout .tip-stroke{fill:none;stroke:var(--cerulean);stroke-width:1.4;stroke-linecap:round}.graph-pronunciation-callout text{fill:var(--cerulean);font-family:Comic Neue,Caveat,Manrope,sans-serif;font-size:clamp(13px,1.9vw,16px);font-weight:800;letter-spacing:.01em}.graph-tooltip{position:absolute;width:min(320px,calc(100vw - 24px));background:#0f172af0;border:1px solid rgba(255,255,255,.22);color:#edf2ff;border-radius:12px;padding:.6rem .72rem;pointer-events:none;box-shadow:0 14px 32px #00000057;z-index:3}.graph-tooltip h3{margin:0;font-size:.98rem;color:#f8fbff}.graph-tooltip p{margin:.28rem 0 0;font-size:.82rem;line-height:1.3;color:#d7e1f8}.landing-tooltip{z-index:6}.designed-by{position:fixed;bottom:1.2rem;right:1.2rem;font-family:Dekko,cursive;font-size:1rem;color:#457b9dd9;z-index:4;pointer-events:none}@media(max-width:980px){.app-root{scroll-snap-type:y proximity}.landing-content{padding-top:.7rem;padding-left:clamp(1.1rem,6vw,2rem);padding-right:clamp(1.1rem,6vw,2rem);padding-bottom:4.2rem;grid-template-rows:auto auto 1fr}.landing-title,.landing-instruction{width:100%;max-width:38ch;padding-left:.25rem;padding-right:.25rem}.landing-visual{width:100%;align-self:start;margin-top:-.2rem}.landing-visual-svg{width:100%;max-width:min(760px,calc(100vw - 2.4rem))}.landing-visual-svg{width:min(760px,98vw)}.landing-node-label{font-size:clamp(23px,5.6vw,34px)}.landing-callout-text{font-size:clamp(13px,2vw,18px)}.graph-header{padding:1.25rem .9rem .6rem}.graph-language-select{min-width:0;max-width:88vw}.graph-shell{--visual-margin-y: .8rem}.graph-pronunciation-callout .main-stroke,.graph-pronunciation-callout .tip-stroke{stroke-width:1.2}}@media(max-width:700px){.landing-content{display:block;padding-top:8rem;padding-left:1rem;padding-right:1rem}.landing-title{max-width:20ch;margin-top:.25rem;margin-left:auto;margin-right:auto}.landing-instruction{max-width:30ch;font-size:1.02rem;margin-left:auto;margin-right:auto}.landing-visual{position:static;transform:none;width:100%;margin-top:2rem;margin-left:auto;margin-right:auto}.landing-visual-svg{view-transition-name:none;max-width:min(700px,calc(100vw - 1.6rem))}.landing-connection-text,.landing-callout-text{font-size:1.3rem}}@media(min-width:701px)and (max-width:1024px)and (orientation:portrait){.landing-content{display:block;padding-top:8rem;padding-left:1.4rem;padding-right:1.4rem}.landing-title{max-width:22ch;margin-top:.25rem;margin-left:auto;margin-right:auto}.landing-instruction{max-width:34ch;margin-left:auto;margin-right:auto}.landing-visual{position:static;transform:none;width:100%;margin-top:2rem;margin-left:auto;margin-right:auto}.landing-visual-svg{max-width:min(760px,calc(100vw - 2.8rem))}}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes arrow-bob{0%{transform:translateY(0) rotate(45deg);opacity:.55}50%{transform:translateY(7px) rotate(45deg);opacity:1}to{transform:translateY(0) rotate(45deg);opacity:.55}}@keyframes landing-word-swap{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}