/* Quick mode switcher ---------------------------------------------------- */
.modes-quick{position:relative;flex:0 0 auto;display:flex;align-items:center}
.modes-quick-menu{position:absolute;top:calc(100% + 12px);right:0;width:290px;padding:10px;border:2px solid #4f533f;background:rgba(239,235,207,.98);box-shadow:inset 0 0 0 2px rgba(255,255,255,.55),inset 0 -5px rgba(75,68,47,.12),0 5px 0 rgba(49,52,42,.72),0 18px 38px rgba(28,24,16,.24);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-7px);transition:opacity .14s ease,transform .18s ease,visibility 0s linear .18s;z-index:100}
.modes-quick-main .modes-quick-menu{right:-12px}
.modes-quick-mode .modes-quick-menu{left:0;right:auto}
.modes-quick-menu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.modes-quick:hover .modes-quick-menu,.modes-quick:focus-within .modes-quick-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:0s}
.modes-quick-caption{padding:5px 6px 10px;color:#777361;font:900 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.13em}
.modes-quick-item{min-height:70px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:11px;padding:10px;border:2px solid #755d40;background:linear-gradient(#eadbb7,#cfb784);box-shadow:inset 0 0 0 2px rgba(255,255,255,.34),inset 0 -4px rgba(84,62,40,.14),0 3px 0 rgba(84,62,40,.52);color:#342b22;text-decoration:none;transition:transform .12s ease,filter .12s ease}
.modes-quick-item:hover{transform:translateY(-1px);filter:brightness(1.035)}
.modes-quick-icon{width:42px;height:42px;display:grid;place-items:center;border:2px solid #4e3828;background:#75513a;color:#f6edcb;box-shadow:inset 0 0 0 2px rgba(255,255,255,.12);font-size:18px}
.modes-quick-copy strong,.modes-quick-copy small{display:block}.modes-quick-copy strong{font-size:14px}.modes-quick-copy small{margin-top:5px;color:#766957;font:800 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em}.modes-quick-arrow{font-size:18px;font-weight:900}
.modes-quick-all{min-height:36px;margin-top:8px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;border:2px solid #777767;background:linear-gradient(#d9d8cb,#bbbcb2);box-shadow:inset 0 -3px rgba(60,61,53,.14),0 2px 0 rgba(61,63,53,.48);color:#393b33;text-decoration:none;font:900 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.06em}.modes-quick-all:hover{filter:brightness(1.04)}

/* Wiki type filters ------------------------------------------------------- */
.wiki-controls .wiki-row>.wiki-chip[aria-pressed="true"]:not([data-state]){color:#193016!important;background:#94c969!important;border-color:#4d7138!important;box-shadow:inset 0 -3px rgba(45,91,29,.22),0 2px 0 #4d7138!important}
.wiki-controls .wiki-row>.wiki-chip.core[aria-pressed="true"]:not([data-state]){color:#3d2d13!important;background:#e3b75b!important;border-color:#876520!important;box-shadow:inset 0 -3px rgba(112,74,28,.18),0 2px 0 #876520!important}

/* BuildBorn navigation ----------------------------------------------------
   On mode pages the global links are deliberately LEFT aligned instead of
   centered. BuildBorn controls stay pinned to the right inner edge of the same
   unchanged 1260px header. JS only checks for a real collision; if one exists
   at a narrow desktop width the mode controls move to a second row. */
@media (min-width:1200px){
  .site-shell:has(.mode-nav-wrap) .game-nav{
    position:relative;
    width:min(1260px,100%);
    justify-content:flex-start;
    gap:0;
    overflow:visible;
  }

  .site-shell:has(.mode-nav-wrap) .game-nav>.modes-quick-main{display:none!important}
  .site-shell:has(.mode-nav-wrap) .game-nav>.nav-play{display:none!important}

  /* No centering and no translate hacks: start the main menu shortly after the logo. */
  .site-shell:has(.mode-nav-wrap) .game-nav>.nav-links{
    position:static;
    margin-left:34px;
    margin-right:0;
    display:flex;
    flex-wrap:nowrap;
    white-space:nowrap;
    will-change:transform;
  }

  /* Exact same horizontal bounds as the normal header. */
  .site-shell:has(.mode-nav-wrap) .mode-nav-wrap{
    top:22px;
    left:50%;
    right:auto;
    width:min(1260px,calc(100% - 48px));
    height:72px;
    padding:10px 12px;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    transform:translateX(-50%);
    z-index:70;
    pointer-events:none;
  }

  .site-shell:has(.mode-nav-wrap) .mode-nav{
    width:auto;
    max-width:100%;
    min-width:0;
    min-height:52px;
    margin:0;
    padding:0;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:nowrap;
    border:0;
    background:transparent;
    box-shadow:none;
    pointer-events:auto;
    position:relative;
    z-index:2;
    will-change:transform,opacity;
  }

  .site-shell:has(.mode-nav-wrap) .mode-nav .modes-quick-mode{pointer-events:auto;flex:0 0 auto}
  .site-shell:has(.mode-nav-wrap) .mode-links{display:flex;gap:6px;flex-wrap:nowrap;justify-content:flex-end;pointer-events:auto;min-width:0}
  .site-shell:has(.mode-nav-wrap) .mode-link{min-height:42px;padding-inline:12px;pointer-events:auto;white-space:nowrap;flex:0 0 auto}
  .site-shell:has(.mode-nav-wrap) .mode-identity{min-height:42px;padding:4px 9px 4px 5px;border:2px solid #73583d;background:linear-gradient(#e8d6ad,#ccb486);box-shadow:inset 0 0 0 2px rgba(255,255,255,.34),inset 0 -4px rgba(84,62,40,.14),0 3px 0 rgba(84,62,40,.52);pointer-events:auto;flex:0 0 auto}
  .site-shell:has(.mode-nav-wrap) .mode-icon{width:30px;height:30px;font-size:14px}
  .site-shell:has(.mode-nav-wrap) .mode-identity small{display:none}

  .site-shell:has(.mode-nav-wrap) .page-stage.has-mode-nav .inner-page{padding-top:150px}
  .site-shell:has(.mode-nav-wrap) .wiki-shell,
  .site-shell:has(.mode-nav-wrap) .events-shell,
  .site-shell:has(.mode-nav-wrap) .seasons-shell{padding-top:150px!important}

  /* Only a true physical collision triggers the second row. */
  .site-shell.mode-nav-stacked .mode-nav-wrap{top:101px;height:auto;min-height:62px;padding-top:8px;padding-bottom:8px;align-items:flex-start}
  .site-shell.mode-nav-stacked .mode-nav{max-width:100%;padding:8px 10px;flex-wrap:wrap;border:2px solid rgba(79,83,63,.82);background:rgba(239,235,207,.96);box-shadow:inset 0 0 0 2px rgba(255,255,255,.48),0 4px 0 rgba(49,52,42,.58)}
  .site-shell.mode-nav-stacked .mode-links{flex-wrap:wrap}
  .site-shell.mode-nav-stacked .page-stage.has-mode-nav .inner-page,
  .site-shell.mode-nav-stacked .wiki-shell,
  .site-shell.mode-nav-stacked .events-shell,
  .site-shell.mode-nav-stacked .seasons-shell{padding-top:225px!important}
}

@media (max-width:899px){.modes-quick-menu{display:none}}
@media (prefers-reduced-motion:reduce){.modes-quick-menu{transition:none!important;animation:none!important}}
