:root{--paper:#fffaf0;--ink:#173e35;--muted:#51645b;--orange:#f8ad3b;--green:#20664d;--line:#d6ded2;--white:#fffdf7;font-family:ui-rounded,"SF Pro Rounded", "Avenir Next",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;font-size:18px;line-height:1.6}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-underline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #bb5700;outline-offset:5px}img{display:block;max-width:100%;height:auto}button:disabled{cursor:default}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.12;letter-spacing:-.045em}h1{font-size:clamp(48px,5.5vw,80px);font-weight:850;max-width:770px}h1 em{font-style:normal;color:#ad571b}h2{font-size:clamp(34px,3.6vw,53px);font-weight:800}h3{font-size:26px}p{overflow-wrap:break-word}.header{max-width:1360px;min-height:110px;padding:25px 42px;margin:auto;display:flex;align-items:center;gap:32px}.brand{flex-shrink:0;display:inline-flex;align-items:center;min-height:44px;text-decoration:none}.brand img{width:145px;max-height:52px;object-fit:contain}.main-nav{display:flex;gap:32px;margin-left:auto}.main-nav a{display:flex;align-items:center;min-height:44px;text-decoration:none;font-size:16px;font-weight:650}.languages{display:flex;align-items:center;gap:5px}.languages a{font-size:15px;padding:8px 9px;min-width:42px;min-height:44px;display:flex;align-items:center;justify-content:center;text-decoration:none;border-radius:10px}.languages [aria-current]{background:#ececde;font-weight:750}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:17px 26px;min-height:56px;border:0;border-radius:17px;font-weight:750;text-decoration:none;background:var(--green);color:white;box-shadow:0 5px 0 #123e2e;transition:transform .15s,box-shadow .15s}.button:hover{background:#174f3b;transform:translateY(-2px);box-shadow:0 7px 0 #123e2e}.button:active{transform:translateY(4px);box-shadow:0 1px 0 #123e2e}.button span{font-size:25px;line-height:1}.nav-cta{padding:10px 20px;font-size:16px;min-height:46px;border-radius:12px;box-shadow:0 3px 0 #123e2e}.hero{max-width:1360px;min-height:650px;margin:auto;padding:45px 42px 30px;display:grid;grid-template-columns:1.07fr 1fr;align-items:center;gap:25px}.hero-copy{position:relative;z-index:2}.eyebrow{font-size:17px;font-weight:650;letter-spacing:.01em;margin-bottom:25px}.little-star{color:#b75721;font-size:25px;vertical-align:middle;margin-right:7px}.intro{max-width:480px;font-size:20px;color:var(--muted);line-height:1.65;margin:25px 0 32px}.micro{font-size:16px;margin-top:19px;color:var(--muted)}.hero-world{height:590px;position:relative;isolation:isolate}.world-disc{position:absolute;inset:42px 0 30px;border-radius:47% 47% 35% 35%;background:#f1e6cd;z-index:-4}.landscape{position:absolute;inset:auto -5% 0;width:110%;height:510px;object-fit:cover;object-position:bottom;z-index:-3;border-radius:47% 47% 36% 36%;mix-blend-mode:multiply}.sun{position:absolute;right:15px;top:55px;width:95px;height:95px;background:#f0b953;border-radius:50%;z-index:-2}.hangul{position:absolute;top:9px;left:25px;font-size:99px;font-weight:850;color:#decfb2;transform:rotate(-10deg);letter-spacing:-.1em;z-index:-2}.hero-hori{position:absolute;width:84%;max-height:530px;object-fit:contain;bottom:0;left:-3%;filter:drop-shadow(0 18px 15px #5b452217);transform-origin:bottom;animation:arrival .7s ease-out both}.hero-dori{position:absolute;width:30%;right:-5%;bottom:35px;transform:rotate(9deg)}.speech{position:absolute;right:-10px;top:87px;background:#fffdf5;border:2px solid var(--ink);padding:15px 22px;border-radius:22px 22px 22px 3px;box-shadow:4px 5px 0 #173e3515;transform:rotate(5deg);font-size:17px}.speech strong,.speech span{display:block}.speech span{font-size:15px;color:var(--muted)}.curiosity{max-width:1276px;margin:38px auto 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:24px 0;font-size:16px;font-weight:600}.curiosity>span:last-child{font-size:25px}.section{max-width:1276px;margin:0 auto;padding:80px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:40px}.section-heading>p{max-width:350px;color:var(--muted);font-size:19px}.topics{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.topic{text-align:left;padding:0;border:0;background:none;display:flex;flex-direction:column;transition:transform .2s}.topic:hover{transform:translateY(-6px)}.topic-art{height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;border-radius:28px;isolation:isolate;background:#e9ccef;color:#572e63}.topic-1 .topic-art{background:#f3bf81;color:#703821}.topic-2 .topic-art{background:#b9d9c4;color:#194d40}.topic-korean{font-size:84px;font-weight:850;letter-spacing:-.08em;z-index:2}.topic-roman{font-size:19px;letter-spacing:.01em;z-index:2}.topic-orbit{position:absolute;border:1px solid currentColor;opacity:.2;width:300px;height:170px;transform:rotate(-30deg);border-radius:50%;z-index:1}.topic-1 .topic-orbit{border-radius:38%;width:210px;height:250px;transform:rotate(25deg)}.topic-2 .topic-orbit{width:230px;height:230px;border-radius:50%;box-shadow:0 0 0 28px #194d4020,0 0 0 58px #194d4010}.topic-body{display:flex;flex:1;flex-direction:column;padding:24px 2px 0;gap:13px}.topic-body strong{font-size:25px;line-height:1.2;letter-spacing:-.03em}.topic-body>span:not(.topic-action){font-size:18px;color:var(--muted)}.topic-action{display:flex;justify-content:space-between;margin-top:auto;padding-top:14px;font-size:17px;font-weight:700}.friends{padding-top:90px}.friends-heading{text-align:center;max-width:780px;margin:0 auto}.friend-pair{display:grid;grid-template-columns:1fr 1fr;gap:90px;max-width:850px;margin:45px auto 0}.friend{text-align:center}.friend-portrait{height:330px;display:flex;align-items:end;justify-content:center;position:relative}.friend-portrait:before{content:"";position:absolute;inset:48px 0 0;background:#f5e7c7;border-radius:50% 50% 46% 46%;z-index:-1}.friend-portrait img{height:100%;width:auto;object-fit:contain}.dori-portrait img{height:90%}.dori-portrait:before{background:#dce7d8}.friend h3{font-size:30px;margin:25px 0 13px}.friend p{color:var(--muted);font-size:18px;max-width:310px;margin:auto}.launch{background:var(--ink);border-radius:35px;padding:65px 70px 100px;color:var(--paper);margin-top:40px;position:relative;overflow:hidden}.launch-status{display:flex;align-items:center;gap:10px;font-size:16px;color:#e0e7d1;margin-bottom:25px}.launch-status span{height:9px;width:9px;border-radius:50%;background:#efbd5e}.launch h2{font-size:clamp(38px,4.8vw,65px);max-width:820px}.launch>p:not(.launch-status){max-width:570px;margin-top:24px;font-size:19px;color:#dbe5d7}.launch-actions{margin-top:30px;display:flex;align-items:center;gap:30px;position:relative;z-index:1}.gold{background:#f3b449;color:var(--ink);box-shadow:0 5px 0 #a06914}.gold:hover{background:#ffc366;box-shadow:0 7px 0 #a06914}.contact-link{font-size:17px;padding:12px 0}.launch-word{position:absolute;right:25px;bottom:-70px;font-size:170px;font-weight:900;letter-spacing:-.08em;color:#ffffff08;pointer-events:none}.footer{max-width:1276px;margin:0 auto;padding:65px 0 30px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px}.footer p{font-size:16px;color:var(--muted);margin-top:10px}.footer nav{display:flex;gap:24px;align-items:center;flex-wrap:wrap;font-size:16px}.footer nav a{min-height:44px;display:flex;align-items:center}.footer-base{display:flex;gap:25px;flex-wrap:wrap;width:100%;padding-top:24px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}.preview-note{width:100%;padding:12px 16px;background:#fff0cf;border-radius:8px}.skip{position:absolute;top:-100px;left:20px;z-index:99;background:white;padding:12px}.skip:focus{top:10px}.noscript{padding:20px;background:#fff0cf}.lesson-dialog{border:0;border-radius:28px;padding:0;width:min(640px,calc(100% - 28px));max-height:calc(100dvh - 28px);background:var(--paper);color:var(--ink);box-shadow:0 24px 100px #0a251d55;overscroll-behavior:contain}.lesson-dialog::backdrop{background:#12362eaa;backdrop-filter:blur(7px)}body.lesson-open{overflow:hidden}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 24px;border-bottom:1px solid var(--line);font-size:16px;background:var(--paper)}.close{border:0;background:#e9eee2;border-radius:50%;width:44px;height:44px;flex-shrink:0;font-size:28px;line-height:1}.close:hover{background:#d9e4d1}#lesson-body{padding:25px 32px 32px}.lesson-dialog h2{font-size:32px;letter-spacing:-.035em;margin:15px 0 22px;outline:none}.lesson-dialog h3{font-size:23px;margin-bottom:14px}.lesson-story p{margin:16px 0;font-size:19px}.lesson-kicker{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:16px;gap:15px}.lesson-kicker img{width:65px;height:65px;object-fit:contain}.lesson-source{font-size:16px;margin-top:20px}.lesson-dialog .button{width:100%;margin-top:22px;font-size:17px;min-height:56px}.lesson-local{font-size:15px;color:var(--muted);margin-top:20px}.progress{height:9px;border-radius:10px;background:#e0e8d8;overflow:hidden;margin:10px 0 23px}.progress span{display:block;height:100%;background:var(--green);transition:width .2s}.options{display:grid;gap:12px;margin:22px 0}.option{border:2px solid #cbd5c5;background:#fffef9;min-height:59px;border-radius:14px;padding:13px 17px;display:flex;gap:14px;align-items:center;text-align:left;font-size:18px;box-shadow:0 3px 0 #d5ddcc;transition:background .1s}.option:hover:not(:disabled){border-color:#789a79;background:#f3f6e9}.option-number{font-size:15px;display:grid;place-items:center;flex-shrink:0;height:28px;width:28px;border:1px solid #c3d0bd;border-radius:8px}.option[data-state=correct]{border-color:#387b45;background:#e4f0dd}.option[data-state=incorrect]{border-color:#b46925;background:#fcebd3}.option:disabled{opacity:1}.feedback{border-radius:16px;background:#e6eedf;padding:20px;font-size:18px;margin-top:22px}.feedback p+p{margin-top:9px}.feedback strong{font-size:21px}.feedback.wrong{background:#f7ead5}.result-art{height:190px;width:190px;object-fit:contain;margin:5px auto}.result{text-align:center}.result-score{font-size:28px;font-weight:750;margin-bottom:14px}.result p{font-size:18px}.secondary{border:0;background:transparent;text-decoration:underline;text-underline-offset:5px;min-height:48px;padding:12px 10px;margin-top:12px;font-size:17px}.result-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.share-input{display:block;width:100%;font:inherit;padding:10px;background:white;border:1px solid var(--line);border-radius:8px;margin-top:8px}.share-status{font-size:16px;margin-top:12px}.lesson-dialog [hidden]{display:none!important}@keyframes arrival{from{opacity:0;transform:translateY(20px) rotate(-3deg)}to{opacity:1;transform:none}}
@media(min-width:1440px){.hero{padding-top:55px;padding-bottom:55px}.hero-world{height:640px}.hero-hori{max-height:590px}.landscape{height:560px}}
@media(max-width:1359px){.section,.footer,.curiosity{margin-left:42px;margin-right:42px}.header{gap:20px}.main-nav{gap:20px}.hero-world{height:540px}.speech{right:0;top:80px}.hero-dori{right:0}}
@media(max-width:1050px){.main-nav{display:none}.languages{margin-left:auto}.hero{gap:0;padding-top:30px}.hero-world{height:480px}.hero-hori{width:95%;left:-8%}.speech{top:45px;padding:12px 16px}.hangul{font-size:75px}.landscape{height:440px}.sun{width:70px;height:70px}.hero h1{font-size:58px}.intro{font-size:18px}.topic-art{height:220px}.topic-body strong{font-size:22px}.topic-korean{font-size:70px}.friend-pair{gap:40px}.launch{padding:55px 45px 75px}}
@media(max-width:760px){.header{min-height:86px;padding:18px 24px;gap:15px}.brand img{width:120px}.nav-cta{display:none}.languages{gap:0}.hero{padding:20px 24px 0;grid-template-columns:1fr;min-height:0;gap:4px}.hero h1{font-size:clamp(42px,8.5vw,62px);max-width:600px}.hero .eyebrow{margin-bottom:20px;font-size:16px}.intro{font-size:18px;max-width:550px;margin:20px 0 25px}.hero .primary{width:100%;max-width:420px;font-size:17px}.micro{font-size:15px;margin-top:17px}.hero-world{height:420px;max-width:520px;width:100%;margin:0 auto}.world-disc{inset:25px 8% 14px}.hero-hori{height:355px;width:80%;left:0;bottom:0}.hero-dori{height:130px;width:27%;bottom:28px;right:1%}.landscape{height:370px;inset:auto 0 0;width:100%}.speech{top:53px;right:2%;font-size:16px;padding:12px 16px}.speech span{font-size:14px}.hangul{top:16px;left:10px;font-size:76px}.sun{right:30px;top:14px;width:70px;height:70px}.curiosity{margin:25px 24px 0;padding:18px 0}.section,.footer{margin-left:24px;margin-right:24px;padding-top:52px;padding-bottom:52px}.section-heading{display:block;margin-bottom:28px}.section-heading p{margin-top:22px;max-width:none}.section h2{font-size:clamp(32px,6vw,44px)}.topics{grid-template-columns:1fr;gap:35px}.topic{display:grid;grid-template-columns:140px 1fr;gap:22px;padding-bottom:28px;border-bottom:1px solid var(--line)}.topic-art{height:185px;border-radius:21px}.topic-korean{font-size:50px}.topic-roman{font-size:15px}.topic-body{padding:5px 0 0;gap:10px}.topic-body strong{font-size:23px}.topic-body>span:not(.topic-action){font-size:17px}.topic-action{font-size:16px;padding-top:6px}.friends-heading{text-align:left}.friend-pair{gap:24px;margin-top:30px}.friend-portrait{height:220px}.friend h3{font-size:25px}.friend p{font-size:17px}.friend-portrait:before{inset:40px 0 0}.launch{padding:40px 28px 50px;border-radius:25px;margin-top:15px}.launch-actions{align-items:stretch;flex-direction:column;gap:15px}.contact-link{text-align:center}.launch-word{font-size:105px;bottom:-43px}.footer{padding-top:45px;padding-bottom:25px;display:block}.footer nav{margin-top:25px;gap:7px 20px}.footer-base{margin-top:25px;gap:12px;font-size:15px}.footer-base>span{display:block;width:100%}.footer p.preview-note{font-size:15px;margin-top:24px}.lesson-dialog h2{font-size:28px}#lesson-body{padding:20px 22px 26px}.dialog-top{padding:12px 18px}}
@media(max-width:380px){.header{padding:14px 18px;gap:8px}.brand img{width:104px}.languages a{font-size:14px;padding:8px 7px;min-width:39px}.hero{padding:14px 18px 0}.hero h1{font-size:39px}.hero-world{height:350px}.hero-hori{height:300px}.hero-dori{height:110px}.landscape{height:310px}.speech{top:38px;font-size:14px}.speech span{font-size:13px}.hangul{font-size:60px}.section,.footer,.curiosity{margin-left:18px;margin-right:18px}.topic{grid-template-columns:110px 1fr;gap:17px}.topic-art{height:180px}.topic-korean{font-size:42px}.topic-body strong{font-size:21px}.topic-body>span:not(.topic-action){font-size:16px}.friend-pair{gap:18px}.friend-portrait{height:175px}.friend p{font-size:16px}.launch{padding:30px 22px 40px}#lesson-body{padding:18px}.option{padding:12px;font-size:17px}.dialog-top{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Topic illustrations use the full square so both pansori performers remain visible. */
.topic-art{aspect-ratio:1;overflow:hidden}.topic-art .topic-image{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}.topic:hover .topic-image{transform:scale(1.025)}
@media(max-width:650px){.topic-art{height:auto;align-self:start;aspect-ratio:1}.topic-art .topic-image{position:absolute;inset:0}}
@media(prefers-reduced-motion:reduce){.topic-art .topic-image{transition:none}}

/* A playable culture sample, with the scene beside the decision. */
.culture-demo{padding-top:90px;padding-bottom:70px}
.culture-intro{max-width:760px;margin-bottom:36px}
.culture-intro h2{font-size:clamp(32px,4.2vw,54px);line-height:1.12;letter-spacing:-.04em;margin:0 0 20px}
.culture-intro h2 span{color:#a1522d}
.culture-intro>p{font-size:20px;line-height:1.6;max-width:580px;margin:0}
.culture-stage{display:grid;grid-template-columns:.95fr 1.05fr;gap:44px;align-items:center}
.culture-scene{position:relative;align-self:stretch;min-height:390px;border-radius:28px;overflow:hidden;background:#e8d9bb}
.culture-scene>img{display:block;width:100%;height:100%;position:absolute;object-fit:cover}
.culture-scene-caption{position:absolute;left:20px;bottom:20px;background:#fffaf0;padding:12px 20px;border-radius:16px;font-size:25px;font-weight:800;box-shadow:0 3px 0 #163e2b20}
.culture-scene-caption span{font-size:17px;font-weight:500;margin-left:8px}
.culture-play{padding:14px 0}
.culture-play>.eyebrow{margin:0 0 12px}
.culture-play h3{font-size:26px;line-height:1.3;letter-spacing:-.02em;margin:0 0 22px}
.culture-options{display:grid;gap:12px}
.culture-option{display:flex;align-items:center;gap:12px;text-align:left;width:100%;font:inherit;font-size:18px;line-height:1.45;color:var(--ink);background:#fffdf6;border:2px solid #d5d9cb;border-bottom-width:4px;border-radius:16px;padding:14px;cursor:pointer;min-height:64px}
.culture-option-letter{flex-shrink:0;display:grid;place-items:center;border:1px solid #cbd2c1;border-radius:8px;width:30px;height:32px;font-size:16px;font-weight:700}
.culture-option-mark{margin-left:auto;font-weight:800;font-size:24px}
.culture-option:not([aria-disabled]):hover{background:#f1ecd9;border-color:#a7b498}
.culture-option:not([aria-disabled]):active{transform:translateY(2px);border-bottom-width:2px}
.culture-option[aria-disabled]{cursor:default}
.culture-option[data-state=correct]{background:#e8f2da;border-color:#4e7c42}
.culture-option[data-state=incorrect]{background:#fff0e5;border-color:#b77351}
.culture-feedback:empty{display:none}
.culture-feedback{display:flex;gap:12px;align-items:center;margin:20px 0}
.culture-hori{width:80px;height:90px;object-fit:contain;flex-shrink:0}
.culture-reply strong{font-size:20px}
.culture-reply p{font-size:17px;line-height:1.55;margin:6px 0 0}
.culture-continue{width:100%;white-space:normal;min-height:56px;line-height:1.4}
.culture-continue[hidden]{display:none}
@media(max-width:760px){
 .culture-demo{padding-top:48px;padding-bottom:30px}
 .culture-intro{margin-bottom:24px}
 .culture-intro>p{font-size:18px}
 .culture-stage{grid-template-columns:1fr;gap:24px}
 .culture-scene{min-height:0;height:220px;border-radius:22px}
 .culture-scene>img{object-position:center 47%}
 .culture-scene-caption{left:14px;bottom:14px;padding:8px 14px;font-size:22px}
 .culture-play{padding:0}
 .culture-play h3{font-size:23px;margin-bottom:18px}
 .culture-option{font-size:17px;padding:12px;gap:10px}
 .culture-hori{width:64px;height:80px}
}