:root{--navy:#17334e;--dark:#102d44;--teal:#23ab82;--teal-d:#138a67;--gold:#ffc947;--coral:#f67777;--purple:#8b78dc;--paper:#fffcf7;--white:#fff;--muted:#5e7283;--line:#e6edf1;--shadow:0 14px 44px rgba(26,56,75,.10);--shadow-big:0 28px 75px rgba(24,61,78,.17);--radius:25px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;overflow-x:clip;color:var(--navy);background:var(--paper);font-family:'Trebuchet MS','Segoe UI',Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}body.locked{overflow:hidden}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.hidden{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible{outline:4px solid rgba(28,174,129,.4);outline-offset:3px}.container{max-width:1270px;margin:auto;padding:0 26px}.section-pad{padding:90px 0}.ambient{position:absolute;pointer-events:none;z-index:-1;filter:blur(70px)}.ambient-a{width:350px;height:350px;background:#d4fff4;top:80px;left:-160px;border-radius:50%}.ambient-b{width:380px;height:320px;background:#fff0ce;top:400px;right:-140px;border-radius:50%}
/* Navigation */
.site-header{height:90px;position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(24,72,79,.07);transition:box-shadow .2s}.site-header.scrolled{box-shadow:0 8px 24px rgba(12,62,82,.075)}.nav-shell{height:100%;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.brand-mark{height:52px;width:52px;display:grid;place-items:center;border-radius:16px;color:#fff;font-size:35px;font-weight:1000;background:linear-gradient(138deg,#2092c9 3%,#42be9e 74%,#ffce56);position:relative;box-shadow:0 9px 18px rgba(34,156,140,.17)}.brand-spark{position:absolute;font-size:11px;top:4px;right:5px;color:#ffe481}.brand-type{line-height:1.08}.brand-type strong{display:flex;flex-direction:column;letter-spacing:-.5px;font-weight:1000;font-size:21px;color:#17334e}.brand-type strong span{color:#169879;letter-spacing:2.8px;font-size:14px}.brand-type small{display:block;color:#79909b;font-weight:750;letter-spacing:.3px;font-size:10.5px;margin-top:6px}.nav-links{display:flex;align-items:center;gap:5px;margin:auto}.nav-link{padding:13px 13px;border-radius:12px;white-space:nowrap;font-size:14px;font-weight:900;color:#586e7b;transition:.2s}.nav-link:hover,.nav-link.active{background:#eaf8f2;color:#169979}.nav-actions{display:flex;gap:9px;align-items:center}.btn{display:inline-flex;justify-content:center;align-items:center;gap:10px;border-radius:16px;border:2px solid transparent;padding:14px 23px;font-weight:950;white-space:nowrap;transition:transform .2s,box-shadow .2s,background .2s;text-align:center}.btn:hover{transform:translateY(-3px)}.btn:active{transform:translateY(0)}.btn-primary{color:white;background:var(--teal);box-shadow:0 8px 0 var(--teal-d)}.btn-primary:hover{background:#27bc90;box-shadow:0 10px 0 #11916b}.btn-small{font-size:13px;padding:11px 16px;border-radius:12px;box-shadow:0 5px 0 #128868}.btn-text{background:transparent;color:var(--navy);font-size:14px;padding:12px}.btn-text:hover{background:#edf7f3}.btn-white{background:white;color:var(--navy);box-shadow:0 7px 0 #e6ede8;border-color:#edf0ed}.btn-white:hover{background:#f8fffc}.btn-lg{font-size:16px;padding:17px 27px;border-radius:18px}.btn-outline{border-color:#cfebdf;background:white;color:#198f70}.btn-outline:hover{background:#ebfff8}.btn-dark{background:var(--navy);color:white;box-shadow:0 7px 0 #0d253a}.account-chip{display:flex;align-items:center;gap:10px;padding:9px 14px 9px 10px;background:#edfaf5;border:1px solid #cceee0;border-radius:999px;color:#176449;font-weight:900}.account-chip>span:first-child{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#fff}.down-arr{font-size:20px}.mobile-toggle{display:none;width:45px;height:45px;padding:11px;flex-direction:column;justify-content:center;gap:5px;border:0;border-radius:14px;background:#eff8f7}.mobile-toggle span{height:3px;width:100%;border-radius:2px;background:var(--navy)}.mobile-menu{display:none}
/* hero */
.hero{position:relative;padding-top:65px;padding-bottom:18px;overflow:hidden;background:radial-gradient(ellipse at 67% 31%,#e7f9f0 0,transparent 48%),radial-gradient(ellipse at 8% 15%,#fff5d8 0,transparent 42%),linear-gradient(180deg,#fffdfa 0,#f5fbf8 93%,#fff 100%)}.hero-grid{display:grid;grid-template-columns:51% 49%;align-items:center;min-height:600px;gap:5px}.hero-copy{position:relative;z-index:4;padding:10px 0 38px}.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:8px;color:#188f70;font-size:12px;letter-spacing:2px;font-weight:1000}.eyebrow{background:#e9f8f0;padding:11px 15px;border-radius:999px;letter-spacing:1.4px;border:1px solid #dbf1e6}.eyebrow-spark{color:#ffb933;font-size:15px}.hero h1{font-size:clamp(42px,5.5vw,75px);letter-spacing:-3.5px;line-height:1.1;margin:22px 0 20px;font-weight:1000;max-width:680px}.highlight-word{position:relative;color:#1aa47c;white-space:nowrap}.highlight-word:after{content:'';position:absolute;bottom:0px;left:2px;right:1px;height:11px;background:#ffce46;border-radius:90%;z-index:-1;transform:rotate(-2deg)}.h1-smile{font-size:.55em;color:#ffb540;vertical-align:middle;display:inline-block;transform:rotate(-20deg)}.hero-description{font-size:18px;color:#617481;line-height:1.85;max-width:535px;margin:0 0 30px}.hero-description strong{color:#314f60}.hero-cta{display:flex;flex-wrap:wrap;gap:18px;align-items:center}.hero-proof{display:flex;align-items:center;gap:16px;margin-top:42px;color:#647983;font-size:12px;line-height:1.6}.hero-proof strong{color:var(--navy);font-size:14px}.proof-icons{display:flex;padding-left:9px}.proof-icons span{display:grid;place-items:center;height:42px;width:42px;background:white;border:3px solid #fff;border-radius:50%;font-size:23px;margin-left:-9px;box-shadow:0 3px 10px #d9e9e3}.hero-squiggle{position:absolute;left:380px;bottom:12px;font-size:100px;line-height:.3;color:#ffce56;transform:rotate(-25deg);opacity:.7;z-index:-1}.hero-art{position:relative;min-height:615px;width:100%}.hero-art-bg{position:absolute;width:94%;height:86%;top:8%;left:4%;border-radius:48% 52% 43% 57%/45% 40% 60% 55%;background:#dcf5ef;transform:rotate(13deg);border:4px solid #f6fffb}.hero-arc{position:absolute;border-radius:50%;border:2px dashed #ffcb68;z-index:0}.arc-one{width:100px;height:100px;top:9%;right:4%}.arc-two{width:56px;height:56px;bottom:14%;left:0;border-color:#93ddd3}.illustration-frame{position:absolute;overflow:hidden;box-shadow:0 22px 60px rgba(33,102,100,.18);border:9px solid white;background:#fff}.illustration-frame img{width:100%;height:100%;object-fit:cover}.central-frame{width:88%;height:365px;left:7%;top:17%;transform:rotate(-4deg);border-radius:37px;z-index:2;animation:floatOne 6s ease-in-out infinite}.secondary-frame{width:47%;height:205px;right:-1%;bottom:10%;border-radius:28px;z-index:3;transform:rotate(8deg);border-width:7px;animation:floatTwo 7s ease-in-out infinite}.floating-tag{position:absolute;z-index:5;background:#fff;color:#26414e;box-shadow:0 12px 30px rgba(31,91,102,.17);border-radius:16px;padding:13px 16px;font-weight:1000;font-size:12px;display:flex;align-items:center;gap:8px;border:1px solid #edf2ec;white-space:nowrap}.floating-tag span{font-size:22px}.tag-top{top:8%;left:1%;transform:rotate(-7deg);animation:floatOne 5.5s ease-in-out infinite}.tag-bottom{bottom:12%;left:4%;transform:rotate(3deg);animation:floatTwo 5s ease-in-out infinite}.hero-star{position:absolute;z-index:5;display:block;animation:twinkle 5s ease-in-out infinite}.star-one{color:#ffa93e;font-size:65px;top:8%;right:5%}.star-two{color:#ff7d89;font-size:45px;bottom:7%;right:5%;animation-delay:1.2s}.star-three{color:#65bdd2;font-size:38px;top:56%;left:0;animation-delay:2s}.mini-ribbon{border-top:1px solid #e5f0eb;padding-top:22px;padding-bottom:23px;display:flex;align-items:center;justify-content:space-between;gap:14px;color:#4c6979;font-weight:950;font-size:13px}.mini-ribbon i{height:6px;width:6px;border-radius:50%;background:#cfe7db}
/* dashboard */
.dashboard-section{padding:38px 0 0;background:#f5fbf8}.dash-surface{padding:30px 36px;background:linear-gradient(115deg,#dcf8ec,#fef9e8 88%);border:2px solid white;border-radius:32px;box-shadow:var(--shadow)}.dash-welcome{display:flex;align-items:center;gap:18px}.dash-avatar{width:84px;height:84px;border-radius:26px;background:#fff;box-shadow:0 7px 0 #d5e9db;display:grid;place-items:center;font-size:43px}.dash-heading{flex:1}.dash-heading h2{font-size:31px;margin:6px 0 3px;line-height:1.2}.dash-heading p{margin:0;color:#557c72}.dash-edit{padding:12px 17px;font-size:13px}.small{font-size:10px;padding:0;background:none;border:0}.dash-stats{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:14px;margin-top:28px}.stat-box{border:1px solid #e2efe7;border-radius:20px;background:rgba(255,255,255,.85);padding:17px;display:flex;gap:12px;align-items:center}.stat-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:25px}.stat-icon-gold{background:#fff1c6}.stat-icon-blue{background:#e5efff}.stat-box strong{display:block;font-size:25px}.stat-box small{display:block;color:#75909a;font-size:12px;font-weight:800}.progress-stat{display:block}.progress-title{display:flex;justify-content:space-between;font-size:13px;font-weight:900}.progress-title strong{font-size:16px}.progress-track{height:12px;border-radius:99px;background:#e6f0ec;overflow:hidden;margin:8px 0}.progress-fill{height:100%;background:linear-gradient(90deg,#21ac83,#ffc953);width:0%;border-radius:99px;transition:width .5s}.dash-actions{display:flex;gap:10px;margin-top:22px}.dash-actions .btn{padding:11px 18px;font-size:13px;box-shadow:none}
/* subject */
.subjects-section{background:#fff;padding-top:104px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:42px}.section-heading h2,.how-heading h2,.library-copy h2,.cta-surface h2{font-size:clamp(32px,4vw,50px);letter-spacing:-1.4px;line-height:1.17;margin:12px 0 12px;font-weight:1000}.section-heading p,.how-heading p{font-size:16px;color:#71808a;margin:0}.underline-yellow,.underline-teal{position:relative;white-space:nowrap;z-index:0}.underline-yellow:after,.underline-teal:after{content:'';position:absolute;bottom:0;left:0;right:0;height:10px;border-radius:100%;background:#ffe08a;z-index:-1;transform:rotate(-1deg)}.underline-teal:after{background:#95e5ca}.section-doodle{font-size:80px;color:#ffbb42;position:relative;transform:rotate(-18deg)}.section-doodle span{position:absolute;right:60px;top:0;font-size:22px;color:#89cfbf}.subject-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.subject-card{background:white;border:1.5px solid #edf0ef;box-shadow:0 10px 32px rgba(41,75,81,.07);border-radius:27px;overflow:hidden;transition:.25s;position:relative}.subject-card:hover{transform:translateY(-8px);box-shadow:0 22px 45px rgba(38,80,81,.14);border-color:var(--accent)}.subject-image{height:232px;background:var(--soft);position:relative;overflow:hidden;padding:13px 13px 0}.subject-image img{height:100%;width:100%;object-fit:cover;border-radius:17px 17px 5px 5px;transition:transform .4s}.subject-card:hover .subject-image img{transform:scale(1.05)}.subject-emoji{position:absolute;top:23px;right:22px;min-width:51px;height:51px;border-radius:16px;background:#fff;box-shadow:0 8px 20px #1232;display:grid;place-items:center;font-size:30px;font-weight:1000;color:#3d63bd}.subject-body{padding:22px 22px 23px}.subject-category{display:block;color:var(--accent);letter-spacing:1.5px;font-size:10px;font-weight:1000;margin-bottom:9px}.subject-body h3{font-size:24px;letter-spacing:-.5px;line-height:1.25;margin:0 0 9px}.subject-body p{margin:0;min-height:50px;color:#6a7c85;font-size:14px;line-height:1.7}.subject-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:20px;border-top:1px solid #eef1f0;padding-top:14px}.subject-check{font-weight:900;color:#597988;font-size:12px}.round-arrow{border:0;border-radius:15px;width:49px;height:49px;background:var(--accent);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--accent),#333 22%);font-size:28px;transition:transform .2s}.round-arrow:hover{transform:translateY(-2px)}.subject-card.is-complete:after{content:'✓ Dhammaystiran';position:absolute;left:19px;top:20px;background:#fff;color:#168460;border-radius:20px;font-size:11px;font-weight:1000;padding:9px 11px;box-shadow:0 6px 20px #0002}.special-card{min-height:395px;background:#1ba27b;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;padding:37px 32px;border-radius:27px;color:white;position:relative;overflow:hidden}.special-card:before{content:'';position:absolute;width:310px;height:310px;border:2px dashed #ffffff45;border-radius:50%;right:-115px;bottom:-130px}.special-spark{position:absolute;right:34px;top:25px;font-size:56px;color:#ffe18d;animation:twinkle 5s infinite}.special-emoji{font-size:53px;filter:drop-shadow(0 8px 9px #176f5a)}.special-card h3{font-size:31px;letter-spacing:-.6px;line-height:1.25;margin:18px 0 8px;max-width:300px}.special-card p{line-height:1.7;font-weight:700;font-size:14px;color:#e9fff8;max-width:300px}.special-card .btn{margin-top:12px}.special-shapes{position:absolute;right:-6px;bottom:9px;transform:rotate(-23deg);font-size:39px;color:#a6eacb}
/* steps */
.how-section{background:#f0faf5}.how-heading{text-align:center;margin-bottom:45px}.steps-grid{display:grid;grid-template-columns:1fr 55px 1fr 55px 1fr;gap:13px;align-items:center}.step-card{text-align:center;min-height:284px;border-radius:28px;background:#fff;border:1px solid #e3efed;box-shadow:0 10px 28px rgba(50,92,73,.055);padding:34px 21px;position:relative}.step-number{position:absolute;top:20px;left:23px;color:#c6dacf;font-weight:1000;font-size:22px}.step-illustration{width:104px;height:104px;border-radius:31px;margin:0 auto 19px;display:grid;place-items:center;font-size:57px;transform:rotate(-7deg)}.step-a{background:#fff0c7}.step-b{background:#e8e5ff}.step-c{background:#daf7e7}.step-card h3{font-size:21px;margin:8px 0}.step-card p{font-size:13px;line-height:1.75;color:#6c7f89;max-width:270px;margin:8px auto}.step-connector{text-align:center;font-size:33px;color:#60cfa9;font-weight:1000}
/* library */
.library-section{background:#fff}.library-feature{display:grid;grid-template-columns:43% 57%;align-items:center;gap:50px;padding:15px 50px 15px 0}.library-art{min-height:460px;border-radius:44px;background:#eaf1fc;position:relative;display:grid;place-items:center}.library-img-wrap{width:58%;height:385px;transform:rotate(-9deg);border:10px solid #fff;border-radius:18px;overflow:hidden;box-shadow:0 28px 45px #1b4d7040;transition:transform .3s}.library-img-wrap:hover{transform:rotate(-3deg)}.library-img-wrap img{width:100%;height:100%;object-fit:cover}.library-blob{position:absolute;font-size:45px;z-index:2}.blob-one{color:#ffcc5c;right:9%;top:14%}.blob-two{color:#fa7d84;left:10%;bottom:10%}.library-copy{padding-right:30px}.library-copy h2 span{color:#20a67f}.library-copy>p{font-size:16px;line-height:1.9;color:#667c88;margin:20px 0}.library-points{display:grid;gap:12px;margin-bottom:31px;font-size:14px;color:#4d6876;font-weight:900}.library-points span{display:block}
/* footer cta */
.cta-section{background:#fff;padding-top:0}.cta-surface{text-align:center;background:linear-gradient(130deg,#193f5a,#136050 95%);border-radius:35px;padding:64px 20px 70px;position:relative;color:#fff;overflow:hidden}.cta-surface:before,.cta-surface:after{content:'';position:absolute;border-radius:50%;border:2px dashed #ffffff25;width:350px;height:350px;left:-150px;bottom:-210px}.cta-surface:after{left:auto;right:-140px;top:-220px}.cta-surface h2{font-size:clamp(31px,4.5vw,54px)}.cta-surface h2 span{color:#ffdc75}.cta-surface p{max-width:600px;margin:0 auto 29px;color:#e1f3ee;line-height:1.8}.cta-surface .section-kicker{color:#a8f3d3}.cta-decoration{position:absolute;font-size:70px;top:38%;opacity:.8}.deco-l{left:12%}.deco-r{right:11%}.footer{background:#f4f9f6;padding:50px 0 18px;border-top:1px solid #e7f1e9}.footer-main{display:grid;grid-template-columns:1.8fr 1fr 1fr;gap:35px;padding-bottom:30px}.footer-brand>p{line-height:1.8;color:#6c858c;max-width:370px;font-size:13px}.footer-links{display:flex;flex-direction:column;gap:13px;color:#63808a;font-size:13px}.footer-links strong{font-size:15px;color:var(--navy);margin-bottom:8px}.footer-links a:hover{color:var(--teal)}.footer-bottom{border-top:1px solid #dfebe5;padding-top:20px;display:flex;justify-content:space-between;gap:15px;color:#78939a;font-size:12px}
/* Modal */
.overlay{position:fixed;inset:0;z-index:500;background:rgba(13,43,56,.62);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px;overflow-y:auto}.modal{position:relative;background:#fff;border-radius:31px;width:min(100%,530px);box-shadow:0 34px 110px #0d273750;padding:32px 38px 35px;max-height:min(92vh,840px);overflow-y:auto;animation:modalIn .25s ease}.modal-close{position:absolute;top:17px;right:18px;width:38px;height:38px;background:#f0f5f4;border:0;border-radius:50%;color:#31556b;font-size:16px}.modal-header{text-align:center;margin-bottom:22px}.modal-icon{font-size:41px;width:72px;height:72px;border-radius:24px;display:grid;place-items:center;margin:0 auto 14px;background:#eaf9ef}.modal-overline{font-size:10px;font-weight:1000;color:#1c997d;letter-spacing:1.2px}.modal-header h2{font-size:29px;margin:9px 0 4px;letter-spacing:-.5px}.modal-header p{font-size:13px;color:#71818a;margin:0}.auth-tabs{display:flex;padding:5px;background:#f1f5f6;border-radius:15px;margin:12px 0 23px;gap:4px}.auth-tab{flex:1;border:0;background:none;border-radius:11px;padding:12px 8px;color:#71818a;font-weight:950}.auth-tab.active{background:#fff;color:#179570;box-shadow:0 2px 9px #0000000c}.auth-form{display:flex;flex-direction:column;gap:9px}.auth-form label{font-size:13px;font-weight:950;color:#2d5365;margin-top:5px}.auth-form label small{font-weight:700;color:#81929b}.field-wrapper{position:relative}.field-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:18px;line-height:1}.field-wrapper input{width:100%;border:1.5px solid #dbe6ea;outline:none;border-radius:14px;background:#fbfdfd;color:#153448;padding:14px 46px 14px 45px;font-size:14px;transition:.2s}.field-wrapper input:focus{border-color:#29b991;background:#fff;box-shadow:0 0 0 4px #3ecb9c19}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:transparent;font-size:17px;padding:6px}.auth-submit{margin-top:17px;width:100%;padding:17px;box-shadow:0 6px 0 #138c6b}.auth-note{text-align:center;font-size:12px;color:#8a9aa0;line-height:1.6;margin:14px 0 0}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:11px}.field-row>div{display:flex;flex-direction:column;gap:9px}.form-message{background:#fff2ed;border:1px solid #ffd6ca;color:#ab4738;padding:11px 13px;border-radius:13px;font-size:13px;font-weight:800;margin-top:15px}.form-message.success{background:#e8fff3;color:#168864;border-color:#b7efd4}.profile-modal{width:min(100%,470px)}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.avatar-option{border:2px solid #edf1ed;background:#fafcfb;border-radius:18px;height:63px;font-size:31px;transition:.15s}.avatar-option.selected{border-color:#20b18a;background:#e6f9ef;transform:scale(1.08)}
/* Player */
.player{position:fixed;inset:0;z-index:400;background:#e6f4fa;display:flex;flex-direction:column}.player-bar{background:#fff;min-height:68px;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:10px;padding:10px 24px;border-bottom:1px solid #e0e9ee;box-shadow:0 4px 14px #284e6b0f;z-index:3}.player-back,.player-actions button{border:0;background:#f1f7f8;color:#254d65;border-radius:13px;padding:11px 13px;font-size:13px;font-weight:950}.player-back{justify-self:start}.player-back:hover,.player-actions button:hover{background:#e3f3ef}.player-middle{display:flex;gap:10px;align-items:center;justify-content:center;font-size:17px}.player-middle span{font-size:27px}.player-actions{display:flex;justify-content:flex-end;gap:7px}.player-actions .complete-btn{color:#fff;background:#22a97f}.player-actions .complete-btn:hover{background:#158963}.player-actions .complete-btn.done{background:#e9f8f0;color:#17845d}.player iframe{width:100%;border:0;flex:1;background:#fff;min-height:0}.player-loading{position:absolute;inset:68px 0 0;background:#f1faf6;z-index:2;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;color:#2e765e;font-weight:900}.spinner{width:43px;height:43px;border:5px solid #b8e8d6;border-top-color:#1d9d78;border-radius:50%;animation:spin .7s linear infinite}
/* Celebration */
.celebration{position:fixed;inset:0;z-index:600;display:grid;place-items:center;background:#133852ae;backdrop-filter:blur(7px);padding:20px}.celebrate-card{position:relative;z-index:2;background:#fff;width:min(100%,500px);text-align:center;border-radius:36px;padding:41px 30px 44px;box-shadow:0 34px 75px #09233752;animation:modalIn .4s ease}.celebrate-medal{font-size:98px;animation:floatTwo 3s ease-in-out infinite}.celebrate-card h2{font-size:45px;margin:10px 0}.celebrate-card p{color:#607a88;line-height:1.8}.award-stars{font-size:45px;margin:13px 0 27px}.confetti-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti{position:absolute;top:-30px;width:12px;height:18px;border-radius:3px;animation:confetti 2.9s linear forwards}.toast{visibility:hidden;position:fixed;bottom:27px;left:50%;z-index:700;transform:translate(-50%,120px);padding:15px 20px;border-radius:16px;background:#203e50;color:#fff;font-weight:900;box-shadow:0 15px 45px #0002;max-width:90vw;text-align:center;transition:transform .35s}.toast.show{visibility:visible;transform:translate(-50%,0)}
@keyframes floatOne{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-13px) rotate(-3deg)}}@keyframes floatTwo{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-13px) rotate(7deg)}}@keyframes twinkle{0%,100%{opacity:.75;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes modalIn{from{opacity:0;transform:translateY(28px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes confetti{to{transform:translateY(110vh) rotate(700deg);opacity:0}}
@media(max-width:1150px){.nav-links{gap:0}.nav-link{font-size:12px;padding:10px 9px}.brand-type strong{font-size:17px}.brand-type strong span{font-size:12px}.hero-grid{grid-template-columns:53% 47%}.central-frame{height:320px}.hero-art{min-height:560px}.hero h1{font-size:clamp(42px,5.2vw,63px)}.subject-body h3{font-size:21px}}
@media(max-width:930px){.nav-links,.nav-actions{display:none}.mobile-toggle{display:flex;margin-left:auto}.mobile-menu{display:none;flex-direction:column;gap:4px;background:#fff;padding:16px 26px 23px;box-shadow:0 18px 26px #00000012}.mobile-menu.open{display:flex}.mobile-menu>a{font-weight:950;padding:11px 14px;border-radius:12px;background:#f5faf9}.mobile-auth{display:flex;gap:9px;margin-top:8px}.hero{padding-top:35px}.hero-grid{grid-template-columns:1fr;min-height:auto}.hero-copy{text-align:center;padding:20px 0 2px}.hero h1{max-width:740px;margin-left:auto;margin-right:auto}.hero-description{margin-left:auto;margin-right:auto;max-width:630px}.hero-cta,.hero-proof{justify-content:center}.hero-art{min-height:510px;max-width:650px;margin:auto}.central-frame{top:15%;height:350px}.secondary-frame{width:42%;bottom:4%}.mini-ribbon{flex-wrap:wrap;justify-content:center;column-gap:28px}.mini-ribbon i{display:none}.subject-grid{grid-template-columns:repeat(2,1fr)}.library-feature{grid-template-columns:1fr 1.1fr;gap:35px;padding:5px}.library-art{min-height:380px}.library-img-wrap{height:320px;width:66%}.cta-decoration{opacity:.3}.footer-main{grid-template-columns:1.4fr 1fr}.footer-main .footer-links:last-child{grid-column:2}.steps-grid{gap:4px;grid-template-columns:1fr 24px 1fr 24px 1fr}.step-connector{font-size:22px}}
@media(max-width:640px){.container{padding:0 17px}.section-pad{padding:62px 0}.site-header{height:72px}.brand-mark{width:45px;height:45px;font-size:30px;border-radius:14px}.brand-type strong{font-size:16px}.brand-type strong span{font-size:10px;letter-spacing:2px}.brand-type small{font-size:9px}.hero h1{font-size:42px;letter-spacing:-2px}.hero-description{font-size:15px;line-height:1.75}.hero-cta{gap:13px}.hero-cta .btn{width:100%;max-width:340px}.hero-proof{margin-top:25px}.hero-art{min-height:325px;margin-top:22px}.central-frame{height:235px;border-radius:22px;border-width:6px;top:13%;width:90%;left:5%}.secondary-frame{height:135px;border-width:5px;border-radius:15px;right:0;bottom:0}.floating-tag{padding:8px;font-size:9px;border-radius:11px}.floating-tag span{font-size:16px}.tag-top{top:3%}.tag-bottom{bottom:3%}.hero-star.star-one{font-size:36px}.hero-star.star-two{font-size:26px}.mini-ribbon{font-size:11px;gap:16px;padding:17px}.section-heading{margin-bottom:28px}.section-heading h2,.how-heading h2,.library-copy h2{font-size:35px}.section-doodle{display:none}.subject-grid{grid-template-columns:1fr;gap:20px}.subject-image{height:210px}.subject-body{padding:20px}.subject-body p{min-height:auto}.special-card{min-height:310px}.steps-grid{grid-template-columns:1fr;max-width:390px;margin:auto;gap:10px}.step-connector{transform:rotate(90deg)}.step-card{min-height:210px;padding:23px 16px}.step-illustration{width:86px;height:86px;font-size:46px;margin-bottom:6px}.library-feature{grid-template-columns:1fr;padding:0;gap:35px}.library-art{min-height:330px}.library-img-wrap{height:285px;max-width:225px}.library-copy{padding:0}.cta-surface{padding:52px 22px}.cta-surface h2{font-size:33px}.cta-surface .btn{white-space:normal}.footer-main{grid-template-columns:1fr 1fr;gap:20px}.footer-brand{grid-column:1/-1}.footer-main .footer-links:last-child{grid-column:auto}.footer-bottom{flex-direction:column;text-align:center}.dash-surface{padding:24px 16px}.dash-avatar{height:70px;width:70px;font-size:35px;border-radius:20px}.dash-welcome{flex-wrap:wrap;gap:10px}.dash-heading h2{font-size:23px}.dash-edit{width:100%}.dash-stats{grid-template-columns:1fr 1fr;gap:8px}.progress-stat{grid-column:1/-1}.stat-box{padding:12px 9px;gap:8px}.stat-box strong{font-size:20px}.stat-icon{width:40px;height:40px;font-size:20px}.dash-actions{flex-wrap:wrap}.modal{padding:25px 19px;max-height:94dvh;border-radius:25px}.field-row{grid-template-columns:1fr;gap:9px}.player-bar{grid-template-columns:1fr auto;padding:8px 10px;min-height:58px}.player-middle{grid-column:1/-1;grid-row:2;font-size:13px;justify-content:center;padding-bottom:3px}.player-back{font-size:12px;padding:9px}.player-actions{grid-column:2;grid-row:1}.player-actions button{font-size:12px;padding:8px}.desktop-label{display:none}.player-actions .complete-btn span{font-size:11px}.player-loading{top:96px}.celebrate-card h2{font-size:37px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}


/* SERDEC official logo patch */
.brand-mark--image{background:#fff;overflow:hidden;padding:0;box-shadow:0 8px 18px rgba(22,84,86,.12);border:1px solid rgba(0,0,0,.04)}
.brand-mark--image img{width:100%;height:100%;object-fit:contain;display:block;border-radius:inherit}
.brand-mark--image .brand-spark{display:none}
.modal-icon--logo{background:#fff;border:1px solid #e8efee;overflow:hidden;padding:6px}
.modal-icon--logo img{width:100%;height:100%;object-fit:contain;display:block}