:root{font-family:system-ui,-apple-system,sans-serif;color:#153b4f;background:#f6f3e9}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 86% 8%,#fff0ca 0,transparent 27%),#f6f3e9}.shell{max-width:1120px;margin:auto;padding:28px 32px 22px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-weight:900;font-size:1.38rem;color:#146a76}.chapter{font-weight:800;color:#789397;font-size:.9rem;letter-spacing:.04em}.hero{display:grid;grid-template-columns:1.06fr .94fr;align-items:center;gap:20px;min-height:600px}.eyebrow{margin:0 0 12px;color:#e68b55;font-weight:900;font-size:.76rem;letter-spacing:.17em;text-transform:uppercase}h1{font-size:clamp(3.4rem,7vw,6.6rem);line-height:.99;letter-spacing:-.055em;margin:0;color:#133e56;font-weight:900}h1 em{font-style:normal;color:#e68b55}.intro{font-size:1.12rem;line-height:1.6;max-width:460px;color:#607c83;margin:26px 0}.start-box{max-width:460px;border-radius:26px;padding:22px 24px;background:#fff;box-shadow:0 16px 42px #173a4c12}.start-box label,.demo-controls label{display:block;font-size:.9rem;font-weight:900;margin-bottom:7px}.start-box label span{color:#90a2a7;font-weight:600}input{width:100%;font:inherit;border:2px solid #e1e9e7;border-radius:14px;padding:12px 14px;outline:none}input:focus{border-color:#54adac}.actions,.answer-row{display:flex;gap:10px;margin-top:13px}.actions button{flex:1}button{font:inherit;font-weight:900;border:0;border-radius:14px;padding:12px 17px;cursor:pointer;white-space:nowrap}button:disabled{opacity:.55;cursor:not-allowed}.primary{background:#147a84;color:#fff;box-shadow:0 7px 0 #0c5760}.primary:active{transform:translateY(3px);box-shadow:0 4px 0 #0c5760}.secondary{background:#e6f2ef;color:#176a72}.small{font-size:.78rem;color:#869b9d;margin:16px 0 0;line-height:1.45}.illustration{height:490px;position:relative;background:#d6f0e3;border-radius:48% 52% 42% 58% / 43% 44% 56% 57%;overflow:hidden;box-shadow:inset 0 -40px 0 #bce2c9}.illustration:before,.illustration:after{content:"";position:absolute;width:170px;height:240px;background:#79ba8e;border-radius:100px 100px 25px 25px;bottom:42px}.illustration:before{left:-44px;transform:rotate(-15deg)}.illustration:after{right:-45px;transform:rotate(17deg)}.sun{position:absolute;top:52px;right:85px;font-size:65px;color:#f5bf5e}.leaf{position:absolute;z-index:2;font-size:75px;color:#ffe7ac}.one{left:60px;top:70px}.animal{position:absolute;z-index:4;filter:drop-shadow(0 14px 6px #31594a24)}.lion{font-size:130px;bottom:96px;left:40px}.elephant{font-size:155px;bottom:112px;right:28px}.penguin{font-size:87px;bottom:44px;left:44%}.ground{position:absolute;bottom:0;left:-20px;width:120%;height:92px;border-radius:50% 50% 0 0;background:#89c78e;z-index:2}.lesson{background:#fff;border-radius:30px;padding:30px;box-shadow:0 14px 40px #183d4c12;margin:0 0 42px}.lesson-head{display:flex;justify-content:space-between;align-items:start}.lesson h2{font-size:2.6rem;margin:0 0 20px;line-height:1.1}.clock{font-size:2.2rem;font-weight:900;color:#e68b55;font-variant-numeric:tabular-nums}.progress{height:12px;background:#eaf2ed;border-radius:50px;overflow:hidden}.progress div{height:100%;width:0;background:#e9aa68;transition:width .4s}.stage-list{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:18px 0 27px}.stage-pill{padding:10px 8px;border-radius:14px;background:#f2f6f3;color:#839797;text-align:center;font-size:.77rem;font-weight:900}.stage-pill.active{background:#dcf0e8;color:#176f77}.stage-pill.done{color:#2a9c83}.stage-pill .icon{display:block;font-size:1.4rem}.dialogue{display:flex;gap:16px;background:#eef8f5;border-radius:22px;padding:22px;min-height:118px;align-items:start}.avatar{display:grid;place-items:center;flex:none;width:50px;height:50px;border-radius:50%;background:#e8a16d;color:white;font-size:1.8rem;font-weight:900}.speaker{color:#3f8d89;font-size:.78rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em}.dialogue p{font-size:1.3rem;font-weight:800;line-height:1.4;margin:5px 0}.status{color:#789296;font-size:.9rem;margin:15px 2px 25px}.targets{border-top:1px solid #e7efeb;padding-top:18px}.targets strong{font-size:.85rem;color:#7e9697}.targets div{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}.targets span{background:#fff4e7;border-radius:100px;padding:8px 13px;font-size:.87rem;font-weight:800;color:#9e6f50}.demo-controls{margin-top:24px}.answer-row{margin:0}.answer-row input{flex:1}.text-button{color:#16818b;background:transparent;padding-left:0;margin-top:10px}.end-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:28px}.end-row span{font-size:.78rem;color:#90a3a4}footer{text-align:center;color:#9caead;font-size:.8rem;padding:10px}@media(max-width:760px){.shell{padding:19px 17px}.topbar{align-items:start}.chapter{font-size:.75rem;text-align:right}.hero{display:flex;flex-direction:column;align-items:stretch;gap:20px;padding-top:25px}.illustration{height:260px;border-radius:32px}.animal.lion{font-size:85px;left:22px;bottom:55px}.animal.elephant{font-size:105px;right:24px;bottom:65px}.animal.penguin{font-size:60px;bottom:23px}.sun{font-size:45px;top:21px;right:45px}.leaf.one{font-size:45px;top:30px;left:40px}h1{font-size:3.6rem}.intro{margin:17px 0}.start-box{max-width:none}.lesson{padding:21px}.lesson h2{font-size:1.9rem}.clock{font-size:1.55rem}.stage-list{gap:4px}.stage-pill{font-size:.55rem}.stage-pill .icon{font-size:1.05rem}.dialogue p{font-size:1.05rem}.actions{flex-direction:column}.end-row{align-items:start;flex-direction:column}}

.notice{font-size:.87rem;font-weight:800;color:#147a84;margin:9px 0 0}.notice:empty{display:none}
.archive-state{font-size:.82rem;font-weight:800;color:#176a72;margin:0 2px 22px;line-height:1.5}footer a{color:#147a84}
.start-box .consent{display:flex;gap:10px;align-items:flex-start;margin:16px 0 4px;font-size:.78rem;line-height:1.45;font-weight:600;color:#536e73}.consent input{width:18px;height:18px;flex:none;margin:1px 0 0;accent-color:#147a84}.consent span{color:inherit!important;font-weight:inherit!important}
.player-role{display:inline-block;margin:0 0 18px;padding:8px 14px;border-radius:999px;background:#e6f2ef;color:#176a72;font-size:.9rem;font-weight:800}
.hero-player{position:absolute;z-index:6;left:32%;bottom:35px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:155px;min-height:145px;border:5px solid #fff4dc;border-radius:44% 44% 38% 38%;background:#ffc993;box-shadow:0 15px 20px #31594a30;transform:rotate(-5deg)}.hero-player-icon{font-size:79px;line-height:1}.hero-player-name{font-size:.9rem;font-weight:900;color:#684c3f;white-space:nowrap}.illustration .penguin{left:62%}
@media(max-width:760px){.hero-player{left:31%;bottom:12px;width:94px;min-height:88px;border-width:3px}.hero-player-icon{font-size:46px}.hero-player-name{font-size:.55rem}.illustration .penguin{left:63%;bottom:21px}}

.start-box select{width:100%;font:inherit;border:2px solid #e1e9e7;border-radius:14px;padding:12px 14px;background:#fff;color:#153b4f;margin-bottom:8px}.start-box input#accessCode{margin-bottom:14px}

[hidden]{display:none!important}.mode-banner{margin:0 0 14px;padding:13px 15px;border-radius:14px;background:#e6f2ef;color:#176a72;font-size:.9rem;font-weight:750;line-height:1.55}

.lesson .status{margin:15px 2px 10px;line-height:1.5}.lesson #timeHint{margin:0 2px 12px;line-height:1.5}.lesson .archive-state{margin:0 2px 22px}.demo-guide{color:#526f78;line-height:1.6;margin:0 0 14px}.demo-controls #demoRecordBtn{min-width:210px}.demo-controls #demoReplay{display:block;width:min(100%,480px);margin-top:12px}.demo-controls #demoRecordStatus{margin:10px 0 0}
.trusted-device-note{margin:0 0 8px;padding:12px 14px;border-radius:14px;background:#e6f2ef;color:#176a72;font-weight:750;line-height:1.5}