body{margin:0;padding:0;display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#667eea;background-image:linear-gradient(135deg,#667eea,#764ba2);font-family:Arial,sans-serif;overflow:hidden;overscroll-behavior:none;-webkit-overflow-scrolling:touch;position:fixed;width:100%;height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:pan-x pan-y}html{overscroll-behavior:none;overflow:hidden;position:fixed;width:100%;height:100%;background-color:#667eea;background-image:linear-gradient(135deg,#667eea,#764ba2);-webkit-text-size-adjust:100%;text-size-adjust:100%}#container{box-shadow:0 10px 40px #0000004d;border-radius:20px;background:#fff}.success-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:72px;opacity:0;pointer-events:none;z-index:1000}.start-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:2000;cursor:pointer}.start-overlay.hidden{display:none}.start-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:48px;padding:40px 80px;border-radius:20px;box-shadow:0 10px 40px #00000080;font-weight:700;text-align:center;animation:pulse 2s infinite;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.theme-name{position:fixed;top:10px;left:50%;transform:translate(-50%);background:#ffffffe6;padding:8px 20px;border-radius:20px;font-size:16px;font-weight:700;color:#333;box-shadow:0 2px 8px #0000001a;z-index:1000;pointer-events:none;user-select:none;opacity:.8;transition:opacity .3s ease}.theme-name:hover{opacity:1}.hamburger-button{position:fixed;top:20px;right:20px;width:60px;height:60px;border-radius:50%;background:#0009;border:2px solid white;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3000;transition:all .2s ease;-webkit-tap-highlight-color:transparent;outline:none}.hamburger-button:hover{background:#000c;transform:scale(1.1)}.hamburger-button:active{transform:scale(.95)}.hamburger-button .material-icons{font-size:32px;user-select:none;-webkit-user-select:none}.hamburger-button.hidden{display:none}.dark-theme-button{position:fixed;top:90px;right:20px;width:60px;height:60px;border-radius:50%;background:#0009;border:2px solid white;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3000;transition:all .2s ease;-webkit-tap-highlight-color:transparent;outline:none}.dark-theme-button:hover{background:#000c;transform:scale(1.1)}.dark-theme-button:active{transform:scale(.95)}.dark-theme-button .material-icons{font-size:28px;user-select:none;-webkit-user-select:none}.dark-theme-button.hidden{display:none}body.dark-theme{background:linear-gradient(135deg,#1a1a2e,#16213e)}body.dark-theme #container{background:#2d3250;box-shadow:0 10px 40px #000c}body.dark-theme .theme-name{color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.8)}body.dark-theme .menu-dropdown{background:#1e1e28fa;border:2px solid rgba(255,255,255,.2)}body.dark-theme .menu-item{color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}body.dark-theme .menu-item:hover{background:#ffffff26}body.dark-theme .menu-label,body.dark-theme .menu-icon,body.dark-theme .menu-emoji{color:#fff}.menu-dropdown{position:fixed;top:90px;right:20px;background:#fffffff2;border-radius:15px;box-shadow:0 8px 32px #0000004d;z-index:2999;display:none;flex-direction:column;min-width:250px;overflow:hidden}.menu-dropdown.show{display:flex;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:flex;align-items:center;gap:15px;padding:15px 20px;background:transparent;border:none;border-bottom:1px solid rgba(0,0,0,.1);cursor:pointer;transition:background .2s;text-align:left;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}.menu-item:last-child{border-bottom:none}.menu-item:hover{background:#667eea1a}.menu-item:active{background:#667eea33}.menu-icon{font-size:24px;color:#333;user-select:none;-webkit-user-select:none}.menu-emoji{font-size:24px;user-select:none;-webkit-user-select:none}.menu-label{font-size:16px;font-weight:500;color:#333;flex:1}.menu-item.hidden{display:none!important}.menu-item.premium-only.hidden{display:none}.debug-buttons{position:fixed;bottom:20px;left:20px;display:flex;flex-direction:column;gap:10px;z-index:3000}.debug-btn{background:#ff8c00e6;color:#fff;border:2px solid rgba(255,255,255,.5);border-radius:8px;padding:10px 15px;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease;min-width:160px;text-align:left;-webkit-tap-highlight-color:transparent;outline:none}.debug-btn:hover{background:#ff8c00;transform:scale(1.05)}.debug-btn:active{transform:scale(.95)}.debug-error-display{position:fixed;bottom:10px;left:10px;right:10px;max-width:calc(100vw - 20px);max-height:40vh;overflow-y:auto;background:#ff0000f2;color:#fff;padding:15px;border-radius:8px;font-family:Courier New,monospace;font-size:14px;line-height:1.4;z-index:1000;display:none;box-shadow:0 4px 12px #00000080;-webkit-overflow-scrolling:touch}.debug-error-display.visible{display:block}.debug-error-display .error-item{padding:10px;margin:5px 0;background:#0000004d;border-radius:4px;word-break:break-word;white-space:pre-wrap;border-left:3px solid rgba(255,255,255,.5)}.page{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;align-items:center;z-index:1500;pointer-events:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.page.hidden{display:none}.page-inner{background:#fff;border-radius:20px;padding:40px;max-width:800px;width:90%;margin:40px auto;box-shadow:0 10px 40px #0000004d}.page-inner h2{margin-top:0;color:#667eea;font-size:36px;text-align:center;margin-bottom:30px}.faq-item{margin:30px 0;padding:20px;background:#f8f9fa;border-radius:12px;border-left:4px solid #667eea}.faq-item h3{color:#333;font-size:22px;margin-bottom:15px;margin-top:0}.faq-item p{color:#666;font-size:18px;line-height:1.8;margin:0}.page-back-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;padding:15px 40px;font-size:20px;font-weight:700;cursor:pointer;margin-top:30px;display:block;margin-left:auto;margin-right:auto;transition:transform .2s;-webkit-tap-highlight-color:transparent;box-shadow:0 4px 15px #667eea66}.page-back-btn:hover{transform:scale(1.05);box-shadow:0 6px 20px #667eea99}.page-back-btn:active{transform:scale(.95)}.premium-badge{position:fixed;top:20px;left:20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:10px 20px;border-radius:25px;font-size:16px;font-weight:700;box-shadow:0 4px 12px #667eea66;z-index:1000;display:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.premium-badge.show{display:block}.unlock-button{position:fixed;bottom:30px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:15px 30px;border:none;border-radius:30px;font-size:18px;font-weight:700;cursor:pointer;box-shadow:0 4px 20px #667eea80;z-index:1000;display:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:transform .2s,box-shadow .2s}.unlock-button.show{display:block}.unlock-button:hover{transform:translate(-50%) scale(1.05);box-shadow:0 6px 24px #667eea99}.unlock-button:active{transform:translate(-50%) scale(.98)}.lock-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:48px;color:#00000080;pointer-events:none}.unlock-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:2000;display:none;align-items:center;justify-content:center}.unlock-modal.show{display:flex}.unlock-modal-content{background:#fff;padding:40px;border-radius:20px;max-width:400px;width:90%;box-shadow:0 8px 32px #0000004d;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.unlock-modal h2{margin:0 0 20px;color:#333;font-size:24px;text-align:center}.unlock-modal p{margin:0 0 20px;color:#666;font-size:16px;text-align:center;line-height:1.5}.unlock-modal input{width:100%;padding:15px;border:2px solid #ddd;border-radius:10px;font-size:16px;text-align:center;text-transform:uppercase;letter-spacing:2px;margin-bottom:20px;box-sizing:border-box}.unlock-modal input:focus{outline:none;border-color:#667eea}.unlock-modal-buttons{display:flex;gap:10px}.unlock-modal button{flex:1;padding:15px;border:none;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer;transition:transform .2s}.unlock-modal button:active{transform:scale(.98)}.unlock-modal .submit-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.unlock-modal .cancel-button{background:#f0f0f0;color:#666}.unlock-modal .submit-button:hover{opacity:.9}.unlock-modal .cancel-button:hover{background:#e0e0e0}.restore-purchase{position:fixed;bottom:100px;left:50%;transform:translate(-50%);color:#667eea;font-size:14px;text-decoration:underline;cursor:pointer;z-index:1000;display:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.restore-purchase.show{display:block}.restore-purchase:hover{color:#764ba2}@media(max-width:768px){.premium-badge{top:10px;left:10px;padding:8px 16px;font-size:14px}.unlock-button{bottom:20px;padding:12px 24px;font-size:16px}.unlock-modal-content{padding:30px 20px}.unlock-modal h2{font-size:20px}.unlock-modal p{font-size:14px}.restore-purchase{bottom:80px;font-size:12px}}@keyframes slideUp{0%{transform:translate(-50%) translateY(100px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.unlock-button.show{animation:slideUp .5s ease-out}@keyframes pulse{0%,to{box-shadow:0 4px 20px #667eea80}50%{box-shadow:0 4px 30px #667eeacc}}.unlock-button{animation:pulse 2s infinite}body.dark-theme .premium-badge{background:linear-gradient(135deg,#3d5afe,#5e35b1);box-shadow:0 4px 12px #3d5afe80}body.dark-theme .unlock-button{background:linear-gradient(135deg,#3d5afe,#5e35b1);box-shadow:0 4px 20px #3d5afe99}body.dark-theme .unlock-button:hover{box-shadow:0 6px 24px #3d5afeb3}body.dark-theme #unlockPage{background:linear-gradient(135deg,#1a1a2e,#16213e)}body.dark-theme #unlockPage h1,body.dark-theme #unlockPage h2,body.dark-theme #unlockPage p,body.dark-theme #unlockPage li{color:#fff}body.dark-theme #faqPage{background:linear-gradient(135deg,#1a1a2e,#16213e)}body.dark-theme .faq-container h1,body.dark-theme .faq-container h2,body.dark-theme .faq-container p,body.dark-theme .faq-container li,body.dark-theme .faq-container a{color:#fff}body.dark-theme .faq-container a:hover{color:#90caf9}.story-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px;padding:20px;max-width:800px;margin:0 auto}.story-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;padding:15px;text-align:center;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 10px #0003}.story-card:hover{transform:translateY(-5px);box-shadow:0 6px 15px #0000004d}.story-thumbnail{width:100%;height:150px;object-fit:cover;border-radius:10px;margin-bottom:10px}.story-card h3{color:#fff;font-size:16px;margin:10px 0 5px;font-weight:600}.story-pages{display:block;color:#fffc;font-size:12px;margin-bottom:10px}.story-age{display:inline-block;color:gold;font-size:11px;font-weight:600;background:#ffd70026;padding:2px 8px;border-radius:8px;margin-bottom:4px}.story-price-container{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:10px}.story-price{color:gold;font-size:18px;font-weight:700}.buy-story-btn{background:#4caf50;color:#fff;border:none;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.buy-story-btn:hover{background:#45a049}.buy-story-btn:active{transform:scale(.95)}.purchased-badge{color:#4caf50;font-size:14px;font-weight:700;padding:5px 10px;background:#4caf5033;border-radius:10px;margin-top:5px;display:inline-block}.story-viewer{position:fixed;inset:0;width:100%;height:100%;max-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;flex-direction:column;overflow:hidden}#storyViewerPage.page{padding:0;margin:0;justify-content:flex-start;align-items:stretch;overflow:hidden}#storyViewerPage .story-viewer{width:100vw;height:100vh;max-width:100%;max-height:100%;margin:0;padding:0}.story-header{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box;padding:12px 16px;padding-top:calc(12px + constant(safe-area-inset-top));padding-top:calc(12px + env(safe-area-inset-top));background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1)}.story-back-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:10px;transition:opacity .2s}.story-back-btn:hover{opacity:.8}.story-title{color:#fff;font-size:20px;margin:0;flex:1;text-align:center}.story-progress{color:#ffffffe6;font-size:14px;font-weight:600;text-align:center;white-space:nowrap}.story-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:20px 16px;box-sizing:border-box;overflow:auto;min-height:0}.story-image{max-width:100%;max-height:50vh;width:auto;height:auto;object-fit:contain;border-radius:15px;box-shadow:0 10px 30px #00000080}.story-text-overlay{width:100%;box-sizing:border-box;background:#000c;border-radius:15px;padding:20px;margin-top:16px;backdrop-filter:blur(10px)}.story-text-overlay p{color:#fff;font-size:20px;text-align:center;margin:0;line-height:1.6;font-family:Arial,Comic Sans MS,cursive}.story-navigation{display:flex;justify-content:space-between;align-items:center;width:100%;box-sizing:border-box;padding:16px;padding-bottom:calc(16px + constant(safe-area-inset-bottom));padding-bottom:calc(16px + env(safe-area-inset-bottom));background:#0000004d;border-top:1px solid rgba(255,255,255,.1)}.story-nav-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:15px 30px;border-radius:25px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 10px #0000004d}.story-nav-btn:hover{transform:translateY(-2px);box-shadow:0 6px 15px #0006}.story-nav-btn:active{transform:translateY(0)}.story-nav-btn:disabled{opacity:.5;cursor:not-allowed}.story-nav-btn.prev{margin-right:auto}.story-nav-btn.next{margin-left:auto}@media(max-width:768px){.story-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px;padding:15px}.story-card{padding:10px}.story-card h3{font-size:14px}.story-thumbnail{height:120px}.story-title{font-size:16px}.story-header{padding:10px 12px;padding-top:calc(10px + constant(safe-area-inset-top));padding-top:calc(10px + env(safe-area-inset-top))}.story-text-overlay{padding:15px}.story-text-overlay p{font-size:16px}.story-nav-btn{padding:12px 20px;font-size:14px}.story-navigation{padding:12px;padding-bottom:calc(12px + constant(safe-area-inset-bottom));padding-bottom:calc(12px + env(safe-area-inset-bottom))}}@media(max-width:480px){.story-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:10px}.story-image{max-height:50vh}.story-text-overlay{padding:10px}.story-text-overlay p{font-size:14px}}@media(hover:none){.story-nav-btn{min-height:50px;min-width:100px}.buy-story-btn{min-height:44px;padding:10px 20px}}body.dark-theme #storyListPage.page{background:linear-gradient(135deg,#0a0a15,#0d1117)}body.dark-theme #storyListPage .page-inner{background:#1a1a2e;box-shadow:0 10px 40px #000c}body.dark-theme #storyListPage .page-inner h2{color:#667eea}body.dark-theme .story-grid{background:transparent}body.dark-theme .story-card{background:linear-gradient(135deg,#2d3561,#3d2c5c);box-shadow:0 4px 10px #000000b3}body.dark-theme .story-card:hover{box-shadow:0 6px 15px #000c}body.dark-theme .story-viewer{background:linear-gradient(135deg,#0a0a15,#0d1117)}body.dark-theme .story-header{background:#0009;border-bottom-color:#ffffff0d}body.dark-theme .story-navigation{background:#0009;border-top-color:#ffffff0d}body.dark-theme .story-text-overlay{background:#000000e6}
