/* Portrait tablets: a slim two-row header and single-column games, loaded after each game's own styles. */
@media (max-width:1050px) {
  .page-rail { display:none !important; }
}
.nav-collapse { display:contents; }
.nav-menu-btn { display:none; }
.nnd-header-links .nav-collapse > a.nav-kofi-item { display:none; }
/* Portrait tablets: one header row, with the page links tucked into a Menu dropdown (see nav-menu.js). */
@media (min-width:701px) and (max-width:1050px) {
  .nnd-mainbar, .mainbar { flex-wrap:nowrap; gap:10px; padding-top:4px; padding-bottom:4px; }
  .nnd-logo, .logo { flex:0 0 auto; }
  .nnd-logo-text, .logo-copy, .logo-name, .logo-text, .logo-sub, .nnd-logo-sub { white-space:nowrap; }
  .nnd-lang-switch, .language-switcher { order:2; margin-left:auto; }
  .nnd-header-links, .header-links { order:3; flex:0 0 auto; gap:8px; position:relative; margin:0 0 0 auto; align-items:center; overflow:visible; }
  :is(.nnd-mainbar, .mainbar):has(.nnd-lang-switch, .language-switcher) :is(.nnd-header-links, .header-links) { margin-left:0; }
  :is(.nnd-mainbar, .mainbar) :is(.nnd-lang-switch, .language-switcher) { margin-left:auto; }
}
/* The Menu control itself, shared with pages that opt into phone-shell.css. */
@media (max-width:1050px) {
  #nav-menu-btn { display:block; align-self:stretch; box-sizing:border-box; min-height:0; padding:0 10px; line-height:1; color:#333; background:repeating-linear-gradient(45deg,rgba(0,0,0,.025) 0 3px,transparent 3px 7px),linear-gradient(#f3f1ea,#ddd9d0); border:1px solid var(--ls); box-shadow:inset 1px 1px 0 rgba(255,255,255,.8); font:700 11px "MS Gothic","Courier New",monospace; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; }
  #nav-menu-btn:hover { color:var(--menu-accent,var(--red)); background:linear-gradient(#f8f6f0,#e6e2d9); }
  #nav-menu-btn[aria-expanded="true"] { color:#fff; background:var(--menu-accent,var(--red)); border-color:var(--menu-accent,var(--red)); box-shadow:inset 0 1px 0 rgba(255,255,255,.25); }
  #nav-menu-btn::after { content:" \25BE"; }
  html.dark-mode #nav-menu-btn:not([aria-expanded="true"]), body.dark-mode #nav-menu-btn:not([aria-expanded="true"]) { color:#ccc; background:linear-gradient(#262626,#1c1c1c); border-color:#333; box-shadow:none; }
  .nav-collapse { display:none; position:absolute; top:calc(100% + 6px); right:0; left:auto; z-index:50; min-width:150px; background:var(--surface); border:2px solid var(--ls); border-top:3px solid var(--menu-accent,var(--red)); box-shadow:inset 1px 1px 0 rgba(255,255,255,.7),0 2px 6px rgba(0,0,0,.25); }
  .nnd-header-links .nav-collapse.is-open, .header-links .nav-collapse.is-open { display:block; }
  .nav-collapse .nnd-divider, .nav-collapse .divider, .nav-collapse > span { display:none; }
  .nnd-header-links .nav-collapse > a, .nnd-header-links .nav-collapse > button, .header-links .nav-collapse > a { display:block; width:100%; padding:6px 10px; color:var(--text); background:none; font-size:12px; text-align:left; white-space:nowrap; border:0; border-bottom:1px dotted var(--line); box-shadow:none; }
  .nnd-header-links .nav-collapse > :last-child, .header-links .nav-collapse > :last-child { border-bottom:0; }
  .nnd-header-links .nav-collapse > a:hover, .nnd-header-links .nav-collapse > button:hover, .header-links .nav-collapse > a:hover { color:var(--menu-accent,var(--red)); background:var(--sf); text-decoration:none; }
}
