*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{color:#fff;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:#0a1628;width:100%;min-height:100%;font-family:Fredoka,sans-serif}.hidden{display:none!important}#landing{background:linear-gradient(135deg,#0a1628 0%,#1a1a2e 50%,#16132b 100%);padding:0 20px 1px}.landing-header{text-align:center;max-width:700px;margin:0 auto;padding:60px 20px 40px}.logo{background:linear-gradient(135deg,#ffd93d,#ff6b6b,#4ecdc4,#45b7d1) 0 0/300% 300%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:clamp(48px,10vw,80px);font-weight:700;animation:4s infinite gradientShift}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}.tagline{color:#ffd93d;margin-top:8px;font-size:clamp(18px,4vw,28px);font-weight:600}.manage-header-link{color:#4ecdc4;opacity:.8;border-bottom:2px solid #0000;margin-top:10px;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.manage-header-link:hover{opacity:1;border-bottom-color:#4ecdc4}.manage-header-link.hidden{display:none}.subtitle{color:#fff9;margin-top:16px;font-size:clamp(14px,3vw,20px);line-height:1.5}.start-btn{color:#0a1628;cursor:pointer;background:linear-gradient(135deg,#ffd93d,#ff6b6b);border:none;border-radius:50px;margin-top:32px;padding:18px 48px;font-family:Fredoka,sans-serif;font-size:clamp(20px,4vw,28px);font-weight:700;transition:transform .2s,box-shadow .2s;display:inline-block;box-shadow:0 4px 20px #ffd93d66}.start-btn:hover{transform:scale(1.05);box-shadow:0 6px 30px #ffd93d99}.start-btn:active{transform:scale(.98)}.features,.how-it-works,.trust,.faq,.why-parents{max-width:900px;margin:0 auto;padding:40px 0}.features h2,.how-it-works h2,.trust h2,.faq h2,.why-parents h2{text-align:center;color:#ffd93d;margin-bottom:24px;font-size:clamp(24px,5vw,36px)}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;display:grid}.feature-card{text-align:center;cursor:pointer;background:#ffffff0d;border:1px dashed #ffffff26;border-radius:16px;padding:24px;transition:transform .2s,border-color .2s}.feature-card:hover{border-color:#4ecdc480;transform:translateY(-4px)}.feature-icon{justify-content:center;align-items:center;margin-bottom:12px;display:flex}.feature-icon svg{stroke:#ffd93d;stroke-width:1.5px;width:40px;height:40px}.feature-card h3{color:#4ecdc4;margin-bottom:8px;font-size:20px}.feature-card p{color:#fff9;font-size:14px;line-height:1.4}.feature-card-parent{background:#ffd73d14;border:1px dashed #ffd73d4d}.feature-card-parent h3{color:#ffd93d}.feature-card-parent p{color:#fffb}.feature-card-parent strong{color:#ffd93d}.why-parents h2{text-align:left}.why-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.info-left .why-grid{grid-template-columns:1fr}.why-item{background:#ffffff0d;border:1px solid #ffffff14;border-radius:12px;padding:14px 16px}.why-item strong{color:#fffd;align-items:center;gap:8px;margin-bottom:4px;font-size:14px;display:flex}.why-item strong svg{stroke:#4ecdc4;stroke-width:2px;flex-shrink:0;width:16px;height:16px}.why-item p{color:#fff7;margin:0;padding-left:24px;font-size:12px;line-height:1.3}@media (width<=500px){.why-grid{grid-template-columns:1fr}}details{background:#ffffff0d;border:1px solid #ffffff14;border-radius:12px;margin-bottom:12px;overflow:hidden}summary{cursor:pointer;color:#4ecdc4;padding:16px 44px 16px 20px;font-size:16px;font-weight:600;list-style:none;position:relative}summary::-webkit-details-marker{display:none}summary:after{content:"";border-bottom:2px solid #ffd93d;border-right:2px solid #ffd93d;width:8px;height:8px;transition:transform .2s;position:absolute;top:50%;right:18px;transform:translateY(-60%)rotate(45deg)}details[open] summary:after{transform:translateY(-30%)rotate(-135deg)}details p{color:#fff9;padding:0 20px 16px;font-size:14px;line-height:1.6}.faq-link{color:#ffd93d;text-underline-offset:2px;text-decoration:underline}.faq-link:hover{color:#ffe873}.info-split{max-width:1100px;margin:0 auto;padding:40px 0}@media (width>=768px){.info-split{grid-template-columns:1fr 1fr;align-items:start;gap:40px;display:grid}}.info-left .how-it-works,.info-left .trust,.info-left .why-parents,.info-right .faq{max-width:none;padding:0 0 32px}.landing-footer{text-align:center;color:#fff4;padding:40px 0;font-size:14px}.support-text{color:#fffa;margin-bottom:12px;font-size:16px;font-weight:600}.bmc-badge{margin-bottom:16px;display:inline-block}.bmc-badge img{border-radius:8px;height:40px;transition:transform .2s}.bmc-badge img:hover{transform:scale(1.05)}#playground{background:#0a1628;width:100%;height:100%;position:fixed;inset:0}#canvas{width:100%;height:100%;display:block}#display-layer{pointer-events:none;position:absolute;inset:0}.mode-flash{z-index:900;color:#ffd93d;text-shadow:0 0 60px #ffd93dcc,0 0 120px #ffd93d66,0 4px 20px #000000b3;pointer-events:none;opacity:0;background:#0009;justify-content:center;align-items:center;font-family:Fredoka,sans-serif;font-size:clamp(40px,10vw,90px);font-weight:700;transition:opacity .5s;display:flex;position:fixed;inset:0}.mode-flash.active{opacity:1}.mode-flash.hidden{display:none}#parent-panel{z-index:1000;background:#000000b3;justify-content:flex-start;align-items:flex-start;display:flex;position:fixed;inset:0}#parent-panel.hidden{display:none!important}.panel-content{background:#1a1a2e;border-right:2px solid #ffffff1a;flex-direction:column;width:320px;max-width:90vw;height:100vh;display:flex;position:relative}.panel-header{z-index:2;background:#1a1a2e;border-bottom:1px solid #ffffff1a;flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 24px 16px;display:flex;position:sticky;top:0}.panel-header h2{color:#ffd93d;margin:0;font-size:24px}.panel-body{flex:1;padding:20px 24px;overflow-y:auto}.panel-footer{z-index:2;background:#1a1a2e;border-top:1px solid #ffffff1a;flex-shrink:0;padding:16px 24px;position:sticky;bottom:0}.panel-close{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:28px;display:flex}.panel-close:hover{background:#ffffff1a}.panel-btn-close{color:#0a1628;background:#4ecdc4;border-color:#4ecdc4;font-weight:600}.panel-btn-close:hover{background:#3dbdb5}.setting-group{border-bottom:1px solid #ffffff14;margin-bottom:20px;padding-bottom:16px}.setting-group h3{color:#4ecdc4;margin-bottom:12px;font-size:16px}.setting-group label{color:#fffc;cursor:pointer;margin-bottom:10px;font-size:14px;display:block}.setting-group input[type=checkbox]{accent-color:#4ecdc4;margin-right:8px}.setting-group select{color:#fff;background:#0a1628;border:1px solid #fff3;border-radius:6px;margin-left:8px;padding:4px 8px;font-family:Fredoka,sans-serif;font-size:13px}.mode-selector{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.mode-group-label{color:#fff6;text-transform:uppercase;letter-spacing:1px;width:100%;margin-top:4px;font-size:11px}.mode-btn{color:#fffc;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff26;border-radius:8px;padding:8px 14px;font-family:Fredoka,sans-serif;font-size:14px;transition:all .15s}.mode-btn:hover{background:#ffffff1a}.mode-btn.active{color:#0a1628;background:#4ecdc4;border-color:#4ecdc4;font-weight:600}.panel-btn{color:#fffc;cursor:pointer;background:#ffffff14;border:1px solid #ffffff26;border-radius:8px;width:100%;margin-top:8px;padding:10px;font-family:Fredoka,sans-serif;font-size:14px;transition:background .15s;display:block}.panel-btn:hover{background:#ffffff26}body.night-mode #playground{filter:brightness(.7)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}.paywall-overlay{z-index:2000;background:#000000d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0;overflow-y:auto}.paywall-overlay.hidden{display:none}.paywall-card{text-align:center;background:#0f1b2e;border:1px dashed #ffffff26;border-radius:20px;width:100%;max-width:420px;padding:36px 32px;position:relative}.paywall-close{color:#fff6;cursor:pointer;background:0 0;border:none;font-size:24px;position:absolute;top:12px;right:16px}.paywall-close:hover{color:#fff}.paywall-card h2{color:#ffd93d;margin-bottom:4px;font-size:22px}.paywall-modes{color:#4ecdc4;margin-bottom:24px;font-size:14px}.paywall-price{color:#fffc;margin-bottom:20px;font-size:16px}.paywall-price strong{color:#4ecdc4;font-size:22px}.paywall-form{flex-direction:column;gap:10px;display:flex}.paywall-form input,.paywall-existing input{color:#fff;background:#ffffff14;border:1px solid #ffffff1f;border-radius:10px;outline:none;padding:12px 16px;font-family:Fredoka,sans-serif;font-size:15px}.paywall-form input:focus,.paywall-existing input:focus{border-color:#4ecdc4}.paywall-form input::placeholder,.paywall-existing input::placeholder{color:#fff4}.paywall-btn-primary{color:#0a1628;cursor:pointer;background:linear-gradient(135deg,#ffd93d,#ff6b6b);border:none;border-radius:10px;padding:14px;font-family:Fredoka,sans-serif;font-size:16px;font-weight:700;transition:transform .2s}.paywall-btn-primary:hover{transform:scale(1.02)}.paywall-btn-secondary{color:#4ecdc4;cursor:pointer;background:#4ecdc426;border:1px solid #4ecdc44d;border-radius:10px;width:100%;padding:12px;font-family:Fredoka,sans-serif;font-size:14px;font-weight:600;transition:background .2s}.paywall-btn-secondary:hover{background:#4ecdc440}.paywall-btn-outline{color:#fffc;cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:10px;width:100%;padding:10px 16px;font-family:Fredoka,sans-serif;font-size:13px;transition:border-color .2s}.paywall-btn-outline:hover{color:#4ecdc4;border-color:#4ecdc4}.paywall-divider{color:#fff4;align-items:center;gap:12px;margin:18px 0;font-size:12px;display:flex}.paywall-divider:before,.paywall-divider:after{content:"";background:#ffffff1a;flex:1;height:1px}.paywall-note{color:#fff5;margin-top:10px;font-size:12px}.paywall-existing{flex-direction:column;gap:10px;display:flex}.paywall-key-entry{flex-direction:column;gap:8px;display:flex}.paywall-message{text-align:center;border-radius:10px;margin-top:16px;padding:12px;font-size:13px}.paywall-message.hidden{display:none}.paywall-message-error{color:#ff6b6b;background:#ff6b6b26}.paywall-message-success{color:#4ecdc4;background:#4ecdc426}.paywall-message-info{color:#ffd93d;background:#ffd93d26}.pro-lock{vertical-align:middle;color:#ffffff73;width:16px;height:16px;margin-left:6px;display:inline-block}.is-playing #bmc-wbtn,.is-playing #landing-footer,.is-playing .manage-header-link{display:none!important}.payment-toast{z-index:3000;border-radius:12px;align-items:center;gap:12px;width:calc(100% - 40px);max-width:440px;padding:14px 20px;font-family:Fredoka,sans-serif;font-size:14px;font-weight:600;animation:.3s toastSlide;display:flex;position:fixed;top:20px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0006}@keyframes toastSlide{0%{opacity:0;transform:translate(-50%)translateY(-20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.payment-toast p{flex:1;margin:0;line-height:1.4}.payment-toast button{color:inherit;cursor:pointer;opacity:.6;background:0 0;border:none;padding:0 4px;font-size:18px}.payment-toast button:hover{opacity:1}.payment-toast-success{color:#4ecdc4;background:#4ecdc426;border:1px solid #4ecdc44d}.payment-toast-info{color:#ffd93d;background:#ffd93d26;border:1px solid #ffd93d4d}.payment-toast-error{color:#ff6b6b;background:#ff6b6b26;border:1px solid #ff6b6b4d}