/* Tower Defense Hub — responsive layout (mobile-first breakpoints). */

@media (max-width: 1099px) {
  .nav-toggle { display: inline-flex; }
  .main-nav {
    position: fixed; top: 64px; left: 0; right: 0; bottom: 0; z-index: 60;
    background: var(--surface); border-top: 1px solid var(--border); padding: 12px 16px 24px;
    transform: translateX(100%); visibility: hidden; transition: transform .22s ease, visibility .22s; overflow-y: auto;
  }
  .main-nav.open { transform: none; visibility: visible; }
  .nav-list { flex-direction: column; gap: 4px; }
  .nav-list a { padding: 14px 14px; font-size: 1.05rem; border: 1px solid var(--border); }
  .header-actions { margin-left: auto; }
  .brand small { display: none; }
}

@media (max-width: 520px) {
  .header-actions .icon-btn .label { display: none; }
}
@media (max-width: 420px) {
  .header-inner { gap: 6px; }
  .header-actions { gap: 4px; }
  .icon-btn { min-width: 42px; padding: 0 8px; }
  .brand { gap: 6px; min-width: 0; flex-shrink: 1; }
  .brand svg { width: 30px; height: 30px; }
  .brand-text { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .td-build { grid-template-columns: repeat(2, 1fr); }
  .td-controls .td-btn { flex: 1 1 calc(50% - 6px); padding: 8px 8px; font-size: .85rem; }
  .td-controls .td-btn kbd { display: none; }
  .game-shell { padding: 8px; border-radius: 14px; margin-left: -8px; margin-right: -8px; }
  .td-stat { padding: 4px 8px; }
  .td-stat-label { display: none; }
}

@media (min-width: 720px) {
  .hero { padding: 72px 0 84px; }
  .hero .container { grid-template-columns: 1.2fr .8fr; }
  .daily-panel { grid-template-columns: 1.3fr .7fr; padding: 32px; }
  .two-col { grid-template-columns: 1fr 1fr; }
  .filters { grid-template-columns: 1fr; }
}

@media (min-width: 1100px) {
  .main-nav { display: block; }
}
@media (min-width: 960px) {
  .article-layout { grid-template-columns: minmax(0, 1fr) 290px; }
  .article-aside { position: sticky; top: 84px; align-self: start; }
  .game-info-grid { grid-template-columns: minmax(0, 1fr) 320px; }
}

@media (hover: none) {
  .card:hover { transform: none; }
}

@media print {
  .site-header, .site-footer, .ad-slot, .consent, .game-shell { display: none !important; }
  body { background: #fff; color: #000; }
}

.article-layout > *, .game-info-grid > *, .two-col > *, .daily-panel > *, .hero .container > * { min-width: 0; }
.prose h1, .prose h2, h1 { overflow-wrap: anywhere; }