@import url('./assets/fonts/fonts.css');
:root{--ink:#163e3b;--paper:#f7f8f2;--muted:#677a72;--line:#dce4d9;--aqua:#62e3d4;--amber:#f0b85e;--white:#fff;--dark:#102f2e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Onest',Arial,sans-serif;font-size:16px;line-height:1.6}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bd7620;outline-offset:4px}header{max-width:1400px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:23px;font-weight:850;letter-spacing:1px;line-height:1.25}.brand-icon{display:grid;place-items:center;background:var(--ink);color:var(--aqua);height:48px;width:48px;border-radius:14px;font-size:38px}.brand small{display:block;font-size:8px;letter-spacing:1.7px;margin-top:4px}nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:600}nav a{text-decoration:none}nav a:hover{color:#20847a}.nav-progress{background:transparent;border:1px solid var(--line);padding:10px 15px;border-radius:24px;color:var(--ink)}#count{padding-left:10px;color:#32766d}main{min-height:70vh;max-width:1400px;margin:auto}main:focus{outline:none}.wrap{padding:0 5%}.hero{padding-top:58px;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:40px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:1.6px;text-transform:uppercase;display:flex;align-items:center;gap:8px}.dot{height:7px;width:7px;border-radius:50%;background:#26a68b;display:inline-block}.hero h1{font-size:clamp(40px,4.4vw,64px);letter-spacing:-2.7px;line-height:1.08;font-weight:850;font-style:italic;margin:22px 0}.hero h1 em{font-style:inherit;color:#248f81}.hero p{max-width:410px;color:var(--muted);font-size:16px}.btn{border:0;background:var(--ink);color:white;padding:15px 23px;border-radius:9px;text-decoration:none;display:inline-flex;gap:22px;align-items:center;justify-content:center;font-size:14px;font-weight:650;line-height:1.4;transition:transform .2s,background .2s}.btn:hover{background:#205952;transform:translateY(-2px)}.btn.secondary{background:white;color:var(--ink);border:1px solid var(--line)}.btn.light{background:var(--aqua);color:var(--dark)}.hero .btn{margin-top:14px}.hero-art{position:relative;min-width:0}.hero-art img{width:100%;height:420px;object-fit:cover;border-radius:22px 22px 80px 22px;border:1px solid #c8ddd0}.floating-label{position:absolute;bottom:24px;left:-20px;background:var(--ink);color:white;box-shadow:0 8px 30px #133d3920;padding:15px 20px;border-radius:12px;display:flex;gap:12px;align-items:center;font-size:13px}.floating-label span{color:var(--aqua);font-size:25px}.hero-note{display:flex;gap:12px;align-items:center;margin-top:26px;font-size:11px;color:var(--muted)}.avatar{display:grid;place-items:center;height:29px;width:29px;background:#d8e9df;border-radius:50%;font-size:15px;color:var(--ink)}.journey{margin:58px 0 64px;padding:21px 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:25px}.journey>div{display:flex;align-items:center;gap:14px}.step-no{font-size:12px;border:1px solid #b9cbbf;border-radius:50%;width:34px;height:34px;display:grid;place-items:center;flex-shrink:0}.journey strong{font-size:13px;display:block}.journey small{font-size:11px;color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}h2{font-size:32px;letter-spacing:-1px;line-height:1.2;margin:10px 0 12px}.section-head p{color:var(--muted);font-size:13px;margin:0}.filters{display:flex;gap:7px;flex-wrap:wrap;margin:24px 0}.chip{background:transparent;border:1px solid var(--line);border-radius:25px;padding:8px 16px;font-size:12px;color:var(--muted)}.chip[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.course-card{background:white;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s}.course-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #143b3910}.card-art{height:202px;position:relative;overflow:hidden}.card-art img{width:100%;height:100%;object-fit:cover}.tag{position:absolute;top:14px;left:14px;background:#fffef0e8;padding:5px 10px;border-radius:6px;font-size:10px;font-weight:700}.card-body{padding:21px}.card-meta{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.course-card h3{font-size:22px;letter-spacing:-.6px;margin:14px 0 6px;line-height:1.2}.course-card p{font-size:12px;color:var(--muted);line-height:1.7;min-height:62px}.card-link{display:flex;justify-content:space-between;text-decoration:none;font-size:12px;font-weight:700;border-top:1px solid var(--line);padding-top:17px}.card-link:hover{color:#258a7a}.info-banner{margin:60px 0;padding:30px 35px;background:#e9efe4;border:1px solid #d8e2d0;border-radius:14px;display:flex;justify-content:space-between;gap:30px;align-items:center}.info-banner strong{font-size:18px}.info-banner p{margin:7px 0 0;font-size:13px;color:var(--muted)}footer{max-width:1260px;margin:50px auto 0;padding:25px 0;display:flex;align-items:center;gap:30px;justify-content:space-between;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}footer .brand{font-size:16px;color:var(--ink)}footer p{margin:0}footer a{font-weight:700}.back{display:inline-block;color:var(--muted);font-size:12px;text-decoration:none;margin:28px 0 22px}.course-intro{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center}.course-intro img{width:100%;height:310px;object-fit:cover;border-radius:16px}.course-intro h1{font-size:44px;line-height:1.08;letter-spacing:-1.7px;margin:16px 0}.course-intro p{color:var(--muted)}.lessons{margin:40px 0;display:grid;grid-template-columns:1fr 1fr;gap:20px}.lesson{background:white;border:1px solid var(--line);border-radius:14px;padding:26px}.lesson h3{font-size:18px;line-height:1.3;margin:12px 0}.lesson p{font-size:14px;color:#53675d;margin:0}.lesson .step-no{background:#e8f3ed;border:0}.sources{font-size:12px;color:var(--muted);margin:20px 0 35px}.sources a{margin-right:20px}.start-block{padding:30px;border-radius:15px;background:var(--ink);color:white;display:flex;align-items:center;justify-content:space-between;gap:25px}.start-block p{color:#c4dbd3;font-size:13px}.start-block h2{font-size:25px}.novel-wrap{padding:0 3% 30px}.novel-toolbar{display:flex;justify-content:space-between;align-items:center;margin:23px 0;font-size:12px}.novel-toolbar a{color:var(--muted);text-decoration:none}.progress-track{display:flex;gap:5px}.progress-track span{width:32px;height:5px;border-radius:3px;background:#d8e2da}.progress-track .done{background:#2c9b8c}.stage{position:relative;border-radius:18px;overflow:hidden;background:var(--dark);min-height:650px;isolation:isolate;color:white;display:flex;align-items:end}.scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.stage:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#112d2910 10%,#102b2b35 30%,#102b2bf5 95%)}.scene-label{position:absolute;left:28px;top:25px;background:#113a36da;border:1px solid #7ed6c688;padding:6px 14px;border-radius:6px;color:#bde5db;font-size:11px}.novel-content{width:100%;padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:end}.speaker{color:var(--aqua);text-transform:uppercase;letter-spacing:1.5px;font-size:10px;font-weight:700}.novel-content h1{font-size:30px;line-height:1.15;margin:12px 0}.novel-content p{font-size:15px;line-height:1.8;color:#e1eeea}.options{display:grid;gap:10px}.option{background:#f5fcf4f2;color:var(--ink);border:1px solid #bce6d6;border-radius:9px;padding:15px;text-align:left;font-size:13px;line-height:1.5;display:flex;gap:12px}.option:hover{background:var(--aqua);border-color:var(--aqua)}.option b{font-size:11px;border:1px solid #9bbfb1;border-radius:5px;min-width:24px;height:24px;text-align:center;line-height:22px}.correct-box{border:1px solid #6ee0bd80;border-radius:12px;padding:24px;background:#164c43ed}.correct-box strong{color:var(--aqua)}.hint{font-size:11px;color:var(--muted);text-align:center;margin-top:16px}.failure .scene{filter:saturate(.8)}.failure .speaker{color:#f7bd83}.certificate-page{max-width:900px;margin:auto;text-align:center;padding:50px 25px}.success-medal{width:65px;height:65px;border-radius:50%;background:#d8f1e5;color:#26745f;display:grid;place-items:center;font-size:35px;margin:auto}.certificate-page h1{font-size:38px;letter-spacing:-1.5px;margin-bottom:10px}.certificate-page>p{color:var(--muted)}.certificate-form{max-width:530px;margin:30px auto;text-align:left}.certificate-form label{font-size:13px;display:block;margin-bottom:8px}.certificate-form input{width:100%;padding:14px 16px;border:1px solid #9cbcaf;background:white;border-radius:8px;color:var(--ink)}.certificate-form small{font-size:11px;color:var(--muted);display:block;margin:8px 0 15px}.form-actions{display:flex;gap:10px}.form-actions .btn{flex:1}.certificate-preview{width:100%;height:auto;background:white;border-radius:12px;box-shadow:0 8px 30px #18382b10}.notice{font-size:12px!important}.error{color:#a44124;font-size:13px}.empty{padding:50px}.about{max-width:780px;margin:auto;padding:45px 25px}.about p{color:var(--muted)}dialog{border:1px solid var(--line);border-radius:20px;padding:32px;width:min(540px,90vw);color:var(--ink);background:var(--paper)}dialog::backdrop{background:#102d2a99;backdrop-filter:blur(5px)}.close{position:absolute;right:15px;top:12px;border:0;background:transparent;font-size:28px;color:var(--ink)}.progress-item{padding:18px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:13px}.muted{font-size:12px;color:var(--muted)}.skip{position:fixed;top:-70px;left:10px;z-index:100;background:white;padding:10px}.skip:focus{top:5px}@media(min-width:1450px){footer{max-width:1260px}}@media(max-width:900px){header{padding:18px 5%}nav{gap:14px}nav>a:nth-child(2){display:none}.hero{gap:24px}.hero h1{font-size:43px}.hero-art img{height:370px}.journey{gap:12px}.course-grid{gap:13px}.card-body{padding:16px}.card-art{height:170px}.course-card h3{font-size:20px}.floating-label{left:10px}.novel-content{gap:20px}.novel-content p{font-size:14px}footer{margin:40px 5% 0}.course-intro h1{font-size:36px}}@media(max-width:650px){header{padding:16px 5%;gap:12px}.brand{font-size:19px}.brand-icon{width:38px;height:38px;font-size:30px}.brand small{font-size:6px}nav{gap:10px;font-size:11px}.nav-progress{padding:8px 10px;font-size:10px}nav>a{display:none}.hero{padding-top:32px;grid-template-columns:1fr;gap:30px}.hero h1{font-size:44px;letter-spacing:-2px}.hero p{font-size:14px;max-width:100%}.hero-art img{height:290px;border-radius:16px 16px 50px 16px}.hero-note{margin-top:18px}.floating-label{font-size:11px;bottom:15px;padding:10px 13px}.journey{margin:28px 0 36px;grid-template-columns:1fr;gap:16px;padding:22px 0}.journey small{font-size:12px}.journey strong{font-size:14px}h2{font-size:28px}.section-head{display:block}.section-head p{margin-top:10px}.course-grid{grid-template-columns:1fr;gap:22px}.card-art{height:210px}.card-body{padding:22px}.course-card h3{font-size:25px}.course-card p{font-size:14px;min-height:0}.card-meta,.card-link{font-size:12px}.info-banner{margin:35px 0;display:block;padding:24px}.info-banner .btn{margin-top:20px}.info-banner strong{font-size:17px}footer{flex-wrap:wrap;gap:12px;padding-bottom:25px}footer p{order:3;width:100%}.course-intro{grid-template-columns:1fr;gap:22px}.course-intro img{height:230px}.course-intro h1{font-size:37px}.lessons{grid-template-columns:1fr;margin-top:25px}.start-block{display:block;padding:24px}.start-block .btn{width:100%;margin-top:10px}.sources a{display:block;margin-bottom:8px}.novel-wrap{padding:0 3% 20px}.stage{min-height:810px;border-radius:12px}.scene{height:100%;object-position:50% 0}.stage:after{background:linear-gradient(180deg,#112d2900 0%,#102b2b44 20%,#102b2bf5 43%,#102b2b 100%)}.novel-content{padding:20px;grid-template-columns:1fr;gap:10px;padding-top:230px}.novel-content h1{font-size:27px}.novel-content p{font-size:14px;line-height:1.65}.option{padding:13px;font-size:13px}.scene-label{left:18px;top:15px}.progress-track span{width:22px}.novel-toolbar{font-size:10px}.certificate-page{padding:35px 18px}.certificate-page h1{font-size:30px}.form-actions{flex-direction:column}.certificate-form .btn{width:100%}.correct-box{padding:20px}.back{margin-top:22px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}