/*
Theme Name: Yono Rummy App Store
Theme URI: https://yonorummyappstore.com/
Author: Yono Rummy App Store
Description: Responsive green and white gaming application information theme.
Version: 1.0
*/

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;background:#ffffff;color:#151515;line-height:1.5}
a{text-decoration:none;color:inherit}
button,input{font-family:inherit}
.container{width:94%;max-width:1120px;margin:auto}
.header{position:sticky;top:0;z-index:99999;background:#fff;border-bottom:1px solid #e4e9e6;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:51px;height:51px;object-fit:cover;border-radius:12px;border:1px solid #d6ded9}
.brand-text{color:#101010;font-size:18px;font-weight:900;line-height:1.05}
.brand-text small{display:block;color:#25834b;font-size:8px;letter-spacing:2px;margin-top:4px}
.menu-btn{width:43px;height:43px;border:1px solid #dce4df;border-radius:9px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.menu-btn span{width:21px;height:3px;border-radius:5px;background:#159447;transition:.3s}
.menu-btn.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-menu{display:none;width:94%;max-width:1120px;margin:0 auto 10px;padding:7px;background:#fff;border:1px solid #dce5df;border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.12)}
.mobile-menu.active{display:block}
.mobile-menu a{display:flex;padding:12px 14px;margin:2px 0;border-radius:8px;color:#222;font-size:13px;font-weight:700}
.mobile-menu a:hover{background:#edf8f1;color:#148743}
.hero{padding:34px 0 30px;background:#ffffff;border-bottom:1px solid #e5ebe7}
.hero-content{text-align:center}
.hero-logo{width:82px;height:82px;object-fit:cover;border-radius:18px;border:1px solid #cbd8d0;margin-bottom:10px}
.hero h1{font-size:clamp(28px,5vw,44px);line-height:1.1;color:#101010;font-weight:900}
.hero h1 span{color:#178c48}
.hero p{max-width:650px;margin:10px auto 20px;color:#5c665f;font-size:14px}
.search-box{max-width:650px;margin:auto;display:flex;padding:4px;background:#fff;border:2px solid #278b4d;border-radius:12px}
.search-box input{width:100%;border:0;outline:0;padding:12px 15px;background:#fff;color:#111;font-size:13px;border-radius:10px}
.search-box button{border:0;padding:0 20px;border-radius:9px;background:#198b48;color:#fff;font-size:11px;font-weight:900;cursor:pointer}
.tabs{padding:12px 0;background:#fff;border-bottom:1px solid #e5ebe7}
.tab-list{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.tab{text-align:center;padding:10px 5px;border-radius:8px;border:1px solid #dce5df;background:#fff;color:#252525;font-size:11px;font-weight:800}
.tab.active{background:#198b48;border-color:#198b48;color:#fff}
.quick-actions{padding:10px 0 5px;background:#fff}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.quick-btn{padding:10px;text-align:center;border-radius:9px;font-size:12px;font-weight:900;border:1px solid #d4e3da}
.home-action{background:#f7f7f7;color:#176c3b}
.telegram-action{background:#16749c;color:#fff;border-color:#16749c}
.section{padding:32px 0;background:#ffffff}
.section-title{margin-bottom:18px}
.section-title h2{position:relative;padding-left:12px;color:#111;font-size:23px;font-weight:900}
.section-title h2:before{content:"";position:absolute;left:0;top:3px;width:4px;height:24px;border-radius:5px;background:#19904b}
.section-title p{margin-top:4px;color:#68736c;font-size:12px}
.app-wrapper,.latest-post{max-width:900px;margin:auto}
.app-card{background:#fff;border:1px solid #dce5df;border-radius:15px;padding:18px;box-shadow:0 4px 15px rgba(0,0,0,.06);transition:.25s}
.app-card:hover{border-color:#2a9554;box-shadow:0 8px 24px rgba(0,0,0,.1)}
.app-top{display:flex;align-items:center;gap:13px}
.app-logo{width:75px;height:75px;flex-shrink:0;object-fit:cover;border-radius:16px;border:1px solid #d3ded7}
.app-name{color:#111;font-size:21px;font-weight:900}
.app-label{display:inline-block;margin-top:6px;padding:5px 10px;border-radius:20px;background:#198b48;color:#fff;font-size:9px;font-weight:900}
.app-description{margin:15px 0;color:#555f59;font-size:13px;line-height:1.65}
.app-buttons{display:flex;gap:7px}
.btn{display:inline-block;min-width:100px;padding:7px 12px;text-align:center;border-radius:7px;font-size:10px;font-weight:900;transition:.2s}
.btn:hover{transform:translateY(-2px)}
.btn-details{color:#168246;background:#f7f7f7;border:1px solid #24934f}
.btn-download{color:#fff;background:#198b48;border:1px solid #198b48}
.post-card{display:flex;align-items:center;gap:18px;padding:15px;background:#fff;border:1px solid #dce5df;border-radius:14px;box-shadow:0 4px 15px rgba(0,0,0,.05)}
.post-image{width:105px;height:105px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#f7f7f7;border-radius:13px}
.post-image img{width:82px;height:82px;object-fit:cover;border-radius:14px}
.post-content{flex:1}
.post-tag{display:inline-block;padding:4px 8px;border-radius:15px;background:#198b48;color:#fff;font-size:8px;font-weight:900}
.post-content h3{margin:7px 0 5px;color:#111;font-size:18px}
.post-content p{color:#68736c;font-size:12px}
.read-more{display:inline-block;margin-top:8px;color:#168246;font-size:11px;font-weight:900}
.about{background:#ffffff;border-top:1px solid #e3e9e5;border-bottom:1px solid #e3e9e5}
.about-box{max-width:850px;margin:auto;text-align:center}
.about-box h2{color:#111;font-size:23px;margin-bottom:9px}
.about-box p{color:#5f6862;font-size:12px}
.notice{max-width:900px;margin:auto;padding:16px;background:#fff;border:1px solid #dce5df;border-left:4px solid #198b48;border-radius:10px;color:#616a64;font-size:11px}
.notice strong{color:#151515;font-size:12px}
.footer{background:#111111;padding:30px 0 18px;text-align:center}
.footer-title{color:#fff;font-size:18px;font-weight:900}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;margin:15px 0}
.footer-links a{color:#b8c1bb;font-size:10px}
.footer-links a:hover{color:#4ecb7d}
.copyright{color:#737c76;font-size:9px}
.floating-buttons{position:fixed;right:9px;bottom:18px;z-index:999999;display:flex;flex-direction:column;gap:7px}
.float-btn{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 4px 15px rgba(0,0,0,.22);transition:.2s}
.float-btn:hover{transform:scale(1.1)}
.telegram{background:#fff;border:2px solid #1689bb}
.telegram img{width:24px;height:24px;object-fit:contain;border-radius:50%}
.home{background:#198b48;border:2px solid #fff;color:#fff;font-size:21px;font-weight:bold}
@media(max-width:600px){
.nav{min-height:64px}.brand img{width:45px;height:45px}.brand-text{font-size:15px}
.hero{padding:30px 0 27px}.hero-logo{width:78px;height:78px}.hero h1{font-size:30px}.hero p{font-size:12px;padding:0 8px}
.search-box{border-radius:10px}.search-box input{font-size:12px;padding:11px 12px}.search-box button{padding:0 14px;font-size:9px}
.tab{padding:9px 3px;font-size:9px}.section{padding:28px 0}.section-title h2{font-size:21px}.section-title h2:before{height:21px}
.app-card{padding:15px;border-radius:13px}.app-top{gap:11px}.app-logo{width:65px;height:65px;border-radius:13px}.app-name{font-size:19px}
.app-label{padding:4px 8px;font-size:8px}.app-description{margin:13px 0;font-size:12px}.app-buttons{gap:6px}
.btn{min-width:88px;padding:7px 9px;font-size:9px}.post-card{gap:12px;padding:12px}.post-image{width:80px;height:80px}
.post-image img{width:62px;height:62px}.post-content h3{font-size:16px}.post-content p{font-size:11px}
.footer-links{gap:11px}.float-btn{width:40px;height:40px}
}
@media(max-width:370px){.brand-text{font-size:14px}.hero h1{font-size:27px}.app-logo{width:60px;height:60px}.app-name{font-size:17px}}

.app-wrapper{display:grid;gap:12px}