/*
Theme Name: Yono Rummy Now
Theme URI: https://yonorummynow.com/
Author: Yono Rummy Now
Description: Mobile-first green app directory theme for WordPress.
Version: 1.0
License: GPL-2.0-or-later
Text Domain: yono-rummy-now
*/

:root{
  --green:#09b944;
  --dark:#003d1b;
  --blue:#1597e8;
  --bg:#f5f7f6;
  --text:#111;
  --muted:#666;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.6;
}
a{text-decoration:none}
img{max-width:100%;height:auto}
.ynr-site{min-height:100vh}
.ynr-header{
  background:linear-gradient(180deg,#12c84e 0%,#087a2e 58%,#002d16 100%);
  border-bottom:3px solid #064d20;
}
.ynr-header-inner{
  max-width:1100px;margin:auto;padding:10px 15px;
  min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:15px;
}
.ynr-brand{display:flex;align-items:center;gap:13px;color:#fff}
.ynr-brand img{width:72px;height:72px;object-fit:cover;border-radius:17px;border:2px solid #dcff76}
.ynr-brand-name{font-size:30px;font-weight:900;text-shadow:0 2px 3px #0006}
.ynr-menu{display:flex;gap:2px;flex-wrap:wrap}
.ynr-menu a{color:#fff;font-weight:700;padding:8px 11px;border-radius:6px}
.ynr-menu a:hover{background:#ffffff1c}
.ynr-nav{background:#fff;border-bottom:1px solid #ddd}
.ynr-nav-inner{max-width:1100px;margin:auto;padding:0 15px;display:flex;align-items:center;gap:0}
.ynr-nav a{color:#111;font-weight:700;padding:12px 13px}
.ynr-nav a:hover{background:#f1f1f1;color:#087a2e}
.ynr-container{max-width:1100px;margin:auto;padding:0 15px}
.ynr-intro,.ynr-content,.ynr-page-card{
  background:#fff;border:1px solid #ddd;border-radius:10px;
  box-shadow:0 2px 8px #0000000a;
}
.ynr-intro{margin-top:15px;padding:16px 18px}
.ynr-intro p{margin:0;color:#555;font-size:13px}
.ynr-telegram{
  margin-top:12px;background:linear-gradient(135deg,#1597e8,#0878c7);
  border-radius:10px;padding:10px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px
}
.ynr-telegram-left{display:flex;align-items:center;gap:10px}
.ynr-telegram img{width:45px;height:45px;border-radius:50%;object-fit:cover;border:2px solid #fff}
.ynr-telegram-title{display:block;color:#fff;font-weight:800;font-size:14px}
.ynr-telegram-small{display:block;color:#eaf6ff;font-size:11px}
.ynr-join{background:#fff;color:#0878c7;border-radius:7px;padding:9px 14px;font-size:12px;font-weight:800}
.ynr-tabs{margin-top:15px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ynr-tab{background:#fff;border:1px solid #ddd;border-radius:9px;padding:12px;text-align:center;font-weight:800;color:#555}
.ynr-tab.active{background:linear-gradient(135deg,#16c74e,#006d29);color:#fff;border-color:#078b35}
.ynr-grid{display:grid;gap:10px;margin-top:10px}
.ynr-card{
  position:relative;background:#fff;border:1px solid #ddd;border-radius:11px;
  padding:13px 14px;display:flex;align-items:center;gap:12px;
}
.ynr-number{
  position:absolute;left:-1px;top:-1px;min-width:35px;height:30px;
  display:flex;align-items:center;justify-content:center;color:#fff;
  background:linear-gradient(135deg,#16bd4c,#006f2a);border-radius:10px 0 10px 0;
  font-size:13px;font-weight:900
}
.ynr-logo{width:66px;height:66px;min-width:66px;margin-left:14px;border-radius:14px;overflow:hidden;border:1px solid #ddd;background:#eee}
.ynr-logo img{width:100%;height:100%;object-fit:cover}
.ynr-info{flex:1;min-width:0}
.ynr-title{font-size:20px;font-weight:900;margin-bottom:4px}
.ynr-excerpt{font-size:13px;color:#666;margin-bottom:6px}
.ynr-meta{font-size:13px;color:#43885e;font-weight:800}
.ynr-download{
  display:inline-flex;align-items:center;justify-content:center;min-width:120px;
  padding:12px 15px;border-radius:9px;color:#fff;
  background:linear-gradient(135deg,#17bd4d,#006c2a);font-weight:900;font-size:14px
}
.ynr-content{margin-top:18px;padding:22px 18px}
.ynr-content h1,.ynr-content h2,.ynr-content h3{color:#111}
.ynr-content h1{font-size:27px}
.ynr-content h2{font-size:22px}
.ynr-content h3{font-size:18px}
.ynr-content p,.ynr-content li{font-size:14px;color:#555}
.ynr-page{padding:18px 0 25px}
.ynr-page-card{padding:22px 18px}
.ynr-page-card h1{margin-top:0;font-size:26px}
.ynr-footer{margin-top:25px;background:#07150d;color:#fff;text-align:center}
.ynr-footer-inner{max-width:1100px;margin:auto;padding:25px 15px 0}
.ynr-footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}
.ynr-footer-links a{color:#fff;font-size:13px}
.ynr-footer-text{color:#aeb9b1;font-size:11px;max-width:760px;margin:12px auto}
.ynr-age{overflow:hidden;background:#030805;border-top:1px solid #29402f;padding:10px 0;margin-top:15px}
.ynr-age span{display:inline-block;white-space:nowrap;animation:ynrscroll 20s linear infinite;font-size:12px;font-weight:800}
@keyframes ynrscroll{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}
.ynr-copy{padding:12px;color:#7d8b82;font-size:11px}
.ynr-floating{
  position:fixed;right:15px;bottom:65px;width:55px;height:55px;border-radius:50%;
  background:#fff;padding:2px;box-shadow:0 4px 15px #0005;z-index:99999
}
.ynr-floating img{width:100%;height:100%;object-fit:cover;border-radius:50%}
@media(max-width:760px){
  .ynr-header-inner{min-height:80px}
  .ynr-brand img{width:58px;height:58px}
  .ynr-brand-name{font-size:23px}
  .ynr-menu{display:none}
  .ynr-nav-inner{overflow-x:auto;white-space:nowrap}
  .ynr-nav a{font-size:12px;padding:11px 9px}
  .ynr-container{padding:0 9px}
  .ynr-card{padding:12px 9px;gap:8px}
  .ynr-logo{width:56px;height:56px;min-width:56px}
  .ynr-title{font-size:16px}
  .ynr-excerpt,.ynr-meta{font-size:11px}
  .ynr-download{min-width:91px;padding:10px 8px;font-size:11px}
  .ynr-telegram-title{font-size:12px}
  .ynr-telegram-small{font-size:9px}
  .ynr-join{font-size:10px;padding:8px 10px}
}

/* ===== YNR 3-LINE MOBILE MENU + APP TABS ===== */
.ynr-menu-toggle{position:absolute;left:-9999px}
.ynr-hamburger{
  width:48px;height:44px;display:flex;flex-direction:column;justify-content:center;
  gap:6px;cursor:pointer;padding:7px;border-radius:7px
}
.ynr-hamburger span{display:block;width:34px;height:5px;background:#fff;border-radius:5px}
.ynr-menu-list{margin:0;padding:0;list-style:none;display:flex;align-items:center}
.ynr-menu-list li{list-style:none;margin:0;padding:0}
.ynr-menu-list a{display:block;color:#111;font-weight:700;padding:11px 12px}
.ynr-menu-list a:hover{background:#f1f1f1;color:#087a2e}
.ynr-nav{display:block}
.ynr-nav-inner{min-height:45px}
.ynr-hamburger{display:flex}
@media(min-width:761px){
  .ynr-hamburger{display:none}
  .ynr-menu-toggle{display:none}
}
@media(max-width:760px){
  .ynr-nav{display:none}
  .ynr-menu-toggle:checked + .ynr-nav{display:block}
  .ynr-nav-inner{padding:0;display:block}
  .ynr-menu-list{display:block}
  .ynr-menu-list li{border-bottom:1px solid #eee}
  .ynr-menu-list a{padding:9px 16px;font-size:14px}
  .ynr-header-inner{min-height:78px}
}
.ynr-tab-link{display:block;background:#fff;border:1px solid #ddd;border-radius:9px;padding:12px;text-align:center;font-weight:800;color:#555}
.ynr-tab-link.active{background:linear-gradient(135deg,#16c74e,#006d29);color:#fff;border-color:#078b35}