@font-face{font-family:Story;src:url('./fonts/Display.woff2');font-display:swap}@font-face{font-family:Friendly;src:url('./fonts/Body.woff2');font-display:swap}*{box-sizing:border-box}body{margin:0;color:#243e39;background:#f6f3eb;font-family:Friendly,'Trebuchet MS',sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.3}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #c17c36;outline-offset:5px}svg{width:24px;height:24px;flex-shrink:0}header{height:100px;max-width:1512px;padding:0 5%;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:9px;font-family:Story,Georgia,serif;font-size:27px;line-height:1}.brand>svg{height:45px;width:37px;color:#a97030}.brand-sub{display:block;font-family:Friendly,sans-serif;font-size:8px;letter-spacing:2.1px;margin-top:8px;font-weight:700}nav{display:flex;padding:5px;background:#e9eade;border-radius:30px;gap:3px}nav a{font-size:12px;padding:11px 20px;border-radius:24px;transition:background .2s}nav a[aria-current]{background:#fffdf6;box-shadow:0 2px 7px #23423812}.icon-button{height:42px;width:42px;display:grid;place-items:center;border:1px solid #b8c4b8;border-radius:50%;background:transparent;color:inherit}.intro{text-align:center;margin:12px auto 32px}.intro h1{font-family:Story,Georgia,serif;font-size:clamp(32px,3.2vw,49px);font-weight:400;margin:0 0 10px;letter-spacing:-1.1px}.intro p{font-size:13px;color:#65756b;margin:0}.intro p b{font-weight:500}.intro p i{padding:0 12px;color:#a87a3f;font-style:normal}.controls{display:flex;justify-content:center;align-items:center;gap:24px;margin:27px auto 0}.round-button{border:1px solid #bec7b7;background:#f9f8ef;width:49px;height:49px;border-radius:50%;display:grid;place-items:center;color:#29483c;transition:background .2s,transform .2s}.play-button{display:flex;align-items:center;justify-content:center;gap:12px;background:#244c40;color:#fff7df;border:0;min-width:181px;height:51px;border-radius:28px;font-size:14px;box-shadow:0 5px 12px #243e3920;transition:background .2s,transform .2s}.play-button svg{width:19px}.chapter-dots{display:flex;gap:8px;align-items:center}.chapter-dot{width:8px;height:8px;border:0;padding:0;background:#c1c9b8;border-radius:6px;position:relative;transition:width .25s,background .25s}.chapter-dot:after{content:'';position:absolute;inset:-12px -3px}.chapter-dot.active{width:24px;background:#51745d}.page-count{font-size:12px;color:#697864;letter-spacing:1px}.controls-meta{display:flex;justify-content:center;align-items:center;gap:20px;margin:15px auto;color:#687767;font-size:11px}.auto-label{display:flex;align-items:center;gap:6px;cursor:pointer}.auto-toggle{accent-color:#436c55;cursor:pointer}.progress-track{height:3px;background:#ced3bc;overflow:hidden;border-radius:2px;width:95px}.progress-fill{height:100%;background:#547654;transform:scaleX(0);transform-origin:left}.status{min-height:18px;text-align:center;font-size:11px;color:#697864;margin:11px 15px}footer{max-width:1390px;display:flex;justify-content:space-between;align-items:center;margin:25px auto 0;padding:18px 5%;font-size:10px;color:#7b826f}footer span{display:flex;gap:8px;align-items:center}footer svg{width:14px;height:14px}.notes-button{color:inherit;background:transparent;border:0;font-size:11px;text-decoration:underline;text-underline-offset:4px}dialog{padding:0;border:0;border-radius:18px;max-width:600px;width:calc(100% - 32px);color:#243e39;background:#fffaf0;box-shadow:0 20px 80px #102e3340}dialog::backdrop{background:#183735aa;backdrop-filter:blur(5px)}.note-inner{padding:36px;position:relative}.note-inner h2{font:32px Story,Georgia,serif;padding-right:30px}.note-inner p{font-size:14px;line-height:1.8}.note-inner a{text-decoration:underline}.note-inner .small{font-size:11px}.note-close{position:absolute;right:15px;top:15px}.story-copy span{transition:color .3s}.spoken{color:#ad6935}@media(hover:hover) and (pointer:fine){.round-button:not(:disabled):hover{background:#e3e9d5;transform:translateY(-2px)}.play-button:hover{background:#386351;transform:translateY(-2px)}nav a:hover{background:#fffdf6aa}.icon-button:hover{background:#dce3d160}}@media(max-width:700px){header{height:86px;padding:0 5%;flex-wrap:wrap;gap:9px}.brand{font-size:23px}.brand-sub{font-size:6px;letter-spacing:1.6px}.brand>svg{height:36px;width:28px}nav a{padding:9px 12px;font-size:10px}header .sound{width:34px;height:34px}.intro{margin:22px 20px}.intro p{font-size:11px;line-height:1.8}.controls{gap:15px}.page-count{font-size:10px}.round-button{width:43px;height:43px}.play-button{min-width:150px;height:47px}footer{margin-top:12px;gap:20px;line-height:1.6}.intro h1{letter-spacing:-.6px}}@media(max-width:440px){header{height:105px;position:relative;align-content:center}header nav{order:3;margin:auto}.sound{position:absolute;right:5%;top:20px}.brand{margin:auto}.intro{margin-top:17px}.controls{gap:12px}.chapter-dots{gap:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Bengali text uses generous line height and untracked letterforms. */
.brand{font-size:26px;line-height:1.3}.brand-sub{font-size:10px;letter-spacing:0}.intro h1{line-height:1.5;letter-spacing:0}.intro p{font-size:13px}.chapter-label,.place,.page-bottom,.illustration-caption{letter-spacing:0!important}.text-page h2{line-height:1.4!important;letter-spacing:0!important}.story-copy{line-height:1.95}.lesson p{font-style:normal}.brand-sub{margin-top:4px}nav a{font-size:13px}.notes-button{font-family:inherit}.intro{margin-bottom:24px}
.chapter-dot{transition:background .25s}.chapter-dot.active{width:8px;background:#51745d;box-shadow:0 0 0 3px #51745d22}.chapter-dots{gap:12px}.brand-sub{font-size:10px}dialog a{overflow-wrap:anywhere}
@media(max-width:440px){header{display:block;height:126px;padding-top:17px}.brand{width:max-content;margin:0 auto}.brand>svg{height:36px}header nav{position:absolute;top:78px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%}header .sound{top:20px}.intro{margin-top:12px}}
