/* YonoLootZone mobile home polish - V19 */
:root{--yl-pink:#e91e63;--yl-purple:#6d28d9;--yl-blue:#2563eb;--yl-ink:#151923;--yl-muted:#667085;--yl-line:#edf0f4}
.yono-quick-table-section{padding:18px 0 6px;background:#f8f9fc}
.yono-quick-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:10px}
.yono-kicker{display:block;color:var(--yl-pink);font-size:10px;font-weight:900;letter-spacing:.14em;margin-bottom:2px}
.yono-quick-head h2{margin:0;color:var(--yl-ink);font-size:21px;line-height:1.15;font-weight:900}
.yono-see-all{font-size:12px;font-weight:800;color:#2563eb;text-decoration:none;white-space:nowrap}
.yono-table-wrap{overflow:hidden;border:1px solid #e9ecf1;border-radius:14px;background:#fff;box-shadow:0 3px 14px rgba(18,25,38,.05)}
.yono-game-table{width:100%;border-collapse:collapse;font-size:11px}
.yono-game-table th{background:#f8fafc;color:#727987;text-transform:uppercase;letter-spacing:.05em;font-size:9px;font-weight:900;text-align:left;padding:8px 7px;border-bottom:1px solid var(--yl-line)}
.yono-game-table td{padding:7px;border-bottom:1px solid #f0f2f5;color:#667085;vertical-align:middle;white-space:nowrap}
.yono-game-table tbody tr:last-child td{border-bottom:0}
.yono-game-table td:first-child{width:44%}
.yono-game-table td:first-child a{display:flex;align-items:center;gap:7px;color:#1f2937;text-decoration:none;font-weight:800;min-width:0}
.yono-game-table td:first-child span{overflow:hidden;text-overflow:ellipsis}
.yono-game-table img{width:30px;height:30px;border-radius:8px;object-fit:cover;flex:none;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.yono-game-table .bonus{color:#059669;font-weight:900}
.open-mini{display:inline-flex;align-items:center;justify-content:center;min-width:43px;padding:5px 7px;border-radius:7px;background:#eef2ff;color:#4338ca;font-weight:900;text-decoration:none}
.yono-table-note{margin:7px 2px 0;color:#98a0ad;font-size:9.5px;line-height:1.45}

@media(max-width:700px){
  body{background:#f7f8fb!important;overflow-x:hidden}
  /* Telegram strip: compact, not a full-width tall card */
  #mobile-telegram-cta{display:flex!important;margin:0!important;padding:9px 12px!important;min-height:50px;border-radius:0!important;box-shadow:none!important;background:linear-gradient(100deg,#168de2,#1476d4)!important;gap:8px!important}
  #mobile-telegram-cta .tg-title{font-size:12.5px!important;font-weight:900}
  #mobile-telegram-cta .tg-subtitle{font-size:10px!important;margin-top:1px!important;white-space:nowrap}
  #mobile-telegram-cta .tg-button{font-size:10.5px!important;padding:7px 10px!important;border-radius:8px!important;font-weight:900}

  /* Header: one clean row, search opens separately */
  header.bg-white.shadow-lg.sticky{position:sticky!important;top:0!important;box-shadow:0 2px 12px rgba(16,24,40,.08)!important;border-bottom:1px solid #eceef2!important}
  header.bg-white.shadow-lg.sticky>.container{padding:9px 12px!important}
  header.bg-white.shadow-lg.sticky>.container>div{min-height:46px!important}
  header.bg-white.shadow-lg.sticky a.flex.items-center{gap:8px!important;min-width:0}
  header.bg-white.shadow-lg.sticky a.flex.items-center img{width:38px!important;height:38px!important;min-width:38px!important;border-radius:11px!important;box-shadow:0 2px 7px rgba(0,0,0,.12)!important}
  header.bg-white.shadow-lg.sticky a.flex.items-center>div>div:first-child{font-size:17px!important;line-height:1!important;letter-spacing:-.3px!important}
  header.bg-white.shadow-lg.sticky a.flex.items-center>div>div:nth-child(2){font-size:12px!important;line-height:1!important;margin-top:2px!important}
  header.bg-white.shadow-lg.sticky a.flex.items-center p{font-size:9px!important;margin-top:3px!important;line-height:1!important}
  header.bg-white.shadow-lg.sticky .md\:hidden{gap:2px!important}
  header.bg-white.shadow-lg.sticky .md\:hidden button{width:36px!important;height:36px!important;padding:8px!important;border-radius:10px!important}
  header.bg-white.shadow-lg.sticky .md\:hidden button:hover{background:#f6f7f9!important}

  /* Mobile search drawer */
  #mobile-search-dropdown{margin:0!important;padding:8px 12px 10px!important;background:#fff!important;border-top:1px solid #f0f1f3!important;box-shadow:0 4px 10px rgba(16,24,40,.06)!important}
  #mobile-search-dropdown>div{border-radius:11px!important;border:1px solid #e3e6eb!important;box-shadow:none!important}
  #mobile-search-input{font-size:13px!important;height:38px!important}

  /* Hero: less vertical space and stronger mobile hierarchy */
  #home{padding:27px 0 24px!important;background:linear-gradient(145deg,#2563eb 0%,#4f46e5 48%,#7c3aed 100%)!important;position:relative;overflow:hidden}
  #home:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-80px;top:-70px;background:rgba(255,255,255,.10)}
  #home:after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;left:-70px;bottom:-70px;background:rgba(255,255,255,.08)}
  #home .container{position:relative;z-index:1;padding-left:18px!important;padding-right:18px!important}
  #home h1{font-size:29px!important;line-height:1.1!important;letter-spacing:-.8px!important;margin-bottom:10px!important}
  #home p{font-size:13.5px!important;line-height:1.55!important;margin:0 auto 17px!important;max-width:330px!important;opacity:.94}
  #home .flex{gap:8px!important}
  #home a{padding:10px 18px!important;border-radius:10px!important;font-size:13px!important;box-shadow:0 7px 18px rgba(0,0,0,.16)!important}

  /* Compact quick table */
  .yono-quick-table-section{padding:15px 0 4px!important}
  .yono-quick-table-section>.container{padding-left:12px!important;padding-right:12px!important}
  .yono-quick-head h2{font-size:20px!important}
  .yono-table-wrap{border-radius:13px!important}
  .yono-game-table th{padding:7px 6px!important}
  .yono-game-table td{padding:6px!important}
  .yono-game-table img{width:28px!important;height:28px!important}
  .yono-game-table td:nth-child(2){display:none}
  .yono-game-table th:nth-child(2){display:none}
  .yono-game-table td:first-child{width:auto}
  .yono-game-table td:nth-child(3){font-size:10px!important}
  .yono-table-note{font-size:9px!important}

  /* Latest posts: card first, title compact */
  #latest-posts{padding:18px 0!important;background:#fff!important}
  #latest-posts .container{padding-left:12px!important;padding-right:12px!important}
  #latest-posts .mb-4{margin-bottom:10px!important}
  #latest-posts h2{font-size:20px!important;line-height:1.15!important}
  #latest-posts .latest-posts-section{margin:0}
  #homepage-latest-post{padding:10px!important;border-radius:14px!important}
  .latest-post-card{display:flex!important;gap:10px!important;align-items:center!important}
  .latest-post-card img{width:92px!important;height:72px!important;margin:0!important;border-radius:10px!important}
  .latest-post-card h3{font-size:14px!important;line-height:1.25!important;margin-top:2px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .latest-post-card p{font-size:10.5px!important;line-height:1.35!important;margin-top:4px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .latest-post-card span{font-size:10px!important;margin-top:4px!important}
  #latest-posts .flex.items-center.justify-between{align-items:end!important}
  #latest-posts .flex.items-center.justify-between .text-sm{font-size:11px!important}
  #enable-post-notifications{display:none!important}

  /* SEO intro and sections get tighter spacing */
  #seo-intro{padding:20px 0!important}
  #seo-intro .container{padding-left:12px!important;padding-right:12px!important}
  #seo-intro h2{font-size:20px!important;line-height:1.2!important}
  #seo-intro p{font-size:12px!important;line-height:1.6!important;margin-top:8px!important}
  #seo-intro .grid{gap:7px!important;margin-top:12px!important}
  #seo-intro .grid a{padding:10px!important;border-radius:11px!important;font-size:11px!important}
  #seo-intro .grid a span{font-size:9.5px!important;margin-top:3px!important}

  /* Bonus strip: horizontal and compact */
  .py-6.bg-gradient-to-r.from-yellow-50{padding:14px 0!important}
  .py-6.bg-gradient-to-r.from-yellow-50 .container{padding:0 12px!important}
  .py-6.bg-gradient-to-r.from-yellow-50 h3{font-size:15px!important;margin-bottom:9px!important}
  .py-6.bg-gradient-to-r.from-yellow-50 .flex{gap:18px!important}
  .py-6.bg-gradient-to-r.from-yellow-50 a{transform:none!important}
  .py-6.bg-gradient-to-r.from-yellow-50 a .relative.w-14{width:48px!important;height:48px!important}
  .py-6.bg-gradient-to-r.from-yellow-50 a>span{font-size:9px!important}

  /* Games grid: 2 compact columns, less card padding */
  #games{padding:25px 0!important}
  #games>.container{padding-left:12px!important;padding-right:12px!important}
  #games h3{font-size:21px!important;margin-bottom:14px!important}
  #games-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  #games-grid .game-card{padding:9px!important;border-radius:13px!important;box-shadow:0 2px 10px rgba(16,24,40,.06)!important}
  #games-grid .game-card:hover{transform:none!important}
  #games-grid .game-card>div:first-child{width:62px!important;height:62px!important;margin-bottom:7px!important;border-radius:14px!important}
  #games-grid .game-card h4{font-size:11px!important;margin-bottom:2px!important}
  #games-grid .game-card p{font-size:9px!important;margin-bottom:7px!important;min-height:12px!important}
  #games-grid .game-card .space-y-1\.5{margin-top:auto!important}
  #games-grid .game-card a{padding:5px!important;font-size:9px!important;border-radius:7px!important}
}

@media(max-width:360px){
  header.bg-white.shadow-lg.sticky a.flex.items-center img{width:34px!important;height:34px!important;min-width:34px!important}
  header.bg-white.shadow-lg.sticky a.flex.items-center>div>div:first-child{font-size:15px!important}
  #home h1{font-size:26px!important}
  .yono-game-table td{padding:5px 4px!important}
  .yono-game-table img{width:25px!important;height:25px!important}
  .open-mini{min-width:38px!important;padding:4px 5px!important;font-size:9px!important}
}