:root{--brand-900:#0b2f33;--brand-700:#0f4d52;--brand-500:#1aa3a3;--brand-200:#cfeeed;--surface-0:#fff;--surface-1:#f6fbfb;--surface-2:#ecf6f6;--text-900:#122023;--text-700:#31464a;--accent:#1f7a8c;--accent-strong:#145c69;--shadow-md:0 10px 30px #1220231f;--shadow-sm:0 6px 16px #1220231a}.hero{text-align:center;color:var(--brand-900);background:radial-gradient(1200px 500px at 50% -150px,#bff3f1 0%,#6fd6d2 45%,#2f9aa0 100%);padding:64px 20px}.hero h1{max-width:900px;margin:0 auto 12px;font-size:2.4rem;line-height:1.25}.hero p{color:var(--text-700);max-width:900px;margin:0 auto;font-size:1.1rem}.game-section{text-align:center;background:var(--surface-1);padding:32px 20px 40px}.game-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:1100px;margin:0 auto;display:grid}.home-card{background:var(--surface-0);box-shadow:var(--shadow-sm);text-align:left;color:var(--text-900);cursor:pointer;border:1px solid #1aa3a326;border-radius:14px;padding:22px;transition:transform .2s,box-shadow .2s,border-color .2s}.home-card:hover{box-shadow:var(--shadow-md);border-color:#1aa3a359;transform:translateY(-4px)}.home-card h3{color:var(--accent-strong);margin-bottom:8px;font-size:1.3rem}.home-card p{color:var(--text-700);line-height:1.5}.blog-section{text-align:center;background:var(--surface-2);max-width:1100px;box-shadow:var(--shadow-sm);border-radius:16px;margin:24px auto 0;padding:24px 16px}.blog-list{flex-direction:column;gap:10px;margin-top:12px;display:flex}.blog-link{color:var(--accent);font-size:1.1rem;font-weight:600;text-decoration:none}.blog-link:hover{color:var(--accent-strong);text-decoration:underline}#suggestion{text-align:center;background:var(--brand-700);color:#fff;margin:24px 0 0;padding:16px}#suggestion button{color:var(--brand-700);cursor:pointer;background-color:#fff;border:none;border-radius:10px;padding:10px 16px;font-weight:600;transition:transform .15s,box-shadow .15s}#suggestion button:hover{box-shadow:var(--shadow-sm);transform:translateY(-2px)}.app-promo-container{background:linear-gradient(180deg,var(--surface-1)0%,#e7f7f6 100%);justify-content:center;padding:60px 20px;display:flex}.app-promo-card{background:linear-gradient(135deg,#0f4d52 0%,#1aa3a3 100%);border-radius:28px;width:100%;max-width:1000px;padding:48px;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000059}.app-promo-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:40px;display:flex}.app-promo-text{text-align:left;color:#fff;flex:1;min-width:300px}.promo-badge{text-transform:uppercase;letter-spacing:1px;background:#fff3;border-radius:100px;margin-bottom:20px;padding:6px 16px;font-size:.8rem;font-weight:600;display:inline-block}.app-promo-text h2{margin-bottom:15px;font-size:2.8rem;font-weight:800;line-height:1.2}.app-promo-text p{opacity:.9;margin-bottom:28px;font-size:1.1rem;line-height:1.6}.play-store-link img{height:64px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.play-store-link:hover img{transform:scale(1.08)}.app-promo-visual{perspective:1000px;flex:.8;justify-content:center;display:flex}.phone-mockup{background:#1a1a1a;border:12px solid #333;border-radius:40px;width:220px;height:440px;position:relative;transform:rotateY(-15deg)rotateX(5deg);box-shadow:20px 20px 60px #0006}.phone-inner{background:#f8f9fa;border-radius:28px;flex-direction:column;align-items:center;width:100%;height:100%;padding:40px 20px;display:flex;overflow:hidden}.app-logo-circle{border-radius:20px;width:80px;height:80px;margin-bottom:30px;overflow:hidden;box-shadow:0 10px 20px #0000001a}.app-logo-circle img{object-fit:cover;width:100%;height:100%}.skeleton-ui{width:100%}.skeleton-line{background:#e0e0e0;border-radius:6px;height:12px;margin-bottom:15px}.skeleton-line.short{width:60%}.skeleton-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;display:grid}.skeleton-grid span{background:#eee;border-radius:10px;height:60px}.popup-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#000c;justify-content:center;align-items:center;width:100%;height:100%;animation:.4s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.app-popup{text-align:center;background:#fff;border-radius:24px;width:90%;max-width:420px;padding:36px 28px;animation:.5s cubic-bezier(.175,.885,.32,1.275) slideUp;position:relative;box-shadow:0 20px 40px #0000004d}.close-popup{color:#999;cursor:pointer;background:0 0;border:none;font-size:24px;transition:color .2s;position:absolute;top:15px;right:20px}.close-popup:hover{color:#333}.popup-icon{border-radius:18px;width:80px;height:80px;margin:0 auto 20px;overflow:hidden;box-shadow:0 10px 20px #0000001a}.popup-icon img{object-fit:cover;width:100%;height:100%}.app-popup h3{color:#333;margin-bottom:12px;font-size:1.5rem;line-height:1.3}.app-popup p{color:#666;margin-bottom:25px;font-size:1rem}.popup-download-btn img{height:55px;transition:transform .2s}.popup-download-btn:hover img{transform:scale(1.05)}.maybe-later{color:#888;cursor:pointer;background:0 0;border:none;margin:20px auto 0;font-size:.9rem;text-decoration:underline;display:block}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.app-promo-text{text-align:center}.app-promo-content{justify-content:center}.app-promo-visual{display:none}.app-promo-text h2{font-size:2rem}}
