:root{--ink:#112c35;--muted:#5b7277;--paper:#f5f7f4;--green:#086d61;--lime:#ffdc93;--line:#d9e4df;--white:#fff;--gold:#b87920}
body{background:radial-gradient(ellipse at 8% 0%,#e7f3ed 0,transparent 35%),radial-gradient(ellipse at 100% 28%,#fff0da 0,transparent 30%),#f5f7f4;color:var(--ink)}
.topbar{min-height:84px;border-bottom-color:#cfded8}.brand{letter-spacing:-.6px}.seal{background:linear-gradient(145deg,#082c37,#087e6a);color:#ffdc93;box-shadow:0 5px 16px #073b3420}.nav a{font-weight:600}.btn{background:linear-gradient(135deg,#087c69,#07564f);border-color:#086f60;box-shadow:0 5px 16px #07584e18;transition:transform .18s,box-shadow .18s,background .18s}.btn:hover{transform:translateY(-2px);box-shadow:0 9px 22px #07584e26}.btn.secondary{background:#ffffffb3;box-shadow:none}.btn:disabled{transform:none;box-shadow:none}
.hero{position:relative;isolation:isolate;overflow:hidden;grid-template-columns:.94fr 1.06fr;gap:32px;padding:56px 44px;margin:28px 0 42px;min-height:590px;border:1px solid #24444a;border-radius:28px;background:radial-gradient(ellipse at 2% 100%,#0a675d 0,transparent 58%),radial-gradient(ellipse at 95% 0%,#8a60364d 0,transparent 48%),linear-gradient(125deg,#061b25,#102d35);box-shadow:0 25px 65px #17352b20;color:#fff}
.hero::before{content:'';position:absolute;width:310px;height:310px;border:1px solid #ffffff13;border-radius:50%;left:-150px;top:-180px;z-index:-1}.hero::after{content:'';position:absolute;width:530px;height:530px;border:1px solid #ffffff0c;border-radius:50%;left:-260px;top:-270px;z-index:-1}.hero .eyebrow{color:#f9d38c;letter-spacing:2px;font-size:10px}.hero .eyebrow:before{background:#f9d38c;width:20px}.hero h1{font-size:clamp(46px,4.8vw,72px);letter-spacing:-3.7px;line-height:1.06;margin:24px 0;font-weight:750}.hero h1 em{color:#ffda92}.hero p{color:#d1dddc;font-size:16px;line-height:1.75;max-width:390px}.hero .actions{gap:10px;margin-top:26px}.hero .actions .btn:first-child{background:linear-gradient(135deg,#ffe2a4,#efb956);border-color:#ffd78b;color:#112d32;box-shadow:0 7px 24px #0003;font-weight:800}.hero .actions .btn.secondary{background:#ffffff09;border-color:#ffffff45;color:#fff}.hero .actions .btn.secondary:hover{background:#ffffff18}.hero .stats{margin-top:34px;border-top:1px solid #ffffff24;padding-top:22px;gap:26px}.hero .stats strong{color:#ffe1a0}.hero .stats div{color:#bfcecd;font-size:11px}.hero-art{margin:0;align-self:stretch;padding:0;transform:none;border-radius:20px;background:#153b3b;border:1px solid #ffffff22;box-shadow:0 20px 40px #0004;min-height:450px;overflow:hidden}.hero-art img{width:100%;height:100%;min-height:450px;object-fit:cover;object-position:50% 40%;border-radius:0;filter:saturate(1.03)}.hero-art:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#071e2bbd);pointer-events:none}.hero-art .caption{left:22px;bottom:20px;z-index:2;font-size:9px;letter-spacing:1.5px;color:#fff0d7}.hero .floating{left:17px;right:17px;bottom:56px;z-index:2;padding:14px 17px;border:1px solid #ffffff6b;border-radius:13px;background:#fffffff0;backdrop-filter:blur(14px);box-shadow:0 8px 25px #0003}.hero .floating .han{color:#075f53;font-size:40px}.hero .floating small{color:#315951;font-size:12px}
.path{border:1px solid #d7e3de;border-radius:18px;overflow:hidden;background:#ffffffbf;box-shadow:0 12px 30px #163e3010}.step{position:relative;padding:25px}.step:before{content:'';position:absolute;left:24px;right:24px;top:0;height:3px;border-radius:0 0 3px 3px;background:#118976}.step:nth-child(2):before{background:#da9c43}.step:nth-child(3):before{background:#d57557}.step:nth-child(4):before{background:#6d83b7}.step h3{font-size:19px}.section-head h2{font-weight:750;letter-spacing:-1.3px}.toolbar input,.toolbar select{background:#fff;border-color:#cfddd7;box-shadow:0 3px 12px #163e3007}.slider-arrow{border-color:#c5d8cf;background:#fff;box-shadow:0 4px 12px #163e300a}.slider-arrow:hover:not(:disabled){background:#0b665b;color:#fff;border-color:#0b665b}.lesson-card{border:1px solid #ceded5;background:#fff;border-radius:24px;box-shadow:0 14px 38px #173c2d12}.lesson-card .slide-content{background:radial-gradient(ellipse at 100% 0%,#eef6e9,transparent 70%),#fff}.lesson-card h3{font-weight:750}.slide-vocabulary .preview-word{background:#f2f7ee;border-color:#dce7d5}.slide-status{color:#286454}.slide-open{min-height:50px}.slide-includes{color:#3e645a}.lesson-title-link:hover{color:#087464}
.lesson-cover{border:1px solid #365351;box-shadow:0 16px 36px #12382d18}.lesson-cover-shade{background:linear-gradient(90deg,#061f2be8,#093b3b73 70%),linear-gradient(0deg,#041a27d9,transparent 85%)}.lesson-cover-number{color:#ffdc93}.lesson-cover h1{font-weight:750;letter-spacing:-1.6px}.unit-contents{background:#ffffffed;border-color:#cfddd6;box-shadow:0 9px 26px #12382d09}.unit-page{background:#f5f8f2;border-color:#dce5da;transition:background .15s,border-color .15s}.unit-page:hover{background:#eaf3e5;border-color:#99bdab}.unit-page.selected{background:linear-gradient(145deg,#e5f1df,#f6efda);border-color:#24745d;box-shadow:inset 0 3px #24745d}.unit-page-strip{scrollbar-width:thin;scrollbar-color:#9ab7a8 #eaf0e8}.unit-page-strip::-webkit-scrollbar,.experience-nav::-webkit-scrollbar{height:7px}.unit-page-strip::-webkit-scrollbar-track,.experience-nav::-webkit-scrollbar-track{background:#eaf0e8;border-radius:8px}.unit-page-strip::-webkit-scrollbar-thumb,.experience-nav::-webkit-scrollbar-thumb{background:#9ab7a8;border-radius:8px}.experience-nav{border-radius:12px;padding-left:10px;padding-right:10px;background:#f5f7f4ed;box-shadow:0 3px 14px #12382d08}.experience-nav a{min-height:44px;display:inline-flex;align-items:center}.experience-nav a:hover{background:#e4eee3}.experience-section-heading h2{font-weight:750}.section-number{background:linear-gradient(145deg,#dcf0df,#e9edda);color:#225e4f}.aside{background:#fff;box-shadow:0 12px 30px #12382d0c;border-color:#cfdfd4}.rail-helper{background:linear-gradient(120deg,#e3f1df,#f7f0dc)}.word-sound:hover{color:#087563}.word-listen-label{background:#e0efdb;color:#125949}.kc-writing{background:radial-gradient(ellipse at 0 0,#e0f0e6,transparent 55%),linear-gradient(135deg,#fff,#f7f5e9);box-shadow:0 14px 40px #173c2d10}.kc-writing__card{box-shadow:0 6px 17px #173c2d0a}.progress-hero{border-bottom:0}.progress-total{background:radial-gradient(circle at 95% 0%,#dba85055,transparent 55%),linear-gradient(135deg,#082735,#09675d)}.progress-total strong{color:#ffdc93}.progress-lesson{background:linear-gradient(145deg,#fff,#f5f8f0);border-color:#cfdfd4;box-shadow:0 8px 24px #12382d0a}.progress-meter span{background:linear-gradient(90deg,#0d806b,#b9d88a)}
@media(min-width:1600px){.hero-art img{height:100%}}
@media(max-width:1050px){.hero{padding:38px 30px;gap:24px}.hero h1{font-size:53px}.hero .actions{flex-direction:column;align-items:stretch}.hero-art,.hero-art img{min-height:460px}.hero .stats{gap:19px}.hero p{font-size:15px}}
@media(max-width:720px){.hero{grid-template-columns:1fr;padding:29px 23px;margin:20px 0 28px;border-radius:22px;gap:24px;min-height:0}.hero h1{font-size:48px;letter-spacing:-2.6px;margin:20px 0}.hero p{font-size:14px;line-height:1.75;max-width:none}.hero .actions{flex-direction:row;align-items:stretch}.hero .actions .btn{flex:1 1 140px;font-size:12px;min-height:48px;padding:11px 13px}.hero .stats{gap:20px;margin-top:23px;padding-top:19px}.hero .stats strong{font-size:26px}.hero .stats div{font-size:9px}.hero-art{margin:0;min-height:290px;height:310px;border-radius:15px}.hero-art img{min-height:0;height:100%;object-position:center 35%}.hero .floating{left:12px;right:12px;bottom:43px;padding:9px 12px;gap:12px}.hero .floating .han{font-size:31px}.hero .floating small{font-size:10px}.hero-art .caption{left:14px;bottom:16px;font-size:8px;letter-spacing:1px}.step{padding:19px}.step:before{left:19px;right:19px}.step h3{font-size:16px}.lesson-card{border-radius:18px}.lesson-cover{min-height:260px}.lesson-cover h1{font-size:31px}.unit-switcher>a{background:#fff}.experience-nav{padding:9px 4px}.experience-nav a{font-size:12px;padding:8px 10px}.kc-writing h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){.btn,.unit-page{transition:none}.btn:hover{transform:none}.hero .floating{backdrop-filter:none}}

.kc-a-feedback:not(:empty){border:1px solid #a2cfb2;border-left:5px solid #167949;background:#e8f6ec;color:#163e27}.kc-a-feedback.wrong{border-color:#e2b0a0;border-left-color:#ae442b;background:#fff0e9;color:#722e1f}.kc-a-task:has(.kc-a-feedback.wrong) .kc-a-option[aria-pressed="true"]{background:#fff0e9;border:2px solid #ae442b;color:#722e1f}.kc-a-task:has(.kc-a-feedback:not(.wrong):not(:empty)) .kc-a-option[aria-pressed="true"]{border:2px solid #167949;background:#e4f4e8;color:#15482d}.kc-a-feedback:empty{display:none}

.scene-card{position:relative}.scene-open{font:inherit;font-weight:750;line-height:inherit;text-align:left;cursor:pointer;border:0;background:transparent;padding:0;color:#075e52}.scene-open>span{display:inline-grid;place-items:center;width:30px;height:30px;font-size:13px;color:#fff;border-radius:50%;background:#086c5d;margin-right:7px;vertical-align:middle}.scene-open:after{content:"";position:absolute;inset:0;border-radius:inherit}.scene-open:focus-visible{outline:0}.scene-open:focus-visible:after{outline:3px solid #b67722;outline-offset:-4px}.scene-card:has(.scene-open):hover{border-color:#46977c;box-shadow:0 9px 24px #143f2e1a}.scene-card.is-speaking{border-color:#0c8468;box-shadow:0 0 0 3px #0c846828}.scene-audio-hint{display:block;margin-top:12px;font-size:12px;color:#38655a}.scene-card .scene-state{font-size:11px;line-height:1.5}.scene-card .scene-still img{object-fit:cover}.scene-card.is-speaking .scene-open>span{background:#ac6b20}
